Video: Defeat Decision Paralysis: Building a Killer Design System in Isolation

Rate this content
Bookmark
Defeating decision paralysis when building design systems by letting tools make some decisions. Using design tokens to express design decisions as data, including colors and typography. Alias colors to give them more specific names and define typography with a type scale. Use existing spacing scales and build components in isolation to test different states. Start with the basics, use existing tools, and have fun with it.

This talk has been presented at React Summit US 2023, check out the latest edition of this React Conference.

Shaun Evening
Shaun Evening
12 min
15 Nov, 2023

Comments

Sign in or register to post your comment.

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

The Whimsical Potential of JavaScript Frameworks
React Summit US 2023React Summit US 2023
28 min
The Whimsical Potential of JavaScript Frameworks
Top Content
Watch video: The Whimsical Potential of JavaScript Frameworks
The speaker discusses the whimsical and detailed work of Stripe, particularly their interactive and dynamic pages. They explain the use of React for building whimsical details and tracking mouse position. The speaker introduces React Spring for smooth animation and React3 Fiber for creating a 3D egg model. They also mention the use of Framer Motion and React server components for animating CSS properties.
AI + UX: Product Design for Intelligent Experiences
C3 Dev Festival 2024C3 Dev Festival 2024
28 min
AI + UX: Product Design for Intelligent Experiences
AI design challenges include bias, safety, and security. Trust and transparency are important in AI. Design principles for AI include user control, fighting bias, and promoting good decision-making. AI can enable the design process and investors expect to see it included in products. AI empowers individuals to create and share ideas, but managing expectations is crucial.
Domain Driven Design with Vue Applications
Vue.js London 2023Vue.js London 2023
14 min
Domain Driven Design with Vue Applications
Top Content
Welcome to this talk on domain-driven design in Vue.js application. Today we are going to look into domain-driven design, its benefits and how it works with Vue.js domain-driven design versus the MVVM model. Vue.js thrives in domain-driven design, a design approach that models software to match a domain. DDD emphasizes understanding business logic and creating a domain that reflects the language and concepts. Integrating DDD in Vue.js offers benefits such as effective modeling of complex business domains, structured code reflecting domain logic, and easier onboarding and ownership.
Proven Pinia Patterns
Vue.js London 2023Vue.js London 2023
20 min
Proven Pinia Patterns
Top Content
Pinnia is a lighter, more modular state management solution for Vue apps, offering consistent patterns, TypeScript support, and an intuitive developer experience. PINIA encourages splitting state into manageable domains, improving code splitting, type inferences, team collaboration, and debugging clarity. Pinia provides flexibility in accessing and mutating state, with different approaches for option and setup stores. It also offers features like patch, reset, and onAction methods. Vue Mastery offers comprehensive Pinnia courses and resources for fast learning.
Component Design Patterns
Vue.js London 2023Vue.js London 2023
18 min
Component Design Patterns
The Talk covers clean components and when to create new components, as well as patterns for writing cleaner components and the benefits of VIP patterns. Refactoring and separating code into separate components can make it shorter and easier to read, reducing complexity. The importance of not repeating oneself and the benefits of using smaller components for performance and developer experience are discussed. Composables can help extract logic in large and complex components, and patterns can be incorporated into component libraries and design systems.
Design-Driven Full-stack: an End-to-End Dev Workflow that Scales
React Summit 2022React Summit 2022
32 min
Design-Driven Full-stack: an End-to-End Dev Workflow that Scales
This Talk discusses the challenges of building full stack applications and introduces Redwood.js as a solution. It emphasizes the importance of design-driven workflows and the use of Redwood Cells to handle state and simplify complex tasks. The Talk also highlights the seamless integration between the front end and back end using mock data and the optimization of workflow for performant teams. It concludes with a mention of Redwood's authentication features and the importance of community and collaboration.