Designers, Developers, Let’s Create the Difference!
summary
A method for replacing Material with a project-specific design system by co‑building between designers and developers using Sketch and Figma prototypes, a Storybook component library, and Zeplin/InVision handoff, guided by Atomic Design. Components follow five rules — simple, flexible, customizable, tested, documented — and are implemented iteratively, demonstrated by an aquarium app that becomes responsive and more immersive as Material is removed.
AI-written summary · about
chapters (20)
- 0:00Introduction
- 0:40All websites look the same!
- 1:24How to stand out?
- 3:39A designer to the rescue!
- 5:12Design is about research
- 5:43User research
- 5:55And identifying a user journey
- 6:36The project progresses
- 10:28Moodboard
- 11:25First rendering of a user journey...
- 13:43Typography styles
- 15:58Animations to bring the product to life
- 16:48First functional components: molecules
- 19:29Considering accessibility
- 23:23The project’s common folder
- 23:43Components of a design system
- 24:06Flexible components
- 24:25Customizable components
- 25:11Remove Material from the project!
- 29:56Design system group
related talks
34mDesigners and Developers, Let’s Create the Difference!
15mModern Approach to Designer ❤️ Developer Collaboration
15mHoly War between Designers & Developers
39mDesigning with Components
18mDesign Systems in Practice
28mFrom Sketch to Code Designing a Component Kit
14mRethinking Designer-Developer Collaboration
45mDesigners, developers, let's make a difference…