TIL-6

1. 레퍼런스 분석

1. 레퍼런스 분석이란?

• 여러 가지 사례를 상세하게 분류해 생각해 보고 도움이 될 만한 부분을 찾아보는 과정.

2. 래퍼런스 분석은 왜 하나요?

• 레퍼런스 분석을 통해 스스로 생각하는 힘을 기를 수 있음.

3. 레퍼런스 분석하는 방법

• 화면 구조 분석
• 디자인 원칙 기반 분석
• 인사이트 정리하기

2. UX/UI 디자인 패턴

1. U/UI 디자인 패턴이란?

• 디지털 제품, 주로 앱이나 웹에서 자주 사용되는 디자인 요소.

  자주 사용되는 UX/UI 패턴들

  1. 온보딩
  2. 로딩
  3. 검색
  4. 회원가입
  5. 리스트
  6. 카드
  7. 캐러셀

2. 온보딩

• 온보딩은 사용자가 제품을 처음 만나는 과정의 경험.

  온보딩의 종류

  1. 튜토리얼
  2. 가치 보여주기
  3. 개인화 설정하기

3. 로딩

• 로딩은 앱이나 웹에서 화면이 그려지는 동안 사용자가 잠깐 기다려야 할 때 보여주는 화면.

  로딩의 종류

  1) 스피너 아이콘 혹은 애니메이션 활용
  2) 프로그레스 바
  3) 스켈레톤

4. 검색

• 사용자가 원하는 정보를 빠르게 찾을 수 있도록 키워드로 정보를 찾는 방법

  검색화면의 종류

  1. 기본 검색 화면
  2. 연관 상품 추천 / 연관 검색어 노출
  3. Empty view : 검색결과가 없을 때

3. [레퍼런스 분석 1] 핀테크/금융

1. 핀테크/금융 제품의 특징

• 돈과 관련된 산업이다 보니 국가, 금융 기관의 법과 정책의 영향을 많이 받음.
• UI에 대한 구체적인 가이드라인이 있다거나 화면에 대해서 관련 기관의 심의를 받아야 하는 경우도 있음.
• 핀테크/금융은 여러 앱을 동시에 비교해 보는 걸 추천
  • 도메인의 특성상 제약 사항이 있는 경우가 많음. 제한 조건을 각각의 앱에서 어떻게 풀어냈는지 비교해 보는 것이 도움이 됨. 같은 기능의 화면을 찾고 비슷하면서도 다른 점을 비교해 보고, 사용성을 높이기 위해 노력한 흔적을 찾아보자.

2. 레퍼런스 분석 사례 : 토스

4. [레퍼런스 분석 2] 콘텐츠

1. 콘텐츠 제품의 특징

• 콘텐츠의 종류에 따라 영상, 오디오, 텍스트, 웹툰 등 다양하게 나눠지고 각 종류의 특성에 따라 제품의 차이가 큼.
• 예를 들어, 영상 콘텐츠는 디바이스 스크린을 계속해서 쳐다보고 있어야 하지만, 오디오 콘텐츠는 그렇지 않음. 그보다는 개인화된 재생 목록을 잘 구성하는 것이 중요. 그리고 텍스트 콘텐츠는 폰트의 가독성이 사용성에 매우 큰 영향을 끼침.
• 콘텐츠 제품을 분석할 때는 체류시간을 늘리는 UX/UI를 찾는 데 집중해 보자.

2. 레퍼런스 분석 사례 : 티빙

5. [레퍼런스 분석 3] 커머스

1. 커머스 제품의 특징

• 주로 전자상거래인 이커머스를 말하며, 온라인에서 판매 및 거래가 이뤄지는 플랫폼을 뜻함.
• 제품의 지표, UX/UI가 상품으로 인한 영향을 크게 받음.
• 커머스는 상품 탐색 → 구매로 이어지는 사용자 여정에 집중해 보자.

2. 레퍼런스 분석 사례 : 무신사