쇼핑몰 고객을 위한 웹인가? 패션 모델을 위한 웹인가?

First Impression

입찰 의뢰를 받고 오랫만에 패션 브랜드 사이트를 분석했다. 
브랜드 이미지가 무색하게 메인 화면 첫인상은 완성도가 많이 부족해 보인다. 
2020년 1월 기준, 가장 많은 고객이 사용하는 모니터 해상도인 FHD(1920*1080) 에서 접속한 화면에는 슬라이드 되는 배너와 기획전인지 이벤트인지 직관적으로 이해할 수 없는
고정 배너 두 개가 전부다. 국내 브랜드 사이트와 해외 명품 브랜드 사이트 UI를 믹스한 듯 하나 퀄리티는 많이 부족하다. 
컬렉션이나 명품 브랜드가 추구하는 이미지를 상징적으로 표현한 웹은 디자인 방향 자체가 다르기 때문에 제품 이미지를 세련된 효과로 표현하는 것 만으로도 충분하나 
제품을 판매하는 쇼핑몰에서 어떤 목적으로 배너를 구성했는지 이해할 수 없다면 디자인 방향을 잘 못 잡았거나 크게 고민하지 않고 디자인 한 듯 하다. 
특히 할인 행사에 참여를 유도해야 하는 배너라면 할인율을 잘 보이도록 노출하고 사용자 클릭을 유도하는 것이 바람직하다. 
무엇보다 메인 화면 진입 시 보이는 첫번째 화면 영역은 브랜드 이미지를 대표하기도 하며 사용자가 클릭하거나 스크롤 하고 싶은 욕구를 갖게 만들어야 한다.

Main UI

산만하고 완성도가 떨어지는 디자인은 사용자 입장에서 불편할 수 밖에 없다. 
사이트를 자주 방문하고 어느정도 학습이 되어 사이트의 구조가 익숙해진 고객이 아니라면 처음 방문한 고객은 메인 화면을 스크롤 하는 동안 사이트에서 전달하고자 하는 목적이 무엇인지 이해하기 어려우며 사용자 입장에서 클릭할만한 요소가 없다는 것을 금방 알아차리게 된다. 

쇼핑몰을 운영하는 기본 목적은  상품 판매이다. 하지만 사용자의 습관이나 시각을 무시하고 상품을 진열한다면  구매로 직결되기 어렵다. 

디자이너 관점에서 바라본 메인화면 기획전 영역 UI는 브랜드 상품군을 노출하고 대칭 구조를 사용하여 지루함을 피하려고 한 흔적이 보인다. 하지만 상, 하단 브랜드의 구분이 뚜렷하지 않고 비대칭 구조가 오히려 산만해 보이기까지 하다. 
쇼핑을 하는 동안 상품 포커싱이 제대로 이루어지지 않고 시선을 분산시킨다면 고객은 
금방 피곤함과 지루함을 느끼고 브라우저 화면을 닫아버릴 수도 있다. 

독창적인 인터랙션으로 세련된 사이트를 만들려고 한 흔적이 보인다.
하지만 콘텐츠 구성과 UI 완성도가 떨어지는 상태에서 아무리 세련된 인터랙션을 적용한다고 해도 그 가치를 전달하지 못한다. 

기획전, 신상품리스트를 보는동안 지루하고 피곤하다는 생각을 같게 만드는 디자인…
최소한 여백과 라인, 면처리, 그룹핑을 통해 스크롤 하는 동안 상품 진열 목적을 명확하게 전달해야한다. 

“상품이 좋고 관심이 있으면 구매로 이어지겠지”가 아니라 좋은 상품을 좀 더 많이 구매하게 만드는 쇼핑몰, 다양한 유저의 입장을 고려한 쇼핑몰이 되어야 쇼핑몰 운영 목적을 달성할 수 있다. 

LAYOUT

메인화면에는 노출할 수 있는 모든 콘텐츠를 진열해 놓았다. 
메인 화면 상단은 명품 컬렉션 사이트를 흉내 내었지만 하단은 종합몰과 같이 구성해 놓았다면 사용자를 어떤 기준으로 분류하고 
UI 전략을 세웠는지 궁금해진다. 

무엇보다 쇼핑몰을 이용하는 고객은 패션 모델들이 아닌 일반 고객이다!

패션 의류의 전문적인 지식을 가진 디자이너들과 패션 모델들의 특징을 살려 쇼핑몰을 디자인 할 수는 있지만 구매자인 일반 고객의 눈 높이를 맞추지 못한다면 쇼핑몰은 운영 목적을 실현하기 어렵다. 

IA

