[Figma] UX/UI 분석 및 개선

H&M 웹 사이트 모바일 버전 프로토 타입 제작

• 만든 기능
  1) 메인화면
  2) 메뉴바 레이아웃
  3) 메인 이미지 캐러셀
  4) 카테고리 케러셀
  5) 상하 스크롤 기능

  • 실제 H&M 모바일 페이지
    

• 클론한 H&M 모바일 페이지
• 주소 : https://www.figma.com/file/UkE9sM79JDRCNwWILDSG7D/H%26M?node-id=0%3A1

웹 사이트의 UI/UX 분석하기

1) GNB메뉴와 Footer 고객지원 메뉴의 중복 :
미학적이고 미니멀한 디자인이 아님!
2) 메뉴 내 카테고리 분류 안되 있어서 가시성이 떨어짐 :
일관성 및 표준성에 어긋남!
=> 같은 SPA 브랜드인 ZARA에서는 사이드 메뉴바를 누르면 'SHOP'과 '고객지원'의 두가지 메뉴가 나와서 세부 선택이 가능하다.

분석한 내용을 토대로 UI 개선하기

• 개선한 H&M 모바일 페이지 : https://www.figma.com/proto/dQz1eZgWQxxa7lubPZ4eTG/advanced-H%26M?node-id=0%3A1
• 개선내용 :
  1) GNB 메뉴와 Footer 중복 내용 삭제
  2) GNB 메뉴 카데고리 재분류('SHOP', '고객 지원' 으로 양분)
  3) 메인화면 세일페이지와 대표 이미지들을 캐러셀로 만듬