5. UI 설계

UI (userInterface) : 사용자가 직관적으로 무엇을 하면 어떻게 될지 예측할 수 있고, 쉽게 조작 할 수 있도록 도와주는 것, 사용자가 원하는 곳으로 찾아가게 하기 위해 일련의 정보를 제공하는 개념

 

UI형태 

-명령행 기반 

-메뉴기반 

-Graphic User Interface(그래픽 사용자 인터페이스)

 

WIMF : window, Icon, Menu, Pointer

 

창(window) :  화면에서 조작될 수 있는 창형태의 일정 부분의 시각적 디스플레이 

아이콘(Icon) :  조그마한 그림 형태의 시각 정보를 이용하여 표현하는 인터페이스이다. 

메뉴(Menu) : 화면상의 특정 위치에 수행 가능한 기능들을 제시하여 사용자로 하여금 어떠한 대안을 선택하는 과정과 특정 대안의 선택을 수월하게 해주는 인터페이스이다.

포인터(pointer) :  화면상에서 입력이 이루어 질 수 있는 지점을 명시해주는, 화면상의 커서를 의미한다. 

 

UX (User Experience) : 사용자가 어떤 시스템 , 제품 혹은 서비스를 직간접적으로 이용하면서 느끼고 생각하게 되는

총체적 경험이다. 기술을 단지 효용성 측면에서만 보는것이 아니라, 사용자의 삶의질을 향상시키는 방향으로 이해하려는 새로운 개념이다. 

단순히 기술을 효용성 측면에서 보는 것이 아니라, 사용자의 삶의 질을 향상시키는 방향으로 이해라겨는 새로운 개념

사용자 니즈의 충족, 브랜드 충성도향상에 기여한다. 

 

UX의 역역이 모호한 이유 

주관성 : 인간의 경험은 개인의 성격적, 인지적 특성에 따른 주관적인것

맥락성 : 경험이 일어나는 상황적 외적 환경에 영향을 받음  

총체성 : 경험 시점에 개인이 느끼는 총체적인 심리적 효과 

 

UI/ UX 구성요소 

-실용적요소

-쾌락적 요소

-아름다움에 대한 요소

-이로움에 대한 요소 

 

UI개발 프로세스 

사용자의 요구를 반영한 화면을 설계하는 것을 주요 활동으로 한다. 

검증 단게를 거치는 형태로 개발이 진행됨 

 

UI개발 프로세스 

탐색 - 정의 - 개발 - 산출 단계를 거치는 더블 다이아몬드 형태의 프로세스 패턴을 거친다. 

-탐색 : 조사, 분석, 발상과 관련한 활동들을 수행 

정의 : 탐색 단계에서 얻어진 결과들로부터 인사이트를 도출하는 단계 

-개발 : 발산 단계의 활동, 정의단계에서 얻어진 목표를 충족시키지 위한 발상들을 수집하고 프로토 타이핑, 시나리오작성, 정보 시각화 등의 활동을 함 

 -산출 : 수렴 단계의 활동으로, 설계 결과물에 대한 완성도를 높이기 위해 결과물을 평가가하는 활동들을 수행한다. 

 

라이프스타일 

: 특정 제품/서비스에 대해 유사한 경험과 반응을 갖게 될 가능성이 높다. 

 

AIO ( Activity, Interest , Option)분석 = 라이프스타일 분석 

- 소비자가 어떻게 시간을 보내고, 어떤일을 중시하며, 어떤 견해를 갖고 있는가를 척도로 나타내어 수치화하는것이다. 

*시장에 대해 풍부한 정보를 주는 반면 세분화의 경계가 모호하여 측정이 어렵다. 

행위, 관심, 의견 등이 있다. 

 

필드리서치는 사용자에 대한 실제 환경(필드)에서 사용자의 맥락을 함께 조사하는 필드리서치 수행을 통해 관찰되며, 이의 결과를 분석하여 파악한다. 

과제중심, 장소중심, 라이프스타일 중심 3가지 형태로 구분될 수 있다. 

장기간 포괄적인 관찰을 하는방법, 사용자에 대한 깊은 이해가 가능하게 하나,상대적으로 소수인 특정한 사용자 집단에 대한 오랜 시간을 투여하여야 한다는 제약이 있다. 

 

사용자의 니즈분석 

-사용자 요구사항 추상적 명세 

-시스템 요구사항 상세적 명세

-요구사항 추출

-설문조사 

-다이어리 스터디 

