A presentation on UX Experience Design: Processes and Strategy by Dr Khong Chee Weng from Multimedia University at the UX Indonesia-Malaysia 2014 that was conducted on the 26th April 2014 in the Hotel Bidakara, Jakarta, Indonesia.

1. Designing for
UX Innovate Program | 2014.02.18
Khong Chee Weng
Universal Usability & Interaction Design (UUID) SIG
Interface Design Department | Faculty of Creative Multimedia
Multimedia University | cwkhong@mmu.edu.my

2. Functional
Spec
UI/UX Wireframes
Visual
Design
A typical UI-UX Project
This is reasonable, but the process is NOT GOOD enough!
Clients

3. UX starts with People

4. UX focuses on having a deep understanding of USERS,
what they need,
what they value,
their abilities,
and also their limitations.
User’s
Needs
Business
Needs
UX

5. (Source: Google, 2013)

6. :: Involving USERS
from the beginning &
throughout the design
process.
::Designing for Your
Users
It is all about making
your design usable.
(Norman on ‘Thoughtful Design’,
2008)

8. USABILITY is at the
heart of the user
experience (UX).
Poor usability can
lead users to abandon
sites and it can cost
businesses thousands
and thousands of
dollars.

9. (Source: www.goodui.org)

10. Minimalist Design
(Source: onetrapixel, 2013)

11. Skeuomorphism vs. Flat Design
(Source: Vukovic, 2013)

12. Typical 404 Error Webpages

13. User-friendly Error Webpage

14. User-friendly Error Webpage

16. A B
(Source: Interaction Design Foundation)
Mapping refers to the relationship between an object, either in the physical or virtual world, and its functions.
UX and Mapping

18. Top-down
support
and
implementation

20. User Research
Design Ethnography on Mobile Application & Social Interactions
© 2014. Interface Design Dept., FCM, MMU

21. User persona
User Persona & Scenario
© 2014. Interface Design Dept., FCM, MMU

22. © 2014. Interface Design Dept., FCM, MMU
Focus Group for Future Service Design

23. © 2014. Interface Design Dept., FCM, MMU

24. Icon Design Development:
Mom-i Case Study
© 2014. Interface Design Dept., FCM, MMU

25. © 2014. Interface Design Dept., FCM, MMU
Lo-fi Prototyping & Wireframe

26. Lo-fi Prototyping & Wireframe
© 2014. Interface Design Dept., FCM, MMU

27. Lo-fi Prototyping & Wireframe
© 2014. Interface Design Dept., FCM, MMU

28. Lo-fi Prototyping & Wireframe
© 2014. Interface Design Dept., FCM, MMU

29. © 2014. Interface Design Dept., FCM, MMU
Hi-fi Prototyping

30. (Extract from http://ewamalaysia.com.my/ (October 2011)
Web UI Prototyping (Before)

31. © 2014. Interface Design Dept., FCM, MMU
Web UI Prototyping (After): Windows 8

33. Usability Testing
© 2014. Interface Design Dept., FCM, MMU

34. 4.02 4.14 4.16 4.23 4.04
0
1
2
3
4
5
6
7
Overall
Reaction to
Software
Performance
Screen Terminology
& Software
Feedback
Learning Software
Capabilities
AverageRating
Categories
Overall User Satisfaction Rating
Rating
User Satisfaction Rating
Overall user satisfaction scores towards ABC Software is 4.11 out of 7.00.
© 2014. Interface Design Dept., FCM, MMU

35. © 2014. Interface Design Dept., FCM, MMU
Heuristic/Expert Review:
UI Issue & Design Recommendations
• quick feedback with limited resources
• 5-6 respondents (1-2 experts and 4-5 novice users)
• uses a simple set of design/UI rules where quick judgement
can be made on the design/system being evaluated
• conducted in-house or anywhere convenient

36. The UX machine
(Source: keepitusable)

38. Khong Chee Weng
Universal Usability & Interaction Design (UUID) SIG
Interface Design Department | Faculty of Creative Multimedia
Multimedia University | cwkhong@mmu.edu.my