본문 바로가기
정처기

정보처리기사 실기 정리 6. 화면 설계 (feat수제비2022)

by 롱2롱 2023. 4. 18.

①시즌 3호 정처기 실기 접수 이번엔 꼭 보자,, 

사실 보기 싫어서 어제(4/18) 환불하려고 했는데 환불기간 끝남 ㅠ 

그냥 보자 ... 

 

6. 화면 설계 

1) UI 요구사항 확인

1. UI의 개념

ui는 넓은 의미에서 사용자와 시스템 사이에서 의사소통할 수 있도록 고안된 물리적, 가상의 매개체

좁은 의미로는 정보 기기나 소프트웨어의 화면 등에서 사람이 접하게 되는 화면 

UX 안에 UI가 포함됨

 

2. UI의 유형 

- CLI (정적인 텍스트 기반) : 명령어를 텍스트로 입력하여 조작함

- GLI (그래픽 반응 기반) : 그래픽 환경을 기반으로 마우스나 전자펜을 이용하는거 

- NUL (직관적 사용자 반응 기반) : 키보드나 마우스 없이 신체 부위를 이용하는거 (터치 음성)

- OUL (유기적 상호 작용 기반) : 현실에 존재하는 모든 사물이 입출력 장치로 변화할 수 있는거 

CGNO

 

3. UI 설계 원칙

직관성 누구나 쉽게 이해하고, 쉽게 사용할 수 있어야 함
유효성 정확하고 완벽하게 사용자의 목표가 달성될 수 있도록 제작
학습성 초보와 숙련자 모두가 쉽게 배우고 사용할 수 있게 제작
유연성 사용자의 요구사항을 최대한 수용하고 실수를 방지할 수 있도록 제작 

UI는 사용자가 사용자 중심의 일관성이 있고 단순하고 결과 계층 가능하고 가시성 있고 표준화 되어 있고 접근성이 있고 명확하며 오류발생했을 때 사용자가 인지해야함 암튼 사용자가 사용하기 좋아야한다!

 

4. UI 요구사항 확인

- UI 품질 요구사항

① 기능성 : 실제 수행결과와 품질 요구사항과의 차이 분석

② 신뢰성 : 시스템이 일정한 시간 또는 작동되는 시간 동안 의도하는 기능을 수행함을 보증하는 품질 기준

③ 사용성 : 사용자-컴퓨터 사이에 발생하는 어떤 행위를 정확하고 쉽게 인지할 수 있는지 

④ 효율성 : 할당된 시간에 한정된 자원으로 얼마나 빨리 처리할 수 있는지 

⑤ 유지보수성 : 요구사항을 개선하고 확장하는데 있어 얼마나 용이한지 

⑥ 이식성 : 다른 플랫폼에서도 많은 추가 작업 없이 얼마나 쉽게 적용이 가능한지 

 

5. UI화면 설계 구분

와이어프레임  서비스의 간략한 흐름을 공유하기 위해 화면 단위의 레이아웃을 설계하는 작업 / UI, UX, Layout이 포함됨, 뼈대라고 생각 대충 스케치라고 생각
스토리보드 정책, 프로세스, 콘텐츠 구성, 와이어프레임, 기능정의, 데이터베이스 연동 등 서비스 구축을 위한 모든 정보가 담겨 있는 설계 산출물 / 최종적으로 참고하는 산출물
프로토타입 정적인 화면으로 설계된 와이어프레임 or 스토리 보드에 동적 효과를 적용 -> 실제 구현된 것처럼 시뮬레이션할 수 있는 모형 / 디비 연결되고 진짜 돌아가는거 ㄴㄴ 겉으로만 돌아가게 하는것 

2) UI 설계 

1. UI 설계를 위한 UML 

- UML의 특징

가시화 언어, 구축 언어, 명세화 언어, 문서화 언어 

구분 다이어그램 설명
구조적 다이어그램/ 정적 다이어그램 래스 객체 지향 모델링 / 클래스의 속성 및 연산 - 클래스 간의 정적 관계를 표현한 것
클래스에 속한 객체들(==인스턴스)를 특정 시점의 객체와 객체 사이의 관계로 표현한 것, 연관된 모든 인스턴스 표현
포넌트 시스템을 구성하는 물리적인 컴포넌트와 그들 사이의 의존 관계를 나타냄
컴포넌트 사이의 종속성 표현, 물리적 요소(결과물, 프로세스, 컴포넌트)들의 위치를 표현
합체 구조 클래스나 컴포넌트가 복합구조를 갖는 경우 그 내부 구조 표현
키지 유스케이스나 클래스 등의 모델 요소들을 구룹화한 패키지들의 관계 표현 
행위 다이어그램/ 동적 다이어그램 스케이스 시스템이 제공하는 기능 및 그와 관련된 외부요소를 사용자 관점에서 표현
퀀스 시간적 개념을 중심으로 메시지 흐름으로 표현
뮤니케이션 동작에 참여하는 객체들이 주고 받는 메시지 표현 객체관의 연관까지 표현함
하나의 객체의 상태변화 혹은 달느 객체와의 상호작용에 따라 상태가 어떻게 변하는지 표현
시스템이 어떤 기능을 수행하는지를 객체의 처리 로직이나 조건에 따른 처리의 흐름을 순서대로 표현
이밍 객체 상태 변화와 시간 제약을 명시적으로 표현

구조적/정적 다이어그램 - 클객 컴배 복패

행위적/동적 다이어그램 - 유시커 상활타  

 

- 클래스 다이어그램

클래스 다이어그램

네모 안의 선을 기준으로 위에서부터 클래스 이름, 속성, 연산(method)

속성이랑 연산 앞에 +,-는 접근 제어자 or 접근 제한자라고 말함

- 내부접근 허용 (private)
+ 외부 접근 허용(public)
# 동일 패키지 or 파생 클래스 접근 가능(protected)
~ 동일 패키지 접근 가능 (default)

- 클래스 간의 관계 

연관
Association
개념적으로 연결된 선 
의존
Dependency
하나의 클래스가 다른 클래스를 사용하는 관계
일반화
Generalization
하나의 사물이 다른 사물에 비해 더 일반적인것
EX) 차 <-- 택시, 버스 
실체화 
Realization
추상클래스나 인터페이스를 상속받아 자식 클래스가 추상 메서드를 구현할 때 
EX) 탈것(interface) <- (implement) --- train
포함
Composition
포함되는건데 집합보다 더 강한 관계
EX) 엔진 <색칠>피스톤, 플러그
집합
Aggregation
하나의 객체에 여러개의 독립적인 객체들
EX) 차 <> - 엔진, 바퀴, 운전대

 

 


참고자료
https://en.wikipedia.org/wiki/Class_diagram

 

댓글