사용자 인터페이스 (UI, User Interface)
사용자 인터페이스는 사용자와 시스템 간의 상호작용이 원활하게 이루어지도록 도와주는 장치나 소프트웨어를 의미
- 초기의 사용자 인터페이스는 단순히 사용자와 컴퓨터 간의 상호작용에만 국한되었지만 점차 사용자가 수행할 작업을 구체화 시키는 기능 위주로 변경됨. 최근에는 정보 내용을 전달하기 위한 표현 방법으로 변경됨.
* 사용자 인터페이스의 세 가지 분야
- 정보 제공과 전달 및 물리적 제어
- 콘테츠의 상세적인 표현 및 전체적 구성
- 모든 사용자가 편리하고 간편하게 사용하도록 하는 기능
* 사용자 인터페이스의 특징
- 사용자의 만족도에 가장 큰 영향을 미치는 요소. 소프트웨어 영역 중 변경이 가장 많이 발생됨.
- 사용자의 편리성과 가독성을 높임으로써 작업시간을 단축시키고 업무에 대한 이해도를 높여줌.
- 최소한의 노력으로 원하는 결과를 얻을 수 있게 한다.
- 수행 결과의 오류를 줄임
- 사용자에게 작업 기능에 대해 구체적인 방법을 제시함
- 정보 제공자와 공급자 간의 매개 역할을 수행함
- 사용자 인터페이스를 설계하기 위해서는 소프트웨어 아키텍처를 반드시 숙지해야함
*사용자 인터페이스의 구분
- CLI(Command Line Interface) : 명령과 출력이 텍스트 형태로 이루어지는 인터페이스
- GUI(Graphical User Interface) : 아이콘이나 메뉴를 마우스로 선택하여 작업을 수행하는 그래픽 환경 인터페이스
- NUI(Natural User Interface): 사용자의 말이나 행동으로 기기를 조작하는 인터페이스
*사용자 인터페이스의 기본 원칙
- 직관성 : 누구나 쉽게 이해하고 사용할 수 있음
- 유효성 : 사용자의 목적을 정확하고 완벽하게 달성해야함
- 학습성 : 누구나 쉽게 배우고 익힐 수 있어야함
- 유연성 : 사용자의 요구사항을 최대한 수용하고 실수를 최소화해야함
*사용자 인터페이스의 기본 원칙
- 사용자 중심 : 사용자가 쉽게 이해하고 편리하게 사용할 수 있는 환경을 제공하며, 실사용자에 대한 이해가 바탕이 되어야함
- 일관성 : 버튼이나 조작 방법 등을 일관성 있게 제공하므로 사용자가 쉽게 기억하고 습득할 수 있게 설계해야함
- 단순성 : 조작방법을 단순화시켜 인지적 부담을 감소시켜야 함
- 결과 예측 가능 : 작동시킬 기능만 보고도 결과를 미리 예측할 수 있게 설계해야함
- 가시성 : 메인 화면에 주요 기능을 노출시켜 최대한 조작이 쉽도록 설계해야 한다.
- 표준화 : 기능 구조와 디자인을 표준화하여 한 번 학습한 이후에는 쉽게 사용할 수 있도록 설계해야함
- 접근성 : 사용자의 연령, 성별 , 인종 등 다양한 계층이 사용할 수 있도록 설계해야 한다.
- 명확성 : 사용자가 개념적으로 쉽게 인지할 수 있도록 설계해야 한다.
- 오류 발생 해결 : 오류가 발생하면 사용자가 쉽게 인지할 수 있도록 설계해야함.
UI 표준 및 지침
UI 표준과 지침을 토대로 기술의 중립성(웹 표준), 보편적 표현 보장성(웹 접근성), 기능의 호환성(웹 호환성)이 고려되었는 지 확인해야함
- UI 표준 : 전체 시스템에 포함된 모든 UI에 공통적으로 적용될 내용. 화면 구성, 화면 이동등
- UI 지침 : UI 요구사항, 구현 시 제약사항 등 UI 개발 과정에서 꼭 지켜야할 공통의 조건을 의미
*웹의 3요소 : 웹 표준(Web Standards) , 웹 접근성(Web Accessibility), 웹 호환성(Cross Browsing)
한국형 웹 콘텐츠 접근성 지침(KWCAG; Korean Web Content Accessibility Guidelines)
장애인과 비장애인이 동등하게 접근할 수 있는 웹콘텐츠의 제작 방법을 제시함
웹 콘텐츠 접근성(사용성) 지침 준수를 위한 고려 사항
* 내비게이션 : 사용자 중심으로 되어있으며, 사용자가 사이트에서 원하는 정보를 빠르게 찾을 수 있도록 안내하는 것.
전자정부 웹 표준 준수 지침
정부 기관의 홈페이지 구축 시 반영해야 할 최소한의 규약을 정의한 것. 모든 사람이 시스템 환경에 구애받지 않고 정부기관의 홈페이지를 이용할 수 있도록 하기 위한 것.
| 내용의 문법 준수 | -모든 웹 문서는 적절한 문서타입을 명시해야함 -명시한 문서타입에 맞는 문법을 준수해야함 -모든 페이지는 사용할 인코딩 방식을 표기해야 함 |
| 내용과 표현의 분리 | -논리적인 마크업 언어를 사용하여 웹 문서를 구조화해야 함 -사용된 스타일 언어는 표준적인 문법을 준수해야 함 |
| 동작의 기술 중립성 보장 | -스크립트의 비표준 문법을 확장하는 것은 배제해야 함 -스크립트의 비사용자를 위해 대체 텍스트나 정보를 제공해야 함 |
| 플러그인의 호환성 | 플러그인은 다양한 웹 브라우저에서 호환되는 것을 사용해야 함 |
| 콘텐츠의 보편적 표현 | -메뉴는 다양한 브라우저에서 접근할 수 있어야 함 -웹사이트를 다양한 인터페이스로 이용할 수 있어야 함 |
| 운영체제에 독립적인 콘텐츠 제공 |
제공되는 미디어는 운영체제에 종속적이지 않은 범용적인 포맷을 사용해야함 |
| 부가 기능의 호환성 확보 | 실명인증, 전자인증 등의 부가 기능은 다양한 브라우저에서 사용할 수 있어야함 |
| 다양한 프로그램 제공 | -정보를 열람하는 기능은 다양한 브라우저에서 사용할 수 있어야함 -별도의 다운로드가 필요한 프로그램은 윈도우, 리눅스, 맥킨토시 중 2개 이상의 운영체제를 지원해야함 |
UI 설계 도구
사용자의 요구사항에 맞게 UI의 화면 구조나 화면 배치 등을 설계할 때 사용하는 도구.
종류 : 와이어프레임, 목업, 스토리보드, 프로토타입, 유스케이스 등이 있음
*와이어프레임 (Wireframe)
: 기획 단계의 초기에 제작. 페이지에 대한 개략적인 레이아웃이나 UI 요소 등에 대한 뼈대를 설계하는 단계. 개발자나 디자이너 등이 레이아웃을 협의하거나
툴 : 손그림, 파워포인트, 키노트, 스케치, 일러스트, 포토샵 등
*목업(Mockup)
: 디자인, 사용 방법 설명, 평가 등을 위해 와이어프레임보다 좀 더 실제 화면과 유사하게 만든 정적인 형태의 모형.
시각적으로 구성요소를 배치하고, 실제로 구현되지는 않음.
*스토리보드(Story Board)
: 와이어프레임에 콘텐츠에 대한 설명, 페이지 간 이동 흐름 등을 추가한 문서.
디자이너와 개발자가 최종적으로 참고하는 작업 지침서. 정책, 프로세스, 콘테츠 구성, 와이어프레임, 기능 정의 등 서비스 구축을 위한 모든 정보가 들어있음.
툴 : 파워포인트, 키노트, 스케치, Axure 등
*프로토타입(Prototype)
: 와이어프레임이나 스토리보드 등에 인터랙션을 적용함으로써 실제 구현된 것처럼 테스트가 가능한 동적인 형태의 모형. 사용성 테스트나 작업자 간 서비스 이해를 위해 작성하는 샘플. 작성방법에 따라 페이퍼 프로토타입과 디지털 프로토타입으로 나뉨
툴: HTML/CSS, Axure, Flinto, 네이버 프로토나우, 카카오 오븐 등
*유스케이스 (Use Case)
: 사용자 측면에서의 요구사항으로, 사용자가 원하는 목표를 달성하기 위해 수행할 내용을 기술함.
- 사용자의 요구사항을 빠르게 파악하여, 프로젝트의 초기에 시스템의 기능적인 요구를 결정하고 그 결과를 문서화할 수 있음
- 사용자의 요구사항을 구조적으로 표현한 것으로, 일반적으로 다이어그램 형식으로 묘사.
- 유스케이스 다이어그램이 완성되면, 각각의 유스케이스에 대해 유스케이스 명세서를 작성한다.
UI 요구사항 확인
새로 개발할 시스템에 적용할 UI 관련 요구사항을 조사해서 작성하는 단계로, 다양한 경로를 통해 사용자의 요구사항을 조사하고 분석한 후 작성해야함.
1) 목표 정의
: 사용자들을 대상으로 인터뷰를 진행한 후 사용자들의 의견이 수렴된 비즈니스 요구사항을 정의한다.
- 인터뷰를 통해 사업적, 기술적인 요구사항을 명확히 이해해야함.
- 인터뷰 진행 시 유의사항
- 인터뷰는 가급적 개별적으로 진행
- 가능한 많은 사람을 인터뷰하여 다양한 의견을 수렴하고, 다수의 의견 말고 개인의 의견도 놓치지 말아야함
- 인터뷰는 한 시간을 넘지 않도록 함
- 인터뷰 진행은 반드시 사용자 리서치를 시작하기 전에 해야 함.
2) 활동 사항 정의
: 조사한 요구사항을 토대로 앞으로 해야할 활동 사항을 정의함.
- 사용자와 회사의 비전을 일치시키는 작업을 진행함.
- 리서치 규모, 디자인 목표 등을 결정할 수 있도록 각각에 필요한 예산과 일정을 결정함
- 사업 전력 및 목표, 프로세스의 책임자 선정, 회의 일정 및 계획 작성, 우선 순위의 선정, 개별적인 단위 업무를 구분함
3) UI 요구사항 작성
: UI 요구사항을 작성할 때는 여러 경로를 통해 수집된 사용자들의 요구사항을 검토하고 분석하여 UI 개발 목적에 맞게 작성해야함
- 반드시 실사용자 중심으로 작성되어야함
- 여러 사람의 인터뷰를 통해 다양한 의견을 수렴해서 작성해야함
- UI요구사항을 바탕으로 전체적인 구조를 파악 및 검토해야함
- 작성 순서 : 요구 사항 요소 확인 -> 정황 시나리오 작성 -> 요구사항 작성
* 요구사항 요소 확인
| 데이터 요구 | - 사용자가 요구하는 모델과 객체들의 주요 특성을 기반으로 하여 데이터 객체들을 정리함 - 인터페이스 구성에 영향을 미치므로 반드시 초기에 확인해야함 |
| 기능 요구 | -사용자의 목적 달성을 위해 무엇을 실행해야하는 지를 동사형으로 설명함 -기능 요구 리스트는 최대할 철저하게 정리해야 함 |
| 제품 / 서비스의 품질 | -데이터 및 기능 요구 외에 제품의 품질, 서비스, 감성적인 품질 등을 고려하여 작성함 |
| 제약 사항 | -제품 완료 데드라인, 전체 개발 및 제작에 필요한 비용, 시스템 준수에 필요한 규제가 포함됨. -사전에 제약 사항의 변경 가능 여부를 확인함 |
*정황 시나리오 작성
: 사용자의 요구사항을 도출하기 위해 작성하는 것. 목표를 달성하기 위해 수행하는 방법을 순차적으로 묘사함.
- 요구사항 정의에 사용되는 초기 시나리오
-사용자 관점에서 시나리오를 작성해야함
-사용자가 사용하는 기능 위주로 작성해야함, 함께 발생되는 기능들은 하나의 시나리오에 통합함.
- 육하원칙에 따라 간결하고 명확하게 작성해야함
-작성된 시나리오는 외부 전문가 또는 경험이 풍부한 사람에게 검토를 의뢰해야함
*요구사항 작성
: 정황 시나리오를 토대로 작성함
| 정황 시나리오 | 요구사항 |
| 수정이가 핸드폰을 켜서 음성 녹음을 했다. 음성 메시지는 텍스트로 변환되어서 메모장에 텍스로 저장되었다. | - 음성 녹음이 가능해야한다. - 음성 메시지는 텍스트로 변환되어야한다 -변환된 텍스트는 메모장에 저장되어야한다. |
'정보처리기사 > 정보처리기사 1과목' 카테고리의 다른 글
| 정보처리기사 2020 필기 정리 [1] 소프트웨어 설계 1장 요구 사항 확인(2) (0) | 2020.07.04 |
|---|---|
| 정보처리기사 2020 필기 정리 [1] 소프트웨어 설계 1장 요구 사항 확인(1) (0) | 2020.07.03 |