통합검색

사용자를 사로잡는 건 ‘디자인’이 아닌 ‘디자이너’다!
매력적인 설계를 꿈꾼다면 이 책을 펼칠 때

이 책은 이제 막 디자인 너머 사용자를 고민하기 시작한 주니어부터 PM으로 활발히 활동 중인 시니어까지 사용자를 사로잡을 디자인을 꿈꾸는 모든 이를 위한 책이다. 주니어는 UX/UI의 이해부터 나무가 아닌 숲을 보는 방법과 기초 소양을, 시니어는 급변하는 트렌드의 소용돌이에서 건져낸 인사이트를 얻을 것이다.

브런치 조회수 40만 작가, 10년 차 디자이너 김성연(우디)의
사용자를 유혹하는 UX/UI의 기술
이 책에서 다루는 주제는 7가지다. 먼저 현직 디자이너도 쉽게 정의하지 못하는 ‘UX/UI를 제대로 이해하는 것’부터 시작한다. 그렇게 프로덕트 디자이너의 역할을 이해한 다음 ‘웹/앱 디자인을 시작하기 전 알아 두어야 할 것들’ 픽셀, 해상도, 단위 등으로 기초를 탄탄하게 다진다. 본격 UX/UI 디자이너로서 첫 발을 뗄 수 있도록 실무에서 활발히 쓰이는 리서치 개념과 비즈니스 전략, UX 라이팅을 비롯해 화면의 완성도를 높이는 설계 요소까지 둘러볼 것이다.
후반부에선 사용자를 이해하기 위한, 그리고 목표를 조금 더 쉽게 달성하기 위한 ‘심리학’을 살펴본다. 여기에 스타트업도 지금 당장 시작할 수 있는 ‘가장 현실적인 브랜딩’을 더했다. 한 발 더 나아가 디자이너로서 나아가야 할 길에 대한 인사이트를 얻을 수 있는 ‘디자인과 윤리’ 그리고 부록으로 ‘디자이너의 말 그릇’까지 눌러 담았다. 저자의 목소리를 따라 책장을 모두 넘기고 나면 어느새 UX/UI의 광범위한 세계를 마주보게 될 것이다.

비주얼 디자인? UX 라이팅? 리서치? 브랜딩!
오래 가고 실현 가능한 것들에 대하여
시각적 요소부터 브랜딩까지. 폭넓다면 폭넓은 주제를 다루고 있지만 이 책은 단순히 아름다운 디자인을 하는 법이나 브랜딩의 원론적인 이야기를 다루지 않는다. 10년 차 현직 디자이너이자 작가로서 활동한 저자의 모든 경험이 고스란히 녹아 있기 때문이다. 이 책으로 나아갈 방향을 점치는 게 아닌, 나아갈 방향을 스스로 생각하는 힘을 얻게 될 것이다.

-추천사-
디자이너를 둘러싼 환경이 급변하는 탓에 수많은 디자이너가 ‘지금 이렇게 디자인을 하는 게 맞는 걸까?’라는 자기 검증의 시간을 갖곤 했었다. 나 또한 이직을 하거나 새로운 프로젝트를 시작할 때 이 과정을 되풀이했던 것 같다. 이 책은 우디 님이 10년간 쌓은 노력과 경험을 잘 담아냈다. 디자인을 시작하는 이들에게는 좋은 입문서로, 실무에서 한창 디자인을 하고 있는 이들에게는 스스로의 디자인 방법론을 돌이켜 보는 좋은 지침서가 되리라 확신한다. 디자인을 하면서 길을 잃었을 때 이 책을 들춰 본다면 상황에 맞는 현명한 어드바이스를 찾을 수 있을 것이다.
- 김지홍, 디자인 스펙트럼 파운더 / 멋쟁이 사자처럼 Head of Design

사용자 경험이란 실체가 막연하고 복합적이다. UX 디자인을 한 가지 분야만으로 설명할 수 없는 이유다. 시중에 UX 실용서를 표방하는 책들은 툴 사용법에 그치거나 웹/UI 디자인 이론서를 넘어서지 못하는 경우가 많았다. 그러나 이 책은 ‘풀스택 UX 디자이너’가 되기 위한 리서치, 비즈니스, 심리학, 브랜딩, 비주얼까지 빠짐없이 담겨 있다. 방법론이나 트렌드를 수집하고 나열하는 것을 넘어 실무에 쓰이는 지식으로 구성돼 있다. 반면 제품과 목적에 맞는 ‘도구’를 선택하는 일은 독자들이 능동적으로 할 수 있도록 펼쳐놓았다. UX에 입문하려는 사람, 제한된 환경에서 일당백을 해야 하는 사람, 주먹구구식 실무 처리에 한계를 느끼는 사람 모두에게 추천한다.
- 케일라, 메타(페이스북) 프로덕트 디자이너

