프로젝트 개요 - Rankie

모바일웹 디자인

English       中文

Overview

시장에서 수많은 미용제품들이 있고 그중에 어떤 제품이 장말 좋은 건지? Rankie 란 모바일 웹사이트는 바로 소비자중심으로 구현된 시스템을 이용해서 미용제품 선택하는데 도움을 주는 모바일 웹사이트이었습니다.

DATE

Apr – Aug 2016

PLATFORM

Mobile Website

MY ROLES

UX Design
UI Design
Illustration
Branding

TEAM

1 PM
1 Designer
2 Marketers
2 Developers (Outsourced)

The Problem

미용제품을 고를 때 보통 광고보다 실사용자 리뷰가 믿음이 더 가는 편입니다. 하지만 때로 리뷰를 작성하거나 읽는 것도 번거롭다고 느낄 수 있습니다. 우리는 새로운 미용제품 리뷰를 작성과 소비하는 방식을 모색하고자 했습니다.

Define the Problem

어떤 제품의 품질이나 효과를 알아보려고 할 때 사용자리뷰는 가장 신빙성 있는 것 같습니다. 대표적인 사용자 시나리오를 살펴보며 우리가 해결해야 할 주요 디자인 문제를 정했습니다.

GOAL

더 많은 소비자가 우리 웹사이트에서 투표하고 랜킹을 참조하기

RISKS & CONSTRAINTS

사용자가 투표하는 것도 귀찮아하는 경우
사용자가 우리 데이터의 신빙성을 믿을 건지?
개발자 인력 지원 부족

Create a Persona

토론과 인터뷰를 바탕으로 20대 중반 여성인 페르소나를 만들었습니다. 디자인 과정 중에 우리의 주요 목표사용자 Reference 로 사용했습니다.

Look at Inspiring Solutions

Glowpick 란 비슷한 컨셉인 앱을 조사 단계에서 발견했는데 사용자가 평점을 주는 방식으로 화장품 순위를 매깁니다. Behance 의 ‘좋아요’ 기능과 11번가의 ‘상품평’ 기능도 좋은 Reference 이었습니다. 디자인 솔루션을 모색하는 첫 단계는 이런 기능들을 찾아 모아 리뷰했습니다.

Idea Sketches

임하는 도전과 목표 사용자를 알았기 때문에 그 다음에 스케치로 해결방안을 모색하기 시작할 수 있었습니다.

Solution Wireframes

첫 와이어프레임을 제작하고 팀원들의 피드백을 수집했습니다. 코멘트와 질문을 와이어프레임의 관련 위치에 썼습니다. 진행하여 현실적인 사용자 반응을 얻기 위해 와이어프레임을 제작할 때 기능과 흐름에 중점을 두었습니다.

Storyboard

스토리보드는 프로토타입의 어떤 부분이 완제품처럼 제작해야 할지 명시해주었습니다. 향후의 사용자 테스트의 Outline 으로도 사용될 예정이었습니다.

Create Prototypes

팀원들의 의견을 반영하여 higher fidelity 프로토타입을 제작했습니다. 고정된 디자인 시안을 클릭할 수 있는 프로토타입으로 전환시켜 실시간 사용자 테스트를 하기 위해 준비했습니다.

Test Objectives

1. 사용자가 원하는 상품의 순위를 쉽게 찾을 수 있고 평가의 기준을 이해할 수 있을지?
2. 사용자가 특정 카테고리의 순위를 빠르게 찾을 수 있을지?
3. 결론적으로 사용자가 우리 웹사이트를 이용하여 화장품 구매결정을 할 것인가?

TASK SCRIPT EXAMPLE

IOPE 최신 에어쿠션을 사셔야한다는 가정하고 이 제품에 대한 정보를 Rankie를 통해 찾아보세요.

질문

·사이트의 첫인상이 어떠신지?
·상세페이지는 예상하신 것과 차이점 많이 있나요?
·투표 부분에 대한 어땋게 생각하세요?

관찰

·사용자가 어떤 부분에서 가장 오래 머무르는지?
·사용자가 어떻게 투표하는지?
·사용자가 계속 스크롤하는 의욕이 있는지?
·사용자의 표정이 어떤지?

Reaction Patterns

Work with Developers

프론트엔드 코딩과 디자인시안 간의 차이를 고르는 작업도 맡았습니다. 개발은 외주로 진행했기 때문에 품질을 유지하는 것이 쉽지 않았습니다. 중요한 것은 서로의 의견을 존중하고 사용자와 개발자의 입장에서 생각하는 것이었습니다.

en_USEN
zh_CNCN en_USEN