'플랩'에 해당되는 글 1건

  1. 2010/07/08 책속에 숨어있는 유저인터페이스 비밀 (2)

책속에 숨어있는 유저인터페이스 비밀

통신서비스를 말한다 2010/07/08 10:00

유저인터페이스 관련 이야기 1탄

작년 말부터 유저인터페이스에 대한 이야기들이 여기 저기서 참 많이 들립니다.
애플 아이폰이 국내에 출시되면서부터라고 생각됩니다. 그 이야기들을 가만히 들어보면 사람들마다
제각기 이해하고 있는 바를 자신의 관점에서 풀어 이야기하는 것 같습니다.


그러면 유저인터페이스란 무엇일까요?
유저인터페이스에 대해 위키피디아에는 어떻게 정의되어 있는지 알아보겠습니다.

A user interface is the system by which people (users) interact with a machine.
The user interface includes hardware (physical) and software (logical) components. 
User interfaces exist for various systems, and provide a means of: Input, allowing the users
to manipulate a system, and/or
 Output, allowing the system to indicate the effects of the users' manipulation.

읽어보니 그리 대단한 이야기는 없습니다.
즉, 유저인터페이스를 입력과 출력이 있는 시스템으로 보고 있는 겁니다.
사용자가 사용목적을 달성하기 위해, 시스템의 입력장치를 통해 조작을 하고, 
사용자의 조작 의도를 이해하고 사용자가 사용목적을 손쉽게 달성할 수 있도록 지원하는 것입니다.
사용자와 대화(Interaction)를 한다는 것입니다.
이렇게 정의만 보면 참 단순하기조차 한 유저인터페이스 때문에 왜 그리 난리일까요?  
애플 아이폰이 성공적으로 시장에 진입하고 사용자 경험들이 긍정적으로 나오면서
아이폰 성공의 원인 중 하나로 유저인터페이스가 이야기되면서 관심이 증폭된 게 아닌가 합니다.


그러나 찬찬히 살펴보면 아이폰의 유저인터페이스는 비교적 단순합니다.
길을 찾을 때 도로교지판이 잘 구성되어 있으면 목적지를 쉽게 찾아 갈 수 있는 것처럼,
아이폰도 그런 접근 방법을 도입했습니다.

싸인포스트(Signpost)라는 UI 패턴을 일관되게 사용한 것입니다.
아이폰을 사용해보신 분들을 아시겠지만, 지금의 페이지와 다음 페이지를 연결하는 것은
버튼이라는 인터페이스이며 그 버튼 안에 목적지를 담아 낸 것입니다.
그래서 그 목적지를 따라 가기만 하니까 쉬워 보이는 겁니다.
분기하는 것도 별로 없고 목적지에 도달하는 횟수를 늘리더라도 그냥 따라오라는 방식이 성공한 것입니다.

사실 그런 방식은 우리가 인터넷을 사용하면서 아주 익숙한 것입니다.
즉, 하이퍼링크라는 것이 유사한 역할을 합니다.
하이퍼링크에 대한 경험과 일상 생활의 도로표지판에 대한 경험을 녹여낸 것입니다.

겉으로는 쉬워 보이지만 아주 독특한 접근법인 것입니다. 


애플은 사용자의 행위를 많은 관찰하여 자신들의 통찰력을 녹여낸 것입니다.
물론 시각적으로도 사용자들의 대기 시간을 Transient Effect로 잡아두었다는 것도 중요하고
In-page Interaction이라는 인터페이스 패턴을 사용한 것도 중요한 요소 중 하나입니다.

추가적으로 애플이 혁신을 가져온 것은 웹이라는 보편적인 기술을
휴대폰의 폼팩터에 녹여냈다는 것입니다.
브라우저 기반으로 시스템을 끌고 간 것입니다.

기술적으로 정확한 설명은 아니지만 개념적으로 브라우저 기반이라는 겁니다.
여기에 녹아 있는 통찰력은 사뭇 다른 것이기도 합니다.

그런데 많은 사람들은 유저인터페이스를 너무 단순하게만 봅니다.
그러다 보니 유저인터페이스를 단순하게 표면적인 것으로 착각하는 사람들도 있기도 합니다.
하지만 유저인터페이스라는 시스템은 매우 구조적인 것입니다. 

우리가 항상 접하는 책을 예로 들어
유저인터페이스에 대해 더 이야기해보겠습니다.


책이란 물리적인 대상은 그 내용과 형태는 무수히 다르지만 몇 가지 공통적인 요소를 가지고 있습니다.
즉, 책이란 유저인터페이스 시스템은 필수적으로 가지고 있어야 할 요소가 있다는 뜻입니다.

책은 어떤 요소로 구성되어 있을까요? 책이란 어떤 메시지를 전하고 싶은 거니까, 
이야기가 가장 중요합니다. 그리고 잘 알다시피, 책이란 필사본으로부터 시작해서
목판인쇄, 금속인쇄 그리고 DTP에 이르기까지 기술의 발달과 더불어 다양한 형태의 도서가 나타납니다.

특히 요즘 아동용 도서를 보면 입체적인 도서도 나타나고 재질의 발달에 따라
방수가 되는 도서도 나타나는 등 기술의 발달을 반영하고 있습니다.
물론 전자책도 나타나고 있습니다. 이 부분은 나중에 다시 이야기 드리도록 하겠습니다.

우리가 책을 처음 접하게 되면 먼저 표지를 봅니다.
앞 표지와 뒷 표지를 보고 첫인상을 갖게 됩니다. 표지는 비주얼 디자인 요소와 책의 성격을
한 눈에 보여주는 정보전달 요소가 함께 하는 부분입니다.
또한 플랩이라는 요소를 통해 책이 전하고자 하는 메시지를 읽고, 저자에 대한 정보도 읽습니다.
본격적으로 읽기 위해 책을 열어보면, 전형적인 패턴을 만납니다. 


ISBN 등 도서의 정보를 나타낸 부분, 제목, 저자, 출판사, 목차, 소개글 등이 있고, 챕터별로 본문이 시작됩니다.
본문에는 각주나 미주 등의 요소가 있고, 본문이 끝나면 색인이나, 부록 등의 요소를 발견하실 겁니다.

본문도 어떤 책들은 텍스트만 있는가 하면 도해나 사진 등도 포함되는 경우도 있습니다.
텍스트만 있는 경우라도 서체나 자간, 행간 등 독자를 배려한 책이 있는 가하면 그런 배려가 부족한 책들도 많습니다.

페이지 레이아웃도 아주 신경 써서 만들 것이 있는가 하면 그렇지 못한 것들도 많습니다.
내용은 좋지만 이런 부분이 부족한 책들은 읽기가 어렵습니다.

책은 읽기 편해야 읽히는 법입니다.
이렇게 단순히 책을 예로 들어도 우리는 어떤 구조적인 패턴에 아주 익숙해져 있으며,
특정 요소가 없으면 이상하다고 느낄 수 있습니다.
사실 유저인터페이스라는 시스템도 책이란 시스템과 별반 다를 것이 없습니다.

그러면 책이란 예를 통해 유저인터페이스에 대해 이야기 한 것을
다시 다이어그램을 통해 정리해보면서 이번 글을 마무리해봅니다.



글쓴이 : 제너시스템즈 마케팅기획본부 조준성 팀장

곧 다가올 변화를 예의주시하고 있습니다. 웹과 모바일, Communication과 Collaboration에서 생기는 변화는 사용자들에게 전에 보지 못했던 새로운 경험과 가치를 제공하고 있습니다. 제너시스템즈 역시 그 경험을 일궈내는데 주도적으로 참여하고자 합니다. 그리고 제가 이 변화의 현장에서 함께 고민할 수 있다는 데 자부심을 느낍니다.


저작자 표시

"xenerdo의 운영정책에 의해 포스팅 주제와 맞지 않는 댓글과 트랙백은 삭제될 수 있습니다."
Posted by 제너시스템즈

트랙백 주소 : http://xenerdo.com/trackback/369 관련글 쓰기

댓글을 달아 주세요

  1. Favicon of http://strong-coi.tistory.com BlogIcon 독코독담 2010/07/08 23:25  댓글주소  수정/삭제  댓글쓰기

    햐... 좋은 인사이트네요!
    물리적으로 할 수 없는 부분들을 기계가 해주니, 사람이 물리적으로 하는 것과 가장 동일하게 구현하려고 노력해야 좋은 유저인터페이스가 나오는듯 합니다 ^^
    프로그래밍도 인문학인듯 ㅎㅎ