성공하는 안드로이드 앱을 위한 UX 가이드라인

안드로이드 앱 디자인 패턴 가이드. 디자인 패턴은 효과적인 소통 방식을 사용하면서 실제 디자인을 구현할 때 접하는 복잡한 문제를 해결해 준다. 이 책은 먼저 안드로이드의 특징과 파편화, 디자인 사례 연구, 효과적이고 저렴한 프로토타입을 개발하고 고객 테스트를 수행하는 데 도움이 되는 포스트잇 방법론을 다룬다. 또, 웰컴 사용자 경험, 홈 화면, 내비게이션, 검색, 정렬 및 필터링, 데이터 입력, 폼 등 앱 디자인에서 가장 어려운 주제를 공략하는 58가지 핵심 디자인 패턴과, 12가지 안티 패턴을 소개한다.

Part Ι. UX 원칙과 안드로이드 OS 고려 사항
Chapter 01. 안드로이드용 디자인 : 사례 연구
- 실행 아이콘
- 액션 바와 정보 아키텍처
- 선택 컨트롤
- 버튼
- 검색 결과
- 상세 결과
- 정리하며

Chapter 02. 안드로이드의 차별점
- 평평한 세계에 온 것을 환영한다
- 아무곳이나 탭하기
- 모든 기기에 적합한 크기
- 경계 없는 모바일 공간
- 전역으로 생각하고 지역적으로 행동하기

Chapter 03. 안드로이드 파편화
- 파편화란?
- 파편화를 경축하자

Chapter 04. 모바일 디자인 프로세스
- 현실에서의 인간-모바일 상호작용 관찰
- 프로토타입 방식에서는 폼 팩터의 다양성으로 고려해야 한다
- 사용자 테스트에서는 사용자가 모션의 자연스러운 범위, 음성, 멀티터치를 경험할 수 있게 해야 한다
- 터치 인터페이스는 단순함과 정교함을 구체화해야 한다
- 재미는 필수다
- 완전한 이야기 들려주기 : 크로스 채널 경험을 위한 디자인
- 모바일 디자인 사례 연구

Part Ⅱ. 안드로이드 디자인 패턴과 안티패턴
Chapter 05. 웰컴 사용자 경험
5.1 안티패턴: 최종 사용자 라이선스 동의서
5.2 안티패턴: 연락처 방해물
5.3 안티패턴: 가입/로그인
5.4 패턴: 웰컴 애니메이션
5.5 패턴: 튜토리얼

Chapter 06. 홈 화면
6.1 패턴: 링크 목록
6.2 패턴: 대시보드
6.3 패턴: 업데이트
6.4 패턴: 찾기
6.5 패턴: 지도
6.6 패턴: 히스토리

Chapter 07. 검색
7.1 패턴: 음성 검색
7.2 패턴: 자동 완성 및 자동 추천
7.3 패턴: 탭 어헤드
7.4 패턴: 당겨서 새로고침
7.5 패턴: 메뉴에서의 검색
7.6 패턴: 액션 바에서의 검색
7.7 패턴: 전용 검색
7.8 패턴: 콘텐츠 페이지에서의 검색
7.9 안티패턴: 검색과 개선 기능의 분리

Chapter 08. 정렬 및 필터링
8.1 안티패턴: 무능력한 개선 기능
8.2 패턴: 개선 페이지
8.3 패턴: 필터 스트립
8.4 패턴: 병렬적 아키텍처
8.5 패턴: 탭

Chapter 09. 결과 없는 화면 및 원하지 않는 결과 피하기
9.1 안티패턴: 시스템 상태의 가시성 무시
9.2 안티패턴: 인터페이스 효율성의 부족
9.3 안티패턴: 쓸모없는 컨트롤들
9.4 패턴: 이것을 찾으셨나요?
9.5 패턴: 지역 결과

Chapter 10. 데이터 입력
10.1 패턴: 슬라이더
10.2 패턴: 스태퍼
10.3 패턴: 스크롤 캘린더
10.4 패턴: 날짜 및 시간 휠
10.5 패턴: 드롭다운
10.6 패턴: 다중 선택
10.7 패턴: 자유 형식 텍스트 인풋 및 익스트랙트
10.8 패턴: 입력 마스크를 활용한 텍스트 상자
10.9 패턴: 원자적 엔티티를 갖춘 텍스트 상자

Chapter 11. 폼
11.1 패턴: 인라인 에러 메시지
11.2 패턴: 토스트 경고창
11.3 패턴: 팝업 경고창
11.4 패턴: 콜백 검증
11.5 패턴: 취소/확인
11.6 패턴: 상단 정렬 라벨
11.7 패턴: 환경으로부터 입력값 받기
11.8 패턴: 입력 가속기

Chapter 12. 모바일 뱅킹
12.1 패턴: 빠른 로그인
12.2 패턴: 전용 선택 페이지
12.3 패턴: 폼 우선
12.4 패턴: 전용 페이지 마법사
12.5 패턴: 폼을 갖춘 마법사
12.6 패턴: 검토-확인
12.7 패턴: 근거리 자기장 통신(NFC)

