서울시 마포구 상암동 누리꿈스퀘어 연구개발타워 1111호오래가는UX 디자인(Book Study)Jellycoaster Inc.
Part 1.UX 디자인
UX디자인의 개념Interface: 서로 다른 두가지의 주제나 시스템, 성분이 만날때 그 두요소사이에 생기는 경계면UI(User Interface): 사용자와 시스템이 만나는 면인터렉션: 사용자가 인터페이스를 통해 시스...
가렛의 경험디자인 정의:경험디자인은인간의 관여와 참여를 목표로 하고인간의 경험을 성과로 하는 모든것에 관한 디자인을 의미한다.경험디자인은 매질/매체와 무관하게 또는 여러 매질/매체를이용해서 이루어진다.(제시 제임스 가렛...
경험디자인의 4가지 차원:지각, 행동, 인지, 감성1. 지각: 사람이 감각기관을 통해서 여러 자극을 받아들여 사물이나그것의 변화를 알아내는 것2. 행동: 지각된 자극에 반응해서 사람들은 행동하게 된다.(인터렉션 디자인이...
사용자가 만족하는 제품에 필요한 특성들-유연한 인터랙션을 제공해야 한다-쉽게 정보를 입력할 수 있어야 한다.-빠르게 처리결과를 제공해야 한다.-일을 처리하는 흐름이 직관적이어야 한다.-정보와 기능에 대해서 쉽게 이해할 ...
UX 디자인 관련 연구분야-인터랙션 디자인-인포메이션 아키텍처-사용성-인간 컴퓨터 상호작용(HCI: Human Cumputer Interaction)-인간공학-UI디자인
제임스 가렛의 "사용자 경험의 5계층":표면, 윤곽, 구조, 범위, 전략-표면: 이미지와 텍스트 등 전체요소 배치, 시각적 마무리-윤곽: 버튼과 탭, 이미지, 텍스트 블록 등에 대한 배치-구조: 인터페이스의 추상적인 구...
시대별 사용자 경험의 변화기계가 최고의 가치였던 메인프레임 시대컴퓨터로 처리할 수 있는지가 중요했던 PC도입기사람이 중요해지는 pc발전기, 성숙기시대별 PC 기술의 발전
Part 2.인터랙션 디자인
인터랙션 디자인의 7가지 접근방법-시스템 디자인: 시스템의 전체적인 동작구조에 맞춰서 디자인한다.-기능 중심 디자인: 시스템에 요청되는 기능의 구현에 집중한다.-사용자 중심 디자인: 전 과정에 사용자의 반응을 반영해서 ...
인터랙션 디자인 사례서울 지하철 1회용 승차권의다양한 문제
서울 지하철 1회용 승차권의 다양한 문제-전자식 승차권 도입, 보증금을 낸 다음 환급받는 방식보증금이 필요한 지하철 이용 개념모형step1. 보증금 준비step2. 승차권구매step3. 개표step4. 지하철 이용ste...
서울 지하철 1회용 승차권의 다양한 문제수정되어야 할 개념모형!-1회용 제품은 사서 한번쓰면 끝이다.-무료승차권은 돈을 내지 않는다.-1회용제품은 재사용되지 않는다.-충전형 카드와 모양이 똑같다. -> 모양이 바뀌어야 ...
인터랙션 기반 설계를 위해!1.적절한 개념모형을 제시하라-심성모형: 우리가 제품의 동작 방식등을 해석하려고 머릿속에 만드는 모형-개념모형: 심성모형의 한 부분으로 사람이 시스템과 제품 등의 개념을이해하려고 머릿속에 만드...
인터랙션 표현 설계를 위해!1.행동을 유도하는 단서를 제시하라적절한 시그니파이어를 제공하라ex) 벽면 가득한 메모지- 안내문이 없어도 사람들은 메모지를 자연스레 붙인다.2.적절한 피드백을 제시하라-피드백의 역할: 확인-...
서울시 마포구 상암동 누리꿈스퀘어 연구개발타워 1111호끝!Jellycoaster Inc.
Upcoming SlideShare
Loading in …5
×

Blog 오래가는 ux 디자인

2,691 views

Published on

0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,691
On SlideShare
0
From Embeds
0
Number of Embeds
1,356
Actions
Shares
0
Downloads
24
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Blog 오래가는 ux 디자인

  1. 1. 서울시 마포구 상암동 누리꿈스퀘어 연구개발타워 1111호오래가는UX 디자인(Book Study)Jellycoaster Inc.
  2. 2. Part 1.UX 디자인
  3. 3. UX디자인의 개념Interface: 서로 다른 두가지의 주제나 시스템, 성분이 만날때 그 두요소사이에 생기는 경계면UI(User Interface): 사용자와 시스템이 만나는 면인터렉션: 사용자가 인터페이스를 통해 시스템을 이용하는 일련의상호작용UX(User Experience): 제품을 사용할때 마주하는 다양한 경험-좁은의미: 다양한 사용자 인터페이스를 사용하는 경험과이를 활용하는 인터렉션 과정의 경험, 제품, 서비스, 콘텐츠를 사용하면서느끼는 서비스경험과 콘텐츠 경험-넓은 의미: 제품사용과 직접 관련되지 않는 다양한 경험ex) 특정브랜드에 대한 인상, 제품광고에서 느껴지는 분위기, 제품의 포장과진열방식, 고객지원 경험
  4. 4. 가렛의 경험디자인 정의:경험디자인은인간의 관여와 참여를 목표로 하고인간의 경험을 성과로 하는 모든것에 관한 디자인을 의미한다.경험디자인은 매질/매체와 무관하게 또는 여러 매질/매체를이용해서 이루어진다.(제시 제임스 가렛의 2009년 어댑티브 패스 UX 위크 발표 인용)
  5. 5. 경험디자인의 4가지 차원:지각, 행동, 인지, 감성1. 지각: 사람이 감각기관을 통해서 여러 자극을 받아들여 사물이나그것의 변화를 알아내는 것2. 행동: 지각된 자극에 반응해서 사람들은 행동하게 된다.(인터렉션 디자인이 이런 지각에 따른 사람의 행동을 설계하는 분야다.)3. 인지: 사물을 알아보고 기억하며 추리를 통해 문제를 해결하는정신적인 과정4. 감성: 수준 높은 사용자 경험 디자인을 위해서 많은 연구가 필요함
  6. 6. 사용자가 만족하는 제품에 필요한 특성들-유연한 인터랙션을 제공해야 한다-쉽게 정보를 입력할 수 있어야 한다.-빠르게 처리결과를 제공해야 한다.-일을 처리하는 흐름이 직관적이어야 한다.-정보와 기능에 대해서 쉽게 이해할 수 있어야한다.-쉽고 빠르게 사용방법을 학습할 수 있어야한다.-정확한 정보를 올바른 방법으로 제공해야 한다.-재미있는 인터페이스 형태를 제공할 수 있어야 한다.
  7. 7. UX 디자인 관련 연구분야-인터랙션 디자인-인포메이션 아키텍처-사용성-인간 컴퓨터 상호작용(HCI: Human Cumputer Interaction)-인간공학-UI디자인
  8. 8. 제임스 가렛의 "사용자 경험의 5계층":표면, 윤곽, 구조, 범위, 전략-표면: 이미지와 텍스트 등 전체요소 배치, 시각적 마무리-윤곽: 버튼과 탭, 이미지, 텍스트 블록 등에 대한 배치-구조: 인터페이스의 추상적인 구조와 형태를 정의-범위: 제품에 제공할 기능, 작업, 콘텐츠의 범위를 정의-전략: 제품을 만들 때 사업자와 사용자가 추구하는 목표 정의
  9. 9. 시대별 사용자 경험의 변화기계가 최고의 가치였던 메인프레임 시대컴퓨터로 처리할 수 있는지가 중요했던 PC도입기사람이 중요해지는 pc발전기, 성숙기시대별 PC 기술의 발전
  10. 10. Part 2.인터랙션 디자인
  11. 11. 인터랙션 디자인의 7가지 접근방법-시스템 디자인: 시스템의 전체적인 동작구조에 맞춰서 디자인한다.-기능 중심 디자인: 시스템에 요청되는 기능의 구현에 집중한다.-사용자 중심 디자인: 전 과정에 사용자의 반응을 반영해서 디자인한다.-목표 지향 디자인: 사용자의 목표를 찾고 그것을 중심으로 디자인한다.-직관적 디자인: 디자이너의 직관과 통찰력을 기반으로 새로운 제품을 디자인한다.-천재적 디자인: 디자이너 개인의 뛰어난 능력에 기반을 두고 디자인한다.-연구 중심 디자인: 인간과 기계의 특성을 연구하고, 그연구에 기반을 두고디자인한다.
  12. 12. 인터랙션 디자인 사례서울 지하철 1회용 승차권의다양한 문제
  13. 13. 서울 지하철 1회용 승차권의 다양한 문제-전자식 승차권 도입, 보증금을 낸 다음 환급받는 방식보증금이 필요한 지하철 이용 개념모형step1. 보증금 준비step2. 승차권구매step3. 개표step4. 지하철 이용step5. 나가는 개표step6. 보증금 환불step7. 목적지 이동*1회용 제품의 보증금이라는 개념이 추가되어 문제가 발생!
  14. 14. 서울 지하철 1회용 승차권의 다양한 문제수정되어야 할 개념모형!-1회용 제품은 사서 한번쓰면 끝이다.-무료승차권은 돈을 내지 않는다.-1회용제품은 재사용되지 않는다.-충전형 카드와 모양이 똑같다. -> 모양이 바뀌어야 한다-보증금 환급기 모양이 발매기와 구분되지 않는다.-완료시점에 대한 인지적 고려가 필요하다.-실수를 막는 디자인 필요(ex:대구와 대전등에서 사용하는 토큰형 승차권)
  15. 15. 인터랙션 기반 설계를 위해!1.적절한 개념모형을 제시하라-심성모형: 우리가 제품의 동작 방식등을 해석하려고 머릿속에 만드는 모형-개념모형: 심성모형의 한 부분으로 사람이 시스템과 제품 등의 개념을이해하려고 머릿속에 만드는 모형ex) 쉬운 개념모형: 아이팟, 아이폰, 아이패드2.알기쉬운 메타포를 제시하라-메타포: 어떤 대상을 직접 관련되지 않은 다른 대상을 이용해서 표현한 것ex) 메타포의 적절한 사용 예: Drawing Pad, iBooks3.중요한 것을 드러내라ex) 음료 자판기의 인터페이스, 가장 중요한 요소가 눈에 보인다.-동전 투입구의 눈에띄는 위치, 판매 상품샘플 제공, 품절상품 품절표시
  16. 16. 인터랙션 표현 설계를 위해!1.행동을 유도하는 단서를 제시하라적절한 시그니파이어를 제공하라ex) 벽면 가득한 메모지- 안내문이 없어도 사람들은 메모지를 자연스레 붙인다.2.적절한 피드백을 제시하라-피드백의 역할: 확인-경고-오류알림-특별한 상황 알림-작업의 진척과 시간 추정-학습을 위한 알림-상태알림ex) 공중전화의 피드백 방식: 다양한 시,청각 피드백으로 시스템의 상태 파악3.올바른 대응관계를 만들어라ex) iOS에서 제공하는 행동과 반응의 자연스러운 대응. 행동과 반응의 대응이자연스러우면 한 번만 봐도 사용법을 배울 수 있다.3.제약과 제한의 힘을 활용하라ex) 돌기와 홈, 제한된 블록 수로 설명서 없이 쉽게 조립할 수 있는 레고 블록
  17. 17. 서울시 마포구 상암동 누리꿈스퀘어 연구개발타워 1111호끝!Jellycoaster Inc.

×