모바일 UI의 패턴
참고: (주)미래웹기술연구소
소프트웨어 개발에 필요한 소프트웨어 아키텍처에서 패턴이 필요하듯이 모바일 UI에서도 패턴이 활용된다. 모바일의 경우는 PC와 달리 화면이 작고 구성할 수 있는 인터페이스의 수가 제한적이기 때문이다. 그리고 , 모바일은 손가락으로 명령을 내리는 체계이기 때문에 인터렉션의 방법이나 구성에 한계가 있다.
모바일 UI는 사용 목적과 방법에 따라 구분할 수 있다. 최근에 많이 사용되는 패턴으로는 SNS, 포털 , 뉴스 , 기업 , 쇼핑몰 등이 있다 .모바일 소프트웨어를 통해 많이 사용되는 것들이며 , 목적에 따라 사용 방법이 구분되는 것들로 분류되어 있다.
① SNS형 패턴
그림 6은 SNS형으로 블록 단위로 보이도록 구성한다. SNS는 둘 이상의 사용자가 대화형으로 구성되고 시간대 별로 구성되어야 하기 때문에 컨텐츠가 위 아래 스크롤이 가능하도록 구성하는 것이 좋다. 화면을 이동하는 메뉴 네비게이션은 상단에 , 해당 화면에서 필요한 기능을 수행하는 기능 네비게이션은 하단에 위치하는 것이 특징이다.
<그림6> SNS형 패턴
② 포털형 패턴
그림 7은 네이버나 다음 등과 같은 포털형을 나타내고 있다. 포털형의 특징은 다양한 기능을 나타내는 기능 아이콘 중심이다. 기능 아이콘을 통해 사용자는 원하는 기능을 찾을 수 있고 서비스를 이용한다. 아이콘이 눈에 익지 않는 경우 , 사용자의 불편함이 있을 수 있기 때문에 그림 7의 New Style과 같이 아이콘 옆에 설명이나 미리보기를 제공하기도 한다.
<그림7> 포털형 패턴
③ 뉴스형 패턴
뉴스 컨텐츠는 모바일에서 가장 많이 사용되는 컨텐츠다. 뉴스형 패턴은 SNS형과 유사한 형태를 가지고 있다. 뉴스도 사용자와 정보를 교환하는 형태이기 때문이다. 상단에는 다양한 컨텐츠 카테고리 네비게이션이 위치하고, 하단에는 해당 화면에서 필요한 기능 네비게이션을 위치한다. SNS형과 다른 가장 큰 특징은 상단부에 헤드라인 뉴스를 보여주도록 별도의 구분된 프레임이 존재한다.
<그림8> 뉴스형 패턴
④ 기업형 패턴
기업형 소프트웨어는 화면 구성에서 포털형 패턴을 사용하기도 한다. 기업에서 제공하는 다양한 컨텐츠를 아이콘 형태로 구성할 수 있기 때문이다. 차이점을 살펴보면 , 기업형 소프트웨어는 어떤 컨텐츠를 제공하는지 사용자가 모르기 때문에 컨텐츠 아이콘을 계속 노출 시켜야 하기 때문에 화면을 그림 9와 같이 두개로 나누어 구성한다는 점이다. 포털형 패턴은 일정한 기능을 보여주고 기능이 선택될 경우 화면을 이동하지만 , 기업형 패턴의 특징은 보여주고자 하는 컨텐츠를 계속 노출하면서 컨텐츠를 보여준다. 동일한 카테고리의 컨텐츠를 한 화면에 보여준다고 이해하면 된다.
<그림9> 기업형 패턴
