서비스 기획 절차의 이해 - 2

서비스 기획서는 화면 설계서만은 아니다.

전체적으로 참고한 블로그 : 서비스 기획서 작성하기 1: 서비스 기획서 정의와 사용자 분석 알아보기

 

서비스 기획 프로세스

< 현재 상황 분석 - 경쟁사 트랜드 벤치마킹 - 요구사항 / 정책 정의 - 서비스 프로세스 플로우차트 - 화면 설계 >

현업 & 사용자의 요건 분석 시 서비스 담당자, 팀장 등의 요구사항, 사용자 요구사항 분석하여  서비스 기획서(=TO-BE)를 만든다.
요구사항 분석, 정책, IA, UX/UI, 프로세스가 포함되야 한다.

 

 

1. 현재 상황 분석 : AS IS - TO BE 접근 방법

참고 블로그 : 타협 없는 사용자 경험을 위한 AS IS - TO BE

사용자 경험은 제품 또는 서비스의 성공을 좌우한다.
그러므로, 타협 없는 사용자 경험(UX) 및 사용자 인터페이스(UI) 디자인은 현대 비즈니스의 핵심이다.

 

AS IS - TO BE 접근 방식은 사용자 경험을 개선하고 제품 또는 서비스의 품질을 향상시키는데 있어 중요한 역할이다.

- AS-IS : 현재의 상태를 이해하고 문제점을 식별하는 단계

사용자들이 제품이나 서비스를 사용하는 과정에서 겪는 어려움과 불편함을 파악한다. 이 단계는 우리가 어떤 부분에서 실패하고 있는지를 알려주며 어느 부분을 개선할 필요가 있는지 보여준다. 

- TO-BE : 개선된 상태를 설정하고 목표를 정하는 단계

사용자들이 더 나는 경험을 얻을 수 있도록 설계하고 구체화한다. 이 단계는 어기 어떻게 사용자들에게 가치를 제공할 수 있는지 결정하고 현실로 만드는데 필요한 조취를 취할 수 있는지 보여준다.

 

 

2. 경쟁사 트랜드 벤치마킹

참고 블로그 : 벤치마킹의 범위와 고려 사항들 , UI/UX 벤치마킹을 효율적으로 하는 노하우

벤치마킹은 단순히 경쟁 기업이나 선도 기업의 제품을 복제하는 수준에서 그치지 않고, 장/단점을 분석하여 자사 제품 및 서비스를 한층 업그레이드 해 시장 경쟁력을 높이고자 사용한다.

 

경쟁사 벤치마킹

경쟁사가 유저에게 어떤 기능으로 어떤 가치를 제공하고 있는지 분석하기 위해 사용

** 타사 벤치마킹을 통해 알고 싶은 점이 무엇인지 명확해야한다.

 

앱 서비스에 방향이 잡히지 않아 우리의 경쟁 서비스를 알기 어려울 때 = 포지셔닝 맵 활용하기

포지셔닝 맵 : 서비스 / 브랜드를 일정한 기준에 따라 4분면에 위치시키는 기법

 

UI/UX 벤치마킹

이미 상위 기획이 끝난 후 출시 되었거나 출시 예정인 기능의 세부 UI/UX 를 기획할 때 유용

기획자가 봤을 때 참고할 만한 서비스를 벤치마킹 하는 것.

- 공통 분모를 찾아 기능별로 그룹핑
- 특이한 부분에 대해 기능의 목적 추측
- 딱 맞는 UX를 찾았다면 적극적으로 서비스에 녹여보기

 

벤치마킹 고려사항

1. 타깃 : 누구를 위해 제공하는 서비스인가

2. 프로세스 : 어떤 프로세스를 거치고 있는가

3. 콘텐츠의 유형 : 어떤 콘텐츠를 제공하는가

4. 인터페이스 : 어떤 인터페이스를 제공하는가

5. 유도된 행동 : 사용자가 다음에 할 수 있는 액션은 무엇인가

6. 디자인 : 직관적인 메시지 전달을 위해 사용하는 시각적 표현은 무엇인가

7. 좋았던 점과 나빴던 점, 서비스에 적용되었을 때의 화면까지 고려하기

 

 

3. 요구사항 분석

신규 서비스, 기존 개선 서비스 모두 사용자를 분석하는 것이 시작이다.
- 분석 사항 : 타겟 - 욕구 - 목적 - 형태 - 니즈

 

사용자 분석 방법

참고 블로그 : 9. 사용자분석 방법론

 

사용자 종류

주사용자	부사용자	구매자로서의 사용자	관리자로서의 사용자
primary users	secondary users	users as buyer	users as manager
사용자 분석의 주요 대상 그룹	실제로 사용하지는 않지만, 주 사용자가 어떻게 사용하는가에 영향을 받는 사람	실제로 시스템이나 기기를 구입하는 과정에서 결정권을 행사하는 집단	조직 내에서 실질적으로 조직의 일을 관리하는 사람
특정 목적을 달성하기 위해 시스템이나 컴퓨터를 통해 정보처리나 기능을 하는 사람		비즈니스에서는 구매자와 사용자간의 매우 다른 목표나 특성, 행동 양식이 존재

 

유저 리서치(UX Research)

종류

정량적 조사	정성적 조사
- 객관적이고 통계적인 결과 도출 - 숫자로 측정 가능한 데이터를 수집하고 분석	- 주관적이고 맥락적인 인사이트 도출 - 사용자의 행동과 생각을 심층적으로 이해
사용자 설문 조사, 로그 데이터 분석 , A/B 테스트 등	서비스 피드백, 사용 후기, 인터뷰, 현장 조사, 고객의 소리(voc) 등

 

방법론

연역적 분석: 미리 가설을 세우고 그 가설이 적합한지 판단한다.
귀납적 분석 : 조사를 하고 그 결과를 해석하며 UX 결론을 이끌어 간다.

	연역적 분석	귀납적 분석
정성적 조사	페르소나 기법 : 서비스 이용 고객을 대표하는 가상은물을 상정하고 서비스 프로세스에 따라 그 인물의 상황과 감정 등 모든 경험을 고려하는 방법	컨텍스츄얼 인쿼리 : 실제 사용자에게 질의를 하며 의도나 감정, 목적을 묻는 방법
	페르소나 스펙트럼 : 변형된 페르소나 기법으로, 서비스를 이용하는 시점의 전후환경을 고려해 다양한 스펙트럼으로 서비스 이용환경을 점검하는 방법	쉐도잉(필드 리서치) : 실제 사용자의 과정을 방해하지 않고, 관찰만 하는 방법. 시간과 비용이 들기 때문에 작은 서비스에는 대입하기 어려울 수 있다.
정량적 조사	사용자 트래킹 분석 (GA, 와이즈로그, 뷰저블 등) : 일상적이고 빨라야하는 서비스 기획 업무에 적합. *앱 트래킹을 하는 BI 솔루션이 대표적이다.	A/B 테스트 : 목표에 맞는 A와 B 케이스를 만들어 놓고 예상한 목표에 좀 더 근접한 UI 또는 프로세스를 채택하는 방법. 어느 정도의 개발이 필요하기 때문에, 연역적 가설 설정시 효율을 위해 필요로 할 수 있다.

 

*앱 트래킹

트래픽 분석	클릭 분석	퍼널 분석
접속한 이용자 수 또는 이용자가 접근한 페이지 수를 보는 방법. 페이지별 또는 서비스 단위로 트래픽의 변화량을 체크한다.	화면 내 특정 위치나 행동을 기준으로 이벤트를 생성하고 로그분석을 통해 영역별 클릭 수나 사용 패턴을 분석하는 방법.	고객의 동선이 원하는 방향대로 잘 움직이고 있는지 판단하는 방법.
		예시 : ' 메인 전시 페이지 - 상품 상세 페이지 - 주문서 - 주문 완료' 의 메인 프로세스가 존재할 때 고객의 흐름을 확인한다.

 

 

4. 서비스 프로세스(=프로세스 설계서)

 

플로우 차트 Flow Chart 

전체적인 유저 프로세스를 이해한 후 유저 프로세스를 도식화하여 보여준 문서

플로우 차트 공부 링크

플로우 차트

 

유저 프로세스 User Process

기능적 관점에서 사용자의 행동 순서와 화면 전환을 도식화한 문서이다.
UI(화면), 행동, 판단으로 표현하며 사용자 시나리오보다 구체적으로 정의해야 한다.

 

