★ 이 책에 쏟아진 찬사 ★

"이 책은 아이디어가 필요할 때 휘리릭 넘겨보기 좋은, 최고로 간편한 책이다.
- 빌 스콧(Bill Scott) / 페이팔(Paypal)의 시니어 웹 개발 디렉터

“환상적인 책이다!”
- 에린 말론(Erin Malone) / 탠저블UX(Tangible UX)의 파트너

"이 책에 대한 깊은 고마움을 감사하다는 말 외에 달리 표현할 길이 없다. 이 책은 기존 앱을 다시 디자인하는 작업에 훌륭한 길잡이가 되어 줬다!"
- 아가타 준(Agatha June) / UX 디자이너

★ 추천의 글 ★

이름을 아는 것은 이해를 위한 첫걸음이다.
나의 5살짜리 아들은 다른 아이들과 마찬가지로 구름 보는 것을 참 좋아한다. 아들은 얼마 전 구름의 종류에 따라 이름이 다르다는 사실을 알고는 거기에 빠져들어 구름 이름을 외우기 시작했다. 새털구름, 뭉게구름, 안개구름, 면사포구름, 소나기구름, 높층구름, 렌즈구름... 이 정도가 그중 내가 아는 전부다. ‘봉우리 뭉게구름’이란 건 전에 들어본 적도 없다.

이제 아들은 하늘을 보면서 내게 구름의 이름을 말해줄 수 있다. 그뿐만 아니라 전에 비해 아주 미묘한 부분까지 알아차린다. 아들은 구름의 종류를 질감, 색깔, 높이, 움직임 등 외형적 특징으로 구별해서 익혔다(물론 구별하기가 항상 쉽진 않지만, 아들에게는 크게 문제되지 않는다). 또한 어떤 구름이 비를 뿌릴지, 뿌리지 않을지 어느 정도 정확하게 예측할 수 있다.

어린 미취학 아동들이 그렇듯이, 아들은 구름에 대한 지식을 큰 그림을 분석하는 데 사용하기도 한다. “면사포구름은 온난전선을 의미하는 것 같아요.” 또는 “봉우리 뭉게구름이 소나기구름으로 변하고 있어요. 곧 폭풍이 올 것 같아요.”라고 말한다.

무엇보다 아들은 구름이름을 익히는 일을 즐긴다. 어린 아이들은 자기가 사랑하는 것에 이름 붙이는 일을 정말 좋아하는 듯하다. 구름, 공룡, 곤충, 차, 인형, 영화 캐릭터, 무엇이든 말이다. 아이들의 상상력은 좌뇌의 지식에 제한받지 않는 게 분명하다. 아들은 '뭉게구름' 속에서 궁전, 오리, 꽃양배추를 본다.

우리는 이렇게 자라왔다. 이는 이 책의 주제인 모바일 인터페이스 디자인에도 마찬가지로 적용된다. 인터페이스의 패턴을 인식하고 이름을 알면, 인터페이스를 더 잘 ‘보게’ 되고 더 깊숙이 알게 된다. 뇌는 우리가 찾는 것에 맞춰지기 때문이다. 인터페이스 패턴이 어떻게 동작하는지 알기 때문에 소프트웨어의 동작을 예측할 수 있다. 사람들에게 우리가 보는 것을 새로운 표현으로 이야기해줄 수 있다.

그러면 이러한 패턴들을 어떻게 배울 것인가?

내 아들이 구름에 대해 배울 때 가장 좋은 도구는 그림, 아주 많은 그림이었다. 책과 웹사이트에 있는 카탈로그 그림들을 보면서 구름의 차이, 때로는 말로 표현하기도 어려운 미묘한 차이들을 익혔다.

마찬가지로, 인터페이스 패턴을 배우는 가장 좋은 방법은 시각적인 예제들을 보는 것이다. 나는 어휘를 사랑하는 작가이기 때문에, 패턴이 무엇이고, 어떻게 선택하는지 그리고 패턴들 간의 차이가 무엇인지 가능한 범위 내에서 할 수 있는 한 정의해보려고 한다. 그러나 단순히 기술적으로 패턴을 알 필요가 있는 인터페이스 디자이너들에게는 이런 어휘들이 모두 필요하지 않을 것이다. 충분한 설명을 통해 각 패턴에 대한 지식을 얻고, 선별된 실제 사용 사례들을 통해 지식을 강화하고 싶을 것이다.

이 책의 수많은 패턴 그림은 테레사 닐(Theresa Neil)이 함께 작업했다. 나로서는 엄두도 낼 수 없는 이 작업에 어느 정도의 노고가 들어갔는지 상상하기 어렵다. 수많은 모바일 앱을 리뷰하고, 그중에서 좋은 앱을 골라 스크린샷을 모으는 일은 보통 일이 아니다.

이 책은 모바일 인터페이스 디자이너에게 보물단지다. 한 번에 다 읽는 것도 좋겠지만, 예제들을 활용해 자신의 디자인을 향상해보기를 권한다.

■ 예제 중 잘 된 것을 골라보고, 현재 디자인하고 있는 상황에 맞춰 그 이유를 파악해보라.
■ 디자인 영감을 얻기 위한 소스로 사용하라. 이 책의 스크린샷은 패턴뿐만 아니라 아이콘 디자인 또는 색 사용 등 디자인 측면에서도 훌륭하다.
■ 앱에 대한 지식을 넓히는 데 사용할 수 있다. 모든 앱을 일일이 다운로드하고 사용해보는 수고 없이 기존 앱들이 어떻게 작동하는지 알 수 있다.

