[UI기획]파일명,문서규칙, 수정이력 등 기본 체크

화면설계서를 작성할 때 파일명, 문서 규칙, 변경 이력, 그리고 디스크립션을 잘 관리하는 것은 문서의 일관성과 가독성을 높이며, 협업 시 원활한 의사소통을 도울 수 있습니다. 

 

1. 파일명 작성 방법

파일명은 문서를 쉽게 식별하고 관리할 수 있도록 일관된 규칙을 따르는 것이 중요합니다.

파일명 작성 규칙 예시:

• 프로젝트명_화면명_버전번호_작성일자
  • 예: Ecommerce_HomePage_V1.0_20230813.docx

파일명 작성 시 유의 사항:

• 프로젝트명: 해당 프로젝트를 식별할 수 있는 명칭을 사용합니다.
• 화면명: 설계하는 화면의 이름을 명확하게 기재합니다.
• 버전번호: 버전 관리를 위해 "V1.0", "V1.1" 등의 형식을 사용합니다. Major 버전은 큰 변화가 있을 때, Minor 버전은 작은 수정이 있을 때 증가시킵니다.
• 작성일자: YYYYMMDD 형식으로 작성하여 파일이 언제 작성되었는지 명확히 합니다.

2. 문서 규칙

문서 규칙은 설계서의 일관성 유지와 가독성을 높이기 위해 필요한 규칙들입니다.

문서 규칙 설정 예시:

• 헤더와 푸터: 모든 페이지에 프로젝트명, 문서 제목, 페이지 번호, 작성 일자 등을 포함합니다.
• 글꼴 및 서식: 제목, 본문, 주석에 사용할 글꼴과 크기를 일관되게 설정합니다.
  • 예: 제목은 Bold 14pt, 본문은 Regular 11pt.
• 목차(Table of Contents): 문서의 길이가 길 경우, 목차를 포함하여 섹션을 쉽게 찾을 수 있게 합니다.
• 용어 정의: 문서 내에서 사용하는 중요한 용어나 약어를 정의하여 혼동을 방지합니다.

3. 변경 이력 관리

변경 이력(Change Log)은 설계서가 업데이트될 때마다 어떤 변경이 이루어졌는지 기록하는 중요한 요소입니다.

변경 이력 작성 예시:

• 버전번호: V1.1
• 변경일자: 2023-08-13
• 변경사항: "로그인 화면 레이아웃 수정"
• 변경사유: "사용자 피드백 반영"
• 작성자: "홍길동"

변경 이력 관리 시 유의 사항:

• 모든 변경 사항을 상세히 기록하여 이력이 추적 가능하도록 합니다.
• 변경 사항의 이유와 영향 범위를 명확하게 기술합니다.
• 변경 이력은 문서의 시작 부분에 위치시켜 쉽게 접근할 수 있도록 합니다.

화면설계서 변경이력

4. 디스크립션 작성 방법

디스크립션(Description)은 각 화면에 대한 설명을 통해 이해를 돕는 요소입니다. 화면의 목적, 기능, 흐름을 명확하게 설명해야 합니다.

디스크립션 작성 예시:

• 화면명: "로그인 화면"
• 화면 목적: "사용자가 시스템에 접근하기 위해 로그인 정보를 입력하는 화면입니다."
• 주요 기능:
  • ID/비밀번호 입력: 사용자 계정 정보를 입력하는 필드입니다.
  • 로그인 버튼: 입력된 정보로 로그인을 시도합니다.
  • 비밀번호 찾기 링크: 비밀번호를 잊은 사용자를 위한 링크입니다.
• 화면 흐름: "사용자가 로그인 정보를 입력한 후, 로그인 버튼을 클릭하면 인증 절차를 거쳐 대시보드 화면으로 이동합니다."

디스크립션 작성 시 유의 사항:

• 명확성: 기능과 화면의 목적을 명확하게 설명합니다.
• 간결성: 불필요한 정보는 배제하고 핵심적인 내용만 포함합니다.
• 일관성: 모든 화면에 대해 동일한 형식으로 디스크립션을 작성하여 가독성을 높입니다.

Description > 변경이력

