[사이드프로젝트]#01.기획_화면설계서

화면설계서 하나 그려놓고 멘붕이 왔다.
UX디자이너로서 사이드 프로젝트에 참여하게 되면서 기획 포지션의 공백과 애매한 롤로 인해 하여금 공부를 하게 되었다.
툭, 던져진 와이어 프레임과 워드형식의 개발디스크립션 앞에서 나도 그것에 대해 정확한 실체를 모르고
이제껏 고참 사수들이 해준 업무형식대로 따르고 편하게 일해왔음을 느꼈다.
기획이란 애매한 정의에 대해서 프로젝트 리더, 또 개발자들과 커뮤니 케이션 하는 과정에서
제대로 설명할 수 없었던 어렴풋한 지식을 조사하고 정리해 보았다.

모든것은 화면설계서에 기능명세서를 얼마나 포함시켜야 하는지에 대해 고민에서 시작되었나니...
결론. 답은 없는 것 같다.
프로젝트에 따라 화면설계서(와이어프레임)과 기능명세서를 통합한 문서로 정리하기도 하는 것 같다.
적은 것은 몇자 안되는데 방대한양의 개념을 머릿속에 다지느라 시간이 훌쩍 가버렸다.

Q. 기획은 어디서 출발할까?

여러가지 프로젝트 방식인 폭포수/애자일/린 에 따라서, 그리고 진행하는 사람에 따라서 작성되는 문서도 가지각색.

- waterfall 폭포수

서비스 정책서 - 요구사항정의서 - 정보구조도(IA) - 스토리보드(SB)

- agile 애자일

User story - 백로그


그리고 그뒤에.. 프로토타이핑을 만든 후
이슈협의 / 정책정의를 거치며 화면설계서는 버젼업되고, 구현후에는 테스트 - 산출물리뷰 등이 따라간다.

회사에서는 요구사항정의서와 IA가 준비된 상태에서 화면설계서, 스토리보드가 나왔다.
하지만 여긴 클라이언트가 없고, 우린 빠르게 만들어서 피드백을 받고 개선하고 싶기에 조금 다르게 가야할것 같다.

Q. 어떤 프로젝트에서나 회사에서는 기획도 세부적으로 나뉜다고 하던데, 구체적으로 어떻게 설명해야하나?

- 사업/전략 기획(비즈니스 모델) : 비즈니스 모델 구축 및 운용/수익구조
- 서비스 기획(프로덕트 매니징) : 서비스 구조/프로세스 구축/ 운영프로세스설계/ 성장전략/데이터분석
- 운영 서비스 기획(화면설계/정책/테스트) : 상세정책/ UX개선/
- 마케팅/사업운영 기획 : 그로스해킹/프로모션/홍보/운영개선

Q. 프로덕트 도메인이란?

도메인은 비즈니스 분야를 일컫는다.
ex) 이커머스, 핀테크, 헬스케어, 프롭테크, 홈서비스, 애드테크 등..

Q. 기획리서치 도중 보이는, Pivoting 피버팅이 뭔가?

피버팅이란 기존 사업 아이템을 포기하고 방향전환을 한것. 본래의 뜻은 어떤 점을 중심으로 도는 행동이다.
사업에 적용하자면 사업의 목표를 중심으로 전략을 바꾸는 것.

Q. 스토리보드와 화면설계서는 무엇이 다른가?

스토리보드와 화면설계서는 목적이 각각 존재하는 다른 문서이다.

- 화면설계서(wireframe)

화면을 설계하는 사람이 컨텐츠 또는 DB를 분석하여 설계한 결과물.
UX/UI 로 구성, 요구사항명세서 기준의 기능 가시화됨
사용자에 해당하는 ' 고객/관리자/공급자/수요자 '등을 모두 포함한 화면설계.

-스토리보드(storyboard)

요구사항정의서, 기능명세서, 화면설계서,UI설계서를 파악하고 복합적으로 고려되어 작성된 문서.

때론 한문서에 두가지를 담기도 하지만, 엄연히 다른 문서이다.

Q. 폭포수(워터폴)(Waterfall),애자일(Agile),린(Lean)을 짧게 정리하자면?

- 폭포수 : 요구사항 수집 및 분석- 설계 - 구현 - 테스트 - 통합 - 유지보수 / 단계적, 안정적,선형적
- 애자일 : 스프린트, 계획 - 설계 - 개발 - 테스팅 - 배포 - 피드백 / 순환
- 린 : BUILD - MESURE - LEAN / 빨리 실패 후 다시 순환

Q. 스크럼과 칸반은 무엇인가?

우선, 두개다 각각 애자일의 도구인 방법론이다.

- 스크럼

반복적이고 점진적인 개발방법론. 반복주기를 스프린트(Sprint)라고 일컫음. 1~4주로 구성.
제품 책임자(PO)/ 스크럼 마스터/ 개발팀 으로 구성됨.
제품 백로그(요구명세/우선순위정렬) - 스프린트백로그(요구사항 테스크화/테스트계획) - 스프린트 - 제품일부분 완성

- 칸반

적시개발을 지원하는 연속적 흐름 처리 개발방법론. workflow를 가시화하여 생산성 민첩성을 높임.
칸반보드로 간소화된 작업 흐름 관리 시스템.

Q. 사이드 프로젝트에는 어떤 기획이 적합할까?

정답은 없다. 하지만 짧은 시간안에 빠르게 제작해보려는 의도에 적합한것은 린+애자일 인것 같다.

Q. Product Designer 의 역할/업무영역은 어디까지 일까?

