[TIL]정보처리기사 실기/화면설계-2025.10.23

 
화면 설계 단계의 목적과 절차를 이해하고, 사용자 요구를 반영한 UI 구조를 설계할 수 있도록 한다.
시험 문제에서 자주 출제되는 UI 설계 원칙, UI 프로토타입, 스토리보드 구성요소를 정확히 구분하는 것을 목표로 한다.

 

1. 화면 설계의 개념

화면 설계는 시스템 사용자가 직접 접하게 되는 인터페이스를 정의하는 단계이다.
요구사항 분석 결과를 기반으로 사용자 중심의 UI(User Interface) 구조를 설계하여 사용성과 효율성을 높인다.
프로그램의 기능과 데이터 흐름을 시각화하여 개발자와 디자이너 간의 공통된 이해를 형성하는 역할을 한다.

 

2. 화면 설계의 목적

• 사용자의 요구사항을 직관적으로 반영
• 시스템 기능과 화면 흐름의 일관성 확보
• 개발 전 사용자 검증을 통한 오류 최소화
• 사용자 경험(UX)을 고려한 효율적 조작 환경 제공

 

3. 화면 설계 절차

1. 요구사항 분석
   • 기능 요구와 비기능 요구를 검토하여 필요한 화면 구성 요소를 정의한다.
   • 사용자 시나리오와 업무 흐름을 함께 확인한다.
2. UI 구조 설계
   • 전체 메뉴 구조와 화면 간 이동 관계를 도식화한다.
   • 화면 간 관계를 표현하는 화면 네비게이션 구조도를 작성한다.
3. 화면 상세 설계
   • 각 화면에 필요한 입력, 출력 요소를 구체화한다.
   • 버튼, 텍스트 박스, 데이터 테이블 등 구성 요소의 배치를 설계한다.
4. 프로토타입 제작 및 검토
   • 설계 내용을 바탕으로 스토리보드 또는 와이어프레임을 제작한다.
   • 이해관계자 검토를 통해 수정사항을 반영한다.

 

4. UI 설계 원칙

직관성	누구나 쉽게 이해하고 사용할 수 있어야 한다.
유효성	사용자의 목적 달성에 필요한 기능이 명확히 제공되어야 한다.
학습성	사용자가 최소한의 학습으로 사용할 수 있어야 한다.
유연성	다양한 사용 환경에서도 동일한 품질로 작동해야 한다.

이 네 가지는 국가기술자격 실기에서 자주 출제되는 핵심 원칙이다.

 

5. 스토리보드 구성요소

화면 설계 산출물 중 가장 대표적인 문서가 스토리보드이다.
프로젝트 참여자 간의 시각적 공유를 위한 문서로 다음과 같은 항목을 포함한다.

• 화면 ID 및 이름
• 기능 설명
• 입출력 데이터 정의
• 화면 구성도
• 화면 간 이동 흐름
• 버튼, 입력 필드 등 주요 UI 요소

스토리보드는 UI 프로토타입 작성의 기준이 되며 개발자, 기획자, 디자이너가 공통으로 참조한다.

 

6. UI 설계 도구 예시

화면 설계 및 프로토타입 작성에 활용되는 대표적인 도구는 다음과 같다.

• 파워목업(PowerMockup)
• 발사믹(Balsamiq Mockups)
• 액슈어(Axure RP)
• 오븐(ovenapp.io)
• 카카오 오븐, 피그마(Figma)

시험에서는 도구 이름뿐 아니라 “프로토타입 도구의 역할” 을 묻는 문제 형태로 출제된다.

 

7. 화면 흐름 설계 (Navigation Flow)

화면 간 전환 관계를 나타내는 구조도이며 사용자의 작업 경로를 정의한다.

• 계층형 구조: 메뉴 기반 시스템에 적합
• 순차형 구조: 절차적 흐름이 필요한 서비스에 적합
• 네트워크형 구조: 상호 연결된 화면 간 자유로운 이동을 지원

 

8. 화면 설계 검증 항목

• 사용자의 요구사항이 화면에 반영되었는가
• 기능 흐름과 버튼 동작이 일관적인가
• 입력 데이터의 형식과 제약 조건이 명확한가
• 오류 처리와 피드백 메시지가 적절한가

이 검증 과정은 테스트 케이스 설계의 기반이 된다.

 

9. 학습 중 느낀 점

화면 설계는 단순히 UI 배치를 정하는 단계가 아니라 시스템의 사용자 경험을 결정짓는 중요한 과정이다.
데이터 흐름과 화면 흐름을 함께 고려해야 실무에서 오류가 줄어든다.
요구사항 분석 결과와 연결하여 화면 요소를 설계하는 연습이 필요하다고 느꼈다.
또한 스토리보드 작성 시 각 요소 간 연계성을 명확히 표현하는 것이 중요하다는 점을 확인했다.