장점
- 서비스의 주요 흐름을 빠르게 파악할 수 있다.
- 상대적으로 긴 스토리보드나 와이어프레임으로 확인하지 않아도 주요 흐름을 파악할 수 있어 개선 부분을 보완할 수 있다.
- 각 파트와의 커뮤니케이션 용이하다.

 

 

5. 화면 설계

참고 블로그 : IA 정보구조도 설계 첫번째, 두번째

 

IA(정보 구조도)

depth(서비스 단계에 따른 깊이), 업데이트 주기 등을 파악해서 요즘 서비스의 구조를 파악한다.

정보구조도는 서비스의 중요 기능을 사용하기 위해 사용자가 실행해야 하는 행위가 얼마나 발생하는지 등 전반적인 서비스 구조와 범위를 파악할 수 있는 기본 설계서가 되어준다.

 

- step 과 depth 구분 하기

step 은 단계이기 때문에 depth 구조에서 하위로 내려 가지 않는다.

브런치에서 작성된 AI 예시

1depth	2depth	3depth
주문하기	주문메뉴 확인
	배송지 정보 확인
		주소 검색
		할인 쿠폰
	결제
	주문 완료

 + 화면 본수 : 몇 개의 화면으로 서비스가 이루어졌는가?
"화면 본수가 어떻게 돼요?" 라는 질문에는 전체 화면수를 기준으로 답하면 된다.

 

- 스크린 타입(Type) 정의

각 화면들을 어떤 방식으로 제공할 것인가

1depth	2depth	3depth	Type
주문하기	주문메뉴 확인		page
	배송지 정보 확인		page
		주소 검색	popup
		할인 쿠폰	popup
	결제		page
	주문 완료		page

+ 앱 화면 그 자체에서 제공되는 화면 : 바닥 페이지, 바디(Body)리고 칭한다. IA 는 Page 로 칭한다.

Page	Popup	다이얼로그 Dialogs	바텀시트 Bottom sheet
서비스 화면 그 자체에서 제공되는 화면	현재 사용자가 위치한 페이지에서 새로운 화면을 보여준다.	작은 화면에 버튼을 제공하는 것들을 통칭	아래에서 올라오는 화면
	브라우저 팝업 - 브라우저 설정에 따라 열리지 않을 수 있다. 중요한 공지사항이나 정보 공지에는 적합하지 않다. 레이어 팝업 - 브라우저 설정에 영향을 받지 않는다. 로그인 유도, 사용자 선택이 필요한 경우 사용	Alert, Notification - 어떤 값을 입력하거나 선택시 중요한 내용을 알려줄 때 사용 Confirm Alert - 화면 상 A | B 를 선택해야할 때 사용	제공되는 버튼을 반드시 선택한 후에 서비스를 이용할 수 있거나 현재 위치한 서비스가 아닌 다른 서비스로 플로우를 이동해야 할때 사용한다.

 

와이어프레임 Wireframe

참고 블로그 : UX의 기본, 와이어프레임은 어떻게 작성하는 것 일까

웹사이트나 앱의 레이아웃과 구조를 설계하기 위한 초안 = 화면 설계서

즉, 분석과 벤치마킹을 통해 서비스의 목표와 방향성이 녹아져 있는 문서이기 때문에
-  UI를 어떻게 표현할지, 어떤 내용으로 구성할지 등을 그려놓은 화면 프로토타입이다.
- 웹ㆍ앱 화면의 페이지 구조 / 레이아웃 / 정보 구조 / 유저 플로우 / 스크롤, 스와이프 등에 대해 정의한다.

 

와이어프레임을 그릴때 필요한 요소

Why	Goal	What	Concept
왜 이 서비스를 제공해야 하는지	서비스를 제공할 때 목표	무엇을 통해 사용자와 커뮤니케이션 할지	목표에 맞는 컨셉

웹 사용자에 대한 이해, 파악 용으로 사용하기 때문에 웹의 구조와 언어로 표현해야 한다.

 

와이어 프레임에서 보여주어야 하는 기본적인 내용은 아래와 같다.

1.  화면에 어떤 정보가 나타나야 하는가?

2. 어떤 레이아웃을 가져야 하는가?

3. 어떤 세부 모습이 나타나야 하는가?

4. 어느 부분과 이어지며 어디로 이어져야 하는가?

5. 네비게이션은 적절히 기능하는가?