:사용자가 카메라나 비디오 등 자신의 일상, 행동, 주변환경을 스스로 촬영하거나 기록한 다이어리를 작성하게 하고 이를 회수해 분석하는 기법 

-포커스 그룹 인터뷰 

: 주제와 관련해 공통된 특성을 가지고 있는 구성원들로 구성된 소수의 그룹이 개방된 토의를 진행하고 그 결과자료를 분석하는 방법이다. 사회자의 능력에 의해 좌우될 수 있다는 단점이 있음 

 -AIO분석 

-시나리오분석 

-관찰법 

-과업분석 

: 실제 주어진 일을 어떻게 수행하는지를 관찰하는 방법이다. 

 

 

문제 1 /

감성공학(Hunan Sensibilty Ergonomics)에 대한 설명 

-인간공학.인지공학 등 인간 특성을 파악하려는 연구에 기본을 둔 생체 측정기술이다. 

-인간 특성에 적합하도록 사용자 인터페이스를 실현하기 위한 기술로서 센서 공학,퍼지 뉴럴네트워크 기술 신경망기술 등 인간의 오감센서 및 감성 처리 기술이다. 

-사용성 평가 기술 가상현실 기술 등으로 인간에 대한 적합성을 판단하고 새로운 감성을 창출하기 위한 기술

 

 문제 2 / 

GUI 방법 중 WIMP 관련 설명

window : 화면에서 조작될 수 있는 창형태 

icon : 조그마한 그림 형태의 시각정보를 이용하여 표현하는 인터페이스 

Menu: 화면상의 특정 위치에 수행 가능한 기능들을 제시하여 사용자로 하여금 어떠한 대안을 선택하는 과정과 특정 대안의 선택을 수월하게 해주는 인터페이스 

Pointer : 화면상에서 입력이 이루어질 수 있는 지점을 명시해주는 화면상 커서를 의미 

 

문제 3 / 

Lifestyle Analysis AIO 방법중 행위에 관한 설명 

일, 취미, 사회적 행사 , 쇼핑, 레저 등과 관련한 활동이다. 

관찰은 가능하지만, 행동에 대한 이유는 직접적 측정이 어렵다. 

 

문제4 /

더블다이아몬드 모델 4단계 개발에 대한 설명으로 옳은것 

발산 단계의 활동으로 정의 단계에서 얻어진 목표를 충족시키기 위한 발상들을 수집하고 프로토타이핑, 시나리오 작성, 정보 시각화 등의 활동을 수행

 

문제5/ 

Needs Analysis 기법중 설문조사 해당하는것 

: 조사의 효율성을 높이기 위해 모집단을 대표할 수 있는 표적모집단을 추출하여 조사의 정확성을 높이기 위하여 특정 조건에 부합되는 일부만을 표본으로 조사하는 표본조사 방법을 사용한다. 

 

문제6/

플랫디자인에 대한 설명 

-입체감 , 현실감을 주는 디자인이 아니라 평평한 느낌을 주는 단순화되고 심플한 디자인 

-입체효과 등 복잡한 요소는 배제 

-기본적인 요소들인 레이아웃, 대비 색상, 폰트 등을 중심으로 디자인하여 깔끔한 인터페이스를 제공 

-심플한 아이콘, 배제된 효과, 타이포그래피, 단순한 컬러, 미니멀리즘의 특성이 있음 

 

문제 7/ 

Needs Analysis 중 포커스 그룹인터뷰에 관한 설명 

대상자들의 상이한 지각과 관점을 찾기 위해 자유스럽게 토론할 수 있는 환경에서 반복적인 토의를 진행 

저비용으로 빠른 정보 입수 가능, 그룹내의 시너지 효과를 얻을 수 있음 

대상자 수가 적어 대표성이 떨어지고 , 토의를 진행하는 사회자 능력에 의해 좌우될 수 있다는 단점이 있음 

 

문제8/

웹사이트, 앱 등의 버튼을 뒤의 배경이 비쳐보이게 제공, 배경 이미지와 조화롭게 하는 UI/UX 시각적 디자인 요소와 관련된 최근 디자인 기법은? 

고스트 버튼 

*반응형 웹디자인 : 기기별 해상도 차이, 사용자의 브라우저 창 크기 조절 등에 자동으로 반응하여 최적화된 레이아웃으로 페이지를 보여주는 기법 

 

문제9/

AIO 중 의견에 대한 설명  

자극적인 상황에 대한 개인의 구두적 혹은 문자적 반응-응답을 의미한다. 

타인의 의도에 대한 신념, 미래사건의 예측, 보상이나 처벌의 평가와 같은 해석, 기대, 평가 등으로 기술한 것 

 

