Paste Design System Newsletter - July 2024 Edition

Hey all, it's been a while! This newsletter summarizes our releases for all of 2024 so far, especially one release you've all been waiting for…

The AI UI Kit includes:

• AI experience guidelines that summarize all Paste AI components and guidelines, and collect resources from the great research and work that's already been done across the Segment, Flex, and Privacy teams.
• New AI Chat Log components, which we've made distinct from our Conversations Chat Log components, in order to ensure differentiation between the two interaction types.
• An updated Chat Composer component, with a ChatComposerContainer for standard layout and styling of the Chat Composer. This can be used in any chat use case.
• A new Side Panel component, which can be used for showing AI features side-by-side with main page content, for our upcoming update to the Filter pattern, and more.
• A new ArtificialIntelligenceIcon

Thanks to everyone for their partnership and feedback, including Jiyeon Kang, Eileen Tong, Megan Allison, Amira Chalbi Neffati, Wai-Jee Ho, and Barbara Chicca.

The Page Header component controls the spacing and layout for any components used at the top of the page, including Breadcrumbs, Headings, actions, and metadata. This component helps standardize content and layout of our pages, and includes a compact variant, too, for narrow containers.

The Summary Detail component displays a summary of information that can be expanded to show more information. It's most useful when you need to provide more actions and information than the Disclosure can provide. Use this component to organize information in a clear, accessible way to allow users to access detailed data only when needed.

We've released new brand Badges to highlight cross-selling opportunities across our platforms and on pricing plans. These Badges also mirror similar elements on twilio.com for enhanced cohesion across our customer touchpoints.

These Badges also come with updated guidelines on our Card component for marketing use cases. We're also working on a more general card layout pattern, so stay tuned!

The Ordered Display List component helps improve the scannability and visual design of steps or instructions, especially in onboarding use cases. You can use this component with all sorts of nested content as you would with the typical List component to walk a user through complex steps.

Our updated illustration foundations include clearer guidelines on:

• When to use illustrations
• Which ones to use
• How to access and request them

In Figma, you can turn on the Web Spot Image library for easy access to illustrations. Thanks to Shane Brown on the Web team for your partnership on this!

• Added icons for sentiment, different data types, e-commerce, transfer, admin dashboard, and the Conversational Insights product.
• Added dark theme as a mode in the Paste Components Figma library.

• Thanks to Megan Allison for updating our content foundations, including the voice and tone guidelines, content checklist, and product style guide, to more closely align with the recently released Twilio Style Guide.

This year, we've added 3 new members to our team.

Roxana joined us in January from Medellín, Colombia. She's been a Product Designer for several years. Over the past couple of years, she has been advocating for reusable systems for different teams and their benefits for speed, quality, and consistency.

Outside of work you can find her playing with her dogs, doing yoga, playing MTG, binge watching anime and reading historical fiction.

Kristian joined us in May from Minneapolis in the US. He's been at Twilio for nearly 2 years already, most recently with the Messaging team.

Outside of work, his passions include sketching technical studies, paddle boarding, and immersing himself in fantasy novels brimming with magic and adventure. He also enjoys baking and tackling home improvement projects.

Shoaib joined us in July from Bengaluru in India. He has been working at the intersection of design and tech for all his career. He led the design system initiative in his previous organization, combining the principles of open source systems and accessibility.

Outside of work, Shoaib usually indulges himself with movies, music, anime, and biryani.

Pastemates are individuals and teams who have been critical contributors to Paste, through advocating for adoption within their products and channeling important feedback and contributions back into the system.

In this edition of Pastemates, we're spotlighting Joe Fehrman! Joe Fehrman (@cogwizzle) has been an incredible collaborator over the past few months. They embody the Twilio Owner spirit by digging deep into the Paste repo, understanding how the team builds, thinking long term, and contributing betterments for our consumers.

Joe's contributions are already improving the developer experience both within the Paste team and for Twilio engineers at large. Their work has included helpful JSDoc additions to elevate consumers' understanding of component usage and a new variant to Form Pill Group as part of the new Filter Pattern. Not only that, but we are also working closely to facilitate upcoming contributions directly related to sprint work to deliver a lasting impact and accelerate our roadmap. Thank you, Joe!

As always, we're better together.