본문 바로가기
제리의 다독임

[제리의 다독임] <01> UX/UI 디자인 완벽 가이드 : IA와 유저 플로우 편

by 제리 (Jerry) 2024. 2. 2.

 

비전공자에 서비스 기획 부트캠프 하나도 안 해본 기획자 제리의 첫 번째 독서.

 

[서평]

일단 서비스 기획을 하는 사람으로써 첫 책을 너무 어려운 걸 잡은 느낌이었다.

말이 어렵게 써져 있는 것은 아니었는데, 나는 아주 UX/UI의 기초적인 내용인 줄 알고 사버렸다.

 

거기에 더해 IA와 유저플로우를 어떻게 짜는지 상세하게 알려주는 책인 줄 알았는데 그런 내용의 책은 아니었다.

(제목만 보고 목차는 안 봤음)

 

하쥐만... 책 표지와 같이, 각각의 주제에 대해 상세한 설명을 해주는 책이다!

 

17개의 주제를 바탕으로, 다른 서비스의 예시를 보여주며 어떤 UI/UX가 잘못된 것이며,

올바른 방향이 무엇인지에 대해 상세히 설명해 준다.

 

각 주제를 엄청 깊게 설명하기보다는, 각 주제를 연관 지어 설명하기 때문에

필요한 주제만 살펴보다가는 흐름이 끊기는 느낌을 받을 수도 있다.

 

특히 나는 PC기반의 기획을 주로 하는데, 내용의 95% 이상이 모바일에 집중되어 있다.

모바일의 경우 스스로 경험이 많기 때문에 책을 읽으면서 "아 이래서 이건 이렇게 구현되어 있었구나" 하고 공감을 할 수 있는 부분들이 많이 존재했다.

 

그래서 다음에는 PC와 관련된 책을 읽어보려고 한다.

 

사용자 입장에서 어떻게 경험을 향상하고, 그 경험을 향상하기 위해서는 어떤 생각을 해야 하는지 조곤조곤 알려주는 고마운 책이다.

아쉬웠던 점은 풀 컬러로 되어있어서 예시 사진들이 잘 보이는 줄 알았으나, 군데군데 뭉개져서 안 보이는 예시들도 한, 두 개 존재했다.

 

나중에 내가 조금 더 성장하면 혹은 필요할 때마다 찾아볼 책 같아서 사길 잘했다는 생각이 든다.

 

[제리 피셜 추천 독자]

1. 모바일 UI/UX에 대해 공부하고 싶은 기획자

2. UI/UX 대학원을 준비하는 비전공자

3. 17 가지 주제 중 절반 이상 어떻게 구현할지 생각해 봤을 때, 곧바로 감이 오지 않는 기획자

 

[인상 깊은 구절 및 메모]

1. 디지털 서비스에서의 정보 탐색
1.1 디지털 서비스는 아무도 도와주지 않는다.

1.2 IA는 탐색에 대한 UX다

1.3 IA는 사용자들이 디지털 서비스에서 원하는 정보를 잘 찾을 수 있게끔 만드는 도구다

1.4 사용자가 정보를 찾을 때의 기본적인 동기
1.4.1 뭘 알아야 하는지 조차 모름 : 전체 정보 탐색
1.4.2 탐색적인 : 특정 정보 범위만 탐색
1.4.3 뭘 찾을지 알고 있음 : 특정 정보 하나만 탐색
1.4.4 다시 찾음 : 어떤 정보를 반복 탐색
1.4.5 유기적인 정보 간 이동
1.4.6 사용자 주도권 부여를 통한 탐색 모드 식별
1.4.7 개인화/추천

1.5 어느 하나의 방식만 고집해서도 안되고, 유행이나 트렌드에 휩쓸려서도 안된다.


2. IA 콘셉트, 탐색 경로(funnel) 결정
2.1 디지털 서비스의 3가지 방향성(서비스 주도, 개인화, 사용자 주도)
2.2 탐색에서 콘셉트랑 '해당 서비스만의 일관된 경험'을 이어나가게 하는 것이다.

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 개인화/추천으로부터 시작하는 탐색 경로
2.5 탐색 경로를 어떤 콘셉트로 잡느냐는 서비스의 세부적인 UX에 기울이는 노력을 무색하게 할 정도로 큰 영향을 미칠 수 있다.

3. 유기적인 정보 간 이동
3.1 정보의 여러 가지 특성(분류, 위계, 메타데이터, 태그)
3.2 전후 문맥, 논리적 위계, 개념적 상하관계, 예정된 순서에 따른 정보 간 이동은 특별히 고려할 만한 게 없다.
3.3 뼈대가 없으면 집을 짓는 게 불가능하듯, IA가 이용흐름보다 비중이 있게 다뤄지는 것은 사실이다
3.4 순서도 형태의 작업 흐름이 UI가 결합되면 화면 흐름으로 변화하는 것이다.

4. 연결 매개체
4.1 사람들은 눈앞에 보이는 현상을 지각하는 과정에서 이전에 겪었던 경험, 기억, 사회적 상식을 대조하기 때문에 이를 잘 이용하면 사용자에게 정보 이상의 정보를 제공하거나 연상 작용을 불러일으키면서 교묘하게 정보를 전달할 수 있다.
4.2 매개체가 연결이라는 본연의 기능을 제대로 수행하기 위해서는 정보 간 유사성을 잘 반영해야 한다.
4.3 정보와 정보를 연결하는 역할을 할 때 태그는 화면 제일 하단에 보통 배치된다.

 


