-
β βΆββ β γ1μ£Όμ°¨ νμ΅μΌμ§ 첫λ²μ§Έ | UXμ΄λ‘ •κΈ°μ΄ ννΈ 1 | Chapter 1~3 μ 리π―ππ§π€ πππ¨π/πππππππ 2024. 10. 3. 20:00
π μ€λμ ν μΌ π
π» UXμ΄λ‘ •κΈ°μ΄ ννΈ 1 Chapter 1~3 μ 리
π» Chapter 1~3 μ 리
β‘οΈUXλμμΈ?
μ΅κ·Ό κΈ°μ κ²½μλ ₯μμ UXκ° μ°¨μ§νλ μμμ΄ λμ΄μ§κ³ μλ€. μλνλ©΄, μ¬μ€ μ μ μ¬νλλ κ²½μμμ μμ²λ μλ‘μ΄ κ²μ΄ λμ€κΈ° λ³΄λ¨ κΈ°μ‘΄μ κ²μμ λ λμ κ²½νμ ν μ μλλ‘ μ λνκ³ μκΈ° λλ¬Έμ΄λ€.
UX λμμΈμ λͺ©νλ μ μ©μ±κ³Ό λμμ λ§μ‘±μ€λ¬μ΄ μ¬μ© κ²½νμ μ 곡νμ¬ κ³ κ°μ λ§μ‘±κ³Ό μΆ©μ±λλ₯Ό λμ΄λ κ²μ΄λ€. κ·Έκ²μ μν΄μλ λμ μμμ μΌλ€μ λ€λ£¨κ² λλ κ²½μ°κ° λ§μ μ΄λ° μΌμ νλ κ² UX λμμ΄λκ° λ§λ? νλ μκ°μ΄ λ€ μλ μλ€. UXκ° μ¬μ©μκ° μ νμ μ¬μ©νλ κ²½νμ΄λΌλ©΄, UXλμμΈμ κ·Έ κ²½νμ΄ μ΄λ»κ² λ κ²μΈμ§λ₯Ό λμμΈνλ κ²μ΄λ€. κ·Έ κ³Όμ μμ ν΄λΉ λ¨κ³κ° λ²κ±°λ‘μ§ μλλ‘ λ¨κ³λ₯Ό κ°μ νκ±°λ, κΈ°λ₯ μ체λ₯Ό νΈνκ² μμ ν μ μλ€.
UXλμμΈμ μ¬λ¬ λΆμΌμ νλ¬Έλ€μ΄ μ΅ν©λμ΄ μ겨λ νλ¬ΈμΈλ°, κ·Έ νλ¬Έλ€μ μλμ κ°λ€.
Usability μ€μ©μ± Navigation μ¬μ©μκ° μ΄λ»κ² νκ²μ μ°Ύμκ°λκ°? Familiarity μΉμλ, μ νμ΄ μΌλ§λ μ¬μ©μμ λ©ν λͺ¨λΈκ³Ό μ μ¬νκ² λ§λ€μ΄μ‘λκ°? Consistency μΌκ΄μ±, μμ€ν μ μ²μλΆν° λκΉμ§ λμμΈμ ν΅μΌκ°μ μ μ§νλκ°? Error Prevention μλ¬ μλ°© μμ€ν μ μ¬μ©ν λ μ€μλ₯Ό νμ§ μλλ‘ μμ€ν μ΄ ννΈ λ©μμ§λ μλ λ©μμ§λ₯Ό μ λ¬ Feedback νΌλλ°±, μ΄λ ν μ‘μ μ μ·¨νμ λ μ μ ν νΌλλ°±μ΄ μμ΄μΌ μ λλ‘ μμ€ν μ λ°λΌκ°λ κ²μΈμ§ μΈμ§ κ°λ₯ Visual Clarity μκ°μ λͺ λ£μ±, μΈν°νμ΄μ€λ₯Ό λμΌλ‘ λ΄€μ λ κ° μ»΄ν¬λνΈκ° μ΄λ€ μλ―Έλ₯Ό κ°κ³ μ΄λ€ κΈ°λ₯μ νλμ§ μ€ν΄ μμ΄ λ°μλ€μΌ μ μλκ°? Flexibility μ μ°μ±, μ λ°μ΄νΈμ νμμ±μ μ μ°νκ² λμ²ν μ μλ μμ€ν μΈκ°? Efficiency ν¨μ©μ±, μμ€ν μ ν΅ν΄ μ¬μ©μκ° νκ³ μ νλ κ²μ ν μ μμ΄μΌ νλ€. μ¦, μΌλ§λ μΈλͺ¨ μλκ°? Interaction μΈν°λ μ , νλ©΄μ νμ μ΄μΈμ λͺ¨μ μ λν΄ μλ¦Όμ μν μ κ°μ‘°νλ κ², μ μ μΈ κ²λ³΄λ€ λμ μΈ λΆλΆμ μΆκ° β‘οΈλμμΈ νλ‘μΈμ€
μ¬μ©μμ μ΄μΌκΈ°λ₯Ό λ£κ³ , λΆμνκ³ , λμμΈνκ³ , ν μ€νΈνκ³ μ λ°λ³΅ νλ‘μΈμ€.
μ¬λ¬κ°μ§μ λ°©λ²λ‘ νλ‘μΈμ€κ° μλ€.
# Double Diamond
νμ° μλ ΄ νμ° μλ ΄ • λ΄κ° 무μμ λͺ¨λ₯΄λμ§μ‘°μ°¨ λͺ¨λ₯΄λ μνμμ μμ.
• νμ¬ μ¬μ©μμ νν/μ νμ νΉμ±/νΈλ λμ λν μ΄ν΄
• νμ‘΄νλ λ¬Έμ μ λ° κΈ°ν μμΈμ νμ
• μ νμ λμ§ μκ³ κ°λ₯ν λμ λ²μμ 리μμΉλ₯Ό μ§ν
(미리 νλ¨μ λ΄λ €μλ μ λλ€)• Raw λ°μ΄ν°λ₯Ό λΆμνμ¬ μΈμ¬μ΄νΈ/ν€ν©ν° λμΆ
• 리μμΉ κ²°κ³Ό μκ°ν λͺ¨λΈλ§ = Affinity Diagram or User Journey Map
(μ¬μ©μλ€μ΄ μ΄μΌκΈ°νλ κ²μ λμ΄ν΄ κ°μ μμ±μ κ°μ§ κ²λ€λΌλ¦¬ λͺ¨μΌκ³ , λλ§μ κΈ°μ€μ λ§λ€μ΄ ν΅μ¬μ μ μ΄ν΄ν μ μκ² λμμ€λ€.)
• ν 리뷰λ₯Ό ν΅ν΄ Opportunityμ Pain point μ μ
• μλ₯Ό ν΅ν΄ HMW (How might we...) : μ°λ¦¬κ° μ΄λ° κ²μ λ¨Όμ μ μνλ©΄ μ΄λ¨κΉ?• μμ΄λμμ΄μ μ ν΅ν΄ λ¬Έμ ν΄κ²°μ λν μ루μ λμΆ
• μμ΄λμ΄ νκ°λ₯Ό ν΅ν ꡬ체ν
• κ°μ€ μ립 λ° νκ°λ₯Ό ν΅ν λ€μν κ°λ₯μ± νꡬ• νλ‘ν νμ μ μ΄μ©ν κ°μ€ λ° κ΅¬ν μμ μ± κ²μ¦
• ν μ€νΈμ κ°μ μ λ°λ³΅
• κ°λ° λ° μΆμ# Agile Process (=Lean UX Design Process)
ν΅μ¬ κΈ°λ₯λΆν° λ§λλ κ²μ μ°μ λͺ©νλ‘ μΌμΌλ©°, λͺ κ°μ§μ μμΉ νμ μμ§μΈλ€.
μλμ μ°μ μ λκ³ μκΈ° λλ¬Έμ, λΆνμν λ¬Έμμμ μ΄λ μμ¬κ²°μ μ μ€μ΄κ³ , μ μ μΈμμΌλ‘ ν νμ²λΌ μμ§μ΄λ©°, ν° μ λ°μ΄νΈκ° μλ μμ μλΉμ€λ€μ κ·Έλκ·Έλ μ λ°μ΄νΈν κ²μ μμΉμΌλ‘ μΌλλ€.
# UCDC (User Centered Design Canvas)
β μ°λ¦¬κ° λ§λ€κ³ μΆμ κ² β‘ μ μ κ° μνλ κ² β’ μ¬μ©μκ° λλΌλ μ΄λ €μ β£ μ¬μ©μμ λκΈ° μ¬μ©μμ μꡬ (κΆκ·Ήμ μΌλ‘λ μ°λ¦¬ μλΉμ€λ₯Ό μ¬μ©νκ³ μ νλ κ·Όλ³Έμ μΈ λκΈ°) β€ μ¬μ©μκ° μ°λ €νλ κ² β₯ μ¬μ©μκ° λλΌλ μ΄λ €μκ³Ό κ±±μ νλ κ²μ λν΄ μ°λ¦¬κ° μ μν μ μλ ν΄κ²°λ°©μ β¦ μ¬μ©μκ° λ§μ½μ μ°λ¦¬ μλΉμ€λ₯Ό μ¬μ©νμ§ μλλ€λ©΄ μ΄λ€ λμμ΄ μλ? β§ νμ¬μ λΉκ΅νμ λ μ°λ¦¬ μλΉμ€μ μ΄λλ°΄ν°μ§ β¨ κ·ΈλΌμλ λΆκ΅¬νκ³ μ°λ¦¬ μλΉμ€λ₯Ό μ¬μ©ν μλ°μ μλ μ΄μ β© μ°λ¦¬ μλΉμ€λ₯Ό μ¬μ©νμ§ μμ μ΄μ μ λν¬ν λ°Έλ₯ ν¬μ§μ , μ΄ μμ₯μμ μ¬μ©μλ€μκ² μ°λ¦¬ μλΉμ€λ§μ΄ μ 곡ν μ μλ μ μΌν κ°μΉλ? β‘οΈμ¬μ©μ μ‘°μ¬ λ°©λ²
μ¬μ©μ μ‘°μ¬λ λͺ©μ κ³Ό νκ²½μ λ°λΌ λ€μν μ¬μ©μ μ‘°μ¬λ°©λ²λ‘ μ νμ©νμ¬ μ¬μ©μμ λλ¬λλ μ¬μ© ννμ λΉμΈμ΄μ μΈ μꡬμ¬νμ λμΆν΄λ΄λ μ‘°μ¬μ΄λ€.
μ΄ λ, μμλ‘ λ°°λ¬ μλΉμ€ μ΄ν리μΌμ΄μ μ λ§λ€ κ±΄λ° μ°λ¦¬λ λ°°λ¬ μλΉμ€λ₯Ό μ¬μ©νκΈ° λλ¬Έμ μ¬μ©μλΌκ³ ν μ μμ§ μλ? λΌλ μ€λ₯μ λΉ μ§ μ μλ€. κ·Έλ¬λ μ°λ¦¬κ° λ°°λ¬ μλΉμ€λ₯Ό μ¬μ©νλ 건 λ§μ§λ§ μ΄λ―Έ λ°°λ¬ μλΉμ€λ₯Ό λ§λ€λ €κ³ νλ μν©μμ μΌλ° μ¬μ©μμ 곡ν΅μ μΈ μκ°μ 곡κ°νκΈ° μ΄λ ΅κΈ° λλ¬Έμ μΌλ°μ μΈ μ¬μ©μμ κ°μ΄ μκ°ν μ μλ€. κ·Έλ κΈ° λλ¬Έμ νΈν₯λ νΉμ±μΌλ‘ μλͺ»λ 컨μ μ μ ν μ μλ€.
βΆ νλ 리μμΉ : Contextual inquiry
ν΄λΉ μ¬μ©μμκ² "μ°λ¦¬λ μ무κ²λ λͺ¨λ₯΄λκΉ μ°λ¦¬μκ² μ²μλΆν° μλ €μ€λ€κ³ μκ°νκ³ νλν΄μ£ΌμΈμ" λΌκ³ λΆνν μ΄ν κ΄μ°°νλ€.
μ‘°μ¬λͺ©μ λ° λ²μ μ μ μμ : μμ¬λ€μ΄ λ³μμμ μ΄λ€ μλ£μ₯λΉλ₯Ό μ΄λ»κ² μ¬μ©νλμ§ μμ보μ μ‘°μ¬λμ λ° κ·λͺ¨ μμ : μΈλμ§λ£λ₯Ό 보λ μμ¬λ₯Ό λμμΌλ‘ νλ μμ μ€μ μ μΈνλ€ κ°μ΄λ μμ± μμ : 5λ μ°¨ μ΄μ, μκΈμνκ³Ό μ μΈ, μ’ ν©λ²Όμ λμ, μΈλμ§λ£μμ¬, λ°©μ¬λ₯ μ₯λΉ μ μΈ μ¬μ©μ λͺ¨μ§ μμ : μ€μ μ¬μ©μλ₯Ό λμμΌλ‘ 1-2λͺ νμ₯ μ‘°μ¬ μ€μ νμΌλΏν μ€νΈ 보μ/κ°μ νμΌλΏ ν μ€νΈμμμ λ°κ²¬μ μ λ°νμΌλ‘ μμ /보μ λ³Έ μ‘°μ¬ μ€μ μ 체 μ¬μ©μλ₯Ό λμμΌλ‘ μ‘°μ¬ μ€μ β· μ¬μ©μ μ‘°μ¬ μ€κ³ νλ‘μΈμ€
μ‘°μ¬ λͺ©μ μ μ/μ‘°μ¬ λ²μ μ μ → μ‘°μ¬ λ°©λ² μ μ/μ‘°μ¬ λμμ κΈ°μ€ μ μ/μ‘°μ¬ λμμ λͺ¨μ§ → νμΌλΏν μ€νΈ → μ‘°μ¬ μ€ν → κ²°κ³Ό λΆμ
βΈ User Journey Map
μ¬μ©μ μ¬μ μ§λλ₯Ό ν΅ν΄ λ¬Έμ μ μ ꡬ체ννκ³ , UIκ°μ μ ν΅ν΄ ν΄λΉ λ¬Έμ μ μ ν΄κ²°νλ€.
μ¬μ©μ μ‘°μ¬ κ²°κ³Όμ μ¬μ μ§λλ₯Ό λΉκ΅νμ¬ κΈ°μ‘΄μ νμ λ λ¬Έμ μ μ μμΈν μμΈκ³Ό κ·Έ ν΄κ²°λ°©μμ λͺ¨μνλ μλ£λ‘ νμ©λ μ μλ€.
μ¬μ©μ μ¬μ μ§λ μμμλ μ°κ²°λλ λ¨κ³λ‘ νμλμ΄ μμΌλ, μ€μ λ‘λ κ° λ¨κ³λ³λ‘ λ€λ₯Έ μμμκ°μ κ°μ§ μ μλ€.
(μ΄ λ, μμμκ°μ΄ κΈ΄ ꡬκ°μ νμ€ν¬κ° λ§μμμΌ κ°λ₯μ±μ΄ μμΌλ―λ‘ κΈ°ν μμΈμ΄ λ μ μλ€.)
μ‘°μ¬ κ²°κ³Ό → μμΈ νμ → κ°μ νμ λμΆ → κΈ°λν¨κ³Όμ μμλ‘ ννλ€.
βΉ Task Flow : User Journey Map μ΄ν Pain Pointλ₯Ό κ°μ ν μ μλ ν¬μΈνΈλ₯Ό μ°Ύμ μ μλ€.
β‘οΈμμ μ 리
β UCDC μ¬μ©μμ λν μꡬλ₯Ό ν λλ‘ μ°λ¦¬ μλΉμ€λ₯Ό 1μ°¨λ‘ κ²μ¦ β‘ μ¬μ©μ μ‘°μ¬ λ¦¬λ·°λ₯Ό ν΅ν΄ μ¬λ¬κ°μ§ λ°©μμΌλ‘ μ‘°μ¬λ₯Ό νν μ μλ€. νκ² μ€μ ν κ°μ΄λλ₯Ό μμ±ν΄ μ‘°μ¬ μμ β’ User Journey Map μ¬μ μ§λλ₯Ό ν΅ν΄ λ¬Έμ μ μ ꡬ체ννκ³ ν΄κ²°νλ€.
(λ²μ μ§μ ν, νΌμλλ₯Ό μ ν΄ κΈ°μ€ νλͺ©μ μ μνκ³ , μ 보λ₯Ό μ±μ λ£κ³ 리뷰λ₯Ό νλ€.)β£ Task Flow μ¬μ μ§λλ₯Ό ν΅ν΄ UI κ°μ λ°©ν₯μ ꡬ체ννλ€.
(Taskμ λͺ©ν Start μ Endλ₯Ό μ§μ ν ν, λμ λλ¬νκΈ° μν μ¬μ©μμ λͺ¨λ νλμ κΈ°μ νλ€. κ·Έ λ€μ λΆκΈ°λ³λ‘ μμ¬κ²°μ μμΈμ μΆκ°νκ³ , Pain Point λ Opportunityκ° μλ€λ©΄ κΈ°μ¬. λ³λλ‘ λ°μν κ°λ₯μ±μ΄ μλ μλ리μ€λ μΆκ°νλ€.)β€ Story Map μ‘°μ¬λ₯Ό ν΅ν΄ μ¬μ©μμ λν μ 보λ₯Ό ν λλ‘ BackBoneμ λ§λ€κ³ μΌλ ¨μ νλ Storyλ₯Ό λ§λ λ€. μ΄ νλ Storyμμ μ΄λ€ νλμ΄ ν¨κ» μλ°λ μ§λ₯Ό μ΄μΌκΈ°μ μΆκ°νλ€. μ΄λ₯Ό νλ λ¨μλ‘ κ·Έλ£Ήννμ¬ μ°μ μμλ₯Ό λλλ€.
μ΄ λ, MVPλΌκ³ νλ μ΅μνμ μ 곡λμ΄μΌ νλ μλΉμ€λ₯Ό μ°μ μ μΌλ‘ μΆμνμ¬μΌ νλ€.
(μμ : μΌνλͺ°μμλ λΉ λ₯Έ κ²°μ κ° μ΄λ£¨μ΄μ ΈμΌ νλλ° κ΅³μ΄ 2μ°¨ 보μμ κ±Έμ΄μΌ ν κΉ? μ΄κ²μ λ¬Έμκ° λ€μ΄μ€κ±°λ νμν μ μΆκ°νμ.)'π―ππ§π€ πππ¨π > πππππππ' μΉ΄ν κ³ λ¦¬μ λ€λ₯Έ κΈ