어드민설계를 위한 데이터기획-화면구조화-정책정의-플로우차트

어드민설계를 위한 데이터기획-화면구조화-정책정의-플로우차트

(그로스쿨에서 제공하는 도그냥(이미준)식 서비스기획 무작정 따라하기)

이 글은 최근 몇 년 간 내가 굉장히 많은 영감을 받고, 나 스스로 (온라인)멘토로 정한 도그냥 이미준님의 강의를 들으며 요약하거나 살짝 살을 붙인 노트이다.

해당 글을 공유하는 이유는 첫 째로, 나 스스로 기억하기 위함이며, 둘 째로는 혹여 기획 업무를 하는 도중 부딪힌 누군가가 검색을 통해 답을 갈구할 때 도움이 되었으면 하는 마음에서이다.

어드민 설계를 위해 꼭 필요한 ‘데이터’ 기획

어드민설계, 백오피스설계를 위한 '데이터'설계

입력(BO)-저장(DB)-출력(FO)

로직을 통해 특정 템플릿을 만드는 것(변수만 바뀌고 해당 템플릿에 변수값만 호출)

사용자 사이드에서 어떤 일이 벌어지느냐(입력/저장/조회)되느냐에 따라 어드민의 기능이 달라질 수 있으므로 양 사이드를 모두 고려한 설계가 필요함

—> 편의를 위해 그림에서는 단방향으로 표현하였지만, DB와 백오피스, 프론트오피스의 관계는 쌍방향이며, 프론트오피스의 입력 또한 백오피스에 출력되는 형식이 될 수 있다. 하지만 해당 개념을 설명하기 위해서는 입력-저장-출력의 관점으로 설명되었다. 

 

하드코딩: 변동성이 적음, 데이터/변수가 늘어나면 무조건 개발을 또 해야한다는 단점이 있음, 조건식으로 규칙으로만 일어나는 것(대표적인 예: HTML)

코드화: 확장 가능, 변수를 늘리면 알아서 바뀔 수 있음, 로직에 의해 노출되는 자동화 방식

—> 기획서를 만들기 전 해당 부분에 대해 개발자와 충분히 논의 후 구체화하여 진행해야한다. 기획자가 개발을 하는 것은 아니지만 개발자와의 소통을 통해 추후 확장 가능성을 염두해두고 프로젝트를 끌고 갈 수 있다.

 

UI를 그리기 전, 선행되어야 하는 화면 구조화

사용자 시나리오 및 프론트에 구현된 화면에 맞춰 데이터와 백오피스를 구현한다.

—> 서비스기획자는 파워포인트에 화면을 속된 말로 찍어내는 사람으로 착각하기도 한다. 하지만 그게 기획자의 롤의 전부는 아니다. 위와 같이 데이터 관점에서 구조화한 다음 이를 화면 또는 프로토타이핑 툴 등으로 구현하는 것이 좋다. 실제로 초반에 서비스를 구조화하는 과정에 굉장히 많은 시간이 소요되지만, 이 문서를 바탕으로 개발팀과 초도미팅을 진행하고 난 뒤 SB나 기획서를 작성하면 시간이 훨씬 단축되고, 수정하는 일이 현저히 줄어든다.

 

DB의 구조, 데이터가 저장되어 있는 스토리지 살짝 맛보기

가능한 저장 정보는 한 곳에 있는 것이 추후 확장성을 고려했을 때 좋다.

가입-결제-탈퇴 등..

사용자의 일부 정보가 세션 또는 쿠키 스토리지에 저장된 경우, DB의 내 대상 정보와 세션 내 정보를 맵핑하여 원하는 기능을 구현할 수 있음

(예: 로그인 세션 정보에 페이스북으로 로그인한 정보가 남아 있는지)

—> 트렌드에 맞춰 기술은 진화한다. 데이터가 저장되는 위치와 정보에 따라 구현할 수 있는 기능이 달라지므로 해당 부분에 대한 인지도 필요하다.

 

위 내용을 바탕으로 도그냥(이미준)님이 이름 붙인 ‘미준맵’을 그리며 기획서를 작성할 수 있다.

 

미준맵

1단계: 조사한 내용을 바탕으로 서비스의 목적, 목표, 사용자, 니즈, 데이터 및 구성요소, 정책 정리하기

2단계: 사용자를 중심으로 프로세스 나누기(사용자 PI의 고려)

1. 사용자를 구분하자
2. 데이터의 입력과 출력을 기준으로 선행되는 프로세스를 정리하자
3. 순서에 따라서 프로세스를 정리한다.
4. 각 사용자의 추가적인 니즈를 떠올리며 추가한다.

3단계: 각 나눠진 프로세스를 화면 기준으로 세우기

확장성을 고려하여 개발자가 데이터화할 수 있도록 아이디어를 주는 것이 중요!

