서비스기획 이야기

스토리보드, 작업 효율성 높이기

BasicPlan 2023. 12. 17. 00:32
728x90

1. 반복되는 화면 작업을 줄입니다.

기본 UI 레이아웃은 문서 초기에 별도 장표로 명시하여 UI를 모든 장표마다 볼 필요 없이 핵심 컨텐츠 레이아웃만 설계 하는게 좋습니다.

즉 UI 레이아웃은 기본 골격에 해당 하기에 UI LayOut을 만들어 전체 UI를 설계하고, 각 주요 상세화면에서 해당 LayOut의 주요컨텐츠 부분을 설계 하는게 좋습니다.  또 주소 찾기, 단말의 사진 선택하기, 날씨 연동 프로세스와 같이 서비스의 하위 팝업 또는 문서, 단순 기능등은한 개의 서비스 내에서 반복되어 사용되기에 공통 화면 섹션을 분리하여 한 번만 명시하면 좋습니다.

추가로 디스크립션은 최소화하고 모든 부분이 설계안에서 도식화 하여 보여주는게 제일 좋습니다. 하다못해 어드민의 경우 디스크립션 없이 메뉴얼 형태로 타이틀 하단에 기능 사용법을 텍스트로 디스크립션 대신 기재하여 볼수있도록 하고 "숨김"기능을 넣어두는게 더 낳은 설계라고 저는 생각합니다. 

 

 

 

2. 직접 만드는 것 대신 이미 제공되는 UI 소스를 활용합니다.

구글 혹은 네이버, Bing 검색 시, UI소스나 템플릿을 다운로드할 수 있는 서비스가 많습니다. 이미지 사이트에서 UI 세트를 유료 구매하여 사용하거나 Power mockup을 설치하, 엘럿창, 팝업창 등의 소스를 직접 만들지 않아 작업이 빠르고 편합니다. UI 화면뿐만 아니라, 플로차트 흐름도 kit도 쉽게 다운로드하여 활용하실 수 있습니다. 

플로우차트의 경우 요즘 너무 많은 브레인스톰, 화이트보드 툴들이 많아서 본인의 취향이나 가격에 맞추어 사용하시면 될것 같습니다. 

저는 피그마를 무료로 사용하기 제일 좋은 툴로 판단하고 있고, 그 다음으로 MIRO를 결제없이 잘 사용중입니다. 

 

 

※ 참고 링크

https://www.flaticon.com/free-icon/structure_1208803

 

Structure free icons designed by Freepik

Free vector icon. Download thousands of free icons of business in SVG, PSD, PNG, EPS format or as ICON FONT #flaticon #icon #order #diagram #structure

www.flaticon.com

https://creately.com/creately-for-windows/

 

Creately | Visual Collaboration & Diagramming Platform

A Visual collaboration and diagramming platform trusted by 10M+ users and 1000s of teams. Infinite whiteboards, powerful diagramming, data connectivity and integrates with your favorite tools.

creately.com

https://miro.com/ko/

 

Miro | 혁신을 위한 비주얼 워크스페이스

Miro는 팀이 프로젝트를 관리하고, 제품을 디자인하고, 미래를 함께 만들어가는 혁신을 위한 비주얼 워크스페이스입니다. 전 세계 6천만 명 이상의 사용자와 함께하세요.

miro.com

https://whimsical.com/

 

Whimsical - Where great ideas take shape

Whimsical combines whiteboards and docs in an all-in-one collaboration hub.

whimsical.com

https://www.figma.com/

 

Figma: The Collaborative Interface Design Tool

Figma is the leading collaborative design tool for building meaningful products. Seamlessly design, prototype, develop, and collect feedback in a single platform.

www.figma.com

https://www.powermockup.com/

 

PowerPoint Wireframe and Prototyping Tool | PowerMockup

Collaboration PowerPoint includes collaboration and sharing features that facilitate working in a team. You can share documents with others via OneDrive or SharePoint, leave comments on slides, and merge different versions of a document into a single file.

www.powermockup.com

 

 

 

3. 기획 작업 툴 선정에 심사숙고하여 선택합니다.

기획 작업 툴이 다양해진 만큼 선택지가 많아졌습니다. 기존에는 파워포인트로 UI 가이드라인, UI시나리오, 서비스 기획, 서비스 사용자 매뉴얼 작업등이 이루어졌고 엑셀로 화면 목록, IA(메뉴 구조도), 기능 정의서 작업이 이루어졌습니다. 기획자에 따라 UI 동작 가이드나 UI 플로우를 엑셀에서 작업하는 경우도 있습니다. 현재는 기획자가 피그마로 작업을 하거나 디자이너가 스케치에서 작업을 한 후, 기획 문서 없이 개발로 진행하는 경우도 있습니다.

 

한 프로젝트 내 팀원들이 각기 편한 작업 툴로 기획하는 경우, 프로젝트 관리 차원에서는 일관성이 떨어질 수 있습니다. 그래서 불필요한 작업을 필요로 할 수 있습니다. 중복 업무가 발생하지 않도록 프로젝트 시작 시, PM 및 PL과 적절한 커뮤니케이션을 통해 작업 툴을 명확히 한 다음 기획 업무를 시작합니다. 파워포인트는 기존 기획자, 개발자들에게 가장 익숙한 방법으로 보안 관리 측면에서도 좋은 평가를 받고 있습니다.

 

반면에 피그마는 공유와 접근성, 규격 그리기, 레이어 수정 측면에서 반복 작업을 줄게 하는 등의 이점이 있으나, 개발을 위한 디스크립션 작업 측면에서 효과적이지 않고 해당 툴 사용이 익숙하지 않은 기획자, 개발자들이 아직 많습니다.

 

따라서 MVP 프로젝트나 제안 성격의 기획안을 제안드릴 경우, 피그마로 기획을 권유합니다. 또한 기획 운영 측면에서 기존 서비스 문서가 파워포인트로 관리되고 있거나 팀원 대부분이 피그마 사용이 익숙하지 않은 상태에서 단기간 내 빠르게 기획 작업을 마쳐야 하는 경우 파워포인트로 작업을 추천합니다.

 

 

정리

  1. 스토리보드에 들어가는 목차에는, UI 화면 정의 외에도 Document history(작업 이력), Contents(목차), Overview(개요), 화면 ID, IA/Manu structure, UI Flowchart, 정책을 포함 합니다.
  2. 스토리보드의 작업 효율성 높이기 위해, 가능한 반복되는 화면 작업을 줄이도록 노력하고, UI 요소를 직접 만드는 것 대신에 기존에 제공되는 UI 소스를 활용 합니다.
  3. 마지막으로 프로젝트의 여러 상황을 고려하여 기획 작업 툴을 선정하고 작업을 시작합니다.

'서비스기획 이야기' 카테고리의 다른 글

기획 문서 작성과 프로젝트 관리  (2) 2023.12.25