어쩌면 사용하고 있는 모바일 앱에서 자신만의 패턴 예제를 찾아낼 수도 있다. 일단 패턴의 이름을 알고 나면 그 패턴을 사용할 수밖에 없으리라고 장담할 수 있다. 아들이 알려준 덕분에 이제 나는 '봉우리 뭉게구름'을 알고 있다. 아, 그동안 그것도 모르고 어떻게 살았을까?
모쪼록 즐기길!

- 제니퍼 티드웰(Jenifer Tidwell)

★ 이 책에서 다루는 내용 ★

■ 기본 내비게이션과 보조 내비게이션 패턴 배우기
■ 업계에 널리 퍼진 나쁜 폼 디자인 습관 타파하기
■ 표와 리스트로 가장 중요한 정보만 보여주기
■ 검색, 정렬, 필터 기능을 사용하기 쉽게 만들기
■ 도구로 직접 인터랙션하는 것처럼 만들기
■ 기본 차트 디자인의 모범 사례 배우기
■ 한 번 사용해보게 하고, 기능을 발견하도록 유도하기
■ 컨트롤로 기능 수행을 도와주고 적절한 피드백 제공하기
■ 도움말 페이지를 좀 더 작은 폼 요소로 통합하기

★ 이 책의 대상 독자 ★

이 책은 모바일 애플리케이션을 만드는 제품 관리자, 디자이너, 개발자들을 위한 책이다. 회사에서 모바일 전략을 만들 때, 모범 디자인 사례를 찾아내기란 쉬운 일이 아니다. 특히 다양한 운영체제를 고려하면 더욱 어렵다. 간단한 아이폰 애플리케이션을 비롯한 어떤 운영체제에서든지, 이 책에 나오는 패턴들은 쉽지 않은 디자인 문제에 대한 해법이 돼줄 것이다.

★ 저자 서문 ★

우리는 최근 새로운 모바일 프로젝트를 시작했고, 노련한 모바일 디자이너 모두가 각자 프로젝트에 참여하고 있는 상황이었다. 신입 디자이너를 가르칠 수 있는 시간은 불과 일주일도 채 되지 않았다. 그래서 나는 수많은 스크린샷으로 좋은 디자인과 나쁜 디자인을 설명하는 퀵 튜토리얼을 만들었고, 이렇게 모바일 애플리케이션 디자인 패턴이 탄생했다.
이 책의 진정한 가치는 패턴을 분류해서 정의한 것보다 수백 개의 예를 수집해 정리했다는 데 있다. 즉 이 책은 패턴 이론서가 아니라, 모바일 애플리케이션이 진열된 갤러리다. iOS, 안드로이드, 블랙베리, 웹OS, 심비안, 윈도우용 애플리케이션으로부터 400개가 넘는 최신 스크린샷을 구해 패턴 유형별로 분류했다. 웹사이트(http://www.mobiledesignpatterngallery.com)와 플리커(Flickr) 포토스트림에서 더 많은 예를 볼 수 있다.

★ 역자 서문 ★

모바일 시대로 넘어오면서 그 중심에는 모바일 애플리케이션(앱)이 있다고 해도 과언이 아닐 것입니다. 우리가 하루에 사용하는 모바일 애플리케이션의 수는 얼마나 될까요? 하루에도 수없이 많은 모바일 애플리케이션이 지구 곳곳에서 만들어지고 있습니다. 이런 모바일 애플리케이션을 사용하기 쉽게 만들려면 어떻게 디자인해야 할까요? 큰 모니터 화면, 키보드 입력이 기본이었던 PC 환경에서 웹사이트를 만들다가 손바닥만 한 화면과 터치 인터페이스가 중심인 스마트폰 환경에서 사용하기 편리한 모바일 애플리케이션을 디자인하는 일은 쉽게 답할 수 있는 문제가 아닙니다. 이 책은 이 질문에 풍부한 실제 사례들을 기반으로 잘 정리해 실질적이고 구체적으로 답하고 있습니다.

현업에서 일하다 보면 애플리케이션에 녹여내고 싶었던 가치가 모바일 화면을 구성하는 과정에서 잘 표현되지 못해 사용자에게 제대로 전달되지 못하는 경우도 많이 보게 됩니다. 다양한 컨텐츠와 기능이 새롭고 창의적인 방식으로 표현되기 위해서는 참신한 아이디어 못지않게, 사용자와 소통할 수 있는 방식으로 아이디어를 구현하는 방안을 찾아나가는 일 또한 중요합니다. 이러한 학습에는 좋은 사례들을 제대로 이해하는 과정이 도움이 될 수 있습니다. 애플리케이션을 만들어가면서 당면한 문제들을 어떻게 해결했는지 체계적으로 정리해서 보여주는 것이 바로 디자인 패턴입니다. 저자가 수백 가지의 모바일 애플리케이션을 살펴보고 뽑아내어 체계적으로 정리한 디자인 패턴들이 좋은 모바일 애플리케이션을 만드는 데 도움이 되었으면 하는 바람입니다.