좋은 서비스를 만들고 싶은 사람을 위한 종합 선물 세트! 디자이너뿐 아니라 IT 업계에서 서비스를 만드는 데 관심 있는 모든 주니어에게 이 책을 추천한다. 서비스를 만들려면 알아야 할 필수 내용들과 최신 트렌드가 굉장히 잘 담겨 있다. 심리학 전공자의 시선으로 보면, 이 책은 적절한 심리학 이론을 기반으로 디자인 요소를 쉽게 잘 풀어내고 있다. 심리에 대한 높은 이해는 좋은 서비스를 더 잘 만들기 위해서 굉장히 유용할 것으로 기대한다.
- 김수민, 우아한 형제들 PM (전 네이버 제트 PM)

‘시각적 인터페이스 디자인’이라는 영역을 뛰어넘어 ‘디지털 프로덕트 디자인’의 근본적인 주제를 다루는 가이드북. 매일 아침 눈을 뜨면서 잠들기까지 사용하는 전자기기의 디지털 프로덕트는 어떤 요소로 구성되어 있으며, 왜 그렇게 설계되었는지를 이해하기 쉽게 설명해 준다. 디자이너뿐만 아니라 디지털 프로덕트 사업을 전략적으로 설계하는 방법을 고민하는 사람에게도 이 책을 추천한다.
- 최지윤, 구글 본사 UX 디자이너

디자이너를 위한 성장 지침서. 디자이너라면 반드시 알아야 할 용어와 개념으로 시작하지만 서비스와 비즈니스를 이해할 수 있는 안목을 더하고 디자인 원칙, 심리학, 전략을 연구하며 성장할 수 있도록 가이드를 제시한다. 또한 저자의 오랜 경험과 깊은 생각이 녹아든 생생한 사례들과 노하우들을 고스란히 담고 있다. 책 후반부에는 ‘인간을 위한 디자인이란 무엇인가’라는 근본적인 질문으로 돌아가 디자이너가 성장하는 데 필요한 것이 지식만이 아니라는 것을 시사하고 있다. 성장을 갈망한다면, 인간을 위한 디자인이 무엇인지 고민하고 있다면, 디자이너로서 무엇을 할 수 있을까를 생각해 본 적이 있다면 이 책을 추천한다.
- 정다영, 명지대학교 교수 / 디자인 스튜디오 듀오톤 공동대표

명확히 정리된 기본 지식 없이 눈앞의 실무를 중심으로 디자인을 ‘작업’하는 디자이너들에게 생각의 기본이 되는 토대와 생각하는 힘을 만들어 주는 훌륭한 디자인 지침서다.
- 안재원, 큐피스트(글램) CEO

UX/UI 가이드를 넘어 프로덕트 디자이너의 정체성마저 가이드하는 책. 10여 년간 제품을 만들며 부딪치고 구르면서 배운 것보다 더 많은 내용이 이 책 한 권에 정갈하게 담겨 있다.
- 김윤혁, 강남언니 Head of HR (전 CPO)

좋은 제품을 만들려면 디자이너는 복합적인 소양을 갖추어야 한다. 이 책은 그 소양을 갖추는 데 필요한 지식을 한 곳에 명쾌하게 정리했다. 이제 막 실무를 시작한 디자이너는 개념 이해부터 디자이너로서의 성장 방향을 엿볼 수 있고, 현직 디자이너에게는 접근 방식의 다양성에 대해 다시금 생각해 볼 수 있는 기회를 제공한다. 저자가 UX/UI 디자인을 얼마나 깊이 연구하고 고민해왔는지 알기에 더욱 신뢰할 수밖에 없는 책이다. UX/UI 디자이너의 역량을 제대로 갖추고 싶다면 이 책을 꼭 소장하길 바란다.
- 송아미, 식스샵 프로덕트 디자이너 / 《처음 만나는 피그마》 저자

사용자 경험을 설계하고 디자인하는 과정은 인간에 대한 이해를 바탕으로 다양한 분야가 어우러진 융합 영역인 만큼 심리학에 대한 이해가 중요하다. 이 책은 심리학은 물론이고 마케팅과 브랜딩, 데이터에 이르기까지 UX/UI가 적용되는 모든 범위를 다루고 있어서 정말 놀라웠다. 개인적으로 이런 책이 나오길 오랫동안 기다려서 더욱 반가운 마음이 든다.
- 서연주, from designer 커뮤니티 리더 / 인하우스 UI 디자이너

