UX Design - Lectures

21.4.2025 - 23.6.2025 (Week 1 - Week 10)
Chong Hui Yi / 0363195
UX Design / BDCM
Lecturers

---

LECTURES

Week 1:

Introduction to UI-UX

• UX = User Experience → How it works
• UI = User Interface → How it looks
• UX is a process, UI is a deliverable
• Good UX comes first, then UI
• A product needs both to succeed
• "UX without UI is like a skeleton; UI without UX is just decoration."

UI vs UX vs CX

UI (User Interface)

• Visual design: colours, buttons, icons, layout
• Guides users through screens
• Makes the product look good and interactive

UX (User Experience)

• User feelings and satisfaction
• How easy and enjoyable it is to use
• Includes research, usability, testing

CX (Customer Experience)

• Full journey with the brand (online + offline)
• Includes customer service, social media, in-store
• Goal: happy customers = brand loyalty and more revenue

User-Centred Design (UCD)

• Put users at the centre
• Involve users from the start to the end
• Focus on usability: easy, useful, clear
• 4 Phases:

1. Understand users
2. Design solutions
3. Test with users
4. Improve based on feedback

UI-UX Skillsets & Trends

UI Designer

• Focus: Look and feel
• Skills: branding, layout, responsive design, animation
• Works with developers + UX team

UX Designer

• Focus: Usability and function
• Skills: user research, wireframing, testing, strategy
• Looks at both online & offline experiences

Good vs Bad UX Design

• Good design is invisible, bad design is frustrating.
• Example: Norman Doors – look like you should push, but you need to pull.
• Bad UX = Confusing / Misleading / Needs extra instructions
• Good UX = Intuitive / Clear / Predictable

Characteristics of Good UX Design (4Es)

Usable

• Easy to use and understand
• Clear actions and feedback
• Example: Ride-hailing app with easy destination input

Equitable

• Inclusive for all users (age, race, ability, etc.)
• Example: Emojis with skin tones, accessible UI

Enjoyable

• Makes user happy
• Inspires and delights
• Example: Music app recommends songs you like

Useful

• Solves real user problems
• Adds value
• Example: Map app suggests faster routes automatically

Week 2:

User Profiling

Classifies users into:

1. Primary: direct users
2. Secondary: occasional or indirect users
3. Tertiary: those affected by or making decisions about the system

# Understanding users’ backgrounds helps predict their expectations and behaviour.

Week 3:

User Journey Map

# A user journey map is a visual representation of the steps a user takes to achieve a goal.

Key Components:

• Actor
• A specific user or persona (e.g. a university student).
• Each journey map focuses on one actor’s experience.
• Scenario & Expectations
• A situation that reflects the user’s goal or need.
• Can be based on existing products or future concepts.
• Journey Phases
• High-level stages of the user’s experience (e.g. Discover → Try → Buy → Use).
• Vary by scenario (e.g. e-commerce vs. B2B).
• Actions, Thoughts, Emotions
• Actions: Key user behaviours during each phase (not every micro-step)
• Mindsets: What the user is thinking, feeling, or wondering.
• Emotions: Mapped across the journey, showing emotional highs and lows.
• Opportunities
• Insights into what can be improved, who is responsible, and how to measure success.

Approaches:

• Research-First Approach
• Conduct in-depth user research first (takes 3–12 weeks).
• Best for comprehensive understanding.
• Hypothesis-First Approach
• Internal workshop creates a draft map based on assumptions.
• Later validated through real user research.
• Quick-Fire Approach
• 60–90-minute working session for urgent issues.
• Useful when problem is well-known and needs fast visualisation.

Week 5:

# How might we (HMW): A question that helps us explore ideas or potential solutions for the problem we need to solve.

# A good “How might we...” statement sparks imagination and users teams into ideation.

# “Crazy 8” is a fast brainstorming method where you sketch 8 ideas in 8 minutes, focusing on quantity over quality.

Week 6:

Week 10:

Usability Testing

• What: When you solicit feedback, about the prototypes you have created, from your users
• Why: To refine prototypes and solutions
• How: Show, don’t tell

Characteristics of Usability Testing:

• Clear goals and concerns
• Real users participate
• Realistic tasks
• Observation & recording
• Data analysis & design changes

Steps for Conducting Usability/User Testing:

1. Defining Usability Goals and Concerns: effectiveness, efficiency, satisfaction, learnability, safety, memorability, utility.
2. Deciding who are your participants: Refer to user profile and user persona
3. Identifying Scenarios and Tasks: 
   - Focus on key concerns
   - Target possible usability issues
   - Use real user goals and actions
   - Base on your experience and context
4. Deciding how to measure Usability
5. Running the usability test
6. Analysing data and usability result
7. Disseminating usability results and design recommendations to the product development team

---

FEEDBACK

-

---

REFLECTION

-