UX가 무엇인지, UX를 디자인 한다는 건 어떤 일인지, 좋은 UX란 무엇인지에 대해 경험을 바탕으로 풀어본 이야기입니다.
Slideshare에 업로드 되어 있는 비슷한 주제의 자료들 대부분이, 화면을 꽉 채우는 이미지만 덕지덕지 붙어 있거나, 도대체 어떻게 전개되는 이야기인지도 알 수 없게 키워드만 툭툭 던지는 방식이라서 조금 답답하더라구요.
그래서 제맘대로 만들어 봤어요. ㅋ
(얼마를 상상하시든 그것보다 더) 짧은 기간동안 파바박 만든 자료라서.. 조금은 아쉬운 부분도 있지만, 이 자료가 어느 누군가에게는 도움이 되길 바라는 마음에서 올려봅니다.
* 구글의 Noto Sans Korean 폰트를 주로 썼는데, 슬라이드쉐어의 작은 뷰로 보기에는 가독성이 좋지 않아서 맑은 고딕으로 바꿨습니다.
구글의 '안드로이드 L',
새로운 디자인 'Material design' 에 대해서
스마트스터디 내에 공유한 내용입니다.
slideshare에 업로드하기 위해
동영상 자료는 제외되었습니다.
material design에 대한 자료 출처는 'http://www.google.com/design/spec/material-design/introduction.html' 임을 밝힙니다.
UX의 사전적 정의를 통한 UX의 의미와 UX 디자인에 대한 이야기, 그리고 프로세스에 대한 이야기를 정리해보았습니다. :)
(2014년년 7월, 내부 발표자료)
[Content]
USER EXPERIENCE
Definition (value)
UI & UX
Value & Context
UX Process
UCD
GDD
Lean UX
Agile UX
Summary
UX가 무엇인지, UX를 디자인 한다는 건 어떤 일인지, 좋은 UX란 무엇인지에 대해 경험을 바탕으로 풀어본 이야기입니다.
Slideshare에 업로드 되어 있는 비슷한 주제의 자료들 대부분이, 화면을 꽉 채우는 이미지만 덕지덕지 붙어 있거나, 도대체 어떻게 전개되는 이야기인지도 알 수 없게 키워드만 툭툭 던지는 방식이라서 조금 답답하더라구요.
그래서 제맘대로 만들어 봤어요. ㅋ
(얼마를 상상하시든 그것보다 더) 짧은 기간동안 파바박 만든 자료라서.. 조금은 아쉬운 부분도 있지만, 이 자료가 어느 누군가에게는 도움이 되길 바라는 마음에서 올려봅니다.
* 구글의 Noto Sans Korean 폰트를 주로 썼는데, 슬라이드쉐어의 작은 뷰로 보기에는 가독성이 좋지 않아서 맑은 고딕으로 바꿨습니다.
구글의 '안드로이드 L',
새로운 디자인 'Material design' 에 대해서
스마트스터디 내에 공유한 내용입니다.
slideshare에 업로드하기 위해
동영상 자료는 제외되었습니다.
material design에 대한 자료 출처는 'http://www.google.com/design/spec/material-design/introduction.html' 임을 밝힙니다.
UX의 사전적 정의를 통한 UX의 의미와 UX 디자인에 대한 이야기, 그리고 프로세스에 대한 이야기를 정리해보았습니다. :)
(2014년년 7월, 내부 발표자료)
[Content]
USER EXPERIENCE
Definition (value)
UI & UX
Value & Context
UX Process
UCD
GDD
Lean UX
Agile UX
Summary
UI/UX 디자인 방법을 활용, 소프트웨어 개발 과정에서 사용성을 검토하고 사용자 중심으로 개선할 수 있는 가이드가 발간되었습니다.
이 책은 2013년 산업통상자원부 시스템반도체 융합경쟁력 강화사업 중 UI/UX기술자산 제공 기반구축의 일환으로, 정보통신산업진흥원 소프트웨어공학센터와 한국디자인진흥원의 협업으로 제작되었습니다.
역량 있는 소프트웨어 기업의 UI/UX 디자인 활용과 디자인방법을 통한 사용자중심의 소프트웨어 개발 지원, 소프트웨어산업의 활성화를 위한 기반조성을 목적으로 가이드북 제작, 웹 가이드 게시, UI/UX디자인 컨설팅 등이 진행되었습니다.
이 책은 소프트웨어 기획·개발 전문가들이 개발이나 개선 과정에서 UX, UI 개발 방법을 적용해 보고, 사용자 관점에서 편리하게 설계되었는지 각 단계에서 확인할 수 있는 방법을 소개하고 있습니다. 소프트웨어 개발에 관한 UI/UX에 한정된 것으로서 부족하나마 국내 소프트웨어기업들이 보다 다양한 디자인 방법의 활용을 통해 사용자 중심으로 개발하는데 쓰임이 될 수 있기를 바랍니다.
감사합니다.
*소프트웨어 자산뱅크(http://swbank.kr) 및 디자인포털 디자인디비(www.designdb.com) 에서 무료로 파일을 다운받을 수 있습니다.
소프트웨어 공학센터의 품질기준에 근거한 최소한의 UI/UX/GUI/UT 지식을 이해할 수 있습니다.
소프트웨어 개발 또는 개선 시에 단계별로 간단히 사용성을 테스트해 볼 수 있는 방법을 알 수 있습니다.
◇ 목차
Part I 소프트웨어 개발 UI/UX 참조모델 소개
1. UI & UX ?
2. 소프트웨어 개발 UI/UX 참조모델 제작배경
3. 소프트웨어 개발 UI/UX 참조모델 & 가이드 소개
Part II 소프트웨어 개발 UI/UX 참조모델 가이드
1. 목표정의
2. 프로젝트 계획
3. 요구사항 정의
4. 설계 및 구현
5. 테스트
6. 배포 및 관리
Appendix
용어 소개
Reference
방법론
참고서식
◇ 기획
미래창조과학부
정보통신산업진흥원 부설 SW공학센터
한국디자인진흥원
◇ 발행처
정보통신산업진흥원 부설 SW공학센터
한국디자인진흥원
◇ 발행연월
2013.12
◇ 참고링크 : SW자산뱅크 UI/UX 체험하기 바로가기 http://swbank.kr
◇ 문의처 : 한국디자인진흥원 서비스디지털융합팀 031)780-2263
비주얼로 풀어보는 사용자경험 디자인 요약본 입니다.
2014년 8월 16일 공간더하기에서 진행한 사용자 경험 강의 내용 일부 입니다.
전체 자료는 170페이지 정도 되나 여기에선 간단하게 어떤 내용인지 알 수 있도록 요약본으로 정리했습니다.
본 요약본은 비주얼 기반으로 이해하기 쉽게 구성되어 있어 사용자 경험을 누구보다도 쉽게 받아 들이고 이해하실 수 있습니다.
디자이너 마케터 기획자 스타트업 종사자들 분께 많은 도움이 되시리라 봅니다.
궁금하신 분은 ultra0034@gmail.com / 010-9190-7792 로 연락주시면 좋겠습니다.
UI/UX 디자인 방법을 활용, 소프트웨어 개발 과정에서 사용성을 검토하고 사용자 중심으로 개선할 수 있는 가이드가 발간되었습니다.
이 책은 2013년 산업통상자원부 시스템반도체 융합경쟁력 강화사업 중 UI/UX기술자산 제공 기반구축의 일환으로, 정보통신산업진흥원 소프트웨어공학센터와 한국디자인진흥원의 협업으로 제작되었습니다.
역량 있는 소프트웨어 기업의 UI/UX 디자인 활용과 디자인방법을 통한 사용자중심의 소프트웨어 개발 지원, 소프트웨어산업의 활성화를 위한 기반조성을 목적으로 가이드북 제작, 웹 가이드 게시, UI/UX디자인 컨설팅 등이 진행되었습니다.
이 책은 소프트웨어 기획·개발 전문가들이 개발이나 개선 과정에서 UX, UI 개발 방법을 적용해 보고, 사용자 관점에서 편리하게 설계되었는지 각 단계에서 확인할 수 있는 방법을 소개하고 있습니다. 소프트웨어 개발에 관한 UI/UX에 한정된 것으로서 부족하나마 국내 소프트웨어기업들이 보다 다양한 디자인 방법의 활용을 통해 사용자 중심으로 개발하는데 쓰임이 될 수 있기를 바랍니다.
감사합니다.
*소프트웨어 자산뱅크(http://swbank.kr) 및 디자인포털 디자인디비(www.designdb.com) 에서 무료로 파일을 다운받을 수 있습니다.
소프트웨어 공학센터의 품질기준에 근거한 최소한의 UI/UX/GUI/UT 지식을 이해할 수 있습니다.
소프트웨어 개발 또는 개선 시에 단계별로 간단히 사용성을 테스트해 볼 수 있는 방법을 알 수 있습니다.
◇ 목차
Part I 소프트웨어 개발 UI/UX 참조모델 소개
1. UI & UX ?
2. 소프트웨어 개발 UI/UX 참조모델 제작배경
3. 소프트웨어 개발 UI/UX 참조모델 & 가이드 소개
Part II 소프트웨어 개발 UI/UX 참조모델 가이드
1. 목표정의
2. 프로젝트 계획
3. 요구사항 정의
4. 설계 및 구현
5. 테스트
6. 배포 및 관리
Appendix
용어 소개
Reference
방법론
참고서식
◇ 기획
미래창조과학부
정보통신산업진흥원 부설 SW공학센터
한국디자인진흥원
◇ 발행처
정보통신산업진흥원 부설 SW공학센터
한국디자인진흥원
◇ 발행연월
2013.12
◇ 참고링크 : SW자산뱅크 UI/UX 체험하기 바로가기 http://swbank.kr
◇ 문의처 : 한국디자인진흥원 서비스디지털융합팀 031)780-2263
비주얼로 풀어보는 사용자경험 디자인 요약본 입니다.
2014년 8월 16일 공간더하기에서 진행한 사용자 경험 강의 내용 일부 입니다.
전체 자료는 170페이지 정도 되나 여기에선 간단하게 어떤 내용인지 알 수 있도록 요약본으로 정리했습니다.
본 요약본은 비주얼 기반으로 이해하기 쉽게 구성되어 있어 사용자 경험을 누구보다도 쉽게 받아 들이고 이해하실 수 있습니다.
디자이너 마케터 기획자 스타트업 종사자들 분께 많은 도움이 되시리라 봅니다.
궁금하신 분은 ultra0034@gmail.com / 010-9190-7792 로 연락주시면 좋겠습니다.
<p><font>데브멘토와 국내 대표 커뮤니티인 훈스닷넷과 함께 한 재미있는 커뮤니티 세미나</font></p><div><font>이근화/훈스닷넷</font></div><div><font>우리를 끊임 없이 괴롭히면서 화두를 던지고 있는 UX/UI를 이야기로 풀어봅니다. </font></div><div><font>Advanced Rich Experience</font></div><div><font>스마트폰 전성시대인 요즘 아이폰, 안드로이드가 아닌 닷넷과 실버라이트를 이용한 증강현실 및 3D 등 모바일 UX 구현 사례 및 동향에 대한 강연입니다.</font></div>
이야기를 시작하기에 앞서
지난 4월에 올린 "모든 기획자와 디자이너가 알아야 할 사람에 대한 100가지 진실"은
사실 1부와 2부가 나누어 계획한 연재물이었음을 고백합니다.
너무 많은 정보를 보여주게 되면
결국 사람들이 기억하는 건, 자신이 인상적으로 느꼈던 서너가지뿐이라고 배웠기 때문에
이를 적용하여 이전에 100가지의 반절인 50가지,
이번엔 그 나머지 50가지 중에서 여러분도 같이 기억하면 좋을 부분들을 정리해보았습니다.
이중에 서너가지만 기억하고 업무에 적용해도 좀 더 사용자에게 가까이 갈 수 있을 거 같습니다!
UX 프로젝트를 시작하는 분들을 위해 UX 디자인과 프로젝트방법론에 대한 A부터 Z까지를 간결한 질문들을 중심으로 모두 정리했습니다. (PDF 다운로드 가능)
1. UX 디자인이란?
• UX 디자인은 한 마디로 무엇인가?
• UX 디자인에서 하는 일은?
• UX 디자인이 왜 필요한가?
• UX 디자인의 핵심은?
• UXer들이 알고자 하는 사용자 경험이란 무엇인가?
• UX 디자이너들은 누구인가?
2. UX프로젝트란?
• UX 프로젝트는 무엇이 다른가?
• 왜 UX 프로젝트를 해야 하는가?
• 우리 분야에 대한 경험이 부족한 UXer에게 프로젝트를 맡겨도 되는가?
• UX 프로젝트를 했다가 실패한 경험이 있다. 무엇이 잘못된 건가?
• UX 프로젝트의 일반적인 일정
• UX 프로젝트 계획 시 염두에 두어야 할 5가지
• 컨설팅 업체가 UX 프로젝트를 진행할 때 우리의 역할은 무엇인가?
• 컨설팅 업체가 요구하는 자료가 많은데, 모두 공개해도 되는가?
• 진행중인 UX 프로젝트를 공개하면 어떤 장점이 있는가?
3. 필드리서치
• UXer들은 왜 필드리서치를 하는가?
• 필드리서치와 마케팅 리서치의 차이점은?
• 필드리서치는 누구를, 몇 명이나 대상으로 해야 하나?
• 필드리서치를 할 때, 주의해야 할 사항은?
• 필드리서치 결과를 가지고 바로 디자인하면 안 되는가?
4. UX 모델링
• UX 프로젝트에서 모델링이란 작업을 굳이 해야 하는가?
• 필드리서치 결과를 가지고 가장 빠르게 인사이트를 도출할 수 있는 방법은?
• Persona가 기존의 마케팅 시장세분화와 다른 점은?
• Persona를 통해서 얻을 수 있는 기대효과는?
• 선행연구 프로젝트에 가장 적합한 UX 모델링 방법은?
• Journey Map은 언제나 유효한가?
5. UX 전략
• UX 모델링을 통해서 얻어야 할 최종 결과는?
• UX 프로젝트에서 이야기하는 전략이란?
• UX에서 가치가 중요한 이유는?
• UX 프로젝트에서 얘기하는 가치의 구체적인 구분은?
• UXer들은 새로운 사용자경험을 어떻게 디자인하는가?
• UX 프로젝트에서 사용자 시나리오가 중요한 이유는?
• 사용자 시나리오는 어떻게 활용되는가?
6. 프로토타이핑
• UX 프로젝트에서의 프로토타이핑은 무엇인가?
• 구현충실도(fidelity)를 꼭 낮은 것에서부터 시작해야 하는가?
• 프로토타입 작업 시 사용성 테스트를 거치는 이유는?
• 테스트는 누구를 대상으로 하는 것이 좋은가?
• 테스트는 몇 명이나 하는 것이 좋은가?
• UX 프로젝트에서 이야기하는 테스트 방법에는 어떤 것들이 있나?
사물인터넷(IoT)/웨어러블 UX 디자인툴킷_UX-trigger for Iot/Wearable_v1Limepaper, Inc.
[UX trigger for IOT/Wearable]는
Mobile Computing 분야와 Ubiquitous Computing 분야에서 선도적인 기술을 보유하고, 혁신적이고 풍부한 사용자경험(UX을 창출하고자 설립된 UX 디자인 전문 벤처기업인 ㈜라임페이퍼에서 개발하였습니다.
[UX trigger for IOT/Wearable]은
사물인터넷(IoT)/웨어러블 기반의 스타트업 비즈니스모델의 UX진단 및 UX/UI 디자인 워크샵입니다. 스타트업의 Lean-UX에 최적화하여 개발한 IOT/Wearable-UX디자인 툴킷을 활용하여, 서비스개발 초기단계에서부터 스타트업의 빠른 Time-to-Market 적용을 목표로 서비스의 UX/UI완성도를 높일 수 있는 UX/UI디자인 방법론을 체득할 수 있으며, 궁극적으로 스타트업의 사업아이템의 UX경쟁력 강화를 목적으로 진행합니다.
모바일 UX/UI 기획을 위해서 꼭 고려해야할 것들
트랜드와 원칙으로써의 UX - 1부
'UX는 3가지 관점에서 접근될 수 있습니다.
저는 지금까지 UX Design 방법론을 강조해 왔는데,
이번에는 트랜드로써의 UX, 원칙으로써의 UX를 말씀드리고자 합니다.'
- 라이트브레인 UX1컨설팅그룹 조성봉이사
2부의 자료는 추후 공개예정입니다.
3. UX디자인의 개념
Interface: 서로 다른 두가지의 주제나 시스템, 성분이 만날때 그 두요소
사이에 생기는 경계면
UI(User Interface): 사용자와 시스템이 만나는 면
인터렉션: 사용자가 인터페이스를 통해 시스템을 이용하는 일련의
상호작용
UX(User Experience): 제품을 사용할때 마주하는 다양한 경험
-좁은의미: 다양한 사용자 인터페이스를 사용하는 경험과
이를 활용하는 인터렉션 과정의 경험, 제품, 서비스, 콘텐츠를 사용하면서
느끼는 서비스경험과 콘텐츠 경험
-넓은 의미: 제품사용과 직접 관련되지 않는 다양한 경험
ex) 특정브랜드에 대한 인상, 제품광고에서 느껴지는 분위기, 제품의 포장과
진열방식, 고객지원 경험
4. 가렛의 경험디자인 정의
:경험디자인은
인간의 관여와 참여를 목표로 하고
인간의 경험을 성과로 하는 모든것에 관한 디자인을 의미한다.
경험디자인은 매질/매체와 무관하게 또는 여러 매질/매체를
이용해서 이루어진다.
(제시 제임스 가렛의 2009년 어댑티브 패스 UX 위크 발표 인용)
5. 경험디자인의 4가지 차원
:지각, 행동, 인지, 감성
1. 지각: 사람이 감각기관을 통해서 여러 자극을 받아들여 사물이나
그것의 변화를 알아내는 것
2. 행동: 지각된 자극에 반응해서 사람들은 행동하게 된다.
(인터렉션 디자인이 이런 지각에 따른 사람의 행동을 설계하는 분야다.)
3. 인지: 사물을 알아보고 기억하며 추리를 통해 문제를 해결하는
정신적인 과정
4. 감성: 수준 높은 사용자 경험 디자인을 위해서 많은 연구가 필요함
6. 사용자가 만족하는 제품에 필요한 특성들
-유연한 인터랙션을 제공해야 한다
-쉽게 정보를 입력할 수 있어야 한다.
-빠르게 처리결과를 제공해야 한다.
-일을 처리하는 흐름이 직관적이어야 한다.
-정보와 기능에 대해서 쉽게 이해할 수 있어야한다.
-쉽고 빠르게 사용방법을 학습할 수 있어야한다.
-정확한 정보를 올바른 방법으로 제공해야 한다.
-재미있는 인터페이스 형태를 제공할 수 있어야 한다.
7. UX 디자인 관련 연구분야
-인터랙션 디자인
-인포메이션 아키텍처
-사용성
-인간 컴퓨터 상호작용
(HCI: Human Cumputer Interaction)
-인간공학
-UI디자인
8. 제임스 가렛의 "사용자 경험의 5계층"
:표면, 윤곽, 구조, 범위, 전략
-표면: 이미지와 텍스트 등 전체요소 배치, 시각적 마무리
-윤곽: 버튼과 탭, 이미지, 텍스트 블록 등에 대한 배치
-구조: 인터페이스의 추상적인 구조와 형태를 정의
-범위: 제품에 제공할 기능, 작업, 콘텐츠의 범위를 정의
-전략: 제품을 만들 때 사업자와 사용자가 추구하는 목표 정의
9. 시대별 사용자 경험의 변화
기계가 최고의 가치였던 메인프레임 시대
컴퓨터로 처리할 수 있는지가 중요했던 PC도입기
사람이 중요해지는 pc발전기, 성숙기
시대별 PC 기술의 발전
11. 인터랙션 디자인의 7가지 접근방법
-시스템 디자인: 시스템의 전체적인 동작구조에 맞춰서 디자인한다.
-기능 중심 디자인: 시스템에 요청되는 기능의 구현에 집중한다.
-사용자 중심 디자인: 전 과정에 사용자의 반응을 반영해서 디자인한다.
-목표 지향 디자인: 사용자의 목표를 찾고 그것을 중심으로 디자인한다.
-직관적 디자인: 디자이너의 직관과 통찰력을 기반으로 새로운 제품을 디자인한다.
-천재적 디자인: 디자이너 개인의 뛰어난 능력에 기반을 두고 디자인한다.
-연구 중심 디자인: 인간과 기계의 특성을 연구하고, 그연구에 기반을 두고
디자인한다.
13. 서울 지하철 1회용 승차권의 다양한 문제
-전자식 승차권 도입, 보증금을 낸 다음 환급받는 방식
보증금이 필요한 지하철 이용 개념모형
step1. 보증금 준비
step2. 승차권구매
step3. 개표
step4. 지하철 이용
step5. 나가는 개표
step6. 보증금 환불
step7. 목적지 이동
*1회용 제품의 보증금이라는 개념이 추가되어 문제가 발생!
14. 서울 지하철 1회용 승차권의 다양한 문제
수정되어야 할 개념모형!
-1회용 제품은 사서 한번쓰면 끝이다.
-무료승차권은 돈을 내지 않는다.
-1회용제품은 재사용되지 않는다.
-충전형 카드와 모양이 똑같다. -> 모양이 바뀌어야 한다
-보증금 환급기 모양이 발매기와 구분되지 않는다.
-완료시점에 대한 인지적 고려가 필요하다.
-실수를 막는 디자인 필요
(ex:대구와 대전등에서 사용하는 토큰형 승차권)
15. 인터랙션 기반 설계를 위해!
1.적절한 개념모형을 제시하라
-심성모형: 우리가 제품의 동작 방식등을 해석하려고 머릿속에 만드는 모형
-개념모형: 심성모형의 한 부분으로 사람이 시스템과 제품 등의 개념을
이해하려고 머릿속에 만드는 모형
ex) 쉬운 개념모형: 아이팟, 아이폰, 아이패드
2.알기쉬운 메타포를 제시하라
-메타포: 어떤 대상을 직접 관련되지 않은 다른 대상을 이용해서 표현한 것
ex) 메타포의 적절한 사용 예: Drawing Pad, iBooks
3.중요한 것을 드러내라
ex) 음료 자판기의 인터페이스, 가장 중요한 요소가 눈에 보인다.
-동전 투입구의 눈에띄는 위치, 판매 상품샘플 제공, 품절상품 품절표시
16. 인터랙션 표현 설계를 위해!
1.행동을 유도하는 단서를 제시하라
적절한 시그니파이어를 제공하라
ex) 벽면 가득한 메모지- 안내문이 없어도 사람들은 메모지를 자연스레 붙인다.
2.적절한 피드백을 제시하라
-피드백의 역할
: 확인-경고-오류알림-특별한 상황 알림-작업의 진척과 시간 추정-
학습을 위한 알림-상태알림
ex) 공중전화의 피드백 방식: 다양한 시,청각 피드백으로 시스템의 상태 파악
3.올바른 대응관계를 만들어라
ex) iOS에서 제공하는 행동과 반응의 자연스러운 대응. 행동과 반응의 대응이
자연스러우면 한 번만 봐도 사용법을 배울 수 있다.
3.제약과 제한의 힘을 활용하라
ex) 돌기와 홈, 제한된 블록 수로 설명서 없이 쉽게 조립할 수 있는 레고 블록
17. 서울시 마포구 상암동 누리꿈스퀘어 연구개발타워 1111호
끝!
Jellycoaster Inc.