3단계: IA 그리기

전통적인 IA의 모습, 오늘 날의 IA는 개발 범위 확인을 위해 사용된다.

※ 오늘 날 IA 작성 시 주의해야 할 사항

IA=페이지 수

오늘 날의 IA는 화면단위 구분이라고 할 수 있다.

모바일의 인피니티 스크롤은 페이지는 한 페이지이지만 스크롤 할 때마다 각기 다른 모듈을 불러오는 것이기 때문에 각각의 모듈에 대한 기획이 필요하다.

IA는 개발과 기획에 대한 개발 범주를 논의하고, 개발 공수를 산정하기 위한 문서라고 볼 수 있다.

 

정책 정의

천 번을 호출해도 똑같은 순서대로 나오도록 정리=로직 정의

예: ‘최신순으로 노출 되는 리스트’기획에서 ‘최신순’은 개발이 이해할 수 있는 정책을 알려줘야 함 —> 동일한 일자일 때 어떻게 표시할 것인지? 몇 개까지 보여줄 것인지 등—> 개발 스펙 요청 사항이 명확해야한다.

어드민(+어떻게 노출 할 것인지)이 먼저 정의 되어 있어야 프론트에 필요한 상태 값을 모두 추론할 수 있다. 예외 케이스를 가장 많이 확보할 수 있다.

 

설명할 수 있을 정도의 플로우 차트=시스템 구조를 설계하기 위한 플로우차트

로직가 케이스의 흐름을 정의한 플로우차트

유저플로우와 같이 사용자의 행동보다는

개발에서 중요한 플로우: 어떤 저장정보를 호출해서 페이지가 넘어갔는지가 중요

—> 행동이 아닌 로직과 데이터 관점의 플로우 차트 그리기

—> 전체 맥락을 파악할 수 있는, 한 눈에 들어오는 플로우차트(가장 중요한 분기 처리만 표시)

user flow 에 기반한 user story 작성하기

(reason/who) 매일 성과 측정을 하는 운영자가

(goal) 검색 필터 및 날짜 설정을 통해 데이터를 조회한다 (action) 바로 데이터를 확인하기 위해서

위 두 가지는 개발자의 리소스를 줄여주기 위한 방법이다.

 

이후 PRD를 작성하여 개발자와 커뮤니케이션을 진행한다. 이때 나온 여러가지 피드백 및 수정사항을 반영하여 비로소 화면설계서를 작성한다. 

 

해당 내용은 그로스쿨에서 판매 중인 '13년차 기획자 도그냥(이미준)식 '서비스기획'무작정 따라하기'이다. 

강의를 들으면서 제목 잘못 지었다는 생각이 들었다. 무작정 따라하기가 아니라 ‘정신 바짝 차리고’ 따라하기가 적합한 강의일 정도로 내용이 세세하고, 기존 서비스기획자의 관점과는 다른 부분이 있어 처음에는 낯설고 따라가기 어렵기도 하다. 

나는 해당 강의를 약 세 번 정도 반복해서 들었는데, 들을 수록 놓쳤던 부분이 채워지면서 더 이해가 잘 됐다. 본인을 테크니컬 기획자라고 칭하는 도그냥(이미준)님의 강의는 기존에 화면을 그리기만 하던 서비스 기획자들의 왜곡된 롤을 바로 잡아주는 강의다.

 

앞서 말한 것과 같이 이 강의가 저연차 서비스기획자에게는 어려울 수 있다. 그렇다면 먼저 이미준님의 서비스기획스쿨 책을 먼저 읽고 듣기를 추천한다. 

책: 서비스기획스쿨-이미준

현업 기획자 도그냥이 알려주는 서비스 기획 스쿨:사수 없이 시작하는 웹/앱 프로덕트 실전 입문

 

유료강의: 그로스쿨 13년차 기획자 도그냥(이미준)식 '서비스 기획' 무작정 따라하기

13년차 기획자 도그냥(이미준)식 '서비스 기획' 무작정 따라하기

 

아직은 이것이 버거운 입문자(취준생 또는 서비스기획 일년차)라면 내일배움카드를 이용하여 거의 무료로 수강할 수 있는 이미준님의 강의가 있으니 그것부터 보도록 하자. 

 

내일배움카드 무료 강의: 휴넷 미니CEO PO입문 by 이미준

휴넷 PO(프로덕트 오너) 입문 과정

 

이것도 다 무슨 말인지 모르겠고, 예제가 있었으면 좋겠고, 선생님이 필요하다? 그러면 이미준님의 개인 유튜브 채널의 역기획 사례라던지 인터뷰 등 다양한 컨텐츠를 보는 것을 추천한다. 

 

프로덕트와 서비스기획스쿨(이미준님 개인 유튜브)

도그냥TV - 프로덕트와 서비스기획스쿨