서비스 분석 💻

'화해'의 새로운 기능 구체화 (3)

Lamp(램프) 2023. 1. 9. 00:03

저번 글은 '문제 해결을 위한 핵심 기능 MVP'으로 핵심 기능을 도출해 보았습니다.

 

핵심 기능의 타이틀은 "내가 사용한 제품 비교" 이며, 고객이 과거 사용한 제품과 새롭게 선택할 제품을 비교할 수 있는 서비스입니다. 현재 비교 장바구니에 담은 제품만 비교할 수 있고, 제품 선택에 직접적 도움이 미미하기 때문에 새로운 기능을 착안해 보았습니다. 

 

 

핵심 기능 3가지는 다음과 같습니다.

1. 내가 썻던 제품 등록 (history) : 이용자가 과거 사용한 제품의 히스토리를 등록하고 저장하는 기능입니다.
2.새로운 제품의 등록 (new) : 이용자가 비교하고싶은 제품을 등록하는 기능입니다. 
3. 제품 한눈에 비교하기 :  제품과 제품을 비교하여 구매에 돕는 기능입니다. 
 

[위클리과제 W3] '화해' 문제 해결을 위한 핵심 기능 MVP

[Contents] Part 1 | MVP 기획 (Minimum Viable Product) 01 문제의 정의 02 문제 해결을 위한 핵심 기능 정의 03 최소한의 기능 04 기능의 속성 05 프로토타입 제작 06 솔루션 정의 / 솔루션(MVP) 검증하기 Part 2 | BM

busybaby.tistory.com

 

이를 바탕으로 이번 글에서는 새로운 기능들을 구체화하는 시간을 가져보도록 하겠습니다. 


 

[Contents]

Part 1 |  UX개선/개발

01 요구사항 정의서 SRS
02 정보(계층)구조도 (IA, Information Architecture) 

03 화면 디자인 (Wireframe), 플로우 차트 (Flow chart)

04 스토리보드 (기능명세서) 작성

 


 

1. 요구사항 정의서 (SRS, Software Requirements Specification)

개발 요구사항을 아래의 방법으로 구조화된 요구사항 정의서를 제작해 보았습니다. 크게 5개의 구성의 요구사항명으로 요약해서 제작해 보았습니다. 각각의 요구사항에 추가 기능과 데이터가 필요할 시 추가할 예정입니다. 

  • 솔루션을 위한 유사한 기능을 그룹핑하여 요구사항명을 정리했습니다. 
  • 각각의 요구사항의 서비스 목적을 정리했습니다.
  • 각 요구사항에 해당하는 세부 서비스의 기능명을 요약하고 목적을 정의했습니다.
  • 각각의 세부 서비스에 대해 상세 설명과 필수데이터를 열거했습니다.
  • 각각의 서비스의 우선순위 또한 선정해 보았습니다.
  1.  

 


 

2. 정보(계층)구조도 (IA, Information Architecture) 설계

 

먼저, '화해' 전체 정보 계층 구조도를 살펴보겠습니다. 화해는 가장 하단에 네비게이션바를 두어 홈, 화해쇼핑, 마이, 리뷰쓰기 4개의 구성을 두어 빠른 접근성을 돕고있습니다. 크게 6개의 카테고리로 분류해 보았으며, 많은 정보, 광고, 쇼핑까지 아우르기위해 다소 많은 계층의 구조도를 가지고 있습니다. 간단하게 구조도를 설계해 보았지만, 각각의 계층에 구성하고 있는 세부사항은 더욱 다양한 것이 특징입니다.

 

'화해' 전체 정보 계층 구조도

 

큰 카테고리안에 새로운 MVP 기능을 어디에 위치시켜야 이용자가 더욱 접근이 용이하고, 이 서비스가 어디서 필요해서 선택하게 될 지 고민해봤습니다. 플로우 차트를 작성하여 언제 잘 접근할 수 있을지 고민할 예정입니다. 현재 대략적으로 해당 서비스가 위치할 곳은 네비게이션 바에 있는 '마이페이지' 상단에서 나의 히스토리를 관리할 수 있고,  제품 검색의 결과인 제품 정보에서 비교하기를 선택할 수 있습니다.

네이밍은 현재 알기 쉽게 표기하였지만 추후 ux를 개선한 네이밍을 수정할 예정입니다. 

 

 

아래는 '내가 사용한 제품 비교' 기능의 정보구조도 입니다. 크게 4개의 계층으로 구분해 보았으며 계층 아래 구성된 기능을 열거해 보았습니다. '내가 사용한 제품 비교'의 기능 구성은 제품등록, 마이히스토리, 제품 한눈에 비교하기, 비교 결과 상세보기로 구성되어 있습니다.

 

 


 

3. 화면 디자인 (Wireframe)

 

최종 9개로 화면 디자인을 요약해 보았습니다. 유저 플로우는 아래에 기재해 두었으며, 화면마다 설명을 덧붙혀 보겠습니다. 

 