Chapter 13. 내비게이션
13.1 안티패턴: 포고스티킹
13.2 안티패턴: 여러 개의 강조
13.3 패턴: 캐로셀
13.4 패턴: 팝오버 메뉴
13.5 패턴: 워터마크
13.6 패턴: 스위스 군용 칼 내비게이션
13.7 패턴: 연동: 마지막 지경

Chapter 14. 태블릿 패턴
14.1 패턴: 프래그먼트
14.2 패턴: 복합 뷰
14.3 실험 패턴: 사이드 내비게이션
14.4 패턴: 내비게이션 겸용 콘텐츠/멀티터치 제스처
14.5 패턴: 2-D 더 보기
14.6 실험 패턴: C-스와이프

성공하는 모바일 UX & UI를 위한
58가지의 패턴과 12가지의 안티패턴 소개!
이 책은 성공하는 안드로이드 앱 디자인 패턴에 대한 책이다. 그럼, 여기서 디자인 패턴이 왜 필요할까? 디자인 패턴의 장점은 가장 효과적인 소통 방식을 사용하면서 실제 디자인을 구현할 때 접하는 복잡한 문제를 해결해주는 데 있다.

이 책은 크게 두 파트로 나눠져 있다. 첫 번째 파트에서는 안드로이드의 특징과 파편화, 디자인 사례 연구를 다루고 있으며, 효과적이고 저렴한 프로토타입을 개발하고 고객 테스트를 수행하는 데 도움이 되는 포스트잇 방법론을 소개한다.

두 번째 파트에서는 본격적으로 디자인 패턴과 안티패턴을 소개한다. 안드로이드 앱 디자인에서 가장 어려운 주제들(웰컴 사용자 경험, 홈 화면, 내비게이션, 검색, 정렬 및 필터링, 데이터 입력, 폼)을 공략하는 58가지 핵심 디자인 패턴을 소개한다. 또, 고객을 즐겁게 하고 만족시키기 위해 꼭 삼가야 하는, 58가지 패턴만큼 중요한 12가지 안티패턴도 소개한다. 이 책에는 훌륭한 모바일 사용자 경험을 전달하는 데 필요한 모든 내용이 담겨 있다.

성공하는 안드로이드 앱을 위한 UX 가이드라인
사용자 경험(UX)은 성공하는 앱을 제작하기 위한 필수 요소라고 할 수 있다. 특히 소형 스마트폰에서부터 대형 태블릿 PC까지 마치 파편처럼 쪼개진 안드로이드 기기에서 좋은 UX를 전달하기 위해서는 모든 상황에 공통으로 적용할 수 있는 패턴을 찾아 최적화된 디자인을 구현해야 한다.

이 책의 저자인 그렉 누들먼은 성공하는 디자인이 있다고 믿는 사람이며 ‘구글’의 골수 팬이 아니다. 그리고 소위 '순수‘ 프로젝트라고 하는 다양한 프로젝트들이 처참하게 실패하는 것을 여러 차례 봤다. 이 책에서는 애플 iOS, 윈도우 모바일, 블랙베리 같은 다른 모바일 운영체제로부터 아이디어를 얻어 안드로이드에 응용하는 디자인 패턴도 여러 차례 볼 수 있을 것이다.

이 책에서 기능 구현을 위한 소스 코드는 소개하지 않는다. 그래서 프로그래밍 경험이 없는 사람들도 부담없이 볼 수 있다. 현대 모바일 디자인은 매 단계마다 다양한 제약과 빠지기 쉬운 함정이 도사리고 있는 복잡한 분야다. 따라서 이 책에서는 프로젝트의 디자인 부분을 무사히 통과하도록 하는데 모든 내용을 할애했다. 또한 필자의 노하우를 생생하게 전달하고 있어 현업에서 바로 적용할 수 있을 것이다.

이 책의 구성
Part Ι. UX 원칙과 안드로이드 OS 고려 사항
Chapter 01. 안드로이드용 디자인 : 사례 연구
이 장에서는 좀 더 정교한 디자인을 통해 개선할 수 있는 앱에 대한 사례 연구를 통해 이 책에서 58가지 패턴(및 12가지 안티패턴)의 기초를 다진다. 이 장에서 살펴볼 앱은 AutoTrader 앱이다. 각 절에서는 적절한 패턴을 참조하고 있으며, 디자인 솔루션에 대해 좀 더 자세히 알고 싶다면 관련 페이지로 페이지를 넘겨가면서 책을 봐도 된다.

Chapter 02. 안드로이드의 차별점
안드로이드 OS는 공개 후 수년 간 혈기 왕성한 호르몬을 주체할 수 없는 10대처럼 행동했다. 하지만 여전히 안드로이드 OS는 반항적인 해커 DNA를 유지하고 있으며 안드로이드의 고유 특징을 내포하고 있다. 이 장에서는 이러한 안드로이드의 차별화된 특징들을 살펴본다.

