반응형

*UI 설계 도구

- 사용자의 요구사항에 맞게 UI의 화면 구조나 화면 배치 등을 설계할 때 사용하는 도구로, 종류에는 와이어프레임, 목업, 스토리보드, 프로토타입, 유스케이스 등이 있다.

- UI 설계 도구로 작성된 결과물은 사용자의 요구사항이 실제 구현되었을 때 화면은 어떻게 구성되는지, 어떤 방식으로 수행되는지 등을 기획단계에서 미리 보여주기 위한 용도로 사용된다.

 

*와이어프레임(WireFrame)

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

- 와이어프레임을 제작할 때 각 페이지의 영역 구분, 콘텐츠, 텍스트 배치 등을 화면 단위로 설계한다.

- 개발자나 디자이너 등이 레이아웃을 협의하거나 현재 진행 상태 등을 공유하기 위해 와이어프레임을 사용한다.

- 와이어프레임 툴에는 손그림, 파워포인트, 키노트, 스케치, 일러스트, 포토샵 등이 있다.

 

*목업

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

- 시각적으로만 구성 요소를 배치하는 것으로 실제 구현되지는 않는다.

- 목업 툴에는 파워 목업, 발사믹 목업 등이 있다.

 

*스토리보드(Story Board)

- 와이어프레임에 콘텐츠에 대한 설명, 페이지 간 이동 흐름 등을 추가한 문서이다.

- 디자이너와 개발자가 최종적으로 참고하는 작업 지침서로 정책, 프로세스, 콘텐츠 구성, 와이어프레임, 기능 정의 등 서비스 구축을 위한 모든 정보가 들어 있다.

- 상단이나 우측에는 제목, 작성자 등을 입력하고, 좌측에는 UIㅎ 화면, 우측에는 디스크립션을 기입한다.

- 디스크립션은 화면에 대한 설명, 전반적인 로직, 분기처리, 예외처리 등을 작성하는 부분으로 명확하고 세부적으로 작성해야 한다.

- 스토리보드 툴에는 파워포인트, 키노트, 스케치, Axure 등이 있다.

 

*프로토타입(Prototype)

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

- 사용성 테스트나 작업자 간 서비스 이해를 위해 작성하는 샘플이다.

- 작성 방법에 따라 페이퍼 프로토타입과 디지털 프로토타입으로 나뉜다.

- 프로토타입 툴에는 HTML/CSS, Axure, Flinto, 네이버 프로토나우, 카카오 오븐 등이 있다.

 

*유스케이스(Use Case)

- 사용자 측면에서의 요구사항으로 사용자가 원하는 목표를 달성하기 위해 수행할 내용을 기술한다.

- 사용자의 요구사항을 빠르게 파악함으로써 프로젝트의 초기에 시스템의 기능적인 요구를 결정하고 그 결과를 문서화할 수 있다.

- 자연어로 작성된 사용자의 요구사항을 구조적으로 표현한 것으로, 일반적으로 다이어그램 형식으로 묘사된다.

- 유스케이스 다이어그램이 완성되면 각각의 유스케이스에 대해 유스케이스 명세서를 작성한다.

반응형

'자격증 > 정보처리기사' 카테고리의 다른 글

품질 요구사항, ISO/IEC 9126  (0) 2020.05.05
UI 요구사항 확인  (0) 2020.05.04
웹의 3요소  (0) 2020.05.03
소프트웨어 아키텍처  (0) 2020.05.02
사용자 인터페이스(UI)  (0) 2020.05.02
반응형

*웹의 3요소

- 웹 사이트 개발 시 고려할 사항으로 웹 표준, 웹 접근성, 웹 호환성을 말한다.

- 웹 표준(Web Standards)이란 웹에서 사용되는 규칙 또는 기술을 의미하는 것으로, 웹 사이트 작성 시 이용하는 HTML, JavaScript 등에 대한 규정, 웹 페이지가 다른 기종이나 플랫폼에서도 구현되도록 제작하는 기법 등을 포함한다.

- 웹 접근성(Web Accessibility)이란 누구나, 어떠한 환경에서도 웹 사이트에서 제공하는 모든 정보를 접근하여 이용할 수 있도록 보장하는 것을 의미한다.

- 웹 호환성(Cross Browsing)이란 하드웨어나 소프트웨어 들이 다른 환경에서도 모든 이용자에게 동등한 서비스를 제공하는 것을 의미한다.

반응형

'자격증 > 정보처리기사' 카테고리의 다른 글

UI 요구사항 확인  (0) 2020.05.04
UI 설계 도구  (0) 2020.05.03
소프트웨어 아키텍처  (0) 2020.05.02
사용자 인터페이스(UI)  (0) 2020.05.02
UML (Unified Modeling Language)  (0) 2020.05.01
반응형

*소프트웨어 아키텍처

- 개발할 소프트웨어의 기본 틀을 만드는 것으로, 복잡한 소프트웨어 개발 과정을 체계적으로 접근하기 위한 밑그림이다.

- 개발하고자 하는 소프트웨어의 특성과 본질을 파악하고 다양한 시각에서 모형화 한다.

- 전체 시스템의 전반적인 구조를 설계한다.

- 소프트웨어 시스템의 구축 및 개선을 용이하도록 한다.

- 작업자들 간의 상호 이해, 타협 및 의사소통을 원활하게 하기 위해 사용된다.

 

반응형
반응형

*사용자 인터페이스(UI)

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

- 초기에 사용자 인터페이스는 단순히 사용자와 컴퓨터 간의 상호작용에만 국한, 점차 사용자가 수행할 작업을 구체화시키는 기능 위주로 변경, 최근에는 정보 내용을 전달하기 위한 표현 방법으로 변경되었다.

 

*사용자 인터페이스의 세가지 분야

- 정보 제공과 전달을 위한 물리적 제어에 관한 분야

- 콘텐츠의 상세 표현과 전체 구성에 관한 분야

- 모든 사용자가 편리하고 간편하게 사용하도록 하는 기능에 관한 분야

반응형

+ Recent posts