1. 제품 등록, 검색, 목록

 

📌 제품 등록

 썻던 제품 히스토리 등록과 새로운 제품을 등록할 수 있는 첫 화면입니다. 히스토리 제품을 전저 등록하고 비교할 제품을 등록할 수 있습니다. 과거 사용했던 제품과 새로운 제품을 등록할 수 있는 화면입니다. 

 

추가 - 사용자가 등록 순서의 확립을 위해 사용한 제품을 먼저 등록을 유도하는 UX 추가

추가 - 새로운 제품/새로운 제품의 비교를 위한 제품 등록 (사용했던 제품 외에 새로움 제품과 새로운 제품과의 비교)

 

 

📌 검색 

검색을 돕는 화면이며, 추천검색어최근검색어를 선택하여 검색 도움을 받을 수 있습니다. 추천 검색어에서는 현재 인기있는 제품, 화해에서 최근에 둘러봤었던 제품 위주로 제품 명을 띄웁니다. 최근 검색어에는 최근에 검색했던 제품 목록을 띄웁니다. 

 

추가 - 제품명, 브랜드명으로 검색

추가 - 성분으로 검색하기 

 

 

📌 목록

 등록한 제품의 목록을 확인할 수 있는 화면입니다. 이용자가 사용한 제품을 목록화하여 보여주는 화면입니다. 제품을 등록했을 때 카테고리별로 제품이 분류되어야 하며, 스킨케어, 클렌징, 팩, 선케어, 베이스, 아이, 립, 바디, 헤어, 네일, 향수 카테고리별로 노출시킵니다. 

 

추가 - 1) 제품 카테고리별, 2) 피부 고민별 카테고리 분류 선택

 

 

2. 비교할 제품 선택, 검색 및 비교하기, 요약 결과(유사)

 

📌 비교할 제품 선택

사용했던 제품을 등록 했다면 비교할 제품을 선택해야합니다. 비교할 제품을 스크롤하여 카테고리 1, 카테고리 2로 나누어 볼 수 있습니다. 빠른 선택을 돕기위해 

 

추가 - 제품명만 보일지, 제품명+사진을 같이 나타낼지, 제품명의 풀네임 or 요약명

추가 - 선택하기 or 비교하기 버튼 

 

 

📌 검색 및 비교하기

검색을 돕는 화면이며, 추천검색어 최근검색어를 선택하여 검색 도움을 받을 수 있습니다. 추천 검색어에서는 현재 인기있는 제품, 화해에서 최근에 둘러봤었던 제품 위주로 제품 명을 띄웁니다. 최근 검색어에는 최근에 검색했던 제품 목록을 띄웁니다. '비교할 제품 검색하기'를 띄어서 현재 어떤 기능을 하고 있는지 혼란을 겪지 않게 돕습니다. 

 

추가 - 검색어를 입력해 보세요 -> 제품명, 브랜드명으로 검색 

추가 - 성분으로 검색하기 

 

 

📌 요약 결과 (유사결과/차이결과)

'제품 한눈에 비교하기'의 결과 화면입니다. 과거 제품과 현재 제품의 이미지를 띄우고, 유사한 키워드 3개를 띄웁니다. 비슷하다면 화해 쇼핑에서 구매를 유도하는 CTA를 삽입합니다. 가격, 리뷰키워드, 성분, 화해별점, 랭킹, 제조사 6가지 카테고리 중 이용자가 우선순위 카테고리를 선택할 수 있는 '결과 카테고리 재설정'도 삽입합니다.  

 

추가 - 결과 카테고리 재설정, 결과값 기준(카테고리 유사 갯수) 재설정 

추가 - 각 카테고리별 비교기준확립 (성분, 리뷰 키워드 등)

추가 - 결과 논리 변경 : 이용자가 선택한 피부 고민별 -> 제품 성분별 고민 해결정도(도움)에 따른 결과 내역

현재 00만큼 해결해주는 제품을 사용하고 있다, 00제품을 사용하게 된다면 00이 고민을 더 해결할 수 있다. 그래서 구매 추천한다.

 

 

 

3. 결과 상세내역, 요약 결과(차이)

 

📌 비교 결과 상세내역

요약 결과에 대한 내역을 상세하게 볼 수 있는 화면입니다. 가격, 리뷰키워드, 성분, 화해별점, 랭킹, 제조사를 상세하게 보며 이용자는 직접 비교할 수 있습니다. 성분에 대해서는 성분명만 보여주는 것이 아닌, 00기능에 도움을 준다는 성분명을 기재하여 선택을 돕습니다.  

 

추가 - 카테고리 재설정 cta

추가 - 리뷰 키워드 자세히보기 -> 전체 리뷰 키워드, 성분 자세히보기 -> 전체 성분, 성분 기능별 

 

 

 

4. 플로우 차트 (Flow chart)

 

 


4. 스토리보드 (기능명세서)