사람의 마음을 움직이는 데 디자인은 그 어떠한 것보다 큰 영향을 미친다. 사람들의 시간과 관심을 얻기 위해 노력하는 서비스라면 더더욱. 세상은 점점 더 빠르게 변하고 있다. 변하는 환경에서 더 좋은 디자인을 만들기 위해서는 어떤 문제를 만나더라도 해결할 수 있는 나만의 생각법을 익혀야 할 것이다. 이 책은 빠르게 성장한 IT 기반 서비스를 만들어온 저자의 생각법을 압축한 책이다. 지금 사람의 마음을 움직이는 서비스를 만들고자 한다면 꼭 읽어 보길 바란다.
- 박종민, 마이리얼트립 리드 디자이너

입사 전 꿈꿨던 디자인과 실무는 전혀 달랐다. 무엇보다 이해 관계자와 원만하게 프로젝트를 진행하는 것은 결코 쉽지 않다. 이 책에 담긴 디자이너에게 꼭 필요한 만큼의 실무 지식은 이해 관계자를 설득하는 데 실제로 도움이 될 것이다. 이 책에 담긴 내용은 실무 사례들은 저자의 경험과 지식의 깊이가 얼마나 남다른지를 보여 주고 있다. 이 책을 다 읽고 나면 자신 있게 말할 수 있을 것이다. “나는 디자이너다”라고.
-박나래, Rakuten Group, Inc. 2년 차 디자이너

생각을 가시화하고 사용자 경험을 섬세하게 살펴 문제를 해결하는 일, 경험을 통해 또 다른 가능성을 탐색하는 일. 이것이 우리의 일이다. 어렵지만 매력적이다. 마음가짐부터 디테일한 실무까지 아우르는 내용들을 읽다 보니 사용자를 넘어 '인간을 위한 디자인의 본질'을 다시 상기하게 된다. 분명한 목적과 목표를 가지고 균형감각을 만들고자 하는 디자이너들에게 지침서가 되기를 기대한다.
- 최소현, 퍼셉션 대표

PM/PO로 프로덕트 팀에서 일할 때 메이커들의 전문성이 발현될 여지를 주는 것이 중요하다고 강조하곤 했었다. UI 설계에 대한 PM의 역할이 무엇인지 궁금하다면 백 마디 말보다도 이 책 한 권을 추천한다. 프로덕트를 만드는 과정에서 '프로덕트 디자이너의 전문성'이 무엇인지 깨닫게 해준다. 즉흥적이고 습관적인 UI를 디자인하는 디자이너에게는 장기적으로 성장할 방향성을 제시해 줄 것이다.
- 이미준(도그냥), 지그재그 PO / 《현업 기획자 도그냥이 알려주는 서비스 기획 스쿨》 저자

“UX/UI 디자이너의 역할이 뭘까요?” 디자인 커뮤니티에 자주 등장하는 질문이다. 디자이너도 알기 어려운 디자이너의 역할을 저자는 '문제 해결 능력'으로 설명한다. 사용자가 가진 핵심 문제를 해결하기 위해서는 수많은 방법을 고려해야 한다. 다행히도 저자는 우리가 당장 시도할 수 있는 방법을 7개 챕터로 친절히 안내하고 있다. 사용자의 마음에 닿기 위한 방대한 여정 속에서 좀 더 빠른 길을 찾을 수 있는 안내서로 이 책이 유용하게 사용되기를 바란다.
- 박성일, 쿠팡 프로덕트 디자이너

Chapter1 UX / UI 제대로 이해하기
1.1 UX 디자인? UI 디자인?
__1.1.1 UI - 사용자 인터페이스
__1.1.2 UX - 사용자 경험
__1.1.3 프로덕트 디자이너 - 제품 중심 조직의 디자이너
__1.1.4 UX/UI 디자인의 진행 과정
__1.1.5 Designer's Note 알아 두면 쓸모 있는 UX 용어
1.2 UI의 구조와 요소
__1.2.1 UI의 구조
__1.2.2 UI의 요소
1.3 모바일 디자인 트렌드의 변화
__1.3.1 마이크로소프트의 메트로 디자인
__1.3.2 애플 디자인의 변천사
__1.3.3 애플의 한 디자이너와 관성 스크롤
__1.3.4 뉴모피즘은 새로운 UI 트렌드가 될 수 있을까?

