Difference between revisions of "UX 모임 2018-10-22"
From Lyndsey Twining
(→메시지를 디자인하라) |
(→메시지를 디자인하라) |
||
Line 22: | Line 22: | ||
*새로운 인터페이스는 참신한 디자인으로는 안되고 사용자가 받아들일 수 있는 새로운 콘셉트를 이용해야함. | *새로운 인터페이스는 참신한 디자인으로는 안되고 사용자가 받아들일 수 있는 새로운 콘셉트를 이용해야함. | ||
*게임은 모든 구성요소에서 사용자의 즐거움을 추구. 게임UI는 일관성 있는 자극과 동기부여 요소이며 감성적으로도 몰입과 흥미를 강화하는 도구. | *게임은 모든 구성요소에서 사용자의 즐거움을 추구. 게임UI는 일관성 있는 자극과 동기부여 요소이며 감성적으로도 몰입과 흥미를 강화하는 도구. | ||
+ | **Dead Space, 타이탄 폴, 모뉴먼트 밸리 등 | ||
+ | *아이콘 디자인의 선구자 [http://kare.com/ Susan Kare] | ||
+ | ====개성과 분위기를 표현하라==== | ||
+ | *시각 디자인에 더해 유기적으로 콘셉트, 기능과 함께 여러가지 요소가 결합되어야 감성적인 경험이 완성됨. | ||
+ | *디자인에 톤이나 분위기, 목소리를 표현하기 위한 여러가지 방법 | ||
+ | **색 ex) Cuphead, Limbo 등 | ||
+ | **질감 | ||
+ | **배치 ex) [https://playgroundinc.com/ playground] [http://c-21.co.uk/ c-21] | ||
+ | **이미지 스타일 : 사진, 초상화, 도식화, 스케치 등 | ||
+ | ====움직임을 표현하라==== | ||
+ | *기존에는 애니메이션 효과로 피드백을 주는 방식이 기술적인 문제로 회피되어옴. | ||
+ | *그러나 터치 인터페이스가 일반화되고 스마트폰의 성능이 향상되면서 움직임의 중요성이 커짐. | ||
+ | **위치, 속도, 방향 : 모든 움직임은 위치와 속도, 방향을 가짐. 이를 활용하여 표현 가능. | ||
+ | **겹침 : 두가지 이상 개체에 공통요소를 만듦. ex) 앱 서랍 기능 | ||
+ | **패턴 동작 : 터치 인터페이스를 활용. 스와이프. | ||
+ | ====친절한 디자인을 하라==== | ||
+ | *친절한 디자인 : 정보의 핵심을 알아듣기 쉽고 정서적으로도 안정감 있게, 따뜻한 기분이 드는 소통과정처럼 디자인에 배려를 담는 것 | ||
+ | *논리적인 접근 : 사용성 최적화를 통해 제품의 핵심기능을 제대로 전달하며 정확한 정보를 유용하게 제공. | ||
+ | *인지적인 접근 : 기억에 남는 경험은 사용자가 상황에 집중하고 몰입해야 가능. 몰입은 사용자가 부담없이 자신의 욕구에 집중하여 원하는 것을 탐색할 때에 가능. | ||
+ | **장기기억(LTM, long term memory) : 우리가 기억하는 많은 경험. | ||
+ | **단기기억(STM, short term memory) : 지속시간 10-20초, 동시처리 정보갯수 5-7개 | ||
+ | *감성적인 접근 : 친절함의 감성(편안함, 안정감, 배려, 안심 등). 시각요소와 청각요소 등을 활용. ex) [https://ommwriter.com/ OmmWriter] | ||
+ | *친절한 디자인은 디자이너의 실제 사용자에 대한 이해가 필수적. | ||
+ | ====소리로 전달하라==== | ||
==현규== | ==현규== |
Revision as of 14:12, 14 October 2018
Contents
- 1 선애
- 2 현규
- 3 린지
- 3.1 The Design of Everyday Things Ch. 4 - Knowing What to Do: Constraints, Discoverability, Feedback
- 3.1.1 Four Kinds of Constraints: Physical, Cultural, Semantic, and Logical
- 3.1.2 Applying Affordances, Signifiers, and Constraints to Everyday Objects
- 3.1.3 Constraints That Force the Desired Behavior
- 3.1.4 Conventions, Constraints, and Affordances
- 3.1.5 The Faucet: A Case History of Design
- 3.1.6 Using Sound as Signifiers
- 3.1 The Design of Everyday Things Ch. 4 - Knowing What to Do: Constraints, Discoverability, Feedback
선애
RULE5 감성으로 접근하라
핵심콘텐츠에 집중하라
- 먼저, 제품을 구성하는 콘텐츠, 요소의 가치를 평가하는 기준과 관점을 판단
- 제품을 구성하는 기능과 내용을 이와같이 네가지 관점에서 평가할 수 있음. 같은 요소라도 상황에 따라 역할과 중요성을 판단할 수 있어야 함.
메시지를 디자인하라
- 시각디자인(Visual Communication Design) : 시각요소를 활용하여 소통하는 방법을 디자인.
- 메시지는 의미와 함께 넓고 큰 흐름과 전달방식으로 드러남.
- 하나의 기호체계로써 의미를 가지는 디자인은 언어적인 요소로 사용해도 좋음.
- 스큐어모피즘(Skeuomorphism) : 현실세계를 은유한 본래의 형태로 표현하는 것.
- UI에서 아이콘을 사용할 때에는 사람들에게 익숙한 디자인을 활용하는 것이 좋음.
- 새로운 인터페이스는 참신한 디자인으로는 안되고 사용자가 받아들일 수 있는 새로운 콘셉트를 이용해야함.
- 게임은 모든 구성요소에서 사용자의 즐거움을 추구. 게임UI는 일관성 있는 자극과 동기부여 요소이며 감성적으로도 몰입과 흥미를 강화하는 도구.
- Dead Space, 타이탄 폴, 모뉴먼트 밸리 등
- 아이콘 디자인의 선구자 Susan Kare
개성과 분위기를 표현하라
- 시각 디자인에 더해 유기적으로 콘셉트, 기능과 함께 여러가지 요소가 결합되어야 감성적인 경험이 완성됨.
- 디자인에 톤이나 분위기, 목소리를 표현하기 위한 여러가지 방법
- 색 ex) Cuphead, Limbo 등
- 질감
- 배치 ex) playground c-21
- 이미지 스타일 : 사진, 초상화, 도식화, 스케치 등
움직임을 표현하라
- 기존에는 애니메이션 효과로 피드백을 주는 방식이 기술적인 문제로 회피되어옴.
- 그러나 터치 인터페이스가 일반화되고 스마트폰의 성능이 향상되면서 움직임의 중요성이 커짐.
- 위치, 속도, 방향 : 모든 움직임은 위치와 속도, 방향을 가짐. 이를 활용하여 표현 가능.
- 겹침 : 두가지 이상 개체에 공통요소를 만듦. ex) 앱 서랍 기능
- 패턴 동작 : 터치 인터페이스를 활용. 스와이프.
친절한 디자인을 하라
- 친절한 디자인 : 정보의 핵심을 알아듣기 쉽고 정서적으로도 안정감 있게, 따뜻한 기분이 드는 소통과정처럼 디자인에 배려를 담는 것
- 논리적인 접근 : 사용성 최적화를 통해 제품의 핵심기능을 제대로 전달하며 정확한 정보를 유용하게 제공.
- 인지적인 접근 : 기억에 남는 경험은 사용자가 상황에 집중하고 몰입해야 가능. 몰입은 사용자가 부담없이 자신의 욕구에 집중하여 원하는 것을 탐색할 때에 가능.
- 장기기억(LTM, long term memory) : 우리가 기억하는 많은 경험.
- 단기기억(STM, short term memory) : 지속시간 10-20초, 동시처리 정보갯수 5-7개
- 감성적인 접근 : 친절함의 감성(편안함, 안정감, 배려, 안심 등). 시각요소와 청각요소 등을 활용. ex) OmmWriter
- 친절한 디자인은 디자이너의 실제 사용자에 대한 이해가 필수적.
소리로 전달하라
현규
린지
- 살펴볼 사이트:
The Design of Everyday Things Ch. 4 - Knowing What to Do: Constraints, Discoverability, Feedback
- How do we operate something new? --> Knowledge in the world (affordances, signifiers, mappings, constraints) and knowledge in the head (conceptual models, analogies to previous situations)
Four Kinds of Constraints: Physical, Cultural, Semantic, and Logical
Physical constraints
- Limited number of actions
- Desired action made obvious
- Restriction prior to any action being taken (to prevent wrong action before it happens)
- Battery design; USB design?
- Legacy problem: too many devices use the existing standard
- Expense of change?
- Corporate thinking - not caring about the customer
Cultural constraints
- Each culture has a set of allowable actions for social situations
- Ex: Restaurant, public transportation
- Can change over time
Semantic constraints
- The meaning of the situation controls the set of possible actions
- Can change over time
Logical constraints
- After all other options, what is left?
- Obvious errors
- Natural mappings help here
Cultural norms, conventions, and standards
- Greetings with people, traffic laws, food etiquette
- A form of cultural constraint
- Sometimes become international standards or laws
- Violate conventions, and you are marked as an outsider
Applying Affordances, Signifiers, and Constraints to Everyday Objects
The problem with doors
- Sometimes unclear how to use - where to push, push or pull, automatic or not, etc.
- Focus on aesthetics may blind the designer/purchaser to the lack of usability
- Cultural norms play a role
The problem with switches
- Can be annoying... or dangerous
- Must know: 1) what they control, 2) mapping (which they control)
- More switched --> more danger
- Problem comes from coordination of various professions
- Phone/computer applications for this may solve the problem; touch screens, cameras which recognize gestures?
Activity-centered controls
- video, comptuer, full ights, lecture, etc.
- can be done poorly
- device-centered is a wrong approach - different switches/screens for different devices
- regardless, manual controls will still be required because of new, unexpected, demands which require idiosyncratic settings
- manual setting should not cause the current activity to be canceled
Constraints That Force the Desired Behavior
Forcing functions
- a kind of physical constraint: situations in which the actions are constrained so that failture at one stage prevents the next step from happening
- ex: car keys
Interlocks
- Forces operations to take place in proper sequence
- Press down brake pedal to switch out of park
- "Dead man's switch" - user must hold down switch during use so that if they die/are injured the operation stops
- lawn mower, chainsaw, etc.
Lock-ins
- Keeps an operation active, presenting someone from prematurely stopping it
- Ex: "Want to save file?", jail cells, play pens
- Devices which only are compatible with the company's other devices
Lockouts
- Prevents people from entering a dangerous space or prevents an action
- Barrier between ground floor and basement for fire safety
Conventions, Constraints, and Affordances
- From perception of an affordance to understanding the potential action relies on conventions
- Ex: doorknob
Conventions are cultural constraints
When conventions change: the case of destination-control elevators
People's responses to changes in conventions
- People complain, new learning is required
- The merits don't matter, the change does
- Ex: metric system and the U.S.
The Faucet: A Case History of Design
- How to deal with hot and cold
- Separate not and cold? Only temperature? Only amount? On-off?
- Which is hot/cold? How to change temp? How to change flow? Which direction controls flow?
Using Sound as Signifiers
- Useful signifier, but can annoy/distract
- Silence can be dangerous
- Ex: Electric cars, pedestrians cannot hear the car approaching, can be hit
- Skeumorphic - old, familiar ideas into new technologies even if they do not have a functional role