Chapter 03. 안드로이드 파편화
볼 베어링 공장의 파편과 마찬가지로 안드로이드 파편화도 엄청난 규모를 자랑한다. 여기서는 중요한 요소를 골라내고 다양한 기기에 맞는 앱 사용자 경험(UX) 디자인 전략을 구축하는 법을 살펴본다.

Chapter 04. 모바일 디자인 프로세스
효과적인 모바일 디자인 프로세스란 어떤 것일까? 이 장의 끝에서는 이 책 전반에서 사용한 포스트잇 모바일 디자인 방법론을 살펴본다. 또한 전통적인 사용자 중심 디자인(UCD) 기법을 채택한 접근 방식을 살펴봄으로써 이런 전통적인 접근 방식이 여전히 효과적이고 중요하다는 사실을 강조하려 한다.

Part Ⅱ. 안드로이드 디자인 패턴과 안티패턴
Chapter 05. 웰컴 사용자 경험
사용자가 앱을 처음 시작할 때 먼저 눈에 띄는 것이 바로 환영 인사말이다. 그리고 앱 시작과 동시에 드러날 수 있는 안티패턴들이 나타나는데, 최종 사용자 라이선스 동의서, 권리 포기 각서, 가입 폼 등이 그 예다. 이 장에서는 이와 같은 안티패턴의 주범들을 살펴보고 이를 개선할 수 있는 사용자 친화적인 웰컴 전략을 제안한다.

Chapter 06. 홈 화면
훌륭한 홈 화면은 실제로 스토리를 들려주는 것이다. 이 장에서는 홈 화면과 관련된 패턴들을 살펴보면서 사용자 친화적인 전략을 제시한다.

Chapter 07. 검색
검색은 핵심적인 모바일 활동이다. 모바일 기기를 통해 점심을 먹을 장소와 찾아가는 방법 등을 찾을 수도 있으며 사고싶은 물건을 검색할 수 있다. 따라서 모바일에서는 검색 패턴이 중요하다. 이 장에서는 이러한 검색 패턴을 살펴본다.

Chapter 08. 정렬 및 필터링
사용자에게 자신이 필요한 정보를 찾는 과정이 제대로 진행되고 있다는 확신을 심어준 다음에는 모바일 컨텍스트에 맞게 적당한 크기로 데이터를 줄일 수 있게 도와줘야 한다. 이 때는 이 장에서 소개하는 정렬 및 필터링 디자인 패턴이 큰 도움이 된다.

Chapter 09. 결과 없는 화면 및 원하지 않는 결과 피하기
사용자들이 한 손으로 엄지 손가락을 사용해 작은 모바일 기기 화면에서 작업하거나 붐비는 전철에서 샌드위치를 먹으면서 모바일 기기를 사용하다 보면 실수가 생기기 마련이다. 하지만 이런 실수는 에러가 아니라는 점을 잘 인지해야 한다.

Chapter 10. 데이터 입력
모바일 기기에서 데이터를 입력하는 일은 두꺼운 손가락과 작은 기기 화면으로 인해 무척 까다롭다. 이 장에서는 현재 사용 중인 수많은 데이터 입력 방식을 모두 다루는 대신 대부분의 사람들이 오해하고 있는 안드로이드 폼의 입력 측면을 다루는 데 집중한다.

Chapter 11. 폼
작은 기기에서 데이터를 입력할 수 있다는 사실 자체는 멋지지만 궁극적인 사용자 상호작용을 위해서는 폼에 사용자 입력 컨트롤을 여러 개 결합해야 한다. 이 장에서는 안드로이드 기기에서 폼이 덜 짜증나게 하는 방법을 주로 다룬다.

Chapter 12. 모바일 뱅킹
이 장에서는 빠르게 성장하고 있는 모바일 개인 금융 및 모바일 뱅킹을 집중적으로 다룬다. 이 장에서 소개하는 패턴은 모바일 뱅킹 컨텍스트에서 소개하지만 이들 패턴은 긴 폼이나 보안상 중요한 데이터를 처리해야 하는 복잡한 작업 흐름에도 얼마든지 적용할 수 있다.

Chapter 13. 내비게이션
안드로이드 내비게이션은 별도로 책 한 권이 필요할 만큼 방대한 주제다. 그래서 이 장에서는 가장 고급 내비게이션, 가장 큰 논쟁이 되는 내비게이션, 가장 많이 실수하는 내비게이션을 엄선해서 살펴본다. 또한, 작은 모바일 화면에서도 사용할 수 있고, 편안하게 즐길 수 있는 내비게이션 패턴을 살펴본다.

Chapter 14. 태블릿 패턴
태블릿은 모바일 기술에서 큰 부분을 차지한다. 태블릿용 디자인 분야는 실험을 감행할 의지가 있는 개발팀이 태블릿 기기에 가장 최적화된 사용자 경험을 창출함으로써 경쟁에서 빠르게 앞서갈 수 있는 분야 중 하나다. 이 장에서 소개하는 패턴들은 스마트폰보다 화면이 큰 소형 및 대형 태블릿용 패턴이다.