UX 모임 2018-08-20

UX 모임

린지 - The Design of Everyday Things

Chapter 1: The Psychopathology of Everyday Things

• The two most important characteristics of good design are discoverability and understanding.
  • Discoverability: Is it possible to even figure out what actions are possible and where and how to perform them?
  • Understanding: What does it all mean? How is the product supposed to be used? What do the different controls and settings mean?
• Complex devices may require manuals or instruction, but simple ones should not
• The purpose of the design is lost if it is so complex it is not used or barely used

Examples

• doors
• coffeepot for masochists

The Complexity of Modern Devices

"We are designing things for people, so we need to understand both technology and people."

• "All artificial things are designed. Whether it is the layout of a furniture in a room, the paths through a garden or forest, or the intricacies of an electronic device, some person or group of people had to decide upon the layout, operation, and mechanisms.
• Some designed things are systems, rules, services, organizational structures
• "Design is concerned with how things work, how they are controlled, and the nature of the interaction between people and technology"
• Three main areas of design:
  • Industrial - focus on function, value, appearance with user and manufacturer in mind
  • Interaction - focus on how people interact with technology (what can be done, what is happening, and what happened)
  • Experience - focus on the quality and enjoyment of the total experience (of a service, product, process, event)
• "Much of design is done by engineers who are experts in technology but limited in their understanding of people. 'We are people ourselves,' they think, 'so we understand people.' But in fact, we humans are amazingly complex....The problem with the designs of most engineers is that they are too logical....You are designing for people the way you would like them to be, not for the way they really are."

Human-Centered Design

• Design has improved, but technological advances outpace design
• "HCD is a design philosophy."
• "HCD puts human needs, capabilities, and behavior first, then designs to accomodate those needs, capabilities, and ways of behaving. Good design starts with and understanding of psychology and technology."
• "Good design requires good communication, especially from machine to person, indicating what actions are possible, what is happening, and what is about to happen."
• Observation of people who may not even be aware of their own needs and the difficulties they encounter.
• Avoid specifying the problem and iterate upon approximations

Fundamental Principles of Interaction

• "Great designers produce pleasurable experiences."
• Determines how fondly people remember their interactions
• Positive of frustrating/confusing?
• Discoverability: Need to discover how to work it
  • What is does
  • How it works
  • What operations are possible

Affordances

• The relationship between a physical object and a person
• The properties of and object <-> The capabilities of the agent --> How it can be used
• Bidirectional relationship
• They exist even if they are not visible
• Making them visible is the job of the designer

Signifiers

• Any mark or sound, any perceivable indicator that communicates appropriate behavior to a person.
• Must be perceivable
• Affordances determine what actions are possible. Signifiers communicate where the action should take place.
• Does not matter if it is intended or incidental
• Ex: PUSH, trail made by others, whether there are people waiting at the train station, soda can on shelf, lack on sink, vertical pipes on the road

Mapping

• Which controls which things, layout of controls and displays
• Ex: Which switches control which lights in a room
• Spacial correspondence
• Natural mapping is best
• Vertical position represents intensity or amount, make controls in same pattern as lights, groupings and proximity - related things should be together

Feedback

• Communicating the results of an action
• People need feedback to know that the machine heard them
• Ex: Lights in an elevator
• Must be immediate, informative (not too simple), but not too much
  • Too many announcements cause people to ignore all of them or disable all of them, so critical ones may be missed
• Ex: Auditory signals (beeps) may not be clear as to where it is coming from, single or multiple flashes
• Feedback must be planned and actions need to be confirmed
• Feedback must be prioritized

Conceptual Model

• An explanation, usually highly simplified, of how something works
• Doesn't need to be complete or even accurate as long as it is useful
  • Ex: Folder icons
• Often multiple conceptual models of a product or device depending on user's background knowledge
• Mental models are the conceptual models in people's minds that represent their understanding of how things work. Different people may hold different models of the same item.
  • Ex. Refrigerator controls

The System Image

• People create mental models of themselves, others, the environment, and the things with which they interact. These are our conceptual models formed through experience, training, and instruction. These models serve as guides to help achieve our goals and in understanding the world.
• The system image: The combined information available to us
  • what the device looks like
  • advertisements
  • articles
  • instruction manual
  • product website
• When the system image is incomplete, there are problems
• Good conceptual models are the key to understandable enjoyable produce; good communication is the key to good conceptual models.

The Paradox of Technology

• "Technology offer the potential to make life easier and more enjoyable; each new technology provides increased benefits. At the same time, added complexities increase our difficulty and frustration with technology."
• Watch --> phone --> Phone watch? --> Special glasses --> Projectors? --> Ear phones?
• How would we learn and remember complicated gestures and commands?
  • Agreed upon standards

The Design Challenge

• "Design requires the cooperative efforts of multiple disciplines.
• Great design requires great designers, but also great management.
• Each discipline has a different perspective of the relative importance of the many factors of a product.
  • Usable and understandable, attractive, affordable, reliable, able to be manufactures and services, distinguishable, people have to purchase it
• The challenge it to use the principles of HCD to produce positive results, products that enhance lives and add to out pleasure and enjoyments.
• The goal is to produce a great product, one that is successful, and that customers love.

사례 평가 - Encyves (Graphs, Maps, 기사)

• Graphs
  • 용어가 너무 많다
  • 쿼리가 불가능하다
  • 사용자가 불명확하다
  • 뒤로 갈 수 없다
  • 뭘 해야 하는지 모른다
  • 클릭하면 그 요소에 대한 요약이 떴으면 유리하겠다
  • 왜 이 요소들을 이렇게 정리했는지에 대한 설명이 있었으면 좋겠다
  • 또 이 정보는 왜 이렇게 표시해야 하는지 모르겠다

• Maps
  • 좌표 밖에 없어서 장소 이름 같이 있었으면 좋겠고 클릭 했을 때 요약이 떴으면 좋겠다
  • 시간 관계, 등 같이 표시됐으면 한다.
  • 장소의 유형에 따라 표가 다르게 생겼으면 좋겠다

• 기사 페이지
  • 이 정보는 기존의 백과사전과 어떻게 다른지 모르겠다 - 쿼리가 불가능하기 때문에
  • 같은 정보는 그냥 다른 모습으로 반복적으로 표시한 뿐
  • 사용자가 예를 들면 그래프를 복사.붙이고 싶으면... 불가능 하지 않나?
  • 디자인은 그냥 안 예쁘고 사진이 더 중심이 됐으면 좋겠다

선애

• 지난주에 빠뜨렸던 사이트 : 좋은 UX디자이너의 자질

안에 보면 ux에 관한 다양한 이야기가 있습니다.

RULE 2 매력적인 상품을 위해 사용자를 파악하라

• UX 디자인의 역할

UX디자인은 기본적으로 제품이나 서비스 품질을 높이는 방법. 멋진 제품을 만드는 방법이 아니라, 올바른 관점과 체계적인 방법을 통해 실패 확률을 줄이고 시간을 절약하는 방법을 제시.

• 사용자 경험 디자인 순환형 개발 과정 : think-make-check(반복)

• 포커스 그룹 vs 개별 사용자

포커스 그룹은 제품의 기본적인 전략 방향을 제시하는 것. 개별 사용자의 기대나 만족감과 같은 가치를 평가하기에는 한계. 포커스 그룹의 공통점으로부터 트렌드를 읽기 쉽지만, 그로부터 개별 사용자가 실제로 제품과의 소통에서 축적되는 가치를 찾기란 어려움.

=> DH에서의 사용자, 포커스 그룹이란?

• 인터뷰와 설문으로 소비자를 이해하라