사용자 중심 제품 디자인에 관한 모든것 (?). 비즈니스 모델 검토/ UX리서치 및 디자인(페르소나,저니맵,유저테스트 등)

Q. 기능명세서에 들어갈 내용은?

- 입력필드(befor/typing/after)
- 버튼(disabled/able/click)
- Data로직(추천/최신/인기)
- 에러케이스(방어로직)
- 제한개수(데이터 입력/업로드 개수)
- 외부액션(시기/상황/메시지등 조건설계)

* 참고했던 글 list

- https://brunch.co.kr/@insuk/17

애자일과 린, 그리고 워터폴

- https://engineering-skcc.github.io/agile-quickguide/Agile-QuickGuide04-%EC%A0%9C%ED%92%88%EB%B0%B1%EB%A1%9C%EA%B7%B8%EB%8F%84%EC%B6%9C/

Agile 프로젝트 퀵가이드(4) : Starting편 -제품백로그 도출

- https://deep-wide-studio.tistory.com/96

서비스기획 전체 플로우와 기획산출물 뇌에 박제하기

- https://kys4620.tistory.com/entry/%EB%85%B8%EC%85%98-%EC%A7%81%EC%9E%A5%EC%9D%B8-%EC%8B%9C%EB%A6%AC%EC%A6%88-%EC%97%85%EB%AC%B4-%EA%B3%B5%EC%9C%A0-%EB%B3%B4%EB%93%9C-%EB%A7%8C%EB%93%A4%EA%B8%B0-2

노션 직장인 시리즈 - 업무 공유 보드 만들기 (2)

- https://mklab-co.medium.com/%EC%9E%91%EC%84%B1%EB%B2%95-%EC%9A%94%EA%B5%AC%EC%82%AC%ED%95%AD-%EB%AA%85%EC%84%B8%EC%84%9C-requirements-specification-ad3533d6d5b8

요구사항 명세서 (Requirements Specification)

https://mklab-co.medium.com/%EC%9E%91%EC%84%B1%EB%B2%95-%ED%99%94%EB%A9%B4%EC%84%A4%EA%B3%84%EC%84%9C-wireframe-%EC%99%80-%EA%B8%B0%EB%8A%A5%EB%AA%85%EC%84%B8%EC%84%9C-functional-specification-bbcff0071ea2

화면설계서 (Wireframe)와 기능명세서 (Functional Specification)

https://brunch.co.kr/@cysstory/151

프로덕트 매니저의 툴, UI 디자이너의 툴

https://brunch.co.kr/@cysstory/103

한 번쯤 들어봤던 화면설계 & 프로토타이핑 툴 총정리

https://medium.com/amhocode/%EC%95%B1-%EA%B0%9C%EB%B0%9C-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-%EC%84%9C%EB%B9%84%EC%8A%A4-%EA%B8%B0%ED%9A%8D-agile-%EC%95%A0%EC%9E%90%EC%9D%BC-%EB%B0%A9%EB%B2%95%EB%A1%A0-linkerbell-1-%EA%B8%B0%ED%9A%8D%ED%8E%B8-2-e0ff6d5326a3

앱 개발 프로젝트 서비스 기획,  Agile 애자일 방법론— Linkerbell №1 기획편 — 2

https://velog.io/@dooyou21/%EC%8A%A4%ED%94%84%EB%A6%B0%ED%8A%B8-%EC%8A%A4%ED%81%AC%EB%9F%BC-%EC%95%A0%EC%9E%90%EC%9D%BC

스프린트, 스크럼, 애자일

https://velog.io/@ednadev/%EC%86%8C%ED%94%84%ED%8A%B8%EC%9B%A8%EC%96%B4-%EA%B0%9C%EB%B0%9C-%EB%B0%A9%EB%B2%95%EB%A1%A0

개발자라면 꼭 알아야 하는 지식 #1 소프트웨어 개발 방법론

https://brunch.co.kr/@kimcookie/6

사이드 프로젝트로 앱 기획하기 (1)

https://junspapa-itdev.tistory.com/56

[프로젝트 수행 일기 ] 프로세스 작성 및 요구사항 정의서 작성

https://e-plan.tistory.com/36

화면설계, 스토리보드, UI기획(UI설계)...그리고 GUI

https://yslab.kr/74

[웹 기획] 화면 설계 용어 - 와이어프레임, 스토리보드, 프로토타입의 차이점

https://coffeedjimmy.github.io/guide/2018/07/07/function_specification/

기능 명세서 작성 가이드

https://brunch.co.kr/@chulhochoiucj0/20

모바일 UI 디자인 기본 요소 - 텍스트 필드

https://munsonghabnida.tistory.com/40

소프트웨어 공학 4주차

https://shlee1990.tistory.com/831

[자격증] 정보처리기사 실기 : 18강 애플리케이션 테스트 관리 (애플리케이션  테스트케이스 설계

https://deep-wide-studio.tistory.com/106

서비스 브랜드 컨셉 회의/ 와이어프레임 & 기능명세서 작성하기

https://gabi-uxui.medium.com/%EC%A0%95%EC%82%B0%EC%9D%98-%EC%8B%9C%EA%B0%84-app-%EA%B8%B0%ED%9A%8D%EB%B6%80%ED%84%B0-gui%EA%B9%8C%EC%A7%80-f296d11805ea

App 출시 A부터 Z까지 — 정산의 시간

https://www.clien.net/service/board/lecture/15250317

노션 - 만능 태그와 만능 태스크를 활용한 업무일지 만들기 : 클리앙

https://m.blog.naver.com/david7716/221981781243

노션 100% 사용법(테이블, 보드 편)