• 눈길을 사로잡는 스마트폰 앱 UX & UI 디자인
  • 디자이너가 개발자가 함께 보는

  • 김영삼 지음

  • 위키북스 UX 시리즈_008
  • ISBN: 9788998139094
  • 30,000원 | 2012년 12월 27일 발행 | 504쪽



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

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

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

김영삼

대학에서 의상디자인을 전공했으며 국내 IT 초창기 때부터 지금까지 모바일 그래픽, 스마트폰 앱 UX/UI 디자인, 모바일 웹앱, 플래시, 캐릭터 디자인 등에 대한 개발과 강의를 진행하고 있다.

한국 매크로미디어 MAX(모바일 게임 부문 대상), 아이리버(모바일 플래시 게임 부문 특별상), 친환경상품 진흥원(게임 부문 3위), 보건 복지가족부(UCC 부문 장관상) 등의 수상 경력이 있으며, 현재는 (주)소프트캠퍼스 디자인 실장에 재직하면서 동시에 SK T아카데미, 삼성 SDS 멀티캠퍼스, 각 지역 진흥원 및 특성화고, 앱창작터, 대학 등에서 강의하고 있다.

  • ▣ 1장: 스마트폰 앱 UX, UI 디자인 환경
    • [01] UX, UI 디자인
      • UX란?
        • UX
        • UX 디자인
        • UX 주요 사례
      • UI와 GUI란?
        • UI
        • UI 디자인 원칙
        • GUI
        • UI 디자인의 흐름
      • UX, UI 디자인
        • UX, UI 디자인은 기술과 함께 발전한다
        • UX, UI 디자인은 표현과 경험이다
        • UX, UI 디자인 프로세스
        • UX, UI 디자이너의 자세
        • 인터랙션 디자인
        • 스마트폰 앱 UX, UI 디자인 특징
      •  
    • [02] 스마트폰 앱 디자인 환경
      • 스마트폰 앱 제작 환경
        • 스마트폰이란?
        • 애플리케이션/앱
        • 모바일 앱의 종류
        • 스마트폰 앱 마켓, 스토어
        • 스마트폰 운영체제
        • 피처폰의 특징
        • 스마트폰과 피처폰 콘텐츠 디자인의 차이
        • 스마트폰 운영체제별 개발 환경
      • 스마트폰 앱 디자인의 특징
        • 스마트폰 앱 UI 구성 시 고려 사항
        • UI 가이드라인
        • 나인 패치 이미지의 활용
        • 레이아웃 및 구조
        • 색상 패턴
      •  
    • [03] 스마트폰 앱 디자인 가이드
      • 안드로이드 UI 디자인 가이드 및 특징
        • 구글(안드로이드)의 10가지 UX 디자인 원칙
        • 스마트폰의 화면 크기 및 해상도
        • 런처 아이콘(애플리케이션 실행 아이콘)
        • 메뉴 아이콘
        • 상태 바 아이콘
        • 탭 아이콘
        • 다이얼로그 아이콘
        • 리스트 아이콘
        • 위젯 디자인
        • 최신 버전의 안드로이드 운영체제의 특징
        • 아이폰 UI 디자인 가이드 및 특징
        • Less & More
      • 아이폰 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 디자인
        • 런처 아이콘 제작
        • 해상도별 이미지 크기 및 레이아웃 설정
        • 나인패치 제작
      • 스타일 가이드 및 이미지 저장
        • 나인패치 종류
        • 파일명 표기 및 이미지 저장
        • 스타일 가이드

예제코드 관련 GitHub 페이지

동영상 강의

관련 글


엮인 글

엮인 글 주소: http://wikibook.co.kr/seductive-ux-ui/trackback/