만드는 사람은 자신의 입장에서 개발하기 때문에 사용자 관점을 이해하는데 한계. 이를 극복하기 위해 직접 사용자를 만나 그들의 생각과 반응을 관찰하여 부족한 정보를 보충하는 기회를 얻는 것. 사용자 개인의 시점을 반영하는 것이기 때문에 UX디자인에서 매우 중요한 도구. 인터뷰는 진행자의 능력이 중요. 무의식적으로 편향된 상태. 설문은 인터뷰를 보완할 수 있는 경제적이고 효과적인 방법. 개별 사용자를 정확히 파악 못함. 인터뷰는 사용자에게 유연하게 질문하고 답변을 얻는 반면, 설문은 정형화된 질문지이므로 수집할 수 있는 정보에 한계가 있음.

• 구체적인 대상을 정하여 설계하라
  • 페르소나(Persona) : 특정한 목적에 따라 설정한 가공의 사용자. 페르소나의 선택과 행위에 초점을 맞춤. 구체화된 캐릭터의 가상 인물이 제품을 선택하고 사용하는 모든 과정에서 발생하는 상황을 시나리오 형식으로 표현하여 발생할 수 있는 문제와 특이 상황들, 예측하지 못한 가치 등을 유추하는 것.
  • 시뮬레이션(simulation) : 실제 제품이나 서비스가 완성되지 않은 상태에서도 그 성능이나 영향, 그리고 예측하지 못하는 여러 상황 등을 살펴보기 위해 시험적으로 운영하는 것. UX디자인의 시뮬레이션은 사용 과정에서 겪는 상황이 주요 관심사.

사례 평가 - Encyves (Graphs, Maps, 기사)

• 그래프
  • 전체적인 모습을 보고 파악하기 어려움
  • 링크가 없는 것도 있음
  • 어떤 거는 한자 명칭이 있고, 어떤거는 없고?
  • 전체 그래프의 일부가 아니라 매우 단편적. 그냥 하나의 주제에 대해 10-30여개 남짓의 노드만 표현되어 있으며, 그것들이 외부 링크만 보여주고 있음.
  • 역사 인물 전체 관계망 : ㅎㄷㄷ;;
  • 지식 관계망을 모아놓은 것이 어떤 편의성과 유용성을 제공하는지 모르겠음.

• 지도

• 기사
  • 카테고리 분류. 야후의 사례에서 보듯이 오늘날의 검색에는 적절하지 않음.
  • 백과사전을 표방하고 있으나 잘모르겠음. 그냥 위키백과...?
  • 용어의 불일치 : 문맥기사-문맥요소. 관련 설명 부족.
  • 시맨틱 위키를 사용하면 좋았을 것들이 보임. 분류별로 모아놓은 것들에서 수작업의 흔적이 느껴짐...

현규

정보페이지를 만드는 여섯가지 지침

• 사람들이 필요로 하는 것만 제공하라
• 자르고, 자르고, 또 잘라라
• 핵심부터 써라. 역 피라미드 형태로 써라.
• 언어의 담장을 허물어라
• 유용한 정보를 제공하는 것으로 마케팅하라.
• 용도별로 정보를 여러 층으로 나눠라.

유용한 디자인을 위한 열네가지 지침

• 규칙과 정렬을 이용해 페이지 요소가 눈에 잘 들어오게 하라.
• 페이지를 기획할 때 사이트 전체를 생각하라.
• 템플릿을 만들어라.
• 여백을 효율적으로 활용하라. 콘텐츠에 능동적인 여백을 넣어라.
• 가짜 바닥을 조심하라.
• 제목이 떠 보이지 않게 하라.
• 중앙 정렬하지 마라.
• 산 세리프체를 디폴트로 하라.
• 쉽게 익힐 정도로 큰 크기를 디폴트로 하고, 상대적 글자 크기를 이용하라.
• 중간 줄 길이를 디폴트로 하는 유동 레이아웃을 이용하라.
• 대문자로 모든 철자를 구성하지 마라.
• 링크 외에는 어디에도 밑줄을 긋지 마라. 이탤릭체는 아껴라.
• 글자와 배경 화면은 충분히 대조되게 하라.
• 색상을 선택할 때에는 방문자 모두를 고려하라.