2장 콘텐츠 구성하기: 정보 설계와 애플리케이션 구조 - 사용자를 끌어들이는 UX/UI의 비밀

2022 우아한스터디 - UX 패턴파인더 스터디

 

방해되지 않는 정보 구조 설계하기

인터랙티브 경험에서는 인터페이스가 사용에 방해되지 않는 게 가장 중요하다.

정보 구조를 설계하는 일에는 보여주기, 검색하기, 탐색하기, 라벨링하기, 카테고리화하기, 정렬하기, 조작하기, 전략적으로 정보 숨기기 등이 포함된다.

정보 구조 아이러니 한 점은 잘못 설계되었을 때만 고객들이 알아차린다는 것이다. 반대로 정보 구조를 제대로 설계하면, 디자인은 눈에 보이지 않는다.

 

사용자에게 어떤 정보와 도구를 보여줘야 하는가? 어느 시점에 보여주는게 좋은가?

컨텐츠의 카테고리가 '빠짐 없이 중복되지 않도록' 한다. 

'사용빈도'를 가장 중요한 원칙으로 하여 자주 사용하는 항목은 검색하지 않아도 곧바로 보이게 한다. 사용 빈도가 낮으면 숨기거나 사용자가 찾을 때만 접근할 수 있게 한다.

 

정보와 기능을 어떻게 분류하고 정렬해야 할까?

앱의 정보를 구조화하고 분류하기 위해 '위치, 가나다순, 시간(역시간), 카테고리, 위계, 숫자' 등의 구분을 활용할 수 있다.

 

사용자는 제공받은 정보와 기능으로 무슨 일을 하는가?

화면의 기능은 '개요보기', '집중하기', '만들기', '수행하기' 4가지로 나눌 수 있다. (대부분 이 기능들을 복합적으로 수행한다.)

 

태스크를 보여주는 방식은 다양한가?

여러 방식이 필요할지도 모른다.

사용자의 기술 수준, 숙련도가 다르다는 점을 고려한다. 숙련자를 위해 단축키와 맞춤형 인터페이스 같은 액셀러레이터를 제공해서 작업 효율성을 높여줄 수도 있다.

 

어떻게 하면 사용하기 쉽게 만들까?

정보와 정보의 표현(비주얼 디자인)과 분리해서 생각하면 실제 디자인할 때 부담을 덜 수 있다.

 

 

 

 

 

화면별 구성 원칙

개요화면

개요화면은 정보를 리스트나 그리드에서 아이템과 옵션을 보여주는 화면이다. 개요화면에서는 어떻게 정보를 구조화할지 고민해야 한다.

• 데이터 분량은 어느 정도이며, 목록은 얼마나 긴가?
• 데이터를 보여줄 공간은 충분한가?
• 정보에 위계가 있는가? 있다면 어떤 종류인가?
• 정보가 어떻게 정렬되었는가? 사용자가 정렬 방식을 바꿀 수 있는가?
• 사용자는 어떻게 정보를 검색하고, 필터링하고, 정렬하는가?
• 각 항목과 관련된 정보나 작업이 있는가? 있다면 언제 어떻게 보여주는게 좋을까?

 

집중화면

집중화면에서는 하나의 컨텐츠를 보여주고 재생하는 화면이다. 

• 사용자가 앱의 주요기능으로 즉시 이동할 수 있다. (모바일 다이렉트 액세스) 사용자가 직접입력하지 않아도, 시간/위치 등 데이터를 기반으로 가치있는 정보를 보여준다.
• 다양한 보기모드를 지원해서 컨텐츠를 여러 방식으로 보여준다.
• 작업공간을 나누어 여러 문서를 동시에 볼 수 있다.

 

창작화면

디지털 개체를 만들고 업데이트하는데 쓰이는 화면이다.

• 캔버스와 팔레트를 활용한다. 전통적인 패턴이라 사용자의 기대에 강하게 부합한다.
• 작업공간을 나누어 문서 여러 개를 개별 창으로 띄워놓고 동시에 여러 문서에서 작업할 수 있게 한다.

 

수행화면

로그인, 회원가입, 게시물작성, 프린트, 업로드, 구매 등과 같이 특정 작업 하나를 완료하는 것을 목적으로 하는 화면이다.

• 태스크가 복잡할 경우 큰 태스크를 작은 단계나 단계의 묶음으로 나눈다.
• '설정'에서 사용자가 원할 때, 다양한 옵션 중 원하는 옵션으로 설정을 변경할 수 있게 한다.

 

내용출처: 사용자를 끌어들이는 UX/UI의 비밀(제니퍼 티드웰, 찰스 브루어, 아인 발렌시아 저)