Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Designing for
UX Innovate Program | 2014.02.18
Khong Chee Weng
Universal Usability & Interaction Design (UUID) SIG
Interfa...
Functional
Spec
UI/UX Wireframes
Visual
Design
A typical UI-UX Project
This is reasonable, but the process is NOT GOOD eno...
UX starts with People
UX focuses on having a deep understanding of USERS,
what they need,
what they value,
their abilities,
and also their limit...
(Source: Google, 2013)
:: Involving USERS
from the beginning &
throughout the design
process.
::Designing for Your
Users
It is all about making
y...
USABILITY is at the
heart of the user
experience (UX).
Poor usability can
lead users to abandon
sites and it can cost
busi...
(Source: www.goodui.org)
Minimalist Design
(Source: onetrapixel, 2013)
Skeuomorphism vs. Flat Design
(Source: Vukovic, 2013)
Typical 404 Error Webpages
User-friendly Error Webpage
User-friendly Error Webpage
A B
(Source: Interaction Design Foundation)
Mapping refers to the relationship between an object, either in the physical o...
Top-down
support
and
implementation
User Research
Design Ethnography on Mobile Application & Social Interactions
© 2014. Interface Design Dept., FCM, MMU
User persona
User Persona & Scenario
© 2014. Interface Design Dept., FCM, MMU
© 2014. Interface Design Dept., FCM, MMU
Focus Group for Future Service Design
© 2014. Interface Design Dept., FCM, MMU
Icon Design Development:
Mom-i Case Study
© 2014. Interface Design Dept., FCM, MMU
© 2014. Interface Design Dept., FCM, MMU
Lo-fi Prototyping & Wireframe
Lo-fi Prototyping & Wireframe
© 2014. Interface Design Dept., FCM, MMU
Lo-fi Prototyping & Wireframe
© 2014. Interface Design Dept., FCM, MMU
Lo-fi Prototyping & Wireframe
© 2014. Interface Design Dept., FCM, MMU
© 2014. Interface Design Dept., FCM, MMU
Hi-fi Prototyping
(Extract from http://ewamalaysia.com.my/ (October 2011)
Web UI Prototyping (Before)
© 2014. Interface Design Dept., FCM, MMU
Web UI Prototyping (After): Windows 8
Usability Testing
© 2014. Interface Design Dept., FCM, MMU
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
L...
© 2014. Interface Design Dept., FCM, MMU
Heuristic/Expert Review:
UI Issue & Design Recommendations
• quick feedback with ...
The UX machine
(Source: keepitusable)
Khong Chee Weng
Universal Usability & Interaction Design (UUID) SIG
Interface Design Department | Faculty of Creative Mult...
UX Experience Design: Processes and Strategy
UX Experience Design: Processes and Strategy
UX Experience Design: Processes and Strategy
UX Experience Design: Processes and Strategy
UX Experience Design: Processes and Strategy
UX Experience Design: Processes and Strategy
Upcoming SlideShare
Loading in …5
×

UX Experience Design: Processes and Strategy

8,611 views

Published on

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.

UX Experience Design: Processes and Strategy

  1. 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. 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. 3. UX starts with People
  4. 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. 5. (Source: Google, 2013)
  6. 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)
  7. 7. 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.
  8. 8. (Source: www.goodui.org)
  9. 9. Minimalist Design (Source: onetrapixel, 2013)
  10. 10. Skeuomorphism vs. Flat Design (Source: Vukovic, 2013)
  11. 11. Typical 404 Error Webpages
  12. 12. User-friendly Error Webpage
  13. 13. User-friendly Error Webpage
  14. 14. 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
  15. 15. Top-down support and implementation
  16. 16. User Research Design Ethnography on Mobile Application & Social Interactions © 2014. Interface Design Dept., FCM, MMU
  17. 17. User persona User Persona & Scenario © 2014. Interface Design Dept., FCM, MMU
  18. 18. © 2014. Interface Design Dept., FCM, MMU Focus Group for Future Service Design
  19. 19. © 2014. Interface Design Dept., FCM, MMU
  20. 20. Icon Design Development: Mom-i Case Study © 2014. Interface Design Dept., FCM, MMU
  21. 21. © 2014. Interface Design Dept., FCM, MMU Lo-fi Prototyping & Wireframe
  22. 22. Lo-fi Prototyping & Wireframe © 2014. Interface Design Dept., FCM, MMU
  23. 23. Lo-fi Prototyping & Wireframe © 2014. Interface Design Dept., FCM, MMU
  24. 24. Lo-fi Prototyping & Wireframe © 2014. Interface Design Dept., FCM, MMU
  25. 25. © 2014. Interface Design Dept., FCM, MMU Hi-fi Prototyping
  26. 26. (Extract from http://ewamalaysia.com.my/ (October 2011) Web UI Prototyping (Before)
  27. 27. © 2014. Interface Design Dept., FCM, MMU Web UI Prototyping (After): Windows 8
  28. 28. Usability Testing © 2014. Interface Design Dept., FCM, MMU
  29. 29. 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
  30. 30. © 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
  31. 31. The UX machine (Source: keepitusable)
  32. 32. Khong Chee Weng Universal Usability & Interaction Design (UUID) SIG Interface Design Department | Faculty of Creative Multimedia Multimedia University | cwkhong@mmu.edu.my

×