1. 소프트웨어 설계
B. 화면 설계
① 사용자 인터페이스 :
인터페이스 : 각 사용자와 시스템 간의 매개체 기능을 하는 모든 것
📌 UI의 분야
- 구성
- 기능
- 제어
📌 UI 특징 (보통 긍정적)
- 사용자의 만족도에 가장 큰 영향을 미치는 요소
- 가독성 높임/ 작업시간 단축/ 이해도 상승
- 최소한의 노력으로 원하는 결과를 얻을 수 있게 함
- 수행결과의 오류 줄임/ 구체적인 방법 제시
- 정보 제공자와 공급자 간의 매개 역할
- 소프트웨어 아키텍쳐를 반드시 숙지해야 함
📌 UI 구분
- CLI : 키보드로 직접 명령어 입력
- GUI : 아이콘이나 메뉴를 선택할 수 있는 형태
- NUI : 음성, 뇌파 등 시스템 이용
📌 UI 기본 원칙
- 유연성
- 학습성
- 직관성
- 유효성
📌 UI의 설계 지침
- 명확성
- 접근성
- 표준화
- 가시성
- 결과예측
- 단순성
- 일관성
- 사용자 중심
- 오류 발생 해결
② UI표준 및 지침 :
- 표준 : 공통으로 적용되는 것
- 지침 : 꼭 지켜야 하는 것
📌 웹 표준
- 웹 접근성 : 누구나 동등하게 이용가능
- 크로스 브라우징 : 어느 환경에서도 이용가능
📌 접근성 지침
- 인식 (대체 - 인식을 하지 못하는 사람들을 위한 대체 방안)
- 운용 (포인팅 - 좀 더 쉽게 정보에 접근할 수 있도록 구성하는 것)
- 이해 (논리적)
- 견고함
👉 네비게이션 : 표준 지침을 적용하여 만들어진 요소 ex. 정부시스템
③ UI 설계 도구 :
📌 설계도
1. Wireframe : 화면단위로 대략적인 레이아웃을 구성하는 단계
2. Mockup : 실제화면과 유사한 형태로 만드는 단계, 껍데기, 기능 x
3. Story Board : 와이어프레임 + 콘텐츠 설명, 콘텐츠의 이동경로를 적정으로 나타냄, 매뉴얼(작업 지침서)
4. Prototype : 기존의 설계 + 상호작용, 인터렉션 적용, 동적인 형태, 데이터만 없을 뿐 최종 결과물과 가장 유사
5. Use Case : 사용자의 요구사항을 다이어그램 형식으로 표현 + 다이어그램에 대한 각각의 명세서(내용정리) 작성
④ UI 요구사항 확인 :
1. 목표 정의 : 개별로 인터뷰 진행을 통해 상업적/기술적 요구사항 이해 -> 리서치
2. 활동사항 정의 : 목표, 예산, 계획, 우선 순위 -> 협의
3. UI요구사항 작성 : 실사용자 중심으로 다양한 의견 수렴, 추후에 작성된 요구사항을 기반으로 소프트웨어 구조를 파악할 수 있도록 하는 것
👀 UI요구사항 요소 확인 : 데이터(가장 먼저), 기능(동사형으로 정리), 품질(감성), 제약 -> 정황 시나리오 작성 : 완성된 서비스를 이용하는 가상의 이야기를 육하원칙을 토대로 이야기 하듯이 작성 -> 요구사항 작성
⑤ 품질 요구사항 :
SW품질 = 요구사항 / 요구사항이 충족될수록 품질이 좋다고 생각함
- ISO/IEC 9126 : SW품질에 대한 국제 표준 지침
- 기능(적절한 기능이 정확하게+호환,보안) : 적절, 정확, 호환, 상호운용, 보안
- 신뢰(결함에도 문제없이) : 성숙, 회복, 고장허용(고장이 나도 일정 성능 유지)
- 사용(얼마나 쉽고 편리) : 이해, 학습, 운용, 친밀
- 효율(한정된 시간, 자원으로 많은 일처리) : 시간, 자원
- 유지보수(개선 및 확장) : 분석, 변경, 시험, 안정
- 이식(다른 환경에서 적응) : 설치, 적용, 공존, 대체
⑥ UI프로토타입 제작 및 검토 :
동적인 형태의 텍스트 모델
실제와 유사하게 제작하여 실사용자가 테스트할 수 있게 하여, 기능을 검증하고 수정보완할 수 있는 모델
👍장점 : 시각적 -> 이해, 오류발견이 쉬움
👎단점 : 인력, 시간 소요, 특정 부분이 생략될 가능성이 있음
1. 페이퍼 타입
👉 즉시, 간편, 저렴, 간단 -> 빠른 의사소통 가능
2. 디지털
👉 결과와 유사, 재수정 / 어려움, 전문기술과 시간 필요
📌 계획
목적 → 환경 → 핵심UI → 필요한 인원 할당 → 검증(테스트, 해결) → 가이드
📌 작성 : 최종적으로 확정하는 형태
범위확인(UI요소) → 목표확인 → 자원확인
📌 제작단계
요구사항 분석 → 요구사항 작성(프로토타입) → 테스트 및 피드백 → 수정 및 승인
👉 테스트의 주체는 사용자, 3,4번째 단계는 계속해서 반복
⑦ UI 설계서 작성 :
- 표지 : 프로젝트/시스템 명
- 개정이력 : 초안 이후 내용이 변경될 때마다 이력을 적음, 1.0을 시작으로 0.1씩 증가
- 요구사항 정의서 : 요구사항 + 각각 요구사항의 반영여부
- 시스템 구조 : 사용자의 UI요구사항이 전체 시스템에 어떻게 적용되는지
- 사이트 맵 : 시스템 구조를 바탕으로 콘텐츠를 메뉴별로 설계 + 상세내용 표로 작성
- 프로세스 정의서 : 사용자 입장에서 사용자가 요구한 사항들이 실제로 어떻게 진행되는지 작업 진행 순서위주로 정리한 것
- 화면설계 : UI화면별 표지(화면 구분)와 스토리보드로 구분해서 설계하는 과정
⑧ UI유용성평가, 상세설계, 감성공학 :
📌 유용성 평가 : 얼마나 유용한지, UI의 주 목적
👉 실제 모델과 사용자가 예상한 모델이 얼마나 차이나는지
- 실행차이(기능) : 쉽지 않거나 불필요한 기능, 중복되거나 불편한 기능(선형흐름)
- 결과차이(평가) : 즉각적이지 않은 피드백, 이해하기 어려운 결과, 파악하기 어려운 변화
📌 상세설계
앞서 작성했던 설계서를 바탕으로 기능, 구조, 인터렉션(상호작용), 예외처리 등의 내용이 담긴 시나리오 작성
👉 구체적 작성, 계층적/순서도 형태로 작성
👉 여러 일반 규칙을 정해놓은 후 세부사항 정의
📌 감성공학
- HCI : 편리하고 안전한 시스템 개발, 최적의 사용자 경험(UX)이 최종목표
- UX : 시스템 이용 중 얻게되는 모든 경험, 주관적, 심리적, 정황성, UI와 반대 개념
- 감성공학 : 시스템을 통해 얻게 될 모든 감성을 고려해서 심리적, 인간친화적 시스템 개발
참고한 영상 : 정보처리기사 필기
