brunch

You can make anything
by writing

C.S.Lewis

by 기획자 Sep 25. 2023

서비스 기획자의 피그마 문서 폼 공유

화면설계서, 요구사항명세

피그마 초보자 분들이나 서비스기획 신입 분들에게
실직적으로 도움이 될만한 게 뭐가 있을까...?


생각을 해보니 쉽게 사용할 수 있는 문서 폼 만한 게 없을 거 같다는 생각이 들어서

제가 실무에 실제로 사용하고 있는 폼을 공유해 볼까 합니다.


(해당 폼은 현 회사에서 재직 중 제작한 것이 아니며,

제가 손수 제작하여 사용하고 있는 폼이기에 회사의 자산을 공유하는 것이 아님을 명시합니다.)






화면설계서

각 잡고 제대로 된 화면설계서를 작성할 때 사용하는 폼입니다.

명확하게 확인되어야 될 요소가 많다 보니 작성 항목도 많은 편입니다.


Screen ID : 화면의 아이디

Screen Title : 화면의 제목

Screen depth : 화면의 단계 (ex. 3)

Screen path : 화면 단계 상세 (ex. 메인 > 내 정보 > 환경설정)

Version : 화면의 버전

Date : 화면 최종 업데이트 일자

작성자 : 설계서 작성자 이름

Case : 한 화면에 다양한 case가 발생할 경우 사용

Function Description : action이나 field에 관련된 Description

Button Description : Button에 관련된 Description

Check Point : 중요 확인 사항과 설계서 업데이트 정보


기획을 하다 보면 신규 서비스 구축보다

기존 서비스 디벨롭을 진행하게 되는 경우가 많습니다.


그럴 때에는 설계서를 간소화하여 작성하기도 합니다.

폼 사용법은 간단합니다.

칸이 고정되어 있지 않고 autolayout으로 설정되어 있기 때문에

enter를 치실 경우 자동으로 칸이 조정됩니다.



간혹 옆 칸이 메인으로 잡혀있을 경우 자동 조정되지 않는 경우가 있는데 그럴 때에는

크기가 조정되어야 할 칸을 클릭하시고 우측 [frame]의 세로 값을 [fill]으로 수정해 주시면 됩니다.


칸을 추가하고 싶으시다면 복사할 칸을 선택하신 뒤

[ctrl + C] / [ctrl + V] 하시면 됩니다.


클래식 스토리보드의 경우 다른 폼과 달리 frame으로 작업되었기 때문에

Description이 길어져 칸이 부족할 경우 [ctrl] 키를 누른 상태로 frame크기를 조정해주셔야 합니다.




요구사항 명세

요구사항 명세 또한 autolayout 설정되어 있기 때문에 편하게 작성하실 수 있습니다.


요구사항 / 정책 : 작성한 Task

해당 페이지 : 해당 요구사항이 적용되는 Screen ID

Version : 화면의 버전

Date : 최종 업데이트 일자

작성자 : 설계서 작성자 이름

요구사항 : 항목 / 요구사항 / 상세 / 비고

정책 : 항목 / 정책 / 이슈 / 안내 텍스트 / 표기 형태

Check Point : 중요 확인 사항과 설계서 업데이트 정보




Status

어드민 기획자가 아니더라도 간혹 DB 설계까지 신경 써야 해서

상태 값을 기획자가 작성해야 할 때가 있습니다.


그럴 때 관련 화면 옆에 status 값을 작성합니다.


Task : 작성한 Task

Version : 화면의 버전

Date : 최종 업데이트 일자

작성자 : 설계서 작성자 이름

상태 : 분류 / 항목 / 상세 / status

Check Point : 중요 확인 사항과 설계서 업데이트 정보




피그마 설계서 확인 링크

바로가기


브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari