UX 모임 2018-10-22

UX 모임

선애

RULE5 감성으로 접근하라

핵심콘텐츠에 집중하라

• 먼저, 제품을 구성하는 콘텐츠, 요소의 가치를 평가하는 기준과 관점을 판단

• • 기능성 : 기능적인 측면에서 전체 제품에 이바지하는 정도와 특성. 핀터레스트
  • 정체성 : 제품의 특징이나 개성을 기억시키는 요소. [https//www.google.co.kr/ 구글]
  • 사용성 : 정확성과 보안성이 필요한 서비스에서는 매우 중요. '언제, 어디서나, 쉽게' 페이팔
  • 사업성 : 경제적 가치를 얻기 위한 것이라면 목적에 충실히 설계. IMDb 로튼토마토

• 제품을 구성하는 기능과 내용을 이와같이 네가지 관점에서 평가할 수 있음. 같은 요소라도 상황에 따라 역할과 중요성을 판단할 수 있어야 함.

메시지를 디자인하라

XMB 인터페이스

Dead Space

• 시각디자인(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