Welcome to Episode 5 of our design system series! In this episode, we're taking a deep dive into building a table component in Figma!
We'll walk you through the best practices for designing flexible and adaptable table components, all while staying aligned with your design system principles and leveraging the design tokens we established in the previous episodes.
Make sure to like, comment, and subscribe for more insights on building effective design systems!
Purchase this variable library: https://resources.uicollective.co/buy...
*Apologies for audio issues throughout. Ran into issues working with my new microphone.
Save 15% on the Central Icon System with code COLLECTIVEICONISTS
Central Icon System: https://iconists.co/central?aff=bdzGd
ASK THE COMMUNITY: https://uicollective.co/
Downloads & Links
Part 1: • Build a Design System! Ep. 1: Figma T...
Part 2: • Build a Design System! Ep. 2: Basic F...
Part 3: • Build a Figma Design System | Part 3!
Part 4: • Build a Figma Design System | Part 4!
Resources: https://uicollective.co/designer-tool...
We build design systems: https://uicollective.co/design-system...
Book me for an hour (enterprise support): https://tidycal.com/kirkland/60-minut...
0:00 Building Cell Items
8:05 Building a Cell
12:47 Building Rows
15:41 Building Columns
20:02 Hacking your table!!
22:54 Build a Row Table Component
26:19 Adding a Heading & Pagination
29:55 Building a Column Table Component
33:13 Text Truncation
34:24 Troubleshooting & Cleanup