기후위기시계
실시간 뉴스
  • UIㆍUX, 내가 살고있는 또다른 세상 ‘모바일 세상’을 설계하다

[헤럴드경제=황유진 기자]손안에서 펼쳐지는 또 하나의 세상, 모바일 세상에도 법칙이 있다. 이미지 크기, 줄 간격, 버튼 위치 하나 ‘그냥’ 존재하는 것은 없다. 알고보면 좀 더 편리하고 효율적으로 사용자가 원하는 정보를 찾아갈 수 있도록 치밀하게 ‘디자인 된’ 세상이다. 때문에 최근 IT업계에서는 사용자 환경(UI, User Interface)이나 사용자 경험(UX, User eXperience)에 대한 연구ㆍ분석이 뜨겁다.

그 중심에는 6인치 내외의 작은 스마트폰 화면 속으로 들어온 사용자가 손 쉽게 원하는 정보를 찾고, 더 나아가 또 다른 정보로 확장ㆍ접근할 수 있도록 ‘보이지 않는 설계도’를 만드는 사람들이 있다. 바로 모바일 UIㆍ UX 디자이너들이다. 다음카카오 UIㆍUX팀을 통해 모바일 세상을 설계하는 비하인드 스토리를 들어봤다. 

▶호모 모빌리언스를 연구한다=모바일 기기를 사용하는 신인류를 일컫는 호모 모빌리언스(Homo Mobilians)를 연구하는 것은 사용자 중심의 모바일 UI와 UX를 만들기 위한 필수 절차다. 제스쳐, 습관 등 모바일 사용자의 행태를 분석해 더 쉽고 편리한 UI와 UX를 구축하기 위함이다. 예를 들면 스마트폰 기기로 사람들이 가장 많이 사용하는 서비스 중 하나가 바로 ‘길찾기 서비스’다. 지도 서비스에서 사용자 중심의 UI와 UX를 구현하기 위해서는 소위 ‘셰도우(그림자) 트래킹’이라는 절차를 거친다. 해당 서비스의 사용자를 그림자처럼 따라다니며 근거리 관찰을 함으로써 사용자가 원하는 정보와 서비스 이용 패턴을 더욱 구체적으로 파악하는 것이다.

김기성 다음카카오 콘텐츠 UX 파트장은 “이동 중 스마트폰으로 검색을 이용하는 다수의 성향을 고려해 현재 위치를 기준으로 반경 2km 이내의 장소 검색 결과인 경우 도보 이동 시간을 함께 보여준다”면서 “자동차나 도보의 경우에는 어떤 루트를 통해 목적지에 도착하는 지가 더 중요한 정보기 때문”이라고 설명했다. 예를 들어, 스마트폰의 위치사용 승인을 해 둔 이용자가 이태원 역 인근에서 ‘맛집’을 검색하고 도보로 이동할 경우, 주요 맛집 위치가 표시된 지도 하단에 상호, 업종, 이용자 리뷰, 주소와 함께 ‘도보 시간’이 포함된 장소 목록을 함께 보여주는 것이다. ‘현위치 재설정’ 기능을 이용하면 이동 중 계속 도보 시간을 파악할 수 있다. 자동차로 길을 찾아 갈 경우에는 도착 지점 주변의 주차장 정보를 보여주는 방식으로 사용자 맞춤형 UX를 제공한다.


▶이미지, 글자크기, 여백 하나도 계산된 결과다=모바일 화면을 통해 보여지는 이미지와 활자의 크기, 썸네일(전체의 레이아웃을 검토할 수 있게 페이지 전체를 작게 줄여 화면에 띄운 것)의 위치 하나마저도 계산된 결과다.

다음카카오는 지난 8월 모바일 UX를 개편하면서 뉴스, 블로그, 카페, 게시판, 지식, 웹문서, 많이 본 글 영역의 화면 구성을 크게 변화시켰다. 일반적으로 좌측에 이미지 썸네일, 우측에 문서 제목과 본문 요약이 보여지던 형태에서 벗어나 제목과 내용을 왼쪽에, 썸네일을 우측에 배치했다. 이는 화면을 바라보는 시선이 왼쪽부터 오른쪽으로 이동하는 것을 고려한 변화다.


작은 화면을 보는 사용자를 배려해 인물, 뉴스, 이미지 등 각 영역의 구분선을 강조한 것도 마찬가지다. 긴 검색 결과 중 현재 어느 영역을 보고 있는지 쉽게 알 수 있도록 한 것이다. 검색 결과와 관련된 메뉴들을 검색창 하단에 배열한 것도 이용자들이 보다 쉽게 필요한 정보로 접근 할 수 있도록 하기 위함이다.

백성원 다음카카오 UX팀장은 “모바일 상에서 사용자들이 어떤 경로를 통해 들어오고 어떤 플로우로 이동하는지 수 많은 경우의 수를 시나리오로 만들어보고 테스트 하는 과정을 거치게 된다”면서 “사용자들의 사용 지표를 보면서 서비스 설계를 수정하는 작업이 계속 이뤄진다”고 말했다.


▶비언어 커뮤니케이션 세상을 설계하다=스마트폰을 통한 커뮤니케이션의 필수 조건은 전달하고자 하는 감정과 정보를 충분히 반영하면서도 간결해야 한다는 점이다. 모바일 커뮤니케이션에서 활자보다는 ‘이미지’가 중요한 이유다. 이모티콘을 활용한 비언어 커뮤니케이션이 활발해진 것도 UI의 한계를 극복하는 창조적인 방안이었던 셈이다.

카카오스토리의 탄생도 “스토리 커뮤니케이션 툴이 있으면 좋겠다”는 사용자의 니즈에서 출발했다. 기존의 SNS(소셜네트워크서비스)가 굉장히 건조한 느낌이었다면 “메시지를 간결하면서도 더 재미있게 보낼 수 있는 수단이 없을까”에 대한 고민에서 출발한 서비스다. 이 과정에는 ‘24K’라는 사내 벤처 프로그램이 한 몫 했다. 24K는 아이디어를 내고 24시간 안에 해당 아이디어의 프로토타입까지를 구현해보는 다음카카오 서비스 개발 방식 중 하나다. 3개 팀이 각각의 프로토타입으로 경쟁을 펼친 결과 현재 우리가 사용하는 카카오스토리가 만들어지게 됐다.

임정훈 다음카카오 스토리디자인 셀장은 “이모티콘 대화는 물론 앞으로는 직접 그림 그려서 대화하는 방식도 활발하게 이뤄지는 등 비언어 커뮤니케이션 수단이 더욱 다채로워질 것”이라고 분석했다.

hyjgogo@heraldcorp.com

맞춤 정보
    당신을 위한 추천 정보
      많이 본 정보
      오늘의 인기정보
        이슈 & 토픽
          비즈 링크