사례 연구를 통한 온라인 커머스 uxui 방향성 검토

(온라인 커머스 월드 2013 FALL)

2013.10.18InnoUX CEO 최병호

[email protected], @ILOVEHCI

© 2013 InnoUX & Innodesign All rights reserved.사례 연구를 통한 온라인 커머스 UX/UI 방향성 검토

Table of Contents

• Overview: Inspirational Commerce• For the Window Shopper: Fashion Kaleidoscope app• Unique style for photography: Suitsupply.com• Minimize navigation size: Lilybalou.be• Full screen background images: Us.vanmoof.com• Personalize your experience: Fab.com

1

http://www.slideshare.net/subburama/inspirational-commerce-solutions

http://kalei.do/

https://itunes.apple.com/us/app/kaleidoscope-fashion-inspired/id505876558?ls=1&mt=8


For the Window Shopper: Fashion Kaleidoscope app

1. Home screen(time line)의 변화와 타인이 멋있게 입고 있는 스타일과닮고 싶다는 욕구 판매

2. 구매 프로세스의 변화 추구: 스타일 탐색 > 스타일 선택 > 구매 대상선택

3. 구매 대상 선택 UI의 개선 필요: ‘메뉴’ 방식과 affordance와 fun이투영된 ‘구매 대상 직접 선택’ 방식 혼용

4. Shopping mall 연계 UI의 개선 필요: 단순 제품 나열 방식에서 비주얼감성을 자극하는 방식으로 전환 필요

5. Social friends가 공유하는 스타일로의 접근 변화

6. Visual bookmarking의 commodity화 (예) Pin it

참조: http://mashable.com/2013/05/16/shopping-apps-tablet/

http://www.slideshare.net/subburama/inspirational-commerce-solutions

http://suitsupply.com/


Unique style for photography : Suitsupply.com

1. 예술작품 같은 비주얼 충격: 고품격 제품 퀄리티 추구

2. 돋보기로 본 듯한 섬세한 제품 확대: 신뢰성 제고

3. 실제 모델이 직접 동영상 홍보: 강력한 흥미 유발

4. Size advisor 기능 및 실제 모델이 직접 동영상 설명 제공: 실효적인 구매 지원

5. ‘ADD TO CART’ 버튼 선택 직후 정보 제공: 명료한 피드백

6. ‘SHOP BY LOOK’ 메뉴 제공: WYSIWYG 접근 강화

참조: http://www.slideshare.net/StuartSilverstein/30-sites-deck-final2

http://www.lilybalou.be/


Minimize navigation size: Lilybalou.be

1. Home page의 변화: 정보량과 내비게이션 바의 위치 혁신으로정보주목도 강화

2. 매거진 방식 도입: 패션 매거진을 보는 즐거움의 이식과 종이매거진에는 없는 인터랙션 스타일 접목으로 쇼핑 즐거움 배가(예) 지면 부분 확대(!), 전체 화면으로 확대


http://us.vanmoof.com/


Full screen background images: Us.vanmoof.com

1. Home page의 변화: background image의 교체와 한 개의이미지으로만 정보주목도 강화

2. 직관적인 인터랙션 방식 도입: 옵션 마우스 오버 시 floating info. Box 제공 및 옵션 선택 시 제품에 실제 착탈로 명료한 이해유도


http://fab.com


Personalize your experience: Fab.com

1. 맞춤 카테고리: 선호하는 카테고리를 선택하여 웹/앱/이메일대상으로 맞춤 서비스를 받을 수 있도록 구성

2. Social friends의 선호 제품 공유: SNS에서 선호하는 제품공유로 conversion rate 상승 효과

경청해주셔서고맙습니다!

사례 연구를 통한 온라인 커머스 uxui 방향성 검토

Design