눈길을 사로잡는 스마트폰 앱 UX UI 디자인(디자이너와 개발자가 함께 보는)(개정증보판)(위키북스 UX 시리즈 13)

다년간의 모바일 디자인 개발과 강의 경험을 바탕으로 한 국내 최초의 앱 디자인 전문서!



대부분의 앱 개발 관련 책은 프로그래밍 언어와 UX/UI 이론에 중점을 두지만, 이 책은 앱 개발에 필요한 UX/UI, 기획, 앱 디자인 가이드라인과 모바일 환경, 그래픽 툴의 활용, 스타일가이드 등 앱 개발에 필요한 디자인 요소를 주된 내용으로 담고 있으며, 앱 개발자와 디자이너, 앱 개발에 관심이 있고 취업 및 이직을 원하는 모든 분들께 필요한 앱 디자인 실무서다.



다양한 앱 디자인 사례부터 일러스트레이터, 포토샵 등을 활용한 디자인 기법, 현실적이고 쉽게 표현된 UX/UI 사례 및 이론, 각 운영체제별 디자인 가이드라인 등의 내용을 담고 있어 앱 제작에 관심이 있는 개발자나 디자이너라면 누구나 쉽게 앱 개발 및 디자인에 도움될 것이다.



이 책은 기존에 출간된 『눈길을 사로잡는 스마트폰 앱 UX & UI 디자인』 도서의 개정증보판으로 iOS7 발표에 따라 새롭게 화면을 구성하고 UX/UI 의 새로운 디자인 트렌드 등에 대한 내용을 추가했습니다.



앱 개발자와 디자이너에게 꼭 필요한 앱 디자인 실무서!



국내 스마트폰 앱 시장의 규모와 환경에 비해 앱 디자인에 대한 정보를 찾아보기란 쉽지 않습니다. 앱을 개발하는 기획자와 개발자, 디자이너조차 어떻게 디자인이 활용되고 디자인에 대한 가이드라인은 무엇이며, 디자인과 개발 분야와의 협업은 어떻게 이뤄지는가에 대해 모르고 접근할 때가 아주 많습니다.



특히 최근에는 앱에 대한 UX/UI의 중요성이 주목받고 있지만 대부분 개발에 필요한 프로그래밍 언어와 이론 중심의 UX/UI에 관한 책들이 대부분입니다. 그런 점에서 이 책은 앱 개발에 필요한 UX/UI, 기획, 앱 디자인 가이드라인과 모바일 환경, 그래픽 툴의 활용, 스타일가이드 등 앱 개발에 필요한 디자인 요소를 다년간의 실무와 강의 경험을 바탕으로 체계적으로 다룬 앱 디자인 전문서입니다.



앱 개발자와 디자이너, 앱 개발에 관심이 있고 취업 및 이직을 원하는 모든 분들께 필요한 실무서입니다.



★ 이 책에서 다루는 내용



◎ UX/UI, GUI 디자인

◎ 앱 디자인 환경 및 디자인 가이드

◎ 앱 디자인을 위한 그래픽 디자인의 활용

◎ 아이콘 디자인

◎ 앱 UX/UI 디자인

◎ 앱 디자인 제작 프로세스

◎ 앱 디자인 제작

◎ 프로토타입, 나인패치, 스타일 가이드

▣ 1장: 스마트폰 앱 UX, UI 디자인 환경



[01] UX, UI 디자인

UX란?

- UX

- UX 디자인

- UX 주요 사례

- 스마트폰 앱의 UX 환경 변화

UI와 GUI란?

- UI

- UI 디자인 원칙

- GUI

- UI 디자인의 흐름

UX, UI 디자인

- UX, UI 디자인은 기술과 함께 발전한다

- UX, UI 디자인은 표현과 경험이다

- UX, UI 디자인 프로세스

- UX, UI 디자이너의 자세

- 스마트폰 앱 UX, UI 디자인 특징

UX, UI 디자인 트렌드

- 인터렉션 디자인

- 플랫 디자인

- 인포그래픽스



[02] 스마트폰 앱 디자인 환경

스마트폰 앱 제작 환경

- 스마트폰이란?

- 애플리케이션/앱

- 모바일 앱의 종류

- 스마트폰 앱 마켓, 스토어

- 스마트폰 운영체제

- 피처폰의 특징

- 스마트폰과 피처폰 콘텐츠 디자인의 차이

- 스마트폰 운영체제별 개발 환경

스마트폰 앱 디자인의 특징

- 스마트폰 앱 UI 구성 시 고려 사항

- UI 가이드라인

- 나인 패치 이미지의 활용

- 레이아웃 및 구조

- 색상 패턴



[03] 스마트폰 앱 디자인 가이드

안드로이드 UI 디자인 가이드 및 특징

- 구글(안드로이드)의 10가지 UX 디자인 원칙

- 스마트폰의 화면 크기 및 해상도

- 런처 아이콘(애플리케이션 실행 아이콘)

- 메뉴 아이콘

- 상태 바 아이콘

- 탭 아이콘

- 다이얼로그 아이콘

- 리스트 아이콘

- 위젯 디자인

- 최신 버전의 안드로이드 운영체제의 특징

- 아이폰 UI 디자인 가이드 및 특징

- Less & More

아이폰 UI 디자인 원칙

- 스마트폰 화면 크기 및 레티나 디스플레이

- 아이콘 제작 환경