문제10/ 

관찰법에 해당하는 것 

사용자 설문, 사용자 고용, 모의실험 등의 방법들은 특정한 실험체계 내의 제한된 인위적 변수만을 고려하고 있다는 제약이 있다. 

[시나리오 분석법]

-미래에 나타날 수 있는 여러가지 모습들을 일관성, 논리성을 갖춘 상태에서 제시하는 것이다. 

-사용자들의 생활 형태와 예상되는 제품/서비스의 사용환경의 상황을 시나리오로 기술해 잠재된 니즈를 파악하는 미래예측기법이다. 

-선행연구가 많지 않거나 기초자료가 부족한 경우 사용된다. 

 

문제11/

트렌드 적용 기획서 작성순서 

UI/UX 콘셉트에 대한 재검토를 수행 

UI/UX 트랜드 및 적용사례 조사

UI/UX 콘셉트에 부합하는 트랜드를 선별 

트랜드 적용 결과 이미지를 작성 

트랜드 적용 기획서를 작성 

기획서 발표 및 토의를 진행 

 

문제12/

3C분석 

=자사(Corporation),고객(Customer), 경쟁사 (Competitor)

-경쟁사의 미래 행동 및 전략 예측

-고객의 핵심 구매 요인 파악 

동일한 고객을 대상으로 경쟁하고 있는 자사와 경쟁사를 비교, 분석함으로써 자사의 차별화와 경쟁 승리/우위 확보 전략을 찾아내는것

 

문제13/ 

SWOT 분석에 따른 전략 수립 설명 

SO전략 (강점-기회 전략) : 시장의 기회를 활용하기 위해 강점을 사용하는 전략을 선택 

ST전략 (강점-위협 전략) : 시장의 위협을 피하기 위해 강점을 사용하는 전략 

WO전략( 약점-기회 전략) : 약점을 극복함으로써 시장의 기회를 활용하는 전략을 선택 

WT전략( 약점-위협 전략) : 시장의 위협을 회피하고 약점을 최소화하는 전략 

 

문제 14/ 

4P 분석에 대한 설명 

효과적인 마케팅을 위한 상품(Product), 가격(price), 장소(Place), 홍보(Promotion) 를 의미하는 것은 ?

1960년대 제롬 메카시 교수가 제안한 제품 분석 방법은 무엇인가 ? 

 

문제 15/ 

스토리보드 작성 기법 단계 

메뉴 구성도 만들기(1단계) -> 스타일 확정 (2단계) -> 설계하기 ( 3단계)

 

문제16/

스토리 보드에 대한 설명 

디자이너와 개발자가 최종적으로 참고하는 산출 문서이며, 정책이나 프로세스 및 콘텐츠의 구성, 와이어프레임 기능에 대한 정의 , 데이터베이스의 연동 등 구축하는 서비스를 위한 대부분의 정보가 수록되어있는 문서이다. 

 

문제17/

UI Scenario 문서 작성 요건 

완전해야한다. 

최대한 빠짐없이 가능한 상세하게 기술한다. 

시스템 기능보다 사용자의 태스크에 초점을 맞춰 기술한다. 

 

문제18/

UI Scenario 문서 작성 요건 수정용이성(Modifiable)에 대한 설명 

쉽게 변경이 가능해야함

수정 또는 개선 사항을 시나리오에 반영해야함 

동일한 수정 사항을 위해 여러문서를 편지하지 않도록해야함 

*추적 용이성 

-쉽게 추적이 가능해야한다. 

-변경 사항들이 언제,어디서, 어떤부분들이, 왜 발생하였는지 추적이 쉬워야한다. 

 

문제19/ 

모법적인 UI시나리오 문서의 효과

불필요한 기능을 최소화 개발속도를 향상 

시나리오 작성과 소프트웨어 개발 비용이 절감됨

개발과정에서 재작업이 감소, 혼선이 최소화 

요구사항과 의사소통의 오류 감소 

 

문제20/

UI Scenario 가독성에 대한 설명 

표준화된 템플릿을 작성하여 적용한다. 

버전의 넘버링은 v1.0 v2.0등과 같이 일관성 있게 한다. 문서의 인덱스에 대한 규칙 적용, 목차 제공이 중요 

중의 간격은 충분하게 유지하며, 단락에 대한 구분과 들여쓰기의 기준을 마련하여 읽기 쉽고 편해야한다. 

여백과 빈페이지는 적절하게 활용하여 여백의 미를 살리도록 해야한다.