quick hello from
User Experience (UX)
BY: FOKHRUZ ZAMAN: BESHTO, IPAPHOLICS, A2I ….
MASRUR HANNAN: BONOLOTA DESIGN, MNHS
M...
Disclaimer:
This introductory UX session will NOT guarantee that
the participants will develop the ability to produce
supe...
Discussion topics
1. What is User Experience (UX)
2. ROI of UX
3. Mobile UX
4. How to design User's Experience
5. UX, U, U...
IDEO experience from 1997-1998
Fokhruz Zaman’s
working experience with
Quick hello from UX - at ‘Mobile Monday’ – Dhaka Ch...
What is User Experience (UX)?…
Generally speaking
User's experience when using any product/ service …
Quick hello from UX ...
Quick UX examples from daily life …
Digital Camera operations
TV Remotes – different TVs, different types
Quick hello from...
User Experience (UX) …. with DOORS!
How about Doors?! … Some you push, some you pull, some slide.
Note: all doors have cer...
Things we do and use everyday …
the super awesome mobile apps
YOU produce, if lucky - will be
ONE of such 20,000 things yo...
Origins of User Experience
Various principles of
psychology – that make
things Understandable and
Usable for humans.
Quick...
Business viewpoints for UX
Scout Stevenson,
Creative Director at
Extension Engine
Harvard i-lab
UX Design: An Introduction...
Business viewpoints for UX
Robert Fabricant, Vice President of Creative for frog (Apple's UX firm)
at Harvard Business Rev...
Business viewpoints for UX
Instagram’s $1 billion USD takeover by Facebook
Robert Fabricant, Vice President of
Creative fo...
UX design – global practices
Top UX/ design firms of the worldVarious top Silicon Valley companies that practice UX
Quick ...
ROI of UX … doodle video from HFI and NN/g
article
www.youtube.com/watch?v=O94kYyzqvTc
Quick hello from UX - at ‘Mobile Mo...
Designing GOOD User Experience ..
Possible
UX is a field of it's own, based on the principles of –
• Human Computer Intera...
User Experience (UX) design … how
to
Designing GREAT products that bring people JOY!
• Quick rule of thumbs for good UX: I...
User Experience (UX) design …
continued
No squinting eye-brows for users …
Don’t Make Me
Think, by Steve
Krugg. Page: 13
h...
User Experience (UX) design …
continued
“WHAT WE DESIGN FOR… THE REALITY…”
Don’t Make Me
Think, by Steve
Krugg. Page: 21
h...
User Experience (UX) design …
continued
“What designers build – What users see”
Quick hello from UX - at ‘Mobile Monday’ –...
User Experience (UX) design …
continued
How do various product owner stakeholders see the same interface
Don’t Make Me
Thi...
How to design User's Experience …
how to 2
Various Methodologies – following the same principles
The Strategy Plane
User n...
How to design User's Experience …
how to 3
Considering the Bangladeshi development context, based on the following
resourc...
How to design User's Experience …
how to 4
1.Initial research, ideation, inspiration hunt and concept finalization
2.Proto...
Initial research … Information Ecology
[Information Architecture for the World Wide Web: Designing Large-Scale Web Sites, ...
Prototyping … paper prototyping
Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 Augus...
Prototyping … paper prototyping
Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 Augus...
Prototyping … wireframes
Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013...
Iterative design and development …
Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 Au...
Iterative design and development …
Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 Au...
Iterative design and development …
continued
Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Ses...
User Testing
Extensive user testing
Ideal one-to-one user testing with hand-written notes
http://www.nngroup.com/articles/...
Mobile UX
The Lifecycle of a Mobile App, a User’s Perspective - Michael Griffith , Ex UX Director, HP
1. Stage One: The Ap...
Mobile UX… continued
The Elements of Mobile User Experience
1. Functionality
2. Information Architecture
3. Content Design...
Mobile App UX improvement Quick Tips:
• As few features as possible
• Small screen, bigger touch targets
• Easy readabilit...
Quick Tips ..continued
As few features as possible
Small Screen – Bigger touch targets –
lesser options to click in 1 scre...
Quick Tips ..continued
As less User Input as possible
source: http://mobiledesignpatterngallery.com/mobile-patterns.php
Qu...
Quick Tips ..continued
Alerts/ Errors – should be brief and must contain a clear message
source: http://mobiledesignpatter...
UX, U, Us
• Scaling your UX strategy:
http://blogs.hbr.org/cs/2013/01/scaling_your_ux_strategy.html
• More UX discussions ...
Thanks … but would love to discuss more UX
stuff :)
BASIS session: Let's talk UX!
Quick hello from UX - at ‘Mobile Monday’...
Upcoming SlideShare
Loading in …5
×

Mobile Monday Dhaka Chapter (proposed) first session UX Aug 5 2013 MHannan FZaman

3,428 views

Published on

Mobile Monday Dhaka Chapter (proposed) first session - quick hello from UX - Aug 5, 2013 | conducted by: Fokhruz Zaman and Masrur Hannan.

Published in: Technology, Design
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
3,428
On SlideShare
0
From Embeds
0
Number of Embeds
22
Actions
Shares
0
Downloads
35
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Mobile Monday Dhaka Chapter (proposed) first session UX Aug 5 2013 MHannan FZaman

  1. 1. quick hello from User Experience (UX) BY: FOKHRUZ ZAMAN: BESHTO, IPAPHOLICS, A2I …. MASRUR HANNAN: BONOLOTA DESIGN, MNHS Mobile Monday – Dhaka Chapter (proposed) First Session: 5 August, 2013, 4.30 – 6.30 PM Venue: BASIS auditorium, 5th floor, BDBL building, Karwan Bazaar, Dhaka Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  2. 2. Disclaimer: This introductory UX session will NOT guarantee that the participants will develop the ability to produce super awesome Mobile apps... However, this session will discuss various methodologies that are used by successful Silicon Valley ventures in producing super awesome mobile apps, web apps, desktop apps, computers and even mobile phones (iPhone)...
  3. 3. Discussion topics 1. What is User Experience (UX) 2. ROI of UX 3. Mobile UX 4. How to design User's Experience 5. UX, U, Us Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  4. 4. IDEO experience from 1997-1998 Fokhruz Zaman’s working experience with Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  5. 5. What is User Experience (UX)?… Generally speaking User's experience when using any product/ service … Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  6. 6. Quick UX examples from daily life … Digital Camera operations TV Remotes – different TVs, different types Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  7. 7. User Experience (UX) …. with DOORS! How about Doors?! … Some you push, some you pull, some slide. Note: all doors have certain attributes: ◦ Visibility ◦ Mapping ◦ Clues ◦ Feedback ◦ Affordance Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  8. 8. Things we do and use everyday … the super awesome mobile apps YOU produce, if lucky - will be ONE of such 20,000 things your user will use! Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium twenty thousand (20,000) things we deal with in everyday lives! Design of Everyday Things, by Don Norman. Page: 11
  9. 9. Origins of User Experience Various principles of psychology – that make things Understandable and Usable for humans. Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  10. 10. Business viewpoints for UX Scout Stevenson, Creative Director at Extension Engine Harvard i-lab UX Design: An Introduction with Scout Stevenson http://www.youtube.com/watch?v=WkUwbPdyMIY Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  11. 11. Business viewpoints for UX Robert Fabricant, Vice President of Creative for frog (Apple's UX firm) at Harvard Business Review: http://blogs.hbr.org/cs/2013/01/scaling_your_ux_strategy.html “It's the "new black," to borrow from a fashion phrase — as well as a reference to its influence on profitability.” “The recognition of UX's importance seems to be slowly sinking into corporate culture the way "brand" did a decade ago. ” Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  12. 12. Business viewpoints for UX Instagram’s $1 billion USD takeover by Facebook Robert Fabricant, Vice President of Creative for frog (Apple's UX firm) at Harvard Business Review. http://blogs.hbr.org/cs/2013/01/scaling_yo ur_ux_strategy.html “Just look at the $1 billion price tag paid by Facebook for Instagram, whose primary asset is not technology, but the best photo sharing UX in the business …” Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  13. 13. UX design – global practices Top UX/ design firms of the worldVarious top Silicon Valley companies that practice UX Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  14. 14. ROI of UX … doodle video from HFI and NN/g article www.youtube.com/watch?v=O94kYyzqvTc Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium Summary: Development projects should spend 10% of their budget on usability. Following a usability redesign, websites increase desired metrics by 135% on average; intranets improve slightly less. http://www.nngroup.com/articles/return- on-investment-for-usability/ NN/g article: Return on Investment for Usability
  15. 15. Designing GOOD User Experience .. Possible UX is a field of it's own, based on the principles of – • Human Computer Interaction (HCI) • Interaction Design • Information Architecture • Usability principles Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  16. 16. User Experience (UX) design … how to Designing GREAT products that bring people JOY! • Quick rule of thumbs for good UX: Intuitive! • No squinting eye-brows for users … • Answer user's “behind the scene” thoughts • and MANY more …… Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  17. 17. User Experience (UX) design … continued No squinting eye-brows for users … Don’t Make Me Think, by Steve Krugg. Page: 13 http://www.sensible.com/dmmt.html Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  18. 18. User Experience (UX) design … continued “WHAT WE DESIGN FOR… THE REALITY…” Don’t Make Me Think, by Steve Krugg. Page: 21 http://www.sensible.com/dmmt.html Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  19. 19. User Experience (UX) design … continued “What designers build – What users see” Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium Don’t Make Me Think, by Steve Krugg. Page: 23 http://www.sensible.com/dmmt.html
  20. 20. User Experience (UX) design … continued How do various product owner stakeholders see the same interface Don’t Make Me Think, by Steve Krugg. Page: 126 http://www.sensible.com/dmmt.html Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  21. 21. How to design User's Experience … how to 2 Various Methodologies – following the same principles The Strategy Plane User needs are the goals for the site that come from outside our organization—specifically from the people who will use our site. The Scope Plane On the information space side, scope takes the form of content requirements: a description of the various content elements that will be required. The Structure Plane For information spaces, the structure is the information architecture: the arrangement of content elements within the information space. The Skeleton Plane The skeleton plane breaks down into three components. The Surface Plane Finally, we have the surface. Regardless of whether we are dealing with a software product or an information space… A popular schema of User Experience design: Jesse James Garrett’s FIVE planes of user experience design, explained thoroughly in the book The Elements of User Experience: http://www.jjg.net/elements/pdf/elements_ch02.pdf Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  22. 22. How to design User's Experience … how to 3 Considering the Bangladeshi development context, based on the following resources (Books, MOOC, NN/G) – the process I (Masrur Hannan) try to follow for User Experience (UX) design practices … Books: • Design of Everyday Things, by Don Norman • Don’t Make Me Think, by Steve Krugg • Information Architecture for the World Wide Web, by Peter Morville … • Sketching User Experience, by Bill Buxton • Elements of User Experience, by Jesse James Garrett Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium https://class.coursera.org/hci/ nngroup.com/articles/
  23. 23. How to design User's Experience … how to 4 1.Initial research, ideation, inspiration hunt and concept finalization 2.Prototyping, wireframes, taxonomy development 3.User Testing with prototypes – early stage user feedback collection 4.Iterative design and development work with rigorous User Testing 5.Post-launch testing: performance, user behavior etc – and continue improvement work along with User Testing with each iteration Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  24. 24. Initial research … Information Ecology [Information Architecture for the World Wide Web: Designing Large-Scale Web Sites, 2006, page 25] Three inter-dependent components of an information ecology Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium http://www.amazon.com/Information-Architecture-World-Wide-Web/dp/0596527349
  25. 25. Prototyping … paper prototyping Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium NN/g article: Paper Prototyping: Getting User Data Before You Code With a paper prototype, you can user test early design ideas at an extremely low cost. Doing so lets you fix usability problems before you waste money implementing something that doesn't work. http://www.nngroup.com/articles/paper-prototyping/
  26. 26. Prototyping … paper prototyping Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium http://www.nngroup.com/articles/paper-prototyping/
  27. 27. Prototyping … wireframes Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  28. 28. Iterative design and development … Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium 3 methods for increasing UX quality by exploring and testing diverse design ideas work even better when you use them together. You can achieve a high- quality user interface by combining 3 design process models: 1.Competitive testing 2.Parallel design 3.Iterative design NN/g article: Parallel & Iterative Design + Competitive Testing = High Usability http://www.nngroup.com/articles/parallel-and-iterative-design/
  29. 29. Iterative design and development … Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium NN/g article: Parallel & Iterative Design + Competitive Testing = High Usability http://www.nngroup.com/articles/parallel-and-iterative-design/
  30. 30. Iterative design and development … continued Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium http://www.nngroup.com/articles/parallel-and-iterative-design/
  31. 31. User Testing Extensive user testing Ideal one-to-one user testing with hand-written notes http://www.nngroup.com/articles/why-you-only-need-to-test-with-5-users/ NN/g article: Why You Only Need to Test with 5 Users Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  32. 32. Mobile UX The Lifecycle of a Mobile App, a User’s Perspective - Michael Griffith , Ex UX Director, HP 1. Stage One: The App Store Experience 2. Stage Two: The First-Open Experience 3. Stage Three: Attempting Simple Tasks 4. Stage Four: Attempting Complex Tasks http://www.uxmatters.com/mt/archives/2011/10/the-lifecycle-of-a- mobile-app-a-users-perspective.php Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  33. 33. Mobile UX… continued The Elements of Mobile User Experience 1. Functionality 2. Information Architecture 3. Content Design 4. User Input 5. Mobile Context 6. Usability 7. Trustworthiness 8. Feedback 9. Help 10. Social Marketing Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium http://mobile.smashingmagazine.com/2012/07/12/elements-mobile-user-experience/
  34. 34. Mobile App UX improvement Quick Tips: • As few features as possible • Small screen, bigger touch targets • Easy readability and smooth interactions • As less User Input as possible • Lesser options to click in 1 screen • Avoid requiring use of both hands for inputs • Alerts/ Errors – should be brief and must contain a clear message Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium NN/g article: Optimizing a Screen for Mobile Use http://www.nngroup.com/articles/optimizing-a-screen-for-mobile-use/
  35. 35. Quick Tips ..continued As few features as possible Small Screen – Bigger touch targets – lesser options to click in 1 screen source: http://mobiledesignpatterngallery.com/mobile-patterns.php Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  36. 36. Quick Tips ..continued As less User Input as possible source: http://mobiledesignpatterngallery.com/mobile-patterns.php Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  37. 37. Quick Tips ..continued Alerts/ Errors – should be brief and must contain a clear message source: http://mobiledesignpatterngallery.com/mobile-patterns.php Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  38. 38. UX, U, Us • Scaling your UX strategy: http://blogs.hbr.org/cs/2013/01/scaling_your_ux_strategy.html • More UX discussions in upcoming Mobile Monday sessions for more detailed discussion and interactive sessions …. Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium
  39. 39. Thanks … but would love to discuss more UX stuff :) BASIS session: Let's talk UX! Quick hello from UX - at ‘Mobile Monday’ – Dhaka Chapter (proposed) First Session: 5 August, 2013, at BASIS auditorium Thanks again: Fokhruz Zaman http://www.linkedin.com/in/fzaman Masrur Hannan http://www.linkedin.com/in/masrurhannan

×