Adekunle_Oduye_30_Min_E.pdf

UXINDIA2019: India's biggest international conference on User Experience Design which is being celebrated on Sep 9, 10 & 11 at Novotel HICC, Hyderabad.
www.ux-india.org/uxindia2019
#ux #uxindia #uxindia2019 #designthinking #uxi19 #uxconference #umodesign

Transcript

3. Adekunle Oduye Adekunle Oduye (Add-eh-koon-lay Oh-due-yay) (Add-eh-koon-lay Oh-due-yay) @adekunleoduye
4. My first experience My first experience building a design system building a design system
6. People People
7. Producers Producers Consumers Consumers
8. Design System Design System Direct Users Direct Users End Users End Users
9. Direct Users of a Design System: Direct Users of a Design System: ◦Designers ◦Engineers ◦Content Strategists ◦Data Scientists ◦QA Analysts
10. Design for the primary, Design for the primary, Support the secondary, Support the secondary, Accommodate the rest. Accommodate the rest.
12. Which experience is most important: Which experience is most important: Designer's or Developer's? Designer's or Developer's?
13. Which experience is most important: Which experience is most important: Designer's or Designer's or Developer's Developer's? ?
14. Why focus on the developer Why focus on the developer experience? experience? ◦Execute the UI ◦Execute the IxD ◦ In-charge of performance and accessibility
15. A design system doesn’t A design system doesn’t exist until it’s in exist until it’s in code code
16. Quantitative Research Quantitative Research
17. Quantitative Research - Survey
18. Qualitative Research Qualitative Research
19. Qualitative Research - User Interviews
20. Key questions to ask: Key questions to ask: ◦ What are some of the major pain points the design process? ◦ How can the design system make your job easier? ◦ What are some of your future goals?
21. 1. Clear and concise pattern Clear and concise pattern documentation documentation
22. 2. Seamless integration into Seamless integration into design & development process design & development process
23. 3. Communicate design system Communicate design system updates and new features updates and new features
24. 4. Test & validate components Test & validate components before release before release
25. - Magera Moon, "We realized that ultimately for our systems to succeed long-term, it needed to be thought of as everyone’s responsibility." The People Part of Design Systems
26. Process Process
27. What makes for a great process? What makes for a great process? ◦Predictable ◦Flexible ◦Seamless
28. Pattern Audit Pattern Audit
30. Project Roadmap Project Roadmap
32. Guidelines Guidelines
35. The process will be The process will be rough rough at first at first
36. Small Small steps, steps, Great Great distances distances
37. How can we incorporate How can we incorporate new patterns new patterns into a into a design system? design system?
38. New Pattern Process: New Pattern Process: ◦ Proposal ◦ Production ◦ Documentation
39. 1. Proposal Proposal
40. Proposal: Proposal: ◦Pattern Name ◦What is the purpose? ◦Where would this pattern be used?
41. 2. Production Production
44. Component API
45. Accessibility Checklist: Accessibility Checklist: ◦Keyboard navigation ◦Color Contrast ◦Images ◦Semantic Elements and Roles
46. https://a11yproject.com/checklist/
47. QA Checklist: QA Checklist: ◦Operating System (Windows, Mac, Andriod and IOS) ◦Cross browser compatibility (Chrome, Firefox, Safari, etc.) ◦Responsiveness (Desktop, Mobile, TV, etc.)
48. 3. Documentation Documentation
49. Documentation structure: Documentation structure: ◦Purpose ◦Variants ◦Live Example ◦Code snippents
52. - Una Kravets, Despite how much control the other engineers have on the process, they need to feel like they have input, and feel heard. Why Design Systems Fail
53. Product Product
54. UI Kit - Carbon Design System
55. Pattern Library - Carbon Design System
56. Documentation - Carbon Design System
57. Front-end Prototyping Front-end Prototyping
59. 1. Design the Design the "real" "real" experience experience
60. 2. One One master deliverable master deliverable
62. 3. Utilizing real data Utilizing real data
63. Move away from Move away from pixel perfection pixel perfection
64. Build the Build the right thing right thing instead of building the instead of building the thing right thing right
65. Front-end Prototypes for Great User Experience
66. Understand the Understand the problems & goals problems & goals of the of the people people
67. Create a Create a process process that that empowers the empowers the people people
68. Have a Have a product product that that provides value provides value to your company. to your company.
69. Thanks! Thanks! http://bit.ly/3ps-design-system-uxindia-2019
70. Resources Resources ◦ - Josh Clark ◦ - Jerry Cao ◦ - Atif Azam Only One Deliverable Matters How & Why Prototypes Are Mandatory for Good Design The Master Prototype | @adekunleoduye #uxindia2019