#15 - Creating a component system

Summary The conversation covers various topics including movie plans, TV shows, workout routines, reading habits, building a component library, reviewing the component library in Figma, color and typography choices, standardizing links and headers, and icon usage and component consistency. In this conversation, Adam and Ste discuss various improvements to the hardcover website, focusing on the design and implementation of components. They start by discussing the prompts page and how to improve its layout. Then, they explore creating text components in Figma to make it easier to style and manage text across the website. They also discuss implementing component library variants and sizes to ensure consistency and ease of use. The conversation then moves on to creating a title component and considering SEO implications for headings. They discuss the benefits of implementing components on the book page and the process of converting existing pages to use components. Finally, they touch on improving search functionality and provide updates on the Hardcover Live series. Takeaways Creating text components in Figma can make it easier to style and manage text across the website. Implementing component library variants and sizes ensures consistency and ease of use. Using components for headings and titles can improve SEO and provide a more structured hierarchy. Converting existing pages to use components can make it easier to maintain and update the website. Chapters 00:00 Introduction and Movie Plans 03:00 Discussion about TV Shows 06:00 Workout Routines 09:00 Reading Habits 12:00 Benefits of Audiobooks 15:00 Building a Component Library 19:00 Reviewing the Component Library in Figma 25:00 Color and Typography Choices 32:00 Standardizing Links and Headers 39:00 Icon Usage and Component Consistency 43:45 Improving the Prompts Page 44:58 Creating Text Components in Figma 48:08 Implementing Component Library Variants and Sizes 49:11 Creating a Title Component 51:11 SEO Considerations for Headings 52:48 Implementing Components on the Book Page 53:18 Converting Existing Pages to Use Components 54:27 Improving Search Functionality 56:10 Wrapping Up and Next Steps 57:01 Hardcover Live Updates 57:32 Inviting Guests to Hardcover Live 58:06 Conclusion