Your SlideShare is downloading. ×
  • Like
Exploring the world of UX
Upcoming SlideShare
Loading in...5

Thanks for flagging this SlideShare!

Oops! An error has occurred.


Now you can save presentations on your phone or tablet

Available for both IPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Exploring the world of UX


Full training about UX including 4 games. …

Full training about UX including 4 games.
Duration: 4 hours

Published in Technology , Design
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads


Total Views
On SlideShare
From Embeds
Number of Embeds



Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

    No notes for slide
  • What’s your expectations ? Pick 3 post it and writing down what are your expectations about this seminar. Put it on the wall, look at what other said, cluster if possible
  • Dr. Jemison (TED Speaker) says it's foolish to even think in terms of having to choose between being analytical or being intuitive and likens this false choice to having to choose between being idealistic or realistic. "You need both," she says. Science is about fact…until it’s no longer a fact. Art is about arguing meanings, feelings, and contesting views. Science is about understanding the world, what’s in it, what’s beyond it. Art is about searching within, expanding the world, and determining perceptions. Science is about natural order. Art is about justification of thought. Science is about advancing, moving forward, discovery. Art is about searching, moving in all directions, discovery. Science is about reason and development. Art is about reason and development. Science is about discovering significance. Art is about giving significance. Science is about forming probabilities. Art is about endless possibilities. Science doesn’t need Art, but it likes having Art around. Art doesn’t need Science, but it likes having Science around.
  • Some people mistakenly use the terms user experience and usability almost interchangeably. However, usability is increasingly being used to refer specifically to the ease with which users can complete their intended tasks, and is closely associated with usability testing . Therefore, many perceive usability to be a rather tactical aspect of product design. In contrast, UX professionals use the term user experience much more broadly, to cover everything ranging from ease of use to user engagement to visual appeal. User experience better captures all of the psychological and behavioral aspects of users’ interactions with products.
  • Visual comp = comprehensive layout or comprehensive, usually shortened to comp , is the page layout of a proposed design as initially presented by the designer to a client, showing the relative positions of text and illustrations before the specific content of those elements has been decided on, as a rough draft of the final layout in which to build around.
  • Business_Objectives Card_sorting Process_task_diagrams Site_Map Prototype Style_Guide Heuristic_Evaluation SUS User_Goals Personas Story_board Thumbnails Wireframe Usability_Testing ISO_20282
  • Could be used with your users keep some empty cards (if needed) not necessary translated into a navigation menu but useful anyway
  • Election Website – 4 groups Group type A: Open Create Groups Label Groups Group type B: Closed Assign items to categories
  • 1 group presents
  • Focus on major elements before thinking about details Draw a small representation of your design, roughing out boxes and greeking lines of text
  • The screen is the basic unit of an interface. Screens can be represented in different ways either by showing their full or partial size. Most screens in this notation are shown with a thicker black outline and an optional title above in the top left.
  • Screens are tied together with user actions in order to tell a story. Each story may have a scenario as a starting point that triggers the narrative and provides a background context. The story then unfolds as action arrows (with optional events, transitions or conditionals) are used to describe what the user has done with the interface (clicks, drags, key presses, etc). All user actions are conveyed in red and all actionable items are shown in blue.
  • Screens are tied together with user actions in order to tell a story. Each story may have a scenario as a starting point that triggers the narrative and provides a background context. The story then unfolds as action arrows (with optional events, transitions or conditionals) are used to describe what the user has done with the interface (clicks, drags, key presses, etc). All user actions are conveyed in red and all actionable items are shown in blue.
  • Achieving variation of your ideas is a very powerful quality that sketching in particular affords. Designers in early phases often diverge conceptually in order to generate more ideas which can be further discussed, evaluated and selected from. This sketching notation also supports the ability to branch off with multiple related ideas. Here, this is mainly done by using lettering (A, B, C, D, etc.) and vertically aligning the alternatives. Notes in this notation are mostly used to help the designer with a potential discussion - sketches are conversation starters after all. In this context, notes are self targeted reminders with the intention of raising advantages, disadvantages, and uncertainties related to sketched out ideas.
  • Tips Think about validation rules Design alert messages
  • 1 group present to the others
  • Work through each of the items in the list and mark your site/system as either conforming or not conforming Guidelines are context specific. If you feel that a guideline does not apply to your site, it's OK to ignore it. These guidelines are purposefully expressed as positive statements, so that when you feed the results back to the design team you can identify some strengths of the design before you launch into the problems
  • Use Guidelines & your experience
  • You have an example in the note
  • This scales all values from 0 to 4
  • URL = User Requirements with Lego
  • Deming
  • What’s your achievements ? Move achieved post its on the right
  • (Jakob Nielsen)


  • 1. UXExploring the world of User Experience Twitter: @FredVandaele v3 - August 2012
  • 2. YourExpectations
  • 3. “UX is the Science and Art of designing a Product”
  • 4. 4 Elements of UX VALUE USABILITY Is it useful ? Is it easy to use ? ADOPTABILITY DESIRABILITYIs it easy to start using ? Is it fun and engaging ?
  • 5. Techniques
  • 6. Design techniques
  • 7. Card Sorting• A method for determining how users mentally group your website’s content – Results are derived from the semantic networks of the users – Semantic networks are vast webs of connections between concepts, determined by our learning and experiences• 2 Types: Open & Closed
  • 8. The CardSorting game
  • 9. min
  • 10. PresentEasyDifficultDifferencesSimilarities
  • 11. Interactive Sketching Notation • ISN fuses user actions and screen sketches • Simple and standardized rules – What the user see (greys, blacks and blues) – What the user do (red) gnihcteks/ac.ikswonil.www//:ptth ngiseD noitcaretnI ikswoniL :stiderCesneciL adanaC 5.2 ekilA erahS-noitubirttA snommoC evitaerC eht rednu decnecil si krow sihT
  • 12. ISN - Screens
  • 13. ISN – User Actions
  • 14. ISN – User Actions
  • 15. ISN – Variation & notes
  • 16. The ISN gameDescribe a sale process on Amazon – John is looking for a new TV – With smart/internet feature – “green” product – Likes Sony (but not exclusive)
  • 17. min
  • 18. PresentEasyDifficultDifferencesSimilarities
  • 19. Wireframe“Wireframe describes a web site or application using black and white lines, text and boxes.”• Extremely fast way of developing the layout, navigation and usability of a website• Quick and easy to change enabling the creation of many variations at minimal cost
  • 20. Design process is like a conversation
  • 21. Wireframe game Design a“Book Your International Flight” order form
  • 22. min
  • 23. PresentEasyDifficultDifferencesSimilarities
  • 24. (Post) Prod techniques
  • 25. Usability Guidelines247 web usability guidelines Dr. David Travis The Research-Based WebDesign & Usability Guidelines
  • 26. Usability Guidelines “Evaluate the formdesigned by another group in the previous game”
  • 27. min
  • 28. PresentEasyDifficultDifferencesSimilarities
  • 29. System Usability Scale• John Brooke (1986)• The most used questionnaire for measuring perceptions of usability• 10 item questionnaire with 5 response options• Fixed response format
  • 30. Scoring SUS• For odd items = user response -1• For even items = 5 - user response• Add up and multiply by 2.5• This create a 0 to 100 scale• Average SUS score from all 500 studies is 68
  • 31. Other useful techniques• URL• Personas• Prototyping• Eye tracking• Heuristic Evaluation• Microsoft Desirability Toolkit• CSUQ, QUIS, SUMI, …
  • 32. One more thing …
  • 33. YourAchievements
  • 34. Go further•••