brunch

You can make anything
by writing

C.S.Lewis

by 이난초 Jan 07. 2024

UX/UI 분석 체크리스트를 만들자

UX/UI 분석하기 02

분석 스터디에 참여하여 서비스의 UX/UI를 본격적으로 분석하려고 하니, 이전처럼 체계 없이 냅다 앱을 써보고 무작정 부딪히면 안되겠다는 생각이 들었다. 이런 식으로 했다가는 열심히 서비스를 봐도 머리에 남지 않을 것 같기에 도대체 어느 부분을 먼저 봐야 할지 기준을 잡아야할 필요성을 느꼈다.

아마 이 체크리스트는 분석을 해나가면서 계속해서 수정될 예정이니 버전 1이라고 부르겠다.



UX/UI 분석 체크리스트 (Ver.1)


(1) 서비스의 이해

□ 서비스의 가치가 무엇인가? (유저가 이 서비스를 쓰는 이유)

□ 서비스의 BM은 무엇인가? (주요 수익모델, 매출이 나오는 곳 찾기)

□ 서비스의 타겟은 누구인가?

□ 유저에게 강조하고자 하는 것은 무엇인가?

□ UX/UI 솔루션이 BM과 유저 사용성 모두를 만족하고 있는가?


(2) UX/UI 사용성 확인하기

사용성 정의 적용 (출처:사용자를 생각하게 하지마!)

    □ 유용성 : 회사 혹은 유저의 어떤 문제를 해결하기 위해 만들었는가? 유저가 원하는 기능, 정보인가?

    □ 학습 용이성 : 신규 유저도 쉽게 쓸 수 있는 서비스인가, 쉽게 쓸 수 있을 만큼 온보딩이 명확한가?

    □ 기억 용이성 : 사용법이 기억하기 쉽고 직관적인가?

    □ 유효성 : 중요한 정보를 쉬운 단어로 전달하여 유저가 간단하게 니즈를 해결할 수 있는가?

    □ 효율성 : 유저가 원하는 정보를 빠르게 찾고 입력할 수 있는가? (end-point 도달까지의 depth 수 등)

    □ 재미 : 서비스를 사용하면서 재미와 즐거움을 느낄 수 있는 요소가 있는가? (맞춤 정보, 컨텐츠 등)

    □ 호감도 : 사람들이 이 서비스를 갖고 싶어 하는가?

    □ 일관성 : 비슷한 요소가 비슷한 방식으로 보이고 작동하는가?

    □ 명료성 : 정보의 위계(시각적 계층구조), 레이아웃, 시각적 단서(어포던스) 등이 명료한가?


