정보처리기사 실기 6일차 ( 화면 설계 )

오늘이 정보처리기사 실기 사전입력기간 이여서 원서접수를 결제와 장소만 빼고 진행중이네요.

한달여간 남은 시험 준비 잘해서 합격 했으면 좋겠습니다. 화이팅 

 

 

 

*정리는 2020시나공 문제집을 참고했습니다.*

 

사용자 인터페이스

사용자와 시스템 간의 상호작용이 원활하게 이뤄지도록 도와주는 장치나 소프트웨어를 의미합니다.

 

CLI( Command Line Interface )- 명령과 출력이 텍스트 형태로 이뤄지는 인터페이스

GUI( Graphical User Interface ) - 아이콘이나 메뉴를 마우스로 선택하여 작업을 수행하는 그래픽 환경의 인터페이스

NUI ( Natural User Interface ) - 사용자의 말이나 행동으로 기기를 조작하는 인터페이스

 

*사용자 인터페이스의 기본원칙*

 

직관성 - 누구나 쉽게 이해하고 사용할 수 있어야 한다.

유효성 - 사용자의 목적을 정확하고 완벽하게 달성해야 한다.

학습성 - 누구나 쉽게 배우고 익힐 수 있어야 한다.

유연성 - 사용자의 요구사항을 최대한 수용하고 실수를 최소화해야 한다.

 

 

*사용자 인터페이스의 설계 지침*

사용자 중심 , 일관성, 단순성 , 결과 예측 가능 , 가시성 , 표준화 ,접근성 , 명확성 , 오류 발생 해결

 

UI 설계 도구

와이어 프레임 ( Wireframe ) - 기획 단계의 초기에 제작하는 것으로, 페이지에 대한 개략적인 레이아웃이나 UI 요소 등에 대한 뼈대를 설계하는 단계이다.

 

목업 ( Mockup ) - 디자인, 사용 방법 설명, 평가 등을 위해 와이어프레임보다 좀 더 실제 화면과 유사하게 만든 정적인 형태의 모형이다.

 

스토리보드 ( Story Board) - 와이어 프레임에 콘텐츠에 대한 설명, 페이지 간 이동 흐름 등을 추가한 문서입니다.

 

프로토타입( Prototype ) - 와이어프레임이나 스토리 보드 등에 인터랙션을 적용함으로써 실제 구현된 것처럼 테스트가 가능한 동적인 모형이다.

 

유스케이스 ( Use Case ) - 사용자 측면에서의 요구사항으로, 사용자가 원하는 목표를 달성하기 위해 수행할 내용을 기술합니다.

 

 

UI 스타일 가이드 작성

UI 스타일 가이드는 개발자나 디자이너들이 UI를 작성할 때 기준이 되는 규칙들로 , 구동 환경 , 레이아웃, 네비게이션 등을 정의합니다. 

 

구동 환경 정의 - 컴퓨터 OS, 웹 브라우저, 모니터 해상도, 프레임 세트 등을 사용 환경에 적합하도록 규정하는 단계입니다.

 

레이아웃 정의 - 화면 구조를 정의하고 각 영역의 메뉴를 구성하는 단계입니다.

 

네비게이션 정의 - 네비게이션의 메뉴 타입을 선택하여 적용하는 단계입니다.

 

기능 정의 - 시스템에 적용할 업무 과정에서 일어나는 모든 활동이나 필요한 데이터 간의 관계 등을 논리적인 모델로 상세화 하는 단계

 

구성 요소 정의 - 화면에 표시할 그리드나 버튼 등으로 정의하는 단계입니다.

 

 

 

 

 

UI 요구사항 확인

*UI 요구사항 확인 순서*

 

목표 정의 - 사용자들을 대상으로 인터뷰를 진행한 후 사용자들의 의견이 수렴된 비즈니스 요구사항을 정의한다.

↓

활동 사항 정의 - 조수한 요구사항을 토대로 앞으로 해야 할 활동사항을 정의한다.

↓

UI 요구사항 작성 - 여러 경로를 통해 수집된 사용자들의 요구사항을 검토하고 분석하여 UI개발 목적에 맞게 작성합니다.

 

※ UI 요구사항 작성 순서 

요구사항 요소 확인 -> 정황 시나리오 작성 -> 요구사항 작성

 

 

UI 흐름 설계

업무의 진행 과정이나 수행 절차에 따른 흐름을 파악하여 화면과 폼을 설계하는 단계입니다.

 

*UI 흐름 설계 순서*

 

기능 작성 - 화면에 표현할 기능을 작성하는 단계

 

입력 요소 확인 - 화면에 표현되어야 할 기능을 확인한 후 화면에 입력할 요소를 확인하는 단계

 

유스케이스 설계 - UI 요구 사항을 기반으로 UI 유스케이스를 설계하는 단계 

 

기능 및 양식 확인 - 분석한 기능을 토대로 텍스트 ,콤보 , 라디오 ,체크 박스 등을 확인하고 규칙읠 정의합니다.

 

 

UI 상세 설계

 

실제 설계 및 구현을 위해 모든 화면에 대해 자세하게 설계를 진행하는 단계입니다.

 

*UI 흐름 설계 순서*

 

요구사항 확인 - UI 상세 설계를 위한 요구사항을 최종적으로 확인하는 단계입니다.

 

UI 설계서 표지 및 개정 이력 작성 - UI 설계서 표지는 다른 문서와 혼동되지 않도록 프로젝트명이나 시스템명을 포함시켜 작성합니다.

 

UI 구조 설계 - UI 요구사항과 UI 프로토타입에 기초하여 UI 구조를 설계하는 단계입니다.

 

메뉴 구조 설계 - 사이트 맵 구조를 통해 사용자 기반 메뉴 구조를 설계 하는 단계입니다.

 

화면 설계 - UI 프로토타입과 UI 프로세스를 참고하여 필요한 화면을 페이지별로 설계하는 단계입니다.