- 아이콘 제작 순서

- 아이콘 디자인 특징

- iOS7 UI 디자인 특징

▣ 2장: 앱 디자인을 위한 그래픽 활용



[01] 그래픽 디자인의 활용

해상도 및 스마트폰 디스플레이

- 해상도

- 해상도와 스마트폰 디스플레이와의 관계

- 해상도별 제작 순서

이미지 파일 형식 및 색상

- JPG

- GIF

- PNG

- 색상 및 비트의 이해

디자인 프로그램의 활용

- 일러스트레이터의 활용

- 포토샵의 활용



[02] 일러스트레이터의 활용

일러스트레이터의 환경

- 벡터 그래픽 제작 방식

- 벡터 그래픽 제작 방식의 장단점

- 일러스트레이터의 화면 구성

- 오브젝트 표현 및 구성

일러스트레이터의 주요 기능

- 단축키 활용

- 작업(Document) 창 설정

- 선택 도구(Selection Tool)의 활용과 오브젝트 속성

- 오브젝트 그리기

- 펜 도구의 활용

- 선(Stroke)의 속성

- 오브젝트의 잠금(Lock) 및 그룹(Group)

- 반복 실행 및 작업 되돌리기

- 오브젝트 명암 처리 기법

- 오브젝트 크기 조절, 회전, 반전 기법

- 연결 및 라운드 코너(둥근 모서리화)

- 레이어의 활용

- 3D와 오브젝트 확장

- 패턴 제작 및 활용



[03] 포토샵의 활용

포토샵의 환경

- 비트맵 제작 방식

- 비트맵 제작 방식의 장단점

- 안티 알리어스

- 포토샵의 화면

포토샵의 주요기능

- 주요 단축키 활용

- 작업 창(Document) 설정

- 창 편집 및 화면 정보

- New Window의 활용

- 색상 적용 및 색상 견본 팔레트

- 선택 도구의 활용 및 편집

- 레이어의 활용 및 편집

- 그라디언트의 활용

- 레이어 스타일

- 레이어 스타일 수정 및 편집

- 레이어 마스크

- 펜 도구와 패스의 활용

- 도형 도구의 활용

- 패턴의 활용

- 브러시 도구 및 연필 도구의 활용

- 일러스트레이터와의 활용

- 자유 변형 도구(이미지 크기 조절)

- 작업 되돌리기



▣ 3장: 스마트폰 앱 UX, UI 디자인



[01] 아이콘 디자인

아이콘 디자인의 특징

- 아이콘이란?

- 확실한 메타포의 사용

- 픽셀 디자인(도트디자인)

- 평면 아이콘 및 효과

- 투시 기법에 따른 아이콘 표현(3D)

- 빛과 아이콘 디자인

- 빛의 굴절 및 표현

스마트폰 앱 아이콘의 특징

- 스마트폰 UI 아이콘의 구분

- 스마트폰 앱 아이콘의 특징



[02] 스마트폰 앱 UX, UI 디자인

일러스트레이터를 활용한 아이콘 디자인

- 일러스트레이터 오브젝트의 포토샵 활용

- 기본 아이콘 디자인

- 응용 아이콘 디자인

- 스마트폰 UI 아이콘 디자인

스마트폰 앱 활용 버튼

- 아쿠아 버튼

- 그라디언트 버튼

런처 아이콘 디자인

- 런처 아이콘 제작 활용

- 런처 아이콘 디자인

위젯 및 패턴 디자인

- 위젯

- 패턴 디자인



▣ 4장: 스마트폰 앱 프로젝트



[01] 앱 디자인 제작 프로세스

앱 개발자 구분

- 기획자 및 프로젝트 매니저

- 앱 프로그래머 및 제작 과정

- 앱 디자이너의 역할 및 자세

앱 디자인 기획

- 디자인 기획

- 페이퍼 프로토타입 및 목업

- 프로토타입 기획서



[02] 앱 디자인 제작

앱 UI 디자인

- 런처 아이콘 제작

- Android, iOS 대응 제작 프로세스

- 해상도별 이미지 크기 및 레이아웃 설정

- 나인패치 제작

스타일 가이드 및 이미지 저장

- 나인패치 종류

- 이미지 커팅 및 나인패치 활용

- 파일명 표기 및 이미지 저장

- 스타일 가이드

김영삼 저자 김영삼은 대학에서 의상디자인을 전공했으며 국내 IT 산업 초창기부터 지금까지 모바일 그래픽, 스마트폰 앱 UX/UI 디자인, 모바일 웹앱, 플래시, 캐릭터 디자인 등에 대한 개발과 강의를 진행하고 있다. 한국 매크로미디어 MAX(모바일 게임 부분 대상), 아이리버(모바일 플래시 게임 부분 특별상), 친환경상품진흥원(게임 부분 3위), 보건복지가족부(UCC 부문 장관상) 등의 수상 경력이 있으며, 현재는 (주)소프트캠퍼스 디자인 실장으로 재직하면서 앱 개발과 PM 업무을 수행하고 있다. 또한 SK T아카데미, KT 에코노베이션 스마트스쿨, 삼성 SDS 멀티캠퍼스, 각 지역 진흥원 및 특성화고, 앱창작터, 대학교 등에서 스마트폰 앱 UX/UI, 앱 기획 및 디자인, 모바일 웹앱 디자인 등을 강의하고 있다.