🎨 UX UI

μŠ€ν„°λ”” 2μ£Όμ°¨

였브 πŸ§™‍♂️ 2023. 8. 13. 02:25

HCI 와 UX에 λŒ€ν•œ μ „λ°˜μ μΈ 이해

<aside> πŸ’‘ 1κ°• ~ 3κ°• http://hci.yonsei.ac.kr/html/lecture/hci-introduction.html

</aside>

HCI

  • μ‚¬λžŒλ“€μ΄ μœ μš©ν•˜κ³  νŽΈλ¦¬ν•˜κ³  즐겁게 μ‚¬μš©ν•  수 μžˆλŠ” digital artifiact의 μ°½μ‘° 및 평가
  • 페이슀뢁, κ²Œμž„ 같은 디지털 컨텐츠 등이 μ˜ˆμ‹œκ°€ 됨
  • λͺ©ν‘œ : μ‚¬λžŒλ“€μ˜ 삢을 μ§ˆμ„ 높여쀄 수 μžˆλŠ” λ””λ°”μ΄μŠ€, μ„œλΉ„μŠ€, 컨텐츠λ₯Ό λ§Œλ“€κ³  κ΅¬ν˜„ν•˜λŠ” 것
  • HCI 1.0→ HCI 2.0 κ°œμΈμ—μ„œ λ‹¨μ²΄λ‘œ λ²”μœ„κ°€ 컀짐
  • 컴퓨터가 우리 μƒν™œμ—μ„œ 많이 λ…Ήμ•„μžˆκΈ° λ•Œλ¬Έμ— μ€‘μš”μ„±μ΄ μ»€μ§€λŠ” 것
  • 차별화에 μ€‘μš”ν•œ 역할을 함
  • μ‚¬μš©ν•˜λŠ” 도ꡬ가 컴퓨터화 되고, κ·Έ 도ꡬ듀이 λ„€νŠΈμ›Œν¬λ‘œ μ—°κ²°λ˜κΈ° λ•Œλ¬Έμ— μ€‘μš”μ„±μ΄ 컀진닀고 λ³Ό 수 있음

INTERFACE / INTERACTION / EXPERIENCE

  • μ‚¬λžŒ μͺ½μ— 더 κ°€κΉŒμš΄μ§€, 기계 μͺ½μ— 더 κ°€κΉŒμš΄μ§€κ°€ 기쀀이 됨
  • 기계 μͺ½μ— 더 κ°€κΉŒμš°λ©΄ INTERFACE, μ‚¬λžŒ μͺ½μ— 더 κ°€κΉŒμš°λ©΄ EXPERIENCE, κ·Έ 쀑간을 λ‹€λ¦¬μ²˜λŸΌ μ΄μ–΄μ£ΌλŠ” 것이 INTERACTION
  • INTERFACE μ˜ˆμ‹œ : 사진을 μ–Όλ§ˆλ‚˜ 크게 ν•˜κ³ , μ€‘μš”ν•œ μ‹ λ¬Έ μΉΌλŸΌμ„ 어디에 λ°°μΉ˜ν• μ§€ κ³ λ―Όν•˜λŠ” 것
  • EXPERIENCE μ˜ˆμ‹œ : μ• ν”Œκ³Ό μ‚Όμ„±μ˜ λ…ΌμŸ (μ‚¬μš©μžκ°€ μ–΄λ–»κ²Œ λŠκΌˆλŠ”μ§€κ°€ μ€‘μš” 쟁점)

ν™œμš©λ  수 μžˆλŠ” λΆ„μ•Ό

  • product innovation - ν•Έλ“œν°
  • service innovation - SNS
  • content innnovation - 온라인 κ²Œμž„
  • social innovation - μ •λΆ€, μ‚¬νšŒμ  κΈ°μ—…
  • communication innovation - λͺ¨λ°”일 인터넷, 디지털 방솑

UX

  • μ‚¬μš©μžκ°€ μ œν’ˆμ΄λ‚˜ μ„œλΉ„μŠ€λ₯Ό μ‚¬μš©ν•˜λ©΄μ„œ μ–»κ²Œ λ˜λŠ” λͺ¨λ“  감정과 지각과 인지적인 κ²°κ³Ό
  • INTERFACE 보닀 EXPERIENCE에 더 κ°€κΉŒμ›Œμ§€λ©΄μ„œ 생긴 λ³€ν™”
    • humane and soft
    • strategic but abstract
    • contextual but contingent
  • HOWκ°€ μ€‘μš”
  • HCIλΌλŠ” 뢄야에 UXλΌλŠ” 골이 μžˆλŠ” 것

UX에 λŒ€ν•œ 세뢀적인 λͺ©ν‘œ

  • μ˜ν™”κ³„
    • μ„Έ κ°€μ§€μ˜ κ²½ν—˜ μš”μ†Œ
    1. 사고적 μˆ˜μ€€
    2. μ˜ν™”κ°€ μ œκ³΅ν•˜κ³ μž ν•˜λŠ” λ©”μ‹œμ§€κ°€ κ΄€κ°μ—κ²Œ μ •ν™•ν•˜κ²Œ μ „λ‹¬λ˜μ–΄μ•Ό 함
    3. 행동적 μˆ˜μ€€
    4. μ˜ν™” μŠ€ν† λ¦¬κ°€ λ„ˆλ¬΄ 빨리 μ§„ν–‰λ˜μ–΄μ„œ 이해할 수 μ—†κ±°λ‚˜ λ„ˆλ¬΄ 늦게 μ§„ν–‰λ˜μ–΄μ„œ μ§€λ£¨ν•˜μ§€ 말아야 함
    5. 감성적 μˆ˜μ€€⇒ 이 3가지 κ²½ν—˜ μš”μ†Œκ°€ μžˆμ–΄μ•Ό 졜적의 κ²½ν—˜μ„ ν•œλ‹€.
    6. μ˜ν™”κ°€ μ£ΌλŠ” 감각적 자극이 μ˜ν™”μ˜ μ£Όμ œμ— 맞게 μ μ ˆν•΄μ•Ό 함
  • 이런 μš”μ†Œκ°€ UX에선 μœ μš©μ„±, μ‚¬μš©μ„±, 감성 μž„.
    1. μœ μš©μ„±
    • μ›λž˜ ν•˜λ €κ³  ν–ˆλ˜ μš©λ„λ₯Ό μΆ©λΆ„νžˆ μˆ˜ν–‰ν•˜λŠ”κ°€? (USEFULNESS)
    1. μ‚¬μš©μ„±
    • κ·Έ κΈ°λŠ₯을 μ–Όλ§ˆλ‚˜ 쉽고 νŽΈλ¦¬ν•˜κ²Œ ν•˜λŠ”κ°€? (USEABILITY)
    • HCI의 μ‹œμž‘
    (+) μœ μš©μ„±μ€ efficiency VS μ‚¬μš©μ„±μ€ effectiveness (νš¨κ³Όμ„± VS νš¨μœ¨μ„±)
    1. 감성
    • μ‚¬μš© ν›„ 무엇을 느끼고 μ–΄λ–€ 생각을 ν•˜λŠ”κ°€? (AESTHETIC)

λͺ¨λ“  λ””λ°”μ΄μŠ€κ°€ κ°€μ§€λŠ” 3가지 μš”μ†Œ

  1. ꡬ쑰
  2. 행동
  3. 양식(ν‘œν˜„)

πŸ”¨ν›„κΈ°

  • μ΄λ²ˆμ£ΌλŠ” 디지털 ν…ŒλΌλ…ΈμŠ€ν‹±μŠ€μ— λ°°μ› λ˜ κ°œλ…λ“€μ— 더 집쀑해 μ‚΄νŽ΄λ³Ό 수 μžˆμ–΄μ„œ μ’‹μ•˜λ‹€.
  • HCI와 UX의 차이가 ν—·κ°ˆλ ΈλŠ”λ° 정리할 수 μžˆμ–΄ μ’‹μ•˜λ‹€.
  • μŠ€ν„°λ””ν•˜λ©΄μ„œ λ”°λ‘œ UX 책을 읽고 μžˆλŠ”λ°, κ·Έ μ±…μ—μ„œ λ‚˜μ˜¨ 더블 닀이아λͺ¬λ“œ 방법둠과 μ—°κ²°λ˜λŠ” λ‚΄μš©μ΄ λ‚˜μ˜€λ‹ˆ 더 재미있게 곡뢀할 수 μžˆμ—ˆλ‹€.