본문 바로가기

UX ⁄ UI

1장 문제를 정확히 파악하고 제대로 해결하는 디자인 - 사용자를 끌어들이는 UX/UI의 비밀


2022 우아한스터디 - UX 패턴파인더 스터디

 

4가지 영역으로 구성된 "사용자를 위한 디자인 프레임워크"를 되새기면, 타겟 고객이 현실에서 맞닥뜨리는 문제에 관한 통찰에 기반해 작업을 하고 있다는 확신을 가질 수 있다.

  1. 컨텍스트: 사용자는 누구인가?
  2. 목표: 사용자는 무엇을 하고자 하는가?
  3. 리서치: 사용자의 전후 사정과 목표를 이해하는 방법
  4. 패턴: 인터페이스 디자인과 관련된 사용자 인식과 행동

 

 

사용자를 둘러싼 컨텍스트 파악하기


01 인터랙션은 대화처럼

  • 소프트웨어는 사람처럼 자율적으로 판단하여 상황에 빠르게 반응하지 못한다.
  • 따라서 인터페이스와 사용자가 피드백을 자연스럽게 주고받으려면, 사람이 대화하는 방식을 모방하도록 소프트웨어를 디자인해야한다.
  • 상대가 이해하기 쉽게 이야기해야하고, 활성상태라는 신호를 보내야하고, 응답중이라는 상태도 분명히 표시해야한다.
  • 사려깊은 사람이 대화하는 상대방을 배려하는 것처럼 다음에 해야할 일이나 조언을 제시해 줄 수도 있다.


02 콘텐츠와 기능을 사용자에게 맞춰라

  • 사용자에게 얼마나 많은 자유를 허용할 것인지 선택해야 한다.
  • 인터페이스의 자유도가 지나치게 높으면 무엇을 해야할지 모르는 상태로 멍하게 있을 수 있다. 단, 숙련된 사용자라면 열린 인터페이스에서 주도적으로 많은 작업을 수행할 수 있으므로 이는 사용자에게 만족스러운 경험을 제공한다.
  • 인터페이스의 자유도가 거의 없으면 사용자는 갇혀있는 것 같은 답답함을 느낄 것이다. 단, 빠르게 잘 작동하면 사용자의 선택범위가 좁고 명확해서 효율적이고 만족스러운 경험을 할 수 있다.

 

03 숙련도에 따라 달라지는 것들

  • 사용자의 툴 관련 지식 수준을 어떻게 가정하는지에 따라 인터페이스가 달라진다.
  • 화면 공간 사용이나 레이블, 위젯의 복잡도, 도움말의 위치 등이 달라지는 것이다.

 

04 인터페이스는 목표를 달성하는 수단일 뿐

  • 사람들이 소프트웨어 같은 툴응 사용하는 이유가 바로 사용자의 목표다.
  • 사용자의 목표는 보통 다음과 같다.
    • 발견, 배움, 거래, 제어나 관찰, 만들기, 대화, 즐거움

05 '왜?' 라고 또 묻기

  • 인터페이스를 디자인하는 첫 단추는 사용자가 무엇을 완료하려고 하는 것인지 아는 것이다.
  • 폼을 작성하는 일은 그 자체가 목표일 리 없다. 온라인에서 구매를 하기 위해, 운전면허를 갱신하기 위해 폼을 작성하는 것이다.


06 문제를 정확히 파악하고 제대로 해결하기

  • 사용자를 한 가지 태스크 중심의 목표를 염두에 두고 몇 가지 단순한 유스케이스를 수행하는, 하나의 '얼굴 없는 사용자'로 여기기 쉽다.
  • 하지만 그것은 사용자들의 현실을 충분히 반영하지 못한다.
  • 디자인을 잘 하려면 사용자의 기대, 본능적 반응, 선호도, 사회적 맥락, 신념과 가치 등 여러 미묘한 요소를 고려해야 한다.
  • 실제 사용자들이 어떤 사람인지, 어떻게 생각하고 느끼는지 발견하는데 집중해야 한다.

 

사용자를 있는 그대로 이해하는 법


  • 사용자를 발견하는 일은 투자다. 장기적으로 더 나은 디자인, 즉 올바른 문제를 해결하고 목적에 부합하는 디자인으로 돌아온다.
  • 같은 사람이 두 소프트웨어를 사용하더라도, 각 소프트웨어 기대하는 수준은 다르다.
  • 한 사람이 어려워하는 것을 다른 사람은 쉽다고도 한다.
  • 사용자를 제대로 이해하기 위해서는 사용자의 목표, 사용자가 수행해야할 태스크와 거기에 사용된 표현(언어/단어) 등을 파악해야 한다.

 

 

인터페이스에서 사람들은 무슨 생각을 하고 어떻게 행동할까?



01 안전한 탐색 Safe Exploration

"길을 잃거나 곤경에 빠지지 않고 탐험할 수 있게 해줘"

  • 애플리케이션에서 '뒤로 가기'라고 생각한 버튼을 눌렀는데 이전화면으로 돌아가지 않는다면, 사용자는 탐색 도중에 길을 잃고, 앱 자체를 삭제할 수도 있다.


02 즉각적 만족 Instant gratification

"나중에 말고 바로 지금, 이걸 하고 싶어."

  • 사람들은 행동을 하면 어떤 결과가 나타나는지 바로 보고싶어 한다.

 

03 만족화 Satisficing

"이 정도면 충분해. 더 잘하는 법을 배우는 데 시간을 쓰고 싶지 않아."

  • '만족화 Satisficing'은 '만족스러운 Satisfying'과 '충분한 Sufficing'의 합성어이다.
  • 많은 사용자들은 시스템을 일정 기간 사용하고 나면 특이한 습관을 갖게 되는데, 이는 만족화 현상 때문이다.
  • 오래전 한 사용자가 어떤 일을 하기 위해 A 방법을 배웠다. 이 사용자는 추후에 시스템에서 더 좋은 대안인 B방법을 제시하더라도 새로 배우려 하지 않는다.


04 중도에 바꾸기 Changes in Midstream

"하다가 중간에 마음이 바뀌었어."

  • 여러분이 설계한 인터페이스를 사용하는 동안 사용자의 목표는 바뀌게 마련이다.
  • 제품 리뷰를 찾으려고 아마존에 접속했다가 책을 사기도 한다. 
  • 사용자가 마음을 바꿀 수 있는 기회를 제공해야 한다는 의미다.
  • 이유 없이 사용자가 다른 페이지나 기능에 접근하지 못하도록 선택권을 박탈하지 말라.


05 선택 미루기 Deferred Choices

"지금은 응답하고 싶지 않아, 일단 이걸 완료하게 해줘."

  • 태스크에 집중한 사람에게 중간에 불필요한 질문을 던지면, 사용자는 질문을 건너뛰고 나중에 답하고 싶어한다.
  • 꼭 사용자가 작성해야하는 폼이라면 필수 항목과 선택항목을 분명히 구분하라.


06 점진적 창조 Incremental Construction

"이 코드 좀 바꿀래. 약간 이상해보이는데, 다시 바꿀게. 이제 괜찮군!"

  • 뭔가를 만들 때 정확한 순서를 밟아 가면서 작업하는 사람은 거의 없다.
  • 제작 및 편집용 인터페이스에서는 사용자가 작업을 수정한 결과를 곧바로 확인할 수 있어야한다.
  • 사용자가 사소한 수정을 하고 결과를 보기까지 30초나 기다려야한다면, 집중력은 깨져버린다. 


07 습관화 Habituation

"다른 곳에서는 다 작동하는 제스처가 여기서는 왜 안 돼?"

  • Ctrl+X 잘라내기, Ctrl+V 붙여넣기, Ctrl+S 저장하기


08 짬시간 활용 Microbreaks

"지금 지하철을 기다리고 있어. 2분 동안 쓸모 있는 일을 하고 싶어"

  • 짬시간 활용을 잘 지원하려면 접근하기 쉽고 빠른 활동을 제공해야 한다.
  • 로딩이 한참 걸리면 안된다.
  • 로그인 해야한다면, 매번 로그인할 필요가 없도록 기존 로그인 정보를 기억하라.


09 공간 기억 Spatial Memory

"분명 그 버튼이 1분 전에는 여기 있었는데, 어디 갔지?"

  • 사람들은 기존에 편집하던 작업물이나 문서를 찾을 때, 이름이 아니라 위치로 기억한다.
  • 사용자가 요청한 게 아니면 파일을 재정렬하지 말라.


10 미래 계획 기억 Prospective Memory

"일단 여기에 메모해 두고 나중에 처리하려고"

  • 사용자의 미래 계획 기억을 보조하자.
  • 누군가 입력 폼을 중간까지 입력하고 잠시 닫으면, 다음 진행을 위해 데이터를 보존할 수 있다.


11 능률적 반복 Streamlined Repetition

"이걸 얼마나 반복해야 하지?"

  • 사용자는 종종 했던 작업을 반복해서 수행해야 한다. 반복 작업을 간소화하는 방법을 사용자에게 제공하는 게 중요하다.
  • 반복 작업은 쉬울수록 좋다.
    • 단축키 한 번이나 클릭 한 번으로 해결할 수 있다면 좋다.
    • 또는 모든 반복 작업을 키를 연속해서 누르거나 연속 클릭해서 한번에 끝낼 수 있다면 더욱 좋다.


12 키보드만 사용하기 Keyboard Only

"마우스를 쓰지 않게 해줘."

  • 마우스 사용을 힘들어하는 사람
  • 키보드와 바꿔 가며 쓰는 데에 시간과 노력이 들어서 마우스를 싫어하는 사람
  • 장애로 인해 화면을 볼 수 없는 사람


13 소셜 미디어(Social Media), 소셜 프루프(Social Proof), 협업(Collaboration)

"다른 사람은 어떻게 생각할까?"

  • 소프트웨어에 사회적 역학 관계를 일으키면 참여율이 올라가고, 입소문이 퍼지고, 커뮤니티가 형성되고, 성장률이 높아진다.
  • 사회적 기능을 보여주는 예시는, 사용자가 생성한 리뷰와 댓글, 소셜미디어에서 만드는 모든 것, 토론 스레드 등이 있다.

 

 

내용출처: 사용자를 끌어들이는 UX/UI의 비밀(제니퍼 티드웰, 찰스 브루어, 아인 발렌시아 저)