5. 탐색 시 서비스 주도권 발휘
5.1 다시 한번 말하지만, 디지털 서비스는 스스로 이용해야 한다.
5.2 산을 잘 아는 관리자가 등산로를 정비해 주듯이 서비스를 더 잘 아는 우리가 그 역할을 해야 한다.
5.3 서비스 주도권이 잘못 사용됐을 경우, 오히려 사용자의 혼란이 가중되고 불필요한 실수가 누적되며 없는 게 차라리 낫다는 소리를 듣기 십상이다.

 


6. 사용자주도권 허용
6.1 자율성(사용자 주도권)이 주는 가치
6.1.1 서비스가 사용자에게 자율권을 부여한다.
6.1.2 본인 취향에 맞게 서비스를 설정한다.
6.1.3 서비스는 점점 더 사용자의 취향/관심사에 맞게 맞춤화된다.
6.1.4 사용자는 서비스에 좀 더 몰입하고 참여한다.
6.2 맞춤화 : 허용된 권한 내에서 서비스의 여러 항목을 사용자가 설정하는 것
6.3 개인화 : 서비스가 개별 사용자에 데이터에 기반하여 그들을 위한 이용환경과 정보를 제시
6.4 가벼운 형태의 설정들은 지시, 조작, 결과가 한눈에 파악될 수 있어야 한다.(bottom sheet 많이 사용)

7. 개인화
7.1 디지털 서비스는 여러 경로로 사용자의 데이터를 파악할 수 있다...... 그러나 이러한 데이터 만으로는 제대로 된 개인화를 전개하기에 무리가 있기 때문에 별도의 명시적인 경로를 통해서 사용자의 취향, 관심사, 서비스와 관련된 구체적인 데이터를 파악하는 것이 필요하다.
7.2 개인화는 기본적으로 데이터를 필요로 한다.
7.3 AI 없이도 개인화를 하는 방법은, 최근 이력을 재방문 시에 보여주는 것이다.

8. 추천
8.1 참신한, 뜻밖의, 폭넓은 추천 서비스가 늘어나고 있다
8.2 사용자의 활동 이력에 기반하여 그와 연관된 아이템을 매칭하고 좀 더 특화된 서비스를 제공하는 것은 초개인화의 가장 기본적인 출발점이다.

9. 맥락의 유지
9.1 심성모델 : 사용자가 대상을 마음속에서 어떻게 묘사하는가
9.2 검색-재검색-필터링이 반복되는 경우에는 무조건 맥락이 유지돼야 한다.
9.3 우리가 만들어내는 UX는 고객의 실제 경험이 반영돼야 한다.

10. 내비게이션
10.1 메뉴의 논리적 구조보다는 현재의 이용흐름에서 사용자의 맥락을 대변하는 것이 중요해졌다.


11. 위치와 선택
11.1 내비게이션은 이동의 수단이 되는 것은 물론, 현재 위치를 알려주는 역할도 수행해야 한다.
11.2 자이가르닉 효과 : 사람들은 완료된 일보다, 완료되지 않거나 중단된 작업을 더 잘 기억한다.
11.3 한정된 공간을 최대한 효과적으로 사용하기 위해서는 서비스주도권만으로 힘들고, 그러다 보니 자연스럽게 사용자 주도권, 그중에서도 개인화에 초점이 실릴 수밖에 없는 것이다.


12. 부드러운 강요
12.1 사용자가 서비스를 원활하게 이용하게 하기 위해 서비스는 간혹 '부드러운 강요'를 할 필요가 발생한다.

13.  UX Writing
13.1 UX writer가 하는 일
13.1.1 작문
13.1.2 언어적 통일감 정의
13.1.3 사용자 조사 및 페르소나 수립
13.1.4 서실 및 구조
13.1.5 이용 안내 및 입력 예시

14. 검색 차별화
14.1 서비스의 특징을 검색 시점에 반영하면 사용자들은 검색 화면에 대한 의존도가 높아지고 검색 화면에서 자연스럽게 정보 탐색을 시작하게 된다.
14.2 중의적인 성격을 띨 경우에는 사용자의 개인적인 성향을 파악해서 그 의도를 미뤄 짐작하는 것이다.

15. 조건 검색
15.1 조건 검색의 3가지 유형
15.1.1 느긋하게 시작
15.1.2 처음부터 집중
15.1.3 상품 유형별 진행
15.2 같은 시점에서 상호 이동할 가능성이 크지 않은 서비스에서는 일관성보다는 각 상품 유형별로 차별화된 UX가 더 중요하다.

16. 필터
16.1 평균적으로 인간은 7+-2 정도의 개체만 작동 기억에 담을 수 있다.
16.2 검색 vs 필터 vs 태그
- 검색은 찾아 나가는 과정
- 필터는 결과를 좁히는 과정
- 태그는 다른 주제로 넘어가는 과정
16.3 복잡성 통제의 딜레마는 자주 사용되는 기본 필터는 노출하고, 그 밖의 상세 필터는 숨김 처리하는 식으로 해결한다.

17. 태그
17.1 해시 태그의 이용 방법
17.1.1 기억하기 쉬워야 한다.
17.1.2 브랜드 이름뿐만 아니라 다른 것도 사용한다
17.1.3 이해가 쉬워야 한다
17.1.4 짧고 간결해야 한다
17.1.5 어떤 것이 쓰이고 있는지 조사한다.
17.1.6 콘텐츠 내용과 관련돼야 한다.
17.1.7 어디든 사용한다.
17.1.8 일관성을 지킨다
17.2 태그는 쉽고 부담 없이 특정 주제 영역으로 사용자의 취향과 관심사를 대변해 준다.
17.3 태그와 필터가 결합된 방식을 Hybrid Dual List라고 부른다.
17.4 탐색 경로에 미리 태그들을 배치하여 사용자의 탐색 경험을 보조하는 것을 큐레이션 태그라고 한다.