모바일 디자인 Process

Design Process

1. App Plan

2. Design Research

3. UI Structure

4. Prototype

 

1. App Plan

1) 비즈니스 모델 정의

2) 테스크 및 사용자 분석

사용자들이 가장 중요하게 생각하는 많이 사용하는 핵심기능 추출한다.

3) 서비스 구분 (OS, RWD, AWA... )

네이티브 모바일, 반응형 웹앱인지 결정한다.

 

2. Design Research

사용자들은 익숙한 UI를 선호하기 때문에 Design Research가 필요하다

1) 유사 카테고리 분석

유사/경쟁 카테고리 서비스와 타겟층이 겹치는 서비스 각각 5~10개씩 찾는다.

2) 디자인 포지션

1)에서 찾은 서비스를 타겟층과 기능(테마)로 분류하고

나의 서비스는 어디에 위치하는지 어느 서비스와 유사한지 찾는다.

3) 경쟁 앱 분석

2)에서 찾은 유사 앱을 분석하여 해당 앱의 장단점을 파악한다.

4) 무드 보드

1~3 과정을 통해 나의 서비스에 해당되는 카테고리와 타겟층은 어떤 것을 선호하는지 파악되고,

이를 한 눈에 파악할 수 있는 혹은 나의 서비스가 가지는 느낌을 표현한 무드 보드를 작성하게 된다.

5) Typography / Font

나의 서비스의 로고, 폰트를 제작 혹은 선택

6) Color Swatch

나의 서비스에서 사용될 컬러 팔레트 선택

7) Icon / Metaphor

사용자에게 나의 서비스를 각인시킬 수 있도록 하는 아이콘 제작 

 

3. UI Structure

1) 앱 전체 구조 설계

컨텐츠의 특성과 사용자의 사용성을 고려하여

해당 컨텐츠의 전체 흐름과 구조를 표현한다.

 

디자인과 스타일 위주보단 기능, 화면, 메뉴 위주로 구성하되 최대 3 Depth를 넘지 않는 것이 중요하다.

 

• 메뉴 및 화면 구성
• 와이어 프레임 형식의 스토리보드
• 기능 및 주요 기술 표시
• 화면 넘버 및 종류 표시 (Activity, popup, toast)
• 트렌지션 표시 (장면 전환 효과) - ex) popup, slide 등

 

4. Prototype

다양한 UI wireframe 툴 등을 이용하여 

서비스의 Usability, interaction을 검증하고 문제점을 발견하여 개선한다. 

 

 

 

출처 : 멀티캠퍼스