본문 바로가기
CERTIFICATE/정보처리기사

[정보처리기사 실기] 2-1 UI 요구사항 확인

by 안녕나는현서 2021. 9. 14.
728x90

1. UI 요구사항 확인

- UI (User Interface)

  • 넓은 의미 : 사용자와 시스템 사이에서 의사소통할 수 있도록 고안된 물리적, 가상의 매개체
  • 좁은 의미 : 정보 기기나 소프트웨어 화면 등에서 사람이 접하게 되는 화면

 

- UX(User experience)

  • 제품과 시스템, 서비스 등을 사용자가 직간접적으로 경험하면서 느끼고 생각하는 총체적 경험

 

- UI 유형

  1. CLI (Command Line Interface, 정적인 텍스트 기반 인터페이스)
    : 명령어를 텍스트로 입력하여 조작하는 사용자 인터페이스
  2. GUI (Graphical User Interface, 그래픽 반응 기반 인터페이스)
    : 그래픽 환경을 기반으로 한 마우스나 전자펜을 이용하는 사용자 인터페이스
  3. NUI (Natural User Interface, 직관적 사용자 반응 기반 인터페이스)
    : 키보드나 마우스 없이 신체 부위를 이용하는 사용자 인터페이스 (터치, 음성 포함)
  4. OUI ( Organic User Interface, 유기적 상호작용 기반 인터페이스)
    : 현실에 존재하는 모든 사물이 입출력장치로 변화할 수 있는 사용자 인터페이스

 

- UI 설계 원칙

  1. 직관성
    • 누구나 쉽게 이해하고 쉽게 사용할 수 있어야 함
    • 쉬운 검색, 쉬운 사용성, 일관성
  2. 유효성
    • 정확하고 완벽하게 사용자의 목표가 달성될 수 있도록 제작
    • 쉬운 오류 처리 및 복구
  3. 학습성
    • 초보와 숙련자 모두가 쉽게 배우고 사용할 수 있게 제작
    • 쉽게 학습, 쉬운 접근, 쉽게 기억
  4. 유연성
    • 사용자의 인터렉션을 최대한 포용하고, 실수를 방지할 수 있도록 제작
    • 오류 예발, 실수 포용, 오류 감지

 

- UI 설계 지침

  1. 사용자 중심 : 사용자가 이해하기 쉽고 편하게 사용할 수 있는 환경 제공, 실사용자에 대한 이해 바탕이 되어야함
  2. 일관성 : 버튼, 조작 방법 등 사용자가 기억하기 쉽고 빠르게 습득할 수 있도록 설계
  3. 단순성 : 가장 간단하게 작동되도록 하여 인지적 부담 최소화
  4. 결과 예측 가능 : 기능만 보고도 결과 예측 가능해야 함
  5. 가시성 : 주요 기능을 메인 화면에 노출하여 쉬운 조작 가능하도록
  6. 표준화 : 디자인을 표준화하여 기능구조 선행학습 후 쉽게 사용 가능해야함
  7. 접근성 : 다양한 계층 수용
  8. 명확성 : 사용자가 개념적으로 쉽게 인지
  9. 오류 발생 해결 : 사용자가 오류에 대한 상황 정확히 인지할 수 있어야함

 

- UI 요구사항 확인

  1. 요구사항 구분
    • 기능적 요구사항 : 시스템의 기능, 서비스, 입출력, 데이터, 연산에 관한 요구사항
    • 비기능적 요구사항 : 품질에 관한 요구사항, 시스템 환경에 대한 요구사항, 계획에 관한 요구사항
  2. UI 품질 요구 사항 (ISO/IEC 9126 기반)
    • 기능성 : 실제 수행 결과와 품질 요구사항의 차이 분석
      • 적절성 : SW 제품이 주어진 작업과 사용자의 목표에 필요 적절한 기능들을 제공해줄 수 있는 SW의 능력
      • 정밀성 : SW 제품이 요구되는 정확도로 올바른 결과를 산출할 수 있는 능력
      • 상호 운용성, 보안성, 호환성
    • 신뢰성 : 시스템이 일정 시간 또는 작동되는 시간동안 의도하는 기능을 행함을 보증
      • 성숙성, 고장 허용성, 회복성
    • 사용성 : 사용자와 컴퓨터 사이에 발생하는 어떠한 행위를 정확하고 쉽게 인지
      • 이해성 : SW의 논리적인 개념과 적용 가능성을 구분하는데 필요한 사용자의 노력 정도에 따른 SW 특성
      • 학습성 : SW 애플리케이션 학습에 필요한 사용자의 노력 정도에 따른 특성
      • 운용성 : SW 운용과 운용 통제에 필요한 사용자의 노력 정도에 따른 특성
    • 효율성 : 할당된 시간에 한정된 자원으로 얼마나 빨리 처리할 수 있는가
      • 시간 효율성, 자원 효율성
    • 유지보수성 : 요구사항을 개선하고 확장하는데 얼마나 용이한한가
      • 분석성, 변경성, 인정성, 시험성
    • 이식성 : 다른 플랫폼(운영체제)에서도 많은 추가 작업 없이 얼마나 쉽게 적용 가능한가
      • 적용성 : 고려된 SW의 목적을 위해 제공된 수단이나 다른 조치 없이 특정 환경으로 전환되는 능력
      • 설치성, 대체성

 

