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

Lean Design Critique

Lean Design Critique

Tracy Miranda

June 18, 2014
Tweet

More Decks by Tracy Miranda

Other Decks in Programming

Transcript

  1. Tracy Miranda
    EclipseCon France 2014

    View Slide

  2.  What is UX
     3-myths about UX
     7-steps of Lean Design Critique
     Conclusion
     Questions
     What is UX
     3-myths about UX
     7-steps of Lean Design Critique
     Conclusion
     Questions

    View Slide

  3. Product

    View Slide

  4. User

    View Slide

  5. User Experience

    View Slide

  6. User Experience
    User Interface

    View Slide

  7. 1. It’s a design job, all about best
    practices like picking the right
    icons, fonts or colour palette.
    1. It’s a design job, all about best
    practices like picking the right
    icons, fonts or colour palette.
    I do code not art

    View Slide

  8. 2. It’s all about delighting your
    user so it’s more for web and
    mobile apps
    2. It’s all about delighting your
    user so it’s more for web and
    mobile apps
    UX is for Apple

    View Slide

  9. 3. It’s expensive and time-
    consuming doing things like
    usability testing, focus groups.
    3. It’s expensive and time-
    consuming doing things like
    usability testing, focus groups.
    € € € €
    ££££ $$$$

    View Slide

  10. 4. Eclipse IDE is too complicated
    and cluttered for good UX
    I blame Eclipse

    View Slide

  11. A 7-step technique to get
    the most worthwhile
    optimizations in a
    short space of time for
    complex software
    toolflows.
    Existing
    Software
    Tool
    A 7-step technique to get
    the most worthwhile
    optimizations in a
    short space of time for
    complex software
    toolflows.
    New
    features
    Limited
    Resources

    View Slide

  12. View Slide

  13. View Slide

  14. Linear Gaussian

    View Slide

  15. Linear Gaussian
    y(x) = mx + c
    m =0.04 c =-23
    y(x) = a exp
    a =49.33 b =2.34 c =502
    -(x-b)2
    2c2
    ( )

    View Slide

  16. View Slide

  17. 1. 90% Task
    2. Cognitive
    Walkthrough
    3. Analysis
    4. Real
    Estate
    5.Research 6.Optimise
    7. Rerun
    analysis

    View Slide

  18. For every tool
    90% of users spend
    90% of their time
    doing the same thing
    over and
    over and
    over again
    For every tool
    90% of users spend
    90% of their time
    doing the same thing
    over and
    over and
    over again

    View Slide

  19.  Input from product manager and one key user
     www.nngroup.com/articles/why-you-only-need-to-test-with-5-users/
     What is your tool used for 90% of the time?
     Function Fitting
     What is it used for the rest of the time?
     Importing and exporting fitting data
     Changing fitting algorithms or accuracy
     Adding in new fitting functions
     Handling error conditions
     Input from product manager and one key user
     www.nngroup.com/articles/why-you-only-need-to-test-with-5-users/
     What is your tool used for 90% of the time?
     Function Fitting
     What is it used for the rest of the time?
     Importing and exporting fitting data
     Changing fitting algorithms or accuracy
     Adding in new fitting functions
     Handling error conditions

    View Slide

  20.  Breakdown the 90% task step-by-step
     Perform the task as a user would
     Breakdown the 90% task step-by-step
     Perform the task as a user would

    View Slide

  21. 1. Click ‘Auto ReFit’
    2. Select the desired function e.g. gaussian
    3. Set the parameters accordingly (mostly value)
    3. Set the parameters accordingly (mostly value)
    4.Look at plot to determine by eye if fit looks close enough
    5. If not, tweak parameters until fit is good
    6. When fit looks good, click update all to accept fit data
    7. Repeat tweaking until happy with fit, also measured by the goodness of fit value

    View Slide

  22. Aim to remove friction for the 90% task
    Pick a measure and stick with it:
    Mouse
    Clicks
    Number
    of Pages
    Mouse
    Travel
    Eye
    Travel
    Length
    of Time

    View Slide

  23. 1. Click ‘Auto ReFit’
    Clicks:
    1

    View Slide

  24. 2. Select the desired function, such as ‘Gaussian’
    Clicks:
    3

    View Slide

  25. 3. Set the parameters accordingly (mostly value)
    Clicks:
    4

    View Slide

  26. 4.Look at plot to determine by eye if fit looks close enough
    Clicks:
    4

    View Slide

  27. 5. If not, tweak parameters until fit is good
    Clicks:
    6

    View Slide

  28. 6. When fit looks good, click update all to accept fit data
    Clicks:
    7

    View Slide

  29. UI elements should be proportional to their
    importance such that they draw attention to
    themselves appropriately.
    90% task get the “Prime Real Estate”
    UI elements should be proportional to their
    importance such that they draw attention to
    themselves appropriately.
    90% task get the “Prime Real Estate”

    View Slide

  30. View Slide

  31. Don’t reinvent the wheel, unless you have to
    Research of other existing design to find
    parallel paradigms, design features.
    - how is this done in Eclipse?
    - how is this done in the rest of the tool?
    - how is this done on a mobile phone?
    Don’t reinvent the wheel, unless you have to
    Research of other existing design to find
    parallel paradigms, design features.
    - how is this done in Eclipse?
    - how is this done in the rest of the tool?
    - how is this done on a mobile phone?

    View Slide

  32.  Table, with support for hierarchy:

    View Slide

  33. Analysis + UI research, ready to optimize
    Useful heuristic checklist
    http://www.nngroup.com/articles/ten-usability-heuristics/
     Efficiency of use?
     Visibility of system status?
     Aesthetic and minimalist design?
    Analysis + UI research, ready to optimize
    Useful heuristic checklist
    http://www.nngroup.com/articles/ten-usability-heuristics/
     Efficiency of use?
     Visibility of system status?
     Aesthetic and minimalist design?

    View Slide

  34. View Slide

  35.  Close the loop by rerun analysis to see the
    measurable difference
     Close the loop by rerun analysis to see the
    measurable difference

    View Slide

  36. Clicks:
    4

    View Slide

  37. Clicks:
    7
    Clicks:
    4

    View Slide

  38. 1. 90% Task
    2. Cognitive
    Walkthrough
    3. Analysis
    4. Real
    Estate
    5.Research 6.Optimise
    7. Rerun
    analysis

    View Slide

  39. Optimise
    1 2 3 4 5 6 7

    View Slide

  40. “Design is not just
    what it looks like
    and feels like.
    Design is how it
    works”
    - Steve Jobs
    “Design is not just
    what it looks like
    and feels like.
    Design is how it
    works”
    - Steve Jobs

    View Slide

  41. 1. It’s a design job, all about best
    practices like picking the right
    icons, fonts or colour palette.
    1. It’s a design job, all about best
    practices like picking the right
    icons, fonts or colour palette.
    I do code not art

    View Slide

  42. 1. It’s a design job, all about best
    practices like picking the right
    icons, fonts or colour palette.
    1. It’s a design job, all about best
    practices like picking the right
    icons, fonts or colour palette.
    It’s a process with rules, guidelines
    and measurable outcomes

    View Slide

  43. 2. UX is all about delighting your
    user so it’s more for web and
    mobile apps
    2. UX is all about delighting your
    user so it’s more for web and
    mobile apps
    UX is for Apple

    View Slide

  44. 2. UX is all about delighting your
    user so it’s more for web and
    mobile apps
    2. UX is all about delighting your
    user so it’s more for web and
    mobile apps
    UX is all about putting yourself
    in your users’ shoes

    View Slide

  45. 3. It’s expensive and time-
    consuming doing things like
    usability testing, focus groups.
    3. It’s expensive and time-
    consuming doing things like
    usability testing, focus groups.
    € € € €
    ££££ $$$$

    View Slide

  46. 3. It’s expensive and time-
    consuming doing things like
    usability testing, focus groups.
    3. It’s expensive and time-
    consuming doing things like
    usability testing, focus groups.
    Start with a
    Lean Design Critique

    View Slide

  47.  UX is at a tipping point
     Developers have more control with E4
     cdtdoug.ca/uxmatters
     Launch bar
     Toolbar filtering
     UX is at a tipping point
     Developers have more control with E4
     cdtdoug.ca/uxmatters
     Launch bar
     Toolbar filtering

    View Slide

  48. Good UX starts
    with you
    Good UX starts
    with you

    View Slide

  49.  Questions?
     Acknowledgements
     Diamond Light Source
     DAWNSci - www.dawnsci.org
     Doug Schaefer - cdtdoug.ca/uxmatters
     Questions?
     Acknowledgements
     Diamond Light Source
     DAWNSci - www.dawnsci.org
     Doug Schaefer - cdtdoug.ca/uxmatters

    View Slide