본문 바로가기

분류 전체보기3892

(1/3) New Media User Interface의 디자인 사례 - IPTV 1 개요 IP-TV는 최근 각광받기 시작한 서비스로 초고속 인터넷 망을 기반으로 셋탑박스를 이용하여 TV를 통해 동영상은 물론 게임, 검색 등의 부가서비스를 즐길 수 있는 쌍방향 뉴미디어 서비스이다. 특히 기본적으로는 컴퓨터와 유사한 구성을 취하고 있으며 (모니터=TV, PC본체=셋탑박스, 키보드+마우스=리모컨) 입력도구(리모컨)의 제한과 PC나 스마트폰등의 모바일 기기에 비하여 출력장치(TV)와 조작자간의 거리가 가장 먼 서비스이기도 하다. 또한 PC의 키보드에 비해서 리모컨은 입력에 많은 제약이 따르게 되어 이를 극복할 수 있는 UI 디자인이 요구된다. KT의 ‘USER INTERFACE GUIDE’에서 말하는 일관되고 편리한 서비스를 시청자에게 제공하기 위한 세부사항은 아래와 같다. ① 화면은 심플하게.. 2011. 1. 6.
(2/3) New Media User Interface의 디자인 사례 - IPTV 2 2. TV에 맞는 네비게이션 룰(Navigation Rule)을 고려하라 1) 현재 뎁스(depth)와 이전 뎁스를 효율적으로 배치하라 TV를 시청하면서 이용자가 채널 검색을 시도 할 경우, 현재 시청하고 있는 화면을 최대한 보호하면서, 이용자가 원하는 목적(채널 검색 등)을 달성할 수 있도록 명확하고 깔끔한 메뉴를 제공하여야 한다. 또한 목록별로 분류된 VOD/실시간 영상 데이터를 제공하는 서비스의 성격상 트리(tree)와 폴더(Folder)형식의 구성을 취하고 있는데 이 경우 5뎁스 이상의 복잡한 구조를 가지게 된다. 물론 전통적인 웹사이트의 경우 이용자가 메뉴를 클릭하여 하위뎁스로 이동하면 해당 뎁스(메뉴)에 맞는 페이지로 전환되는 방식이 반복되지만, IP-TV의 경우 현재 시청하고 있는 화면이 재.. 2011. 1. 6.
(3/3) New Media User Interface의 디자인 사례 - IPTV 3 3. 사용 환경을 고려하라 1) 시청 정보의 정확한 제공 VOD/생방송 서비스의 경우 이용자 편의를 위하여 아래와 같은 기능을 제공할 수 있다.이러한 요소들이 방송 화면을 최대한 가리지 않고 구현되는 UI를 보자 ① 생방송의 상황바 생방송 시청중에 확인버튼을 선택시 아래와 같이 화면 하단에 현재 방송의 시작 종료 시간과 진행한 시간을 보여 준다. 또한 상하 채널이동 및 등록 기능을 제공한다. ② VOD의 컨트롤바 VOD 시청중 ‘확인버튼’ 또는 ‘VOD 재생버튼’을 선택하면 오른쪽 상단에 다음과 같은 정보가 출력된다. 확인버튼을 선택하면 현재 시청중인 VOD의 총시간과 시청시간이 표시된다. 또한 ‘VOD 재생버튼’을 선택하여 배속 변경 및 일시정지 기능등을 선택할 경우에도 해당 컨트롤바를 통하여 조작 상.. 2011. 1. 6.
(1/6) New Media User Interface의 디자인 사례 - Web : 이용자에게 친절하라 1 들어가며 User Interface가 훌륭한 디자인 사례는 특별한 것은 없다. 즉, 이용자가 유무선 인터넷 서비스를 이용 - 특히 이용자의 행위를 일으키며, 미션을 수행하는(검색, 글쓰기, 구매 등) -하면서 별다른 어려움을 느끼지 못하고, 목적을 완료하는 과정에서 큰 장애를 느끼지 못하였다면, 해당 사이트는 User Interface 차원에서 매우 잘 디자인된 사이트라 할 수 있다. 그러나 인터넷 사이트를 이용하면서 본인들이 겪었던 불편이나 경험을 생각해 보면, 안타깝게도 대부분의 사람들이 한두번도 아닌 상당히 많은 빈도로 불편을 겪었을 것이다. 심지어는 본인이 하고자 하는 바를 완료하지 못하고 중간에 포기하는 일도 경험했었을 것이다. 이러한 경우들은 기획과 UI의 문제에서 발생하기도 하지만, 페이지의.. 2011. 1. 6.
(2/6) New Media User Interface의 디자인 사례 - Web : 이용자에게 친절하라 2 3) 문제를 알고 있을 경우 최우선 적으로 통보하라 아래의 경우를 보자, 쇼핑몰에서 이용자가 제품을 구입하는 과정에서 재고부족 알림을 출력해 주는 과정을 설명하고 있다. 위의 경우에는 이용자가 구매과정을 모두 수행하고 결제 버튼을 클릭 한 이후에 재고 부속을 알려주며 첫페이지로 화면을 이동시킨다.이 경우 이용자의 입장에서는 처음부터 다시 제품을 검색하여 제품을 찾고 처음부터 다시 구매 프로세스를 진행하여야 하는 불편을 주고 있다. 심할 경우에는 이용자가 해당 구매를 포기하는 경우가 발생하기도 한다. 이는 이용자에게 나쁜 기억을 주게 되고 해당 사이트의 신뢰도를 떨어뜨리는 요인이 된다. 그러나 아래의 경우에는 이용자가 제품을 선택하는 첫 과정에서 재고 부족을 알려주고 있다. 이 경우 이용자는 처음부터 문제.. 2011. 1. 6.
(3/6) New Media User Interface의 디자인 사례 - Web : 통일된 메시지와 UI를 제공하라 2. 통일된 메시지와 UI를 통합하라 1) 하나의 사이트에서는 동일한 용어를 사용하라 ‘게시판-보드’, ‘댓글-리플-한마디’, ‘윗글/아랫글-이전글/다음글’ ‘메인-홈’ 등등 동일한 서비스에 대하여 사이트별로 다양한 용어를 사용하곤 한다. 이 경우 하나의 사이트에서 동일한 서비스(기능)를 제공할 경우에는 통일된 용어와 기호를 사용하여 이용자의 혼란을 최소화 하고, 사이트의 통일성을 꾀할 수 있다. 또한 이용자의 입장에서는 해당 사이트에서 한번의 경험만으로도 다른 서비스의 동일한 기능를 이용할 경우에도 추가적인 학습없이 이용이 가능하게 된다. 아래는 다음(http://www.daum.net)의 아고라, 증권, 부동산의 게시판 페이지이다. 각기다른 3개의 서비스에 위치한 게시판임에도 불구하고, 글쓰기, 답글.. 2011. 1. 6.