UI / UX 분석해보기

woong·2022년 10월 26일
0
post-thumbnail

처음으로 UI/UX를 분석해보기 위해 선택한 웹 사이트는 크림(KREAM) 사이트이다.
https://kream.co.kr/

위의 사이트를 보며 어떤 UI 디자인 패턴이 쓰였는지 보고 피터 모빌의 UX 7요소 및 제이콥 닐슨의 10가지 사용성 평가 기준으로 분석을 해보자.

UI 디자인 패턴

  • 모달: 우측 상단에 있는 검색 아이콘을 클릭할 때나 신발 사이즈를 선택할 때 등 모달이 사용되었다.
  • 태그: 우측 상단에 SYLE을 누르면 페이지가 이동되는데 바로 태그들을 볼 수 있다. 사용자들 임의로 추가도 가능하다.
  • 자동완성: 검색창에 자동완성 기능이 있다.
  • 아코디언: 상품 하나를 클릭하여 해당 상품 페이지에 들어가면 배송기간 안내, 검수 안내가 아코디언으로 이루어졌다.
  • 캐러셀: 메인 페이지에 캐러셀이 사용되었다.
  • 무한스크롤: 기본적으로 페이지가 무한스크롤로 구현되었다.
  • GNB: 상단에 최상위 메뉴인 GNB가 존재한다.(STYLE, SHOP, ABOUT) / LNB는 따로 없는 듯하다.

피터 모빌(Peter Morville)의 벌집 모형 ( UX 7요소 )

1. 유용성 - O
이 사이트의 주 목적은 신발이나 옷 등의 판매(리셀)인데 그러한 부분을 잘 제공하고 있고, 부가적으로 고객들이 착용 사진을 올리는 기능도 마련되어있다.

2. 사용성 - O
태그를 사용하고 브랜드나 종류별로 분류해놓음으로써, 사용자가 원하는 제품을 쉽게 찾을 수 있다. 또한, 익숙한 디자인 패턴들을 많이 볼 수 있다.

3. 매력성 - O
특출나게 감성적인 면이나 특별한 점은 없는 것 같지만 전체적으로 단순하고 직관적이어서, 상품들이 눈에 잘 들어오는 것 같다.

4. 신뢰성 - O
검수 기준을 통한 정품 보증이 확실하게 되고, 이 사이트의 이미지도 젊은 층들에게는 신뢰성있게 구축된 상태이다.

5. 접근성 - X
이 사이트의 주 타겟층이 10대, 20대, 30대로 어느정도 정해져 있어서 접근성에 대한 부분의 중요도가 비교적 낮다고 생각한다. 그렇지만, 다크모드 지원이나 확대하는 기능 등의 편의 사항을 제공하면 좋을 것 같다.

6. 검색 가능성 - O
기본적으로 검색 기능이 있으며 인기 검색어, 추천 검색어 및 카테고리 등의 부가적인 기능이 있다. 검색 가능성을 잘 고려하여 만든 것 같다.

7. 가치성 - O
이 사이트의 목적과 그에 따른 주타겟층을 생각해보면 접근성의 중요도가 비교적 낮다고 생각한다. 그에 따라, 접근성을 제외하고 나머지 요소들은 잘 고려하여 만들어졌다고 생각한다.


UI/UX 사용성 평가

→ 제이콥 닐슨의 10가지 사용성 평가 기준

1. 시스템 상태의 가시성
사이즈 별로 재고가 있는지 여부와 입찰되어져있는 가격을 실시간으로 제공한다.
최근 체결 거래에서 얼마에 판매되었는지 등의 정보를 제공한다.

2. 시스템과 현실 세계의 일치
사용자들이 착용 사진을 올릴 수 있는 기능이 제공되어 있어, 현실감을 올려준다.

3. 사용자 제어 및 자유
실수로 관심상품에서 상품을 삭제하면 되돌릴 수 있는 창이 제공되어 있지는 않는 등 조금 아쉬운 부분인 것 같다.

4. 일관성 및 표준
외부 일관성: 익숙하고 많이쓰이는 UI 디자인패턴이 많이 사용되었다.
내부 일관성: 제품마다 각각의 인터페이스가 동일하여 일관성이 있다.

5. 오류 방지
3번과 유사하게, 관심 상품에서 삭제버튼을 누르면 삭제되기 전에 확인창이 따로 있지 않는 등 사용자의 실수롤 방지하기 위한 것들이 충분하게 구현되지는 않은 것 같다.

6. 기억보다는 직관
최근 검색어 기능을 제공하고 인기 검색어, 추천 검색어 및 카테고리 등의 부가적인 기능을 제공하여 사용자가 기억해야 하는 정보를 줄인 모습을 볼 수 있다.

7. 사용의 유연성과 효율성
마음에 드는 제품들을 관심상품에 담아 놓을 수 있다.

8. 미학적이고 미니멀한 디자인
딱히 불필요한 정보가 지저분하게 나열되어 있지 않고, 필요한 것들만 깔끔하고 직관적으로 보인다.
(예시. 모달과 아코디언의 활용)

9. 오류의 인식,진단,복구
로그인 시 이메일 형식으로 작성하지 않으면 이메일로 작성하라는 문구가 뜨고, 비밀번호도 마찬가지이다. 이처럼 문제가 무엇인지 정확하게 표시해준다.

10. 도움말 및 설명 문서
추가 설명이 굳이 없어도 사이트를 이용하기 크게 어렵지 않고, 추가적으로 고객 센터를 통해 자주 묻는 질문을 모아 놓은 페이지나 검수기준에 대해 작성해놓은 페이지도 마련되어 있다.


→ 내가 생각한 개선점

전체적으로 사용성과 효율성이 충분히 있는 사이트라고 생각한다. 허나, 관심 상품에서 사용자가 삭제버튼을 실수로 눌렀을 때를 대비하여, 삭제되기 전에 뜨는 확인창을 제공하면 사용자의 실수를 방지하여 사용성과 효율성을 더 높일 수 있을 것이라 생각한다.

0개의 댓글