Chapter2 웹/앱 디자인 시 반드시 알아야 할 것들
2.1 해상도 이해하기
__2.1.1 목적에 맞는 해상도 설정
2.2 픽셀 밀도와 선명도의 상관관계
__2.2.1 화면 크기에 따른 픽셀 밀도 차이
__2.2.2 픽셀의 다양한 표현 방식
__2.2.3 1단계. 논리적 해상도
__2.2.4 2단계. 물리적 해상도
__2.2.5 3단계. 다운 샘플링
__2.2.6 4단계. 기기 표현
__2.2.7 iOS의 PT와 안드로이드의 DP/SP
2.3 모바일 서비스를 위한 앱 개발 과정 이해하기
__2.3.1 네이티브 앱
__2.3.2 모바일 웹앱
__2.3.3 하이브리드 앱
2.4 와이어프레임과 프로토타입의 이해
__2.4.1 와이어프레임
__2.4.2 프로토타입
__2.4.3 프로토타입 제작 툴
__2.4.4 Designer's Note 효과적인 유저 스토리 작성법
Chapter3 살아남는 것은 잘 설계된 것이다
3.1 생존을 위한 전략, MVP
__3.1.1 최소 기능 제품과 MVP 피드백 루프
__3.1.2 MVP로 시장 검증에 성공한 드롭박스와 에어비앤비
3.2 우리의 진짜 경쟁자는 누굴까?
__3.2.1 경쟁사 분석을 하는 이유
__3.2.2 경쟁사 목록 표 만들기
__3.2.3 기능 비교 표 만들기
3.3 디자이너가 데이터에 관심 가지면 보이는 것들
__3.3.1 디자이너의 든든한 근거, 데이터
__3.3.2 사용자의 선호도를 파악하는 A/B 테스트
__3.3.3 사용자의 경로를 추적하는 과정, 퍼널
__3.3.4 비즈니스 성장을 위한 핵심 지표, AARRR
__3.3.5 Designer's Note 한 끗 차이가 만든 다른 결과, 정육각 고기 두께 비교 UI
3.4 진짜 문제를 찾아서, 심층 인터뷰와 어피니티 다이어그램
__3.4.1 심층 인터뷰
__3.4.2 어피니티 다이어그램
__3.4.3 Designer's Note 브레인 스토밍에 유용한 질문법, HMW
3.5 사용자 유형을 대변하는 가상의 인물, UX 페르소나
3.6 문제의 근본 원인을 찾아, 5 Whys와 골든 서클
__3.6.1 사례로 보는 5 Whys
__3.6.2 5 Whys와 짝을 이루는 골든 서클
3.7 더 나은 UX 라이팅을 위한 몇 가지 팁
__3.7.1 UX 라이팅 vs 카피라이팅
__3.7.2 좋은 UX 라이팅을 만드는 4가지 법칙
__3.7.3 실전, UX 라이팅 적용하기

Chapter4 더 나은 비주얼 디자인을 위하여
4.1 타이포그래피의 기본, 웹폰트
__4.1.1 웹폰트의 이해
__4.1.2 웹폰트가 호출되는 과정
4.2 좋은 디지털 타이포그래피의 7가지 공식
__4.2.1 공식 1. 최소한의 폰트 종류
__4.2.2 공식 2. 가독성을 높이는 행간
__4.2.3 공식 3. 폰트 크기에 따른 자간
__4.2.4 공식 4. 한 줄에 적당한 글자 수
__4.2.5 공식 5. 배경색과 충분히 구별되는 글자색
__4.2.6 공식 6. 계층 구조를 활용한 타이포그래피
__4.2.7 공식 7. 성격에 맞는 폰트 선택
__4.2.8 Designer's Note 폰트 & 이미지로 브랜드 톤 구축하기
4.3 시각적 위계를 만드는 5가지 강조 방법
__4.3.1 1. 크기를 이용한 강조
__4.3.2 2. 색을 이용한 강조
__4.3.3 3. 질감을 이용한 강조
__4.3.4 4. 공간감을 이용한 강조
__4.3.5 5. 형태를 이용한 강조
__4.3.6 시각적 위계를 활용한 버튼 디자인
4.4 컬러와 UI 디자인
__4.4.1 브랜드 컬러와 정서
__4.4.2 이미지를 키워드화해 컬러를 도출하는 ‘색상 이미지 공간’
__4.4.3 톤온톤을 이용한 컬러 배색
__4.4.4 컬러 강조와 어포던스
__4.4.5 시스템 컬러
4.5 디지털 그리드 시스템의 이해
__4.5.1 그리드 시스템 이해하기
__4.5.2 반응형 디자인과 브레이크 포인트
4.6 피보나치 수열과 시각적 질서
__4.6.1 피보나치로 타이포그래피 적용해 보기
__4.6.2 피보나치로 간격 기준 만들기
4.7 인터페이스 속 다양한 아이콘
__4.7.1 앱 아이콘과 시스템 아이콘
__4.7.2 아이콘과 시각 보정
__4.7.3 Designer's Note 용도에 맞게 활용하는 시스템 아이콘

Chapter5 목표 달성의 심리학
5.1 파충류 설득하기
__5.1.1 자동 시스템 vs 숙고 시스템
__5.1.2 인지적 구두쇠
__5.1.3 Designer's Note 자동 시스템을 이끌어내는 디자인
5.2 휴리스틱을 활용한 웹/앱 평가
__5.2.1 대표성 휴리스틱
__5.2.2 가용성 휴리스틱
__5.2.3 제이콥 닐슨의 10가지 휴리스틱 평가
5.3 뇌는 예측불허를 사랑해
__5.3.1 도파민과 동기부여
__5.3.2 틴더의 스와이프
5.4 구매 유도를 위한 심리학
__5.4.1 긍정적 메시지가 주는 효과 - 손실 회피 편향
__5.4.2 이득을 추구하는 비교 심리 - 닻 내리기 효과
__5.4.3 이미 정해진 결론 - 미끼 효과
__5.4.4 끝까지 이끄는 힘 - 부여된 진행 효과
__5.4.5 Designer's Note 타깃 사용자의 특성에 맞는 결제 시스템
__5.4.6 디자이너가 알아 두면 좋은 8가지 심리 법칙
5.5 훅 모델로 사용자 습관 형성하기
__5.5.1 습관을 만드는 훅 모델
__5.5.2 훅 모델과 디자이너의 윤리
__5.5.3 Designer's Note 삶을 조금 더 나은 방향으로 이끄는 앱

Chapter6 가장 현실적인 브랜딩
6.1 브랜드다움 찾기 : 핵심 가치
__6.1.1 매일 노력할 수 있는 것, 핵심 가치
__6.1.2 ‘와비 파커’의 핵심 가치
6.2 브랜드가 꾸는 꿈 : 비전과 미션
__6.2.1 이루어지지 않을 꿈, 비전
__6.2.2 끝내 이루어지지 않을 꿈을 실현해가는, 미션
__6.2.3 에어비앤비의 비전과 미션
6.3 시선의 일치 : 구체적 타깃 설정과 브랜드 의인화
__6.3.1 타깃과 라이프스타일
__6.3.2 Designer's Note 착한 브랜딩에 관하여
6.4 표면 만들기 : 브랜드 아이덴티티
__6.4.1 브랜드의 얼굴, 로고
__6.4.2 브랜드의 정서, 컬러
__6.4.3 브랜드의 정체성, 사진
__6.4.4 메시지의 질감, 폰트
__6.4.5 가치를 전달하는 도구, 태그라인과 슬로건
__6.4.6 그 외 시각 요소
6.5 브랜드 알리기 : 트리플 미디어 전략과 채널 믹스
__6.5.1 Designer's Note ‘벽’을 고객과 만나는 ‘통로’로
6.6 ‘정육각’으로 알아보는 브랜딩의 실제
__6.6.1 브랜드의 가치 찾기
__6.6.2 리브랜딩의 시작, 로고에서 肉 을 떼기까지
__6.6.3 브랜드 미션과 조형 언어
__6.6.4 핵심 가치와 미션이 반영된 로고 디자인
__6.6.5 이후 브랜딩 과정
__6.6.6 Designer's Note 알아 두면 쓸모 있는 마케팅 용어

Chapter7 디자인과 윤리
7.1 지금, 디자인에 윤리가 필요한 이유
__7.1.1 짤막한 디자인 윤리의 역사
__7.1.2 인스타그램의 허상 지표
__7.1.3 인터페이스가 중립적일 것이라는 착각
__7.1.4 SNS의 ‘에코 챔버’에서 벗어나는 법
7.2 다크 넛지와 UX 패턴
__7.2.1 우선, 넛지
__7.2.2 다크 넛지란?
__7.2.3 Designer's Note 디자인의 목표를 새롭게 설정할 수 있을까?
7.3 중독적인 인터페이스
__7.3.1 간헐적 보상 심리
__7.3.2 정지 신호의 부재
__7.3.3 FOMO
__7.3.4 사회적 승인
__7.3.5 Designer's Note 디자인 윤리를 고려한 팀 활동, 저지먼트 콜

Chapter8 부록
8.1 디자이너의 말 그릇