3 outstanding design systems
I'm a Design Systems Awards finalist, my interview for The Design System Guide, a deep dive with 3 remarkable design systems, a closer look at... Basti Ui and some fresh news!
In this edition:
📣 What's new at @lauthieb
📰 Fresh updates (articles, videos, podcasts)
🧐 Delving deeper... 3 remarkable Design Systems!
📱 Tech news that caught my attention
🔍 Spotlight on... Basti Ui
💌 Thank you
If you're just discovering this newsletter or if someone forwarded you this edition and you'd like to subscribe to Webpreneurs:
For your information, this newsletter was initially written in French and later pivoted to English in order to reach a wider audience following a request from the community. That's why at certain points, you'll find resources in French which will be prefixed with "[French]". Enjoy!
Hello everyone! 👋
Welcome to the 20 new subscribers since the last edition; you are now over 170 people receiving this newsletter!
It's been a few weeks since I last wrote to you; I've been busy, but I managed to find some time to give you some updates. So, I'm very happy to present this 3rd edition to you!
Let's dive in! 🚀
📣 What's new at @lauthieb
On my end, I've been rather quiet on social media lately as I've been quite busy. However, a piece of exciting news did slip through and caused a bit of a noise!
I'm honored to be among the finalists at the Design Systems Awards hosted by ZeroHeight in the "Best Plugin" category for my Figma plugin: Variables Converter (source code on GitHub).
Here is the LinkedIn post where I announce this news:
Thank you so much for your reactions and shares, they warm my heart! I'm also very honored to be in the finals alongside Nathan Curtis, Jan Six, & the Doctolib Design System team.
I also invite you to check out the other finalists in the other categories; it's truly enriching and full of discoveries in the field of design systems! Oh, and I almost forgot 👀, if you'd like to vote for my plugin, you can do so here 🗳️.
Otherwise, I also had the honor of being interviewed by Romina Kavcic, founder of the renowned website filled with resources related to Design Systems: thedesignsystem.guide.
Here is the interview in question & Romina's LinkedIn post.
Thanks again to Romina for this opportunity! It was very enriching 😊
📰 Fresh updates
In terms of my monitoring over the past few weeks, I've come across some very insightful articles, videos, and podcasts. Let's dive in!
📝 Articles
An interesting article by Ahmad Shadeed about the CSS discoveries within the web version of Photoshop: it's right here 📖.
A very insightful article by Erik Kroes (whom I recently had the chance to meet) about accessibility, design systems, and management: it's right here 📖.
🎬 Videos
Canva has announced a plethora of diverse features, including Artificial Intelligence integration within their tool. While I don't use it regularly, I've always found this tool very powerful for quickly creating successful graphic designs. Well done on these new features; they're likely to attract a lot of attention:
[French] Ah, the infamous migration from Next.js 12 to Next.js 13, not an easy task given the changed concepts! Thank you, Melvyn, for summarizing them clearly and succinctly in this video.
Well, we're already at Next.js 14 now since last week! Melvyn is really quick; he's already made a new video about it (he's too fast! 🚀), showcasing the new features this version brings compared to the previous one:
[French] In the second edition of Webpreneurs, I had something for you! Arc Browser has integrated Artificial Intelligence features, and who better than Shubham Sharma to present them in detail:
[French] And finally, a documentary-style video that I really enjoyed, "No-Code Revolution" by Stan Verju. I encourage you to watch it to understand how no-code tools have accelerated the creation of modern and efficient tools in recent years:
🎧 Podcasts
[French] This month, I stumbled upon a podcast that was new to me: "Just a Click" by Terry Michel. It was a delightful discovery, especially through this episode featuring Mathieu Sanchez (CTO of d’Acasi) discussing remote work and asynchronous work:
I also love the podcast "Le mémo" by Baptiste Carpentier Agostini. I particularly enjoyed this episode where he shares some daily productivity tips:
🧐 Let's dig deeper... 3 Remarkable Design Systems!
In the vast domain of design and digital creation, design systems have taken a prominent place as fundamental elements for product design and development.
They play a crucial role in ensuring visual consistency, operational efficiency, and scalability of products while fostering seamless collaboration between design and development teams.
As the Tech Lead & Engineering Manager of Decathlon's Design System, I've had the opportunity to explore a considerable number of different design systems. In this edition, I wanted to present three examples of design systems that stand out for their unique characteristics and their impact on the world of design and development.
1. Google's Material Design: The Elegance of Simplicity
Material Design, created by Google, embodies elegance through simplicity. It has established itself as a cornerstone in interface design by offering clear guidelines for intuitive user experiences.
The standout feature of Material Design lies in its ability to evolve in harmony with design trends. It continually adapts to meet the changing needs of users and creators, thanks to a dynamic community of designers and developers who contribute to its ongoing improvement.
Material Design is characterized by subtle animations, smooth transitions, and a well-defined color palette. Colors are carefully selected to establish harmonious relationships between elements, thereby creating a seamless user experience across different platforms, whether it's Android, iOS, or the web.
Its latest iteration (Material You, also known as Material 3 or "M3") puts emphasis on customization. Users have more control over the appearance of their interfaces. They can choose colors that match their personal preferences, allowing applications to adapt to their own style. This extensive customization fosters a deeper connection between the user and the interface, which can enhance engagement and retention.
In terms of design, Material You continues to prioritize simplicity and clarity. However, it also introduces a new approach to design based on gestures. Touch gestures and interactions are at the core of the user experience, contributing to a smoother and more natural experience.
In summary, Material Design is a versatile model that has left an indelible mark on the aesthetics of the web and mobile applications. It demonstrates that simplicity and elegance can be at the heart of innovation in digital design.
2. IBM Carbon Design System : la puissance de la marque
One of my earliest references when I started in the world of design systems was IBM's Carbon Design System.
It's a design system characterized by its commitment to the IBM brand. It provides a comprehensive library of components and detailed guidelines to ensure complete consistency with the visual identity of the company. This approach promotes brand recognition and fosters user trust.
This design system goes beyond visual design. It also integrates accessibility standards, ensuring that products developed with Carbon are inclusive and accessible to all users, regardless of their specific needs. This holistic approach contributes to creating more equitable and inclusive products.
Colors are an essential part of any design, and Carbon offers a well-balanced color palette. Its system of themes and tokens helps maintain a consistent user experience. It provides two light themes and two dark themes to accommodate user preferences.
Layout is another crucial element of design, and Carbon sets a reference with its spacing scale to help position components accurately while ensuring consistency in layout and spacing.
Typography is also essential, and Carbon uses "type tokens" to define predefined styles for font size, weight, and line height. They are calibrated to be used with the IBM Plex font.
Here's a short video showcasing the different packages available in the latest version:
Overall, the IBM Carbon Design System is a comprehensive tool that promotes brand consistency, accessibility, integration of visual identity, modularity, versatility, and continuous evolution.
3. Nord de Nordhealth : une documentation exceptionnelle
Another design system that I really appreciate is the Nord Design System by Nordhealth. This design system is truly a gem, starting from its documentation platform and its pedagogical approach to all the elements it provides.
Its documentation platform provides a wealth of information and resources for developers and designers. It's a model of comprehensiveness, featuring numerous concrete examples, interactive playgrounds for real-time experimentation, as well as many practical tools.
Here are a few examples of pages I recommend reading:
Navigation through the documentation is truly seamless, providing an exceptional user experience. Everything is just a click away, making it easy to find essential information for design and development.
In short, as you've gathered, I really appreciate Nord for its simple yet comprehensive approach to Design System documentation.
And other design systems?
So… There are many other design systems that I like, and I wanted to focus on three that I find remarkable. I hope you'll enjoy them too; feel free to let me know in the comments.
Stay tuned, as I'll continue to discuss this domain that I'm passionate about in future editions, featuring more examples!
📱 Tech news that caught my attention
Here are the latest digital news items that have caught my attention recently:
The surprise Apple Event "Scary fast" that unveiled several new features for MacBook Pro, iMac, and the new Apple M3, M3 Pro, and M3 Max processors really caught my attention.
And for sure… I’ve bought Super Mario Bros. Wonder 🕹️ !
🔍 Spotlight on… Basti Ui
[French] In this edition, I want to share with you a content creator that I particularly appreciate... Basti Ui!
Bastien is a content creator focused on design & tech, blending playfulness and good humor to make learning graphic interface design concepts extremely enjoyable.
He offers a plethora of fascinating content, whether through his live streams on Twitch or his YouTube videos. Among those that I've enjoyed recently, I recommend the following:
I also had the opportunity to be invited to one of his live streams a few months ago to present Dev Mode within Figma. It was a great experience!
Feel free to explore Basti Ui's work, and I'm confident you'll find his content as informative and inspiring as I do. Graphic interface design has never been more accessible and entertaining.
Moreover, if you want to learn more about his journey, including how he managed to transition from a full-time job to launching his career online following his growth on social media, I invite you to listen to this episode of Offset Podcast:
💌 Thank you
A big thank you to each and every one of you for reading this edition all the way through!
Your feedback is important to me, so please don't hesitate to share it. All criticism is valuable! Stay tuned for more content coming in the next editions.
Thanks again for reading, and see you soon! 👋
If you're just discovering this via a link or if someone forwarded you this edition and you'd like to subscribe to Webpreneurs: