How to trim your design and keep it healthy

719 views
612 views

Published on

A healthy design consist of adaptable, re-usable chunks and a clear vision. The benefits of developing a usable & living designguide is often overlooked. As a result, many products fail to deliver consistent designs efficiently and loose time-to-market. In large corporations, with many ongoing projects, designers and developers continuously working on the same product, how can UX practitioners prevent delivering an inconsistent user experience leading to less intuitive interactions and duplicate code slowing down page-speed? From a large corporation viewpoint, this session looks at the steps towards creating a consistent and efficient design.

Published in: Design, Technology, Business
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
719
On SlideShare
0
From Embeds
0
Number of Embeds
54
Actions
Shares
0
Downloads
8
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

How to trim your design and keep it healthy

  1. 1. ➔ www.steria.no trim your design KEEP IT HEALTHY From a large corporation viewpoint, this session looks at the steps towards creating a consistent and efficient design and How to
  2. 2. ➔ www.steria.no How to trim your design and keep it healthy @jflusund@jflusund The steps towards creating a consistent and efficient design Flickr - Ruth Hartnup
  3. 3. DESIGN re-usable
  4. 4. DESIGN IS MORE CONSISTENT AND re-usable intuitive
  5. 5. We are not designing pages, we are designing systems of components. -Stephen Hay, from Brad Frost´s blog post on Atomic design June 10, 2013.
  6. 6. Flickr - Ruth Hartnup THE MAIN challenge... THE MAIN challenge...
  7. 7. TO KEEP THE DESIGN SYSTEM HEALTHY, DUPLICATE DESIGNS DUPLICATE CODE HARMING PERFORMANCE INCONSISTENT USER INTERFACE used and maintained The main challenge:
  8. 8. Creating the design system DEVELOP
  9. 9. MOTIVATE Be clear on challenges and benefits
  10. 10. Flickr - John Jordan Content: Needs matrix Common goals Challenges Activities: interview stakeholders Developer meetups Designer meetups
  11. 11. TIME AWARENESS CORRECT USE CONNECTIONS IDENTIFYING challenges
  12. 12. TIME AWARENESS CORRECT USE CONNECTIONS IDENTIFYING challenges
  13. 13. TIME AWARENESS CORRECT USE CONNECTIONS IDENTIFYING challenges
  14. 14. TIME AWARENESS CORRECT USE CONNECTIONS IDENTIFYING challenges
  15. 15. TIME AWARENESS CORRECT USE CONNECTIONS IDENTIFYING challenges
  16. 16. TIME AWARENESS CORRECT USE CONNECTIONS IDENTIFYING challenges
  17. 17. Needs & benefits matrix Communication Customers Creators Managers Operational efficiency Usability & Performance TTM
  18. 18. healthy design faster is the sweetspot OPERATIONAL EFFICIENCY creators customersmanagers USABILITY PERFORMANCETTM
  19. 19. from LO-FI to launch
  20. 20. DESIGN IS MORE CONSISTENT AND re-usable intuitive+ improves performance + less cognitive load
  21. 21. If I have learnt anything from working in large distributed teams, it's that communication is key. - Paul Robert Lloyd
  22. 22. Creating the design system MOTIVATE DEVELOP
  23. 23. adapt the content to fit your needs... Content: CSS conventions Design rationale Vector archive Design Chunks Activities: Developer/designer pairing Designer Days Design studio Design Critique
  24. 24. Develop DESIGN SYSTEM STRATEGY code structure design strategy
  25. 25. Teacher designed by gb from the Noun Project DESIGNER DAYS
  26. 26. .play
  27. 27. DESIGN STUDIO DESIGN CRITIQUE
  28. 28. Always design a thing by considering it in its next larger context - a chair in a room, a room in a house, a house in an environment, an environment in a city plan. -Eliel Saarinen
  29. 29. A beautiful design system is about finding the same balance of consistency and variety. Too systematic and the design becomes predictableand repetitive. Too much variation and the system is confusing and overwhelming. -Allison Wagner
  30. 30. Integrating the design system. MOTIVATE DEVELOP STICK make it
  31. 31. Content: Present new Design Chunks Show new Design results Share the Design System Train new users Activities: Presentations Meetups Designer Days Video conferences
  32. 32. Document and integrate the process of iterating on designs. MOTIVATE DEVELOP STICK REPEATABLE make it make it
  33. 33. Flickr - Lesley Fryer Content: Findings from revisions Changes in trends and business Usability findings Emerging trends and needs Activities: Measure progression in design revisions Design Managment Identify re-usable chunks Iterate on design chunks
  34. 34. Flickr - Jasmin Hussain ON DESIGN CHUNKS ITERATEON DESIGN CHUNKS ITERATE
  35. 35. OptimizeDevelop Make it stick
  36. 36. Optimize based on feedback MOTIVATE DEVELOP STICK REPEATABLE OPTIMIZE make it make it
  37. 37. 5 10 7 Content: Challenges Needs Goals Activities: Collect feedback Adjust strategy and process Designer meetups focus groups with developers
  38. 38. The 5 steps towards creating a consistent and healthy design MOTIVATE DEVELOP STICK REPEATABLE OPTIMIZE make it make it
  39. 39. @jflusund www.steria.no Thanks!

×