2. UI 표준

  • 디자인 철학과 원칙 기반하에 전체 시스템에 공통으로 적용되는 화면 간 이동, 화면구성 등에 관한 규약
  • 전체적인 UX 원칙, 정책 및 철학, UI 스타일 가이드, UI 패턴 모델 정의, UI 표준 수립을 위한 조직 구성

 

 - UI 스타일 가이드 구성

  • UI의 통일과 일관적인 화면 구성을 위해 시스템이 지켜야할 UI 요소 정의와 화면 설계원칙 제시
  • UI 구동환경 정의 : 컴퓨터 OS, 웹 브라우저, 모니터 해상도, 프레임 세트 확인
  • 레이아웃 정의
    • 기본 배치 : 상단, 왼쪽, 콘텐츠
    • 하단 메뉴 구성(Footer Area) 상황에 맞게 추가/제외
  • 메뉴 네비게이션 정의 : 4가지 타입의 애플리케이션의 메뉴 구조에 따라 적당한 타입 선택하여 적용
  • 공통표준화면 정의 : 검색영역, Tab Menu 등 공통된 표준 화면 정의
  • 기능 정의 : 시스템 요구사항에 대한 개념 모델을 논리적 모델로 상세화하여 기능 정의
  • 구성요소 정의
    • 그리드 : 테이블 형태로 UI 구성
    • 버튼/컨트롤 타입
    • Page 요소 : 폰트 규정, 아이콘 요소, 말풍선 등 구성요소를 UI 요구사항에 맞게 배치
    • 팝업 요소 : 윈도 팝업, 레이어 팝업
    • Alert 요소 : 사용자가 적시에 필요한 사항을 인지할 수 있도록 안내

 

- UI 패턴 모델 정의

  • CRUD 방식 기반으로 데이터의 입출력을 처리하는 화면 흐름을 포함하여 오퍼레이션 방식에 대한 표준 절차를 표시하고, UI 패턴 모델을 개발
  • 패턴별 표준 개발방법
    • 업무 화면 클라이언트 정의
    • 서버 컨트롤러 정의
    • 서버 메시지 및 예외 처리 정의
    • 클라이언트 - 서버 간 데이터 변환 정의
    • 기업 포털 연계 정의
    • 보고서 정의
    • 외부 컴포넌트 연계 정의

 

3. UI 지침

  • UI 표준에 따라 사용자 인터페이스 설계, 개발 시 지켜야할 세부 사항 규정하는 가이드 라인

 

- UI 표준 적용을 위한 환경 분석

  • 사용자 트렌드 분석, 기능 및 설계 분석

 

- UI 개발 목표 및 범위

  • UI 개발 목표 및 범위 정의를 필수적으로 수행하여 프로젝트 계획 전반에 반영
  • 주요 기법
    1. 3C 분석 : 고객(Customer), 자사(Company), 경쟁사(Competitor) 비교분석하여 어떤 차별화로 경쟁에서 이길지 분석
    2. SWOT 분석 : 기업의 내부환경과 외부환경을 분석하여, Strength(강점), Weakness(약점), Opportunity(기회), Threat(위협) 요인을 규정하고 이를 토대로 경영 전략 수립
    3. 시나리오 플래닝 : 불확실성이 높은 상황 변화를 사전에 예측하여 다양한 시나리오를 설계하는 방법으로 불확실성을 제거해나가려는 경영 전략의 한 방법
    4. 사용성 테스트 : 사용자가 직접 제품을 사용하면서 미리 작성된 시나리오에 맞추어 과제를 수행한 후, 질문에 답하도록 하는 테스트
    5. 워크숍 : 소집단 정도 인원으로 특정 문제/과제에 대한 새로운 지식, 기술, 아이디어 등 서로 교환하고 검토

 

- 사용자 요구사항 도출

  • 페르소나 정의 - 콘셉트 모델 정의 - 사용자 요구사항 정의 - UI 컨셉션

 

4. 스토리보드 (Story Board)

  • UI 화면 설계를 위해서 정책이나 프로세스 및 콘텐츠의 구성, 와이어 프레임, 기능에 대한 정의, 데이터베이스 연동 등 구축하는 서비를 위한 대부분의 정보가 수록된 문서
  • 디자이너와 개발자가 최종적으로 참고하는 산출 문서
  • UI 화면 설계를 위해서는 와이어 프레임, 스토리보드, 프로토 타입 등이 활용됨
    • 와이어 프레임 (Wireframe) : 이해 관계자들과의 화면구성을 협의하거나 서비스의 간략한 흐름을 공유하기 위해 화면 단위의 레이아웃 설계하는 작업

 

- 스토리 보드 작성 절차

  • 전체 개요 작성 - 서비스 흐름 작성 - 스타일 확정 - 메뉴별 화면 설계도 작성 및 상세설명 - 추가 관련 정보 작성

 

- 스토리 보드 작성 시 유의사항

  • 일관된 기호의 표시
  • 공통 영역의 정의
  • 영역별 세부 설계
  • 버전 업 관리

 

5. UI 프로토타입 제작 및 검토

- 프로토 타입 (Prototype)

  • 컴퓨터 시스템이나 소프트웨어의 설계 또는 성능, 구현 가능성, 운용 가능성을 평가하거나 요구사항을 좀 더 잘 이해하고 결정하기 위하여 전체적인 기능을 간략한 형태로 구현한 시제품

 

728x90

댓글