1. 문서 변경 부분의 칼라가 너무 진하면 내용이 보이지 않습니다.
2. 변경된 버전이 description내용을 가려서 내용을 보려면 불편합니다.

-> 변경된 버전이 내용을 가리지 않도록 하고 투명도를 주어 description내용을 가리지 않습니다.

화면설계서 디스크립션

---

• 버전 관리 시스템 사용: Git 등의 버전 관리 시스템을 사용하면 변경 이력을 자동으로 추적하고 관리할 수 있습니다.
• 리뷰 프로세스 도입: 문서 작성 후 팀원들로부터 피드백을 받아 수정하고, 최종 버전을 확정하는 리뷰 프로세스를 도입합니다.
• 공유 및 협업 도구 활용: Confluence, Google Docs와 같은 협업 도구를 활용해 문서 작업을 효율적으로 진행합니다.

이렇게 작성된 화면설계서는 일관성, 가독성, 관리 용이성을 높이며, 프로젝트의 성공적인 진행에 기여할 수 있습니다.

---

 

화면개요(Screen Overview)는 특정 화면의 주요 내용을 간결하게 설명하고, 그 목적과 기능을 명확히 전달하는 문서의 일부입니다. 화면개요는 화면 설계서나 UI/UX 문서에서 필수적으로 포함되는 요소로, 화면이 어떻게 작동하고 어떤 역할을 하는지에 대한 개요를 제공하는 역할을 합니다.

 

화면개요 작성 시 포함해야 할 주요 항목

1. 화면 이름(Screen Name)
   • 해당 화면의 이름을 명확하게 기재합니다. 예를 들어, "로그인 화면", "사용자 대시보드", "상품 상세 페이지" 등.
2. 화면 목적(Purpose of the Screen)
   • 화면이 존재하는 이유와 사용자가 이 화면에서 수행할 주요 작업을 설명합니다.
   • 예: "로그인 화면은 사용자가 시스템에 접근하기 위해 인증 정보를 입력하는 곳입니다."
3. 주요 기능(Key Features)
   • 화면에서 제공하는 주요 기능들을 간략하게 나열합니다.
   • 예: "ID/비밀번호 입력 필드, 로그인 버튼, 비밀번호 찾기 링크"
4. 화면 구성 요소(Components of the Screen)
   • 화면에 포함된 주요 구성 요소들을 설명합니다. 여기에는 버튼, 텍스트 필드, 드롭다운 메뉴, 이미지 등 다양한 UI 컴포넌트가 포함됩니다.
   • 예: "상단에는 로고가 위치하며, 중앙에는 사용자 인증을 위한 입력 필드와 버튼이 있습니다."
5. 화면 흐름(Screen Flow)
   • 사용자가 이 화면을 통해 어떤 흐름을 따라가는지 설명합니다. 주로 이전 화면에서의 전환, 이후 화면으로의 이동 등을 포함합니다.
   • 예: "사용자가 로그인 버튼을 클릭하면, 입력된 정보가 검증된 후 대시보드 화면으로 이동합니다."
6. 사용자 인터랙션(User Interaction)
   • 사용자가 이 화면에서 어떻게 상호작용하는지에 대한 설명입니다.
   • 예: "사용자는 ID와 비밀번호를 입력하고, '로그인' 버튼을 클릭하여 인증 절차를 시작합니다."
7. 디자인 고려사항(Design Considerations)
   • 해당 화면의 디자인 시 고려해야 할 특별한 사항이나 사용자 경험(UX)에 중요한 요소들을 포함합니다.
   • 예: "사용자 접근성을 위해 버튼 크기를 충분히 크게 설정하고, 컬러 대비를 높여 시인성을 개선했습니다."
8. 관련 화면 및 링크(Associated Screens and Links)
   • 이 화면과 직접적으로 연결된 다른 화면들을 언급하거나, 링크를 제공하여 사용자가 전체적인 흐름을 이해할 수 있도록 돕습니다.
   • 예: "비밀번호 찾기 화면으로의 링크가 제공됩니다."

---

 

기획은 검정색입니다.

"졸업 가운의 색이 검정인 이유는 검정이 성취와 권력의 색이기 때문입니다."

 

질문 환영합니다. 댓글 남겨주세요.
thinkhub