사이트를 분석하면서 가장 심각한 문제점으로 판단되었던 부분은 상품 상세화면까지 진입을 유도하는 메뉴 구성이었다. 
메인 화면에 다양한 콘텐츠와 메뉴를 구성해 놓았지만 진입 경로만 다른 메뉴들이 여기저기 분산되어 있다. 
메뉴 구조도에서 컬러로 마킹한 부분은 마지막 depth 가 동일한 화면들이다. 
누가 봐도 답답한 메뉴 구조는 굳이 설명하지 않아도 문제가 심각하다는 것을 알 수 있을 것 같다. 

운영 목적에 적합한 웹 또는 APP을 개발하기 위해서는 많은 것들을 고민해야 한다. 하지만 기본적으로 다음의 것들이 지켜지지  않으면 운영 목적을 상실할 수도 있다. 무엇보다 쇼핑몰은 판매자의 입장이 아닌 구매자의 눈높이에서 생각하고 UI 전략을 세워야만 쇼핑몰 운영 목적에 적합한 디자인과 시스템을 구축할 수 있다.  

To-Be : IA

  • 상품 분류 중심의 네비게이션
  • 판매 가능한 상품 중심의 콘텐츠 구성
  • 주요 서비스 화면 접근이 용이한 UI 방향 도출
  • 회원 참여를 유도할 수 있는 배너 콘텐츠 노출 

To-Be : UI

  • 직관적으로 이해할 수 있는 콘텐츠 구성
  • 사용자 참여를 유도할 수 있는 커뮤니티 콘텐츠 노출
  • 브랜드 및 상품 신뢰를 구축할 수 있는 정보성 콘텐츠 노출
  • 유사 속성의 콘텐츠 별 그룹핑

조금 더 사용자 입장에서 생각하고 UI 전략을 세우고자 한다면 다음의 사용성 분석 및 단계별 UI 평가에 의한 결과를 도출하고 UI 전략을 세워야 한다. 
무엇보다 UI 전략을 세우기 위해서는 UX/UI 를 전략을 세울 줄 아는 컨설턴트의 경험이 무엇보다 중요하다. 컨설턴트의 경험은 단순히 학문적으로 습득한 간접 경험이 아닌 기획, 디자인, 퍼블리싱, 개발 업무를 모두 이해하고 사용자의 관점에서 가치가 있는 UI 전략을 세워야 한다. 

Analysis

Episode

최근 UX/UI 컨설팅 기업들이 많이 생겨났다. 대학에서도 UX/UI 컨설팅을 학문으로 다루기 시작했고 웹에이전시 협회에서도 UX/UI 컨설팅 강의를 하고 있을만큼 UX/UI 컨설팅이 필요하며 사용자와 클라이언트 눈높이가 높아지고 있다는 뜻이기도 하다. 일부 SI 전문 기업들이 기획팀 직원 대상으로 UX/UI 컨설팅 교육을 받게 하고 별도의 UX/UI 컨설팅 전문 기업을 설립하기도 한다. 그런데 그 회사의 고민은 교육을 받은 직원들이 UX/UI 컨설팅을 할 수 없어 고민이라고 한다.  우스운 얘기 같지만 UX/UI 컨설팅은 학문에 의존하기 어렵다.

웹 사이트 또는 시스템 개발 목표를 실현하고 완성도를 높이기 위해 UX/UI 컨설팅이 필요하다. 
UX/UI 컨설팅에 앞서 다양한 방법론이 존재하지만 컨설팅은 학문적 경험보다 실무에서 쌓은 지식과 경험을 바탕으로 결과물을 만들어 가는 것이 효과적이기 때문에 컨설턴트의 경력과 경험이 무엇보다 중요하다.

 

[T01] 컨설팅 계획
[T02] 개선 범위 정의
[T03] 서비스 활용도 분석
[T04] 사용자 참여도 분석
[T05] 경쟁 서비스 분석

[T06] 시장환경 및 사용자 분석
[T07] 내부 평가 및 조사
[T08] 디바이스 환경 및 접근성 분석
[T09] UX/UI 트랜드 분석

[U01] UX/UI 전략 기획
[U02] 표준 UI 정의
[U03] 주요화면 서비스 플로우
[U04] 주요화면 Prototype

[U05] 내부/외부 사용자 평가 계획
[U06] 사용자 평가
[U07] 컨설팅 결과

UX/UI 컨설팅을 단순히 디자인이나 UI 기획 경험만 가지고 디자인 전략을 세우는 것으로 생각한다면 좋은 결과를 만들기 어렵다.  컨설턴트의 경험에 의해 컨설팅 단계를 계획하고 각 단계별로 좋은 결과를 만들기 위한 산출물을 만들어 가야 성공적인 컨설팅 결과를 기대할 수 있다.