Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Crafting High Quality Feedback in App Design

005b3ccff562115ccb49c092038591b0?s=47 Taylor Ling
March 07, 2015

Crafting High Quality Feedback in App Design

My personal deck for 2014/2015.

One of the elements that most of the designers and developers tend to forget is the feedback – and every single feedback crafted in the app plays a important role (or more) in minimising user frustration and turn that into good user experience, regardless its effect size. Join this session to discover (or re-discover) the importance of feedback in interface design which can definitely help in crafting the next awesome app in the Play Store!

005b3ccff562115ccb49c092038591b0?s=128

Taylor Ling

March 07, 2015
Tweet

Transcript

  1. Feedback in App Design Interaction

  2. Feedback in UI Design The importance of What is ?

  3. Feedback in UI Design The importance of WHY A way

    of letting users know that the system is working on your request A way to communicate with users about the result of an action A way to inform users about the hidden rules of the system in the physical world Traffic Light What is ?
  4. way of letting the user know that the system is

    orking on your request way to communicate with the user about the sult of an action A way to inform the user about the hidden rules of the system Feedback in the physical world Lift Traffic Light Sometimes users of the traffic light system are uncertain about their next actions (to stop, to cross etc.), and thus wasted their time or even risk their lifes. Most of the time, it’s due to the insufficient feedback from the traffic light system (lack of count down timer, delayed feedback etc.)
  5. Feedback in the physical world Traffic Light Traffic Light Lift

    (Elevator) How often you see people keep pressing the Close button after the first time, hoping the system receives that closing command? This is one example of the lack of feedback on the hidden rules (buffer time applied after the close button is pressed) that only the designer/ engineer knows about it. Users have no idea at all, therefore they keep doing something unnecessary.
  6. Feedback Why is important?

  7. Feedback Why is important? Feedback provides reassurance, even sometimes it

    might be negative results Feedback helps in managing user expectation Feedback helps in learning and developing skilled behaviour in App Design
  8. Why is important? Feedback provides reassurance, even sometimes it might

    be negative results Feedback helps in managing user expectation in App Design reason that causes user frustration #1 Feedback
  9. Feedback Why is important? in App Design Interactions happen on/in

    glass surface
  10. Why is important? Interactions happen on/in glass surface No Physical

    Feedback
  11. Why is important? Interactions happen on/in glass surface No Physical

    Feedback
  12. Trigger Rules Loops Feedback Microinteractions - Dan Saffer

  13. Rules Loops Feedback Trigger Manual System Button tapped? Gesture applied?

    Voice input? Errors? At the location? Incoming data?
  14. Trigger Rules Loops Feedback What we designed and implemented -

    the users don’t know it most of the time
  15. Trigger Rules Loops Feedback Some ways to communicate the rules

    to the users
  16. Trigger Rules Loops Feedback and Modes One-off? Repetitive? What happen

    if there are interruptions? Does it behave differently at different mode?
  17. Trigger Rules Loops Feedback Overscroll Edge Effect One good example

    of a microinteraction in Android. The trigger is about user input in scrolling the list and reached the top of the list. The rule on this microinteraction doesn’t allow the users to scroll beyond the top/bottom of the list. The feedback is that overscroll edge effect, giving hint to the users that they already reached the top. The loops in this case is about keep showing the effect to the users regardless of the number of overscroll attempt.
  18. Trigger Rules Loops Feedback Vibration Mode (Manual Trigger via Volume

    button) Another good example of a microinteraction in Android. When you turn on the vibration mode via the volume button, 1st feedback you get is the subtle vibration from the device, indicating the vibration mode is now active. Follow up on that, when the users want to know if the vibration mode is active, they just have to check on the status bar and look for the vibration icon.
  19. Feedback When should/could occur?

  20. Feedback When should/could occur? After a manual trigger

  21. Feedback When should/could occur? System initiated trigger

  22. Feedback When should/could occur? System trigger that changed μinteraction

  23. Feedback When should/could occur? Edge of rule

  24. Feedback When should/could occur? System cannot execute command

  25. Feedback When should/could occur? Showing progress

  26. Feedback When should/could occur? Beginning or the end of process

  27. Feedback When should/could occur? Beginning, the end or in the

    middle of mode switching
  28. Rules on crafting high quality feedback 0 1

  29. Rules on crafting high quality feedback 0 1

  30. Feedback must be immediate #1

  31. Feedback must be intelligible RULE 1 Users expect something to

    happen after interaction Any delay, even slight delay can cause the users to give up Delayed feedback can cause undesired result due to multiple user attempts Feedback must be immediate #1
  32. Feedback must be intelligible RULE 1 Feedback must be immediate

    #1 Users expect something to happen after interaction Any delay, even slight delay can cause the users to give up Delayed feedback can cause undesired result due to multiple user attempts
  33. Feedback must be intelligible RULE 1 Users expect something to

    happen after interaction Any delay, even slight delay can cause the users to give up Delayed feedback can cause undesired result due to multiple user attempts
  34. Feedback must be informative and meaningful #2

  35. Feedback must be intelligible RULE 1 Convey what has happened

    and what the users can do about it Do not ever show error code that is not meaningful to the users As simple as possible, but not overly simple
  36. Feedback must be intelligible RULE 1 Convey what has happened

    and what the users can do about it Do not ever show error code that is not meaningful to the users As simple as possible, but not overly simple
  37. Feedback quantity must be balanced #3

  38. Feedback must be intelligible RULE 1 Poor feedback can cause

    distraction and irritation to the users Too much feedback to the users can cause annoyance, and even ignorance from the users
  39. Feedback weight must be planned #4

  40. Feedback must be intelligible RULE 1 Every action needs to

    be confirmed, but not everyone of them need to be intrusive Show heavy feedback to the users only for the irreversible actions eg. deletion, sending money, huge data usage etc.
  41. Feedback must be intelligible RULE 1 Every action needs to

    be confirmed, but not everyone of them need to be intrusive Show heavy feedback to the users only for the irreversible actions eg. deletion, sending money, huge data usage etc.
  42. Feedback must be prioritised #5

  43. Feedback must be intelligible RULE 1 Too much feedback caused

    by every system trigger can be really disturbing Prioritise the feedback so that important signal can capture the users’ attention
  44. Feedback must be easy to understand #6

  45. Feedback must be intelligible RULE 1 Use simple words to

    communicate the situation - easier to understand For animation, too many of them at the same time can cause confusion and the user will have hard time to understand - the core feedback must be easily noticed and understood
  46. Feedback must be intelligible RULE 1 BAD EXAMPLE Use simple

    words to communicate the situation - easier to understand For animation, too many of them at the same time can cause confusion and the user will have hard time to understand - the core feedback must be easily noticed and understood
  47. Feedback must be intelligible RULE 1 Use simple words to

    communicate the situation - easier to understand For animation, too many of them at the same time can cause confusion and the user will have hard time to understand - the core feedback must be easily noticed and understood
  48. Feedback must not be confusing #7

  49. Feedback must be intelligible RULE 1 Feedback shown to the

    users must be correct, contextual and not confusing It’s not the job of the users to figure out what’s wrong when something happen (especially when there isn’t any input from the users)
  50. Feedback must be intelligible RULE 1 Feedback shown to the

    users must be correct, contextual and not confusing It’s not the job of the users to figure out what’s wrong when something happen (especially when there isn’t any input from the users)
  51. Feedback can be playful #8

  52. Feedback must be intelligible RULE 1 Feedback Feedback such as

    loading doesn’t always have to be boring Mask the waiting experience and turn that into a delightful moment NOT an opportunity for you to show advertisement
  53. Feedback can be unique and creative (but don’t sacrifice consistency)

    #9
  54. Feedback must be intelligible RULE 1 Feedback Unique feedback design

    helps establishing the brand, but do not sacrifice consistency if there is a common feedback pattern Familiar visual feedback pattern like snackbar, toast, dialog etc. can communicate information swiftly without learning
  55. Feedback must not be misleading #10

  56. Feedback must be intelligible RULE 1 Less than a minute…

    Users are very calculative, especially on time It’s always good to predict the total time for long process, but try to overestimate so the users don’t get frustrated if it isn’t accurate as told
  57. Feedback Immediate Informative Good Quantity Planned Prioritised Understandable Clear Playful

    Unique Honest
  58. Taylor Ling Mobile Experience Designer @ Snappymob Google Expert for

    UX/UI Master of AndroidUIUX.com +taylorling @taylorling