RenderConf: Designing for Complexity

Transcript

1. Designing For Complexity

2. @jadeapplegate

3. ABOUT US Customers are the source of real growth with

   practical expertise.

4. 122x

5. 10.5x

6. 55x

7. Improving our UI

8. Representing technical complexity

9. Agenda Lessons Learned Improvements Process Rationale

10. Rationale

11. Design Complexities • Lack of rich interactions • No consistency

    in experience • Missing sense of completion • Outdated, stale site • User not kept in mind • Lack of UX principles Rationale

12. Engineering Complexities • Hard to quickly make changes • No

    test coverage • Lack of code consistency • Needed modern architecture • Ownership issues • Many dependencies Rationale

13. Approach Full rewrite Design “refresh” Rationale

14. None

15. Process

16. 1 6 3 4 5 Develop Prototype Refine Merge &

    Release UX Interviews 2 Design Sessions Process

17. Process UX Interviews INEXPERIENCED USER “You just upgraded your servers

    to use better security and you want to make sure your communication between backend servers and cache servers is over TLS. How would you set it up?”

18. Process UX Interviews ADVANCED USER "Set up and activate a

    typical service and tailor the cache performance to your specific needs."

19. Process Design Feedback Sessions Designers + Product + Engineering Incorporate

    feedback into designs

20. Process Rapid Prototyping Engineer + Designer Collaborate Proof of Concept

21. Process Development Engineer Fully implemented feature

22. Process Refinement Engineer + Product + Design Final tweaks to

    look and feel

23. Process Merge & Release Engineer + Product Code reviewed, merged,

    deployed Release notes to customers

24. Improvements

25. Major & Minor Improvements

26. Colors Minor Improvement

27. Buttons Minor Improvement

28. Icons Minor Improvement

29. Help Text Minor Improvement

30. Link to documentation Minor Improvement

31. Sensible Defaults Major Improvement

32. Visual Hierarchy Major Improvement

33. Best Practices Major Improvement

34. Sense of Completion Major Improvement

35. Lessons Learned

36. Users don’t understand your site as much as you do!

    Lessons Learned

37. Understand the problems you are trying to solve. Lessons Learned

38. Be realistic about the scope of your project. Lessons Learned

39. Keep your users in mind, always. Lessons Learned

40. Give users autonomy, but provide help where needed. Lessons Learned

41. Wrap Up

42. Questions? Tweet at me! @jadeapplegate