UX 법칙 적용

    □ 피츠의 법칙(Fitts’ Law), 엄지존(Thumb Zone) : 적절한 간격, 거리, 크기, 영역

    □ 힉의 법칙 (Hick's law) : 선택지의 수와 복잡성 정도

    □ 밀러의 법칙 (Miller’s law, Magic number 7) : 정보 제공량, 구조화 정도 (정보는 5개 이하로!)

    □ 테슬러의 법칙 (Tesler's Law) : 추상적, 과한 심플함

    □ 제이콥의 법칙 (Jakob’s law) : 멘탈 모델


(3) 예외상황

□ 에러메시지가 충분히 친절한가? (해결방법이 포함되어 있으면 더욱 좋다)

□ 유저의 실수를 유발할 가능성이 있는가? 있다면 이를 예방하는 장치가 있는가?

□ 로딩시간이 길어질 때, 유저가 지루하지 않게 기다릴 수 있는 페이지가 있는가?

□ 화면에 예상치 못한 불필요한 버튼이 있지는 않은가?




전자정부 웹사이트 UI/UX 가이드라인

전자정부 웹사이트 UI·UX 가이드라인 배포 및 활용 안내


위 체크리스트에서 좀 더 구체화하여 핵심 질문에 답해볼 수 있는 가이드라인이다.

더욱 상세한 분석이 필요하면 아래 리스트를 추가로 참고하려고 한다.


(1) 사용자에게 필요한 정보와 기능을 제공한다.

□ 사용자가 원하는 정보와 기능을 제공하고 있는가?

□ 사용자가 목적을 달성할 수 있도록 충분한 양의 정보와 기능을 제공하고 있는가?

□ 중요한 정보와 기능을 효과적이며 이해하기 쉽게 표현하고 있는가?


(2) 작업에 소요되는 시간과 단계를 최소화한다. 

□ 웹사이트는 사용자가 요청한 작업에 대해 적절한 속도로 반응하는가?

□ 사용자가 원하는 정보 및 기능에 빠르게 접근할 수 있는가?

□ 하나의 과업을 완료하기 위해, 동일한 작업을 여러 번 반복하지 않는가?

□ 작업 수행에 불필요한 단계가 포함되어 있지 않은가?


(3) 직관적이고 일관성 있게 만든다.

□ 모든 정보와 기능은 논리적 흐름에 적합하도록 구성되어 있는가?

□ 사용자가 이해하기 쉬운 단어와 문장을 사용하고 있는가?

□ 용어, 스타일, 레이아웃, 기능의 작동 방식 등은 전체 페이지에서 일관성 있게 적용되고 있는가?

□ 정보의 표현과 기능의 작동 방식은 일반적인 사용자의 기대에 부합하는가?

□ 사용자의 행동에 도움이 되는 단서 및 정보를 적절한 시기와 위치에 제공하고 있는가?


(4) 사용자가 원하는 방식으로 이용할 수 있게 만든다

□ 사용자의 행동과 웹사이트의 반응 사이에 불필요한 요소가 있는가?

□ 사용자는 원하는 입·출력 도구를 자유롭게 사용할 수 있는가?

□ 사용자가 선호에 따라 웹사이트의 상태 및 설정을 변경할 수 있는가?

□ 사용자에게 다양한 맞춤형 정보를 제공하고 있는가?


(5) 사용자가 실수하지 않게 만든다.

□ 사용자의 실수를 유발하는 요소가 있는가?

□ 심각한 결과를 유발하는 기능의 실행여부를 사용자에게 확인하고 있는가?

□ 사용자가 오류를 빠르게 인지할 수 있도록 표현하고 있는가?

□ 동작을 취소하거나 이전 상태로 돌아갈 수 있는 수단이 제공되고 있는가?


(6) 모든 유형의 사용자가 이용할 수 있게 만든다.

□ 장애가 있는 사용자에게 비장애 사용자와 동등한 수준의 정보와 기능을 제공하고 있는가?

□ 다양한 웹 브라우저에서 모든 기능을 동등하게 이용할 수 있는가?

□ 초보 사용자와 숙련된 사용자가 웹사이트에서 제공되는 모든 기능을 편리하게 이용할 수 있는가?


(7) 원하는 서비스와 정보를 쉽게 찾을 수 있게 만든다.

□ 사용자가 원하는 페이지나 위치로 이동할 수 있는 여러 가지 수단을 제공하는가?

□ 일반적으로 사용되는 내비게이션 모형을 적절하게 구현하고 있는가?

□ 중요한 정보와 다른 정보 간 위계를 명료하게 구분하고 있는가?





추가로 참고하면 좋을 브런치 링크도 공유한다. 사용성, 심리, 디자인, 컬러, 텍스트 등 정말 고려해야 할 요소가 많다는 걸 다시 한번 느꼈고 감이 아닌 근거 있는 분석을 할 수 있도록 꾸준히 학습하여 고려 요소들을 체화시키면서 분석하는 힘을 기를 예정! 


https://brunch.co.kr/@chulhochoiucj0/8


https://uxplanet.org/16-ui-design-tips-ba2e7524d203#b8b1


매거진의 이전글 '위시버킷'은 왜 이렇게 구성되어 있을까?
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari