김재민 김재민

워크플로우 이해 • 사용자의 앱 인터페이스 작동 방법과 수행 순서를 고려하여 혼란을 일으키지 않는 워크플로우를 제작할 수 있다. 1. 워크플로우(workflow) 이해 1.1 UI 화면 설계 작성 순서 UI 화면 설계는 UI 디자인에 앞서, 먼저 사용자의 분석을 토대로 UI 시나리오 문서를 충 실히 작성하여야 한다. 또한 최종 사용자의 편의성을 높이도록 해야 하고 감성적인 목표 도 함께 고려해야 한다. UI 화면 설계를 위한 UI 시나리오 작성 단계는 다음과 같다. UI 화면 설계의 첫 번째 작업은 앞선 학습 1의 정보 구조 설계를 기획하는 단계이다. 두 번째 작업은 본 학습 2의 사용자가 앱 서비스를 바라보는 관점을 이해하는 단계이다. 사용자가 앱 인터페이스를 이용하는 방법과 태스크 흐름을 파악하여 사..

정보 설계 구성 • 수립된 UI/UX 전략을 바탕으로 스마트 문화 앱 UI 디자인 개발에 필요한 정보 구조를 설계할 수 있다. 1. 정보 설계 정보 설계의 목적은 사용자와 앱의 상호작용을 원활하게 하여 사용자가 원하는 정보를 쉽 고 빠르게 찾을 수 있도록 하는 데 있다. 사용자 요구 사항으로부터 도출된 콘텐츠와 기 능 구조를 바탕으로 하여 UI 구조와 내비게이션(navigation), 레이블링(labeling) 체계를 정 립하는 과정이다. 1976년 정보 설계(Information Architecture, IA)라는 개념을 처음으로 언 급한 리처드 사울 워먼(Richard Saul Worman)은 정보 설계의 목적을 “데이터를 사람들이 이해할 수 있는 정보로 바꾸는 것.”이라고 하였다. 1.1 정보 설계..

매체별 디자인 제작 및 표준화 • 사용자의 계층별 성향을 조사하여 서비스 디자인 요소 간의 관계성을 확립하고, 대상 서비스 디자인 요소를 설정할 수 있다 1. 조사 계획 설문 조사 계획 설문은 관심 있는 특정 주제에 관한 사람들의 행동, 태도를 이해하기 위해 조 사 초기 단계에서 사용하는 방법이다. 일반적인 시장 조사를 위한 설문과 달리 이 단계에 서 진행되는 조사 계획 설문은 짧고 간결하며 어렵지 않은 질문으로 구성된다. 이를 통해 주제를 더 빨리 파악하고, 흥미로운 사용자의 패턴을 알 수 있으며, 조사를 어디에 집중해 서 진행할지를 결정할 수 있다. 조사 계획 설문은 문화 인류학적 조사를 위해 참가자를 가려내고 선정하는 데 사용할 수 있다. 또 설문 조사에서 얻은 초기 결과가 애초에 팀에서 예상했던 ..

매체별 디자인 제작 및 표준화 • 다양한 매체의 특성에 따른 구성 요소를 디자인할 수 있다. • 매체의 다양성을 반영한 해상도, 파일포맷파일 포맷 환경을 고려하여 디자인 할 수 있다. • 매체의 특성을 이해하고 범용성·공용성을 지켜 다양한 디바이스(device)가 요구하 는 표준화를 적용할 수 있다. 1. 매체별 디자인 1.1 픽셀(pixel) 픽셀(pixel)은 picture element의 약자로, 디지털 이미지를 이루는 가장 작은 단위의 사각형 점을 의미한다. picture(그림)와 element(원소)를 합성한 단어이기 때문에, 우리나라에서는 ‘화소(畫素)’라 부르기도 한다. 1.2 해상도 해상도란 그래픽 화면을 표시하는 장치의 정밀도, 즉 화면을 구성하는 픽셀(pixel) 수를 의 미한다. 예를..

UX 구성 요소 적용 • 사용자 경험에 따른 반응, 시간, 데이터를 활용하여 시각적 변화를 예측할 수 있다. 1. UX(user experience, 사용자 경험) UX(user experience), 즉 사용자 경험이란 사용자가 제품이나 시스템을 이용하면서 얻게 되는 느낌이나 생각 등을 포함한 모든 측면에서의 총체적 경험을 의미한다. 여기서의 경 험은 단순히 지각적 경험만을 의미하는 것이 아니라, 지각 전반에 걸쳐 사용자가 참여하 고 사용하고 관찰하며 상호 교감을 통해 누적되는 가치 있는 경험을 의미한다. 사용자 경 험은 제품·시스템에 대한 사용자의 느낌과 생각에 관한 것이기 때문에 본질적으로 주관 적 특성을 지닌다. 사용자 경험의 목표는 사용자의 요구에 부합하는 제품·시스템을 제공 함으로써 사용자에게..

UI 구성 요소 제작 • 프로젝트 분석·설계에 따른 사용자 환경을 디자인하고 구조화할 수 있다. • 사용성을 고려하여 시각적 특성에 맞게 콘텐츠를 구성할 수 있다. 1. UI 제작의 원칙 인터페이스(Interface)란 두 개체가 만나는 접점에서 상호 간의 소통을 위하여 만들어진 매 개체, 즉 소통하는 통로를 의미한다. 특히 사용자와 디지털 기기·디지털 시스템이 상호작 용할 수 있도록 하는 물리적·가상적 매개체를 사용자 인터페이스(UI, User Interface)라고 하는데, 사용자가 디지털 기기·시스템을 조작할 수 있게 하는 ‘입력장치’와 사용자가 입력한 것의 결과를 표시하는 ‘출력장치’로 구성된다. 사용자 인터페이스를 제작하기 위해 고려해야 하는 원칙은 다음과 같다. 1.1 메타포(Metaphor)..

심미적 요소 표현 • 서비스, 제작물의 통합적인 아이덴티티를 고려하여 기획된 콘텐츠와 디자인 가이드 를 조합할 수 있다. • 전체적인 시각적 요소인 균형과 조화를 이용하여 심미적 요소가 가미된 조형성을 표현할 수 있다. • 동일 계열의 유사브랜드나 경향을 분석하여 전략적인 비주얼 콘셉트를 확보할 수 있다. 1. 시각 인터페이스의 심미적 요소 인간은 주변의 데이터나 언어 등의 정보를 시각적 요소로 변환하여 생각하는 특징을 지니 고 있다. 따라서 정보의 시각화를 통하여 정보를 효율적이고 직관적으로 이해할 수 있도 록 구성하는 것이 중요하다. 1.1 시각화 시각화(visualization)란 언어나 수치로만 된 정보를 마음속에서 그림이나 이미지 등의 형태 로 바꾸어 사고하는 과정을 뜻한다. 특히, 정보의 시각..

와이어 프레임 작성 • 인터페이스(interface) 필요 요소와 항목들을 분석하여 요소별 적용할수 있다. 1. 와이어 프레임의 개념 와이어 프레임(wire frame)이란 실제로 디자인을 진행하기 전에 화면에 표시될 구성, 정보 체계, 기능, 콘텐츠에 대한 전체적 레이아웃을 간단한 선(wire)으로 단순하게 표현한 스케 치를 의미하며, 색상, 타이포그래피, 이미지 등의 정보를 최소화하여 도식(schematic), 청사 진, 프로토타입(prototype) 형식으로 보여 줄 수 있다. 와이어 프레임은 그래픽 요소나 시 각적 요소의 표현보다는 계층 요소의 구현을 중심으로 표현해야 한다. 2. 와이어 프레임 작성 와이어 프레임을 작성할 때에는 웹 브라우저, 모바일 웹 등 다양한 매체의 화면 비율을 고려하여 작..