본문 바로가기
앱기획 웹기획

화면 정의서는 어떤 기획 문서인가

by 애플_피시 2023. 2. 22.

같은 앱/웹 개발을 위한 문서이지만 화면 정의서는 기능 정의서와 다른 목적으로 작성됩니다. 주로 화면 정의서는 개별 화면 디자인과 UI 등 화면 개발을 위한 스토리보드를 목적으로 합니다. 기능 정의서가 백엔드와 프런트엔드에서 작동하는 기능 개발을 위한 스토리보드 목적과는 다릅니다.  

 

 

화면설계의 시작점

화면 설계에는 개별 화면이 어떻게 구성되어야 하는가도 필요하지만 각 화면이 어떻게 연결되는가도 중요합니다. 만약 기획자가 화면 구성만 작성한다면 디자이너와 구분이 모호해질 것입니다.

 

이점에서 기획자의 화면 설계에는 화면 구성 외에 각 화면의 연결의 설명은 중요한 부분입니다. 각 화면의 연결 구조는 메뉴/IA를 통해 확장되어 갑니다. 

 

화면의 연결 관계의 시작이 메뉴/IA라면 개별 화면 구성의 시작점은 무엇일까요?

 

보통 서비스 기획 시 정리된 앱/웹 디자인 가이드 및 서비스 구성안이 개별 화면 구성의 시작점이 되어야 합니다. 그러나 많은 경우 디자인 가이드나 서비스 구성안이 없는 경우도 많습니다. 이때는 요구사항 정리 때 나온 내용과 메뉴/IA, 제안요청서(RFP) 내용을 통해 각 개별 화면 구성을 정리할 수 있습니다.  

 

 

앱/웹 화면 구조

앱과 웹의 화면 구조는 정지 시점과 흐름 시점에서 정리됩니다. 이것이 위에서 말한 개별 화면 구성과 메뉴 구성이라 할 수 있습니다. 이 두 개 시점의 화면 구조를 하나의 문서로 정리한 것이 바로 화면 정의서입니다.

 

화면 정의서는 메인 페이지를 시작으로 하위 메뉴, 각 하위 메뉴의 하위 메뉴로 점점 화면을 확장해 나갑니다. 그래서 더 이상 확장될 수 없는 최종 화면까지 정리하게 됩니다.

 

이렇게 최종적으로 나온 앱 또는 웹의 모든 화면을 정리하고 이 화면 디자인 또는 기능, 구성,  UI에 대한 사항을 설명한 문서가 화면 정의서라 할 수 있습니다.

 

화면 정의서의 이런 문서적 특성으로 인해 앱/웹 화면 설계의 기준 기획 문서가 되는 것입니다. 

 

다양한 기능과 메뉴가 있는 앱/웹일수록 화면 정의서에서 나타내는 화면의 수는 많아집니다. 이런 복잡도로 인해 때로는 화면 정의서가 기능 개발에는 적절하지 않게 됩니다. 화면 정의서는 기본적으로 메인에서 최종 사용 화면으로 정리되지만 개발은 그 반대로 정리되어야 이해가 쉽기 때문이기도 하고, 화면 구조와 기능 구조는 다르기 때문이기도 합니다.  

 

 

앱/웹 화면 정리

이렇게 메뉴를 기준으로 정리된 앱/웹의 모든 화면은 화면 기준 스토리보드를 정리하는데 활용됩니다.

 

여기서 화면 기준 스토리보드는 기능 프로세스 기준 스토리보드와는 다르게 화면정의서에서 도출된 앱/웹의 모든 화면을 메뉴의 하위 depth 방향으로 디자인과 UI를 표시한 스토리보드를 의미합니다.

 

이러한 스토리보드는 화면 개발 또는 디자인에는 유용하지만 기능 개발에는 한계가 있을 수 있습니다. 앱/웹의 기능이 많고 복잡할수록 기능 개발 적합도가 낮아질 가능성이 커집니다. 그러나 반대로 디자인 작업을 하거나 UI 개발을 할 때는 더 유용해질 가능성이 커집니다.

 

화면 개발/디자인 중심 스토리보드나 기능 개발 중심 스토리보드와 UX(사용자 경험) 설계서와는 또 다른 문서입니다. 이 세 문서가 같은 화면 함께 공유할 수는 있지만 화면을 설명하고 프로세스를 표현하는 방식이 다릅니다. 이 세 문서는 목적이 다르기 때문입니다.

 

화면 정의서에서 도출되는 스토리보드는 말 그대로 앱/웹 화면 개발/디자인에 집중된 문서이므로 화면 밑 백엔드 작동이나 사용자 경험(UX) 형성 알고리즘에 대해서는 부족할 수밖에 없습니다.    

 

 

댓글