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

UX Design and Education for Effective Monitoring Tools (LISA17)

Amy Nguyen
November 01, 2017

UX Design and Education for Effective Monitoring Tools (LISA17)

The fastest way to become a 10X engineer is by enabling 10 other engineers to do their jobs better. As infrastructure engineers, part of our mission is to empower the rest of our engineering organization to use the tools we develop correctly, quickly, and independently. Yet we often fall short of that mission in unexpected ways. In this talk, I will explain ways to make concepts like interpolation, aggregation, and alerting more intuitive and how to identify pain points for new users. I'll go over common misconceptions users have about monitoring and how you can clear up this confusion with improved training and UI design.

Amy Nguyen

November 01, 2017
Tweet

More Decks by Amy Nguyen

Other Decks in Technology

Transcript

  1. Amy Nguyen @amyngyn LISA17 Hi! - I'm Amy! - Observability

    engineer! - Also on the plenary panel tomorrow at 4pm! - amynguyen.net @amyngyn
  2. Amy Nguyen @amyngyn LISA17 Agenda - Motivation - Sharing what

    you know - Designing what your users want - Recap
  3. Amy Nguyen @amyngyn LISA17 - Motivation - Sharing what you

    know - Designing what your users want - Recap Agenda
  4. Amy Nguyen @amyngyn LISA17 UX and Your Situation team documentation

    tools probably paying for vendors TBH? this talk
  5. Amy Nguyen @amyngyn LISA17 UX and Your Situation team documentation

    tools probably paying for vendors TBH? this talk things we can all control
  6. Amy Nguyen @amyngyn LISA17 Why should we care about user

    experience? - Prevent misunderstandings: not everyone is (or should have to be) an expert at interpreting monitoring data
  7. Amy Nguyen @amyngyn LISA17 Why should we care about user

    experience? - Prevent misunderstandings: not everyone is (or should have to be) an expert at interpreting monitoring data - Developer velocity: help people reach conclusions faster, help your company move faster
  8. Amy Nguyen @amyngyn LISA17 Why should we care about user

    experience? - Prevent misunderstandings: not everyone is (or should have to be) an expert at interpreting monitoring data - Developer velocity: help people reach conclusions faster, help your company move faster - Data democracy: you don't know what questions people want to answer with their own data
  9. Amy Nguyen @amyngyn LISA17 Why should we care about user

    experience? - Prevent misunderstandings: not everyone is (or should have to be) an expert at interpreting timeseries data - Developer velocity: help people reach conclusions faster, help your company move faster - Data democracy: you don't know what questions people want to answer with their own data
  10. Amy Nguyen @amyngyn LISA17 Why should we care about user

    experience? Because we can help engineers work correctly, quickly, and independently.
  11. Amy Nguyen @amyngyn LISA17 "The fastest way to become a

    10x engineer is to help 10 other engineers do their jobs better. - Wayne Gretzky" - Michael Scott
  12. Amy Nguyen @amyngyn LISA17 - Motivation - Sharing what you

    know - Designing what your users want - Recap Agenda
  13. Amy Nguyen @amyngyn LISA17 Sharing what you know 1. Education

    vs intuition: Don't overload people with too much information.
  14. Amy Nguyen @amyngyn LISA17 Sharing what you know 1. Education

    vs intuition: Don't overload people with too much information. 2. Best practices: Use your expertise to determine the most helpful default behavior.
  15. Amy Nguyen @amyngyn LISA17 Sharing what you know 1. Education

    vs intuition: Don't overload people with too much information. 2. Best practices: Use your expertise to determine the most helpful default behavior. 3. Potential pitfalls: Make it hard to do the wrong thing.
  16. Amy Nguyen @amyngyn LISA17 It looks like you're trying to

    alert on the most recent data. Are you sure you want to do that?
  17. Amy Nguyen @amyngyn LISA17 - Motivation - Sharing what you

    know - Designing what your users want - Recap Agenda
  18. Amy Nguyen @amyngyn LISA17 Designing what your users want 1.

    Performance: Do whatever it takes to make it fast.
  19. Amy Nguyen @amyngyn LISA17 Performance: Cool Ideas! - Backend -

    Roll-up data over long time ranges - Store latest data in memory (e.g., Facebook's Gorilla paper and Beringei project)
  20. Amy Nguyen @amyngyn LISA17 Performance: Cool Ideas! - Backend -

    Roll-up data over long time ranges - Store latest data in memory (e.g., Facebook's Gorilla paper and Beringei project) - Add a cache layer (e.g., Turn's Splicer project)
  21. Amy Nguyen @amyngyn LISA17 Performance: Cool Ideas! - Backend -

    Roll-up data over long time ranges - Store latest data in memory (e.g., Facebook's Gorilla paper and Beringei project) - Add a cache layer (e.g., Turn's Splicer project) yeah sure get back to us in 6 months
  22. Amy Nguyen @amyngyn LISA17 Performance: Cool Ideas! - Backend -

    Roll-up data over long time ranges - Store latest data in memory (e.g., Facebook's Gorilla paper and Beringei project) - Add a cache layer (e.g., Turn's Splicer project) - Frontend
  23. Amy Nguyen @amyngyn LISA17 Performance: Cool Ideas! - Backend -

    Roll-up data over long time ranges - Store latest data in memory (e.g., Facebook's Gorilla paper and Beringei project) - Add a cache layer (e.g., Turn's Splicer project) - Frontend - Don't reload existing data if the user changes the time window
  24. Amy Nguyen @amyngyn LISA17 Performance: Cool Ideas! - Backend -

    Roll-up data over long time ranges - Store latest data in memory (e.g., Facebook's Gorilla paper and Beringei project) - Add a cache layer (e.g., Turn's Splicer project) - Frontend - Don't reload existing data if the user changes the time window - Prevent the user from requesting the data incessantly
  25. Amy Nguyen @amyngyn LISA17 Performance: Cool Ideas! - Backend -

    Roll-up data over long time ranges - Store latest data in memory (e.g., Facebook's Gorilla paper and Beringei project) - Add a cache layer (e.g., Turn's Splicer project) - Frontend - Don't reload existing data if the user changes the time window - Prevent the user from requesting the data incessantly - Lazy-load graphs on a dashboard
  26. Amy Nguyen @amyngyn LISA17 Designing what your users want 1.

    Performance: Do whatever it takes to make it fast. 2. Exploration: Make it easy to try things without fear.
  27. Amy Nguyen @amyngyn LISA17 don't mess with this don't change

    it or this It doesn't deserve to be treated this way it's just trying to help
  28. Amy Nguyen @amyngyn LISA17 Accessibility is for everyone - Color

    contrast - Customizable color schemes - Navigation bar that isn't entirely controlled by JavaScript
  29. Amy Nguyen @amyngyn LISA17 Accessibility is for everyone - Color

    contrast - Customizable color schemes - Navigation bar that isn't entirely controlled by JavaScript - Keyboard navigation
  30. Amy Nguyen @amyngyn LISA17 Accessibility is for everyone - Color

    contrast - Customizable color schemes - Navigation bar that isn't entirely controlled by JavaScript - Keyboard navigation - Obvious focus on what needs attention
  31. Amy Nguyen @amyngyn LISA17 Exploration recap 1. Don't break basic

    browser features. 2. Design for accessibility. 3. Make it easy to try things without making permanent changes.
  32. Amy Nguyen @amyngyn LISA17 Designing what your users want 1.

    Performance: Do whatever it takes to make it fast. 2. Exploration: Make it easy to try things without fear. 3. Simplicity: Make it easy to figure out what to do.
  33. Amy Nguyen @amyngyn LISA17 manually type in your metric if

    you know the name somehow aggregator
  34. Amy Nguyen @amyngyn LISA17 manually type in your metric if

    you know the name somehow aggregator hope you remember what tags are available for this metric lol
  35. Amy Nguyen @amyngyn LISA17 manually type in your metric if

    you know the name somehow aggregator secret bonus: you can downsample?! hope you remember what tags are available for this metric lol
  36. Amy Nguyen @amyngyn LISA17 manually type in your metric if

    you know the name somehow aggregator secret bonus: you can downsample?! hope you remember what tags are available for this metric lol
  37. Amy Nguyen @amyngyn LISA17 - Motivation - Sharing what you

    know - Designing what your users want - Recap Agenda
  38. Amy Nguyen @amyngyn LISA17 "The fastest way to become a

    10x engineer is to help 10 other engineers do their jobs better. - Wayne Gretzky" - Michael Scott
  39. Amy Nguyen @amyngyn LISA17 UX and Your Situation team documentation

    tools probably paying for vendors TBH? this talk things we can all control
  40. Amy Nguyen @amyngyn LISA17 Sharing what you know 1. Education

    vs intuition: Don't overload people with too much information. 2. Best practices: Use your expertise to determine the most helpful default behavior. 3. Potential pitfalls: Make it hard to do the wrong thing.
  41. Amy Nguyen @amyngyn LISA17 Designing what your users want 1.

    Performance: Do whatever it takes to make it fast. 2. Exploration: Make it easy to try things without fear. 3. Simplicity: Make it easy to figure out what to do.