

Découvrez plus de Webpreneurs ☕
Webpreneurs ☕ #3
3 Design Systems remarquables, un zoom sur... Basti Ui 🎨. Mais aussi des nouveautés, de la veille, des actus tech, évènements, jobs...
Au sommaire de cette édition :
📣 Les nouveautés chez @lauthieb
📰 De la veille toute fraîche (articles, vidéos, podcasts)
🧐 On creuse… 3 Design Systems remarquables !
📱 Les actus tech qui m’ont marqué
🔍 Zoom sur… Basti Ui
💼 Le job board des webpreneurs
💌 Merci
Si vous découvrez tout juste cette newsletter ou si quelqu’un vous a transféré cette édition et que vous souhaitez vous inscrire à Webpreneurs :
Hello tout le monde 👋
Bienvenue aux 20 nouveaux abonné•e•s depuis la dernière édition, vous êtes désormais plus de 170 personnes à recevoir cette newsletter !
Cela fait quelques semaines que je ne vous ai pas écrit, j’avais du pain sur la planche mais j’ai réussi à trouver le temps de vous donner quelques news, me voilà donc très heureux de vous présenter cette 3ème édition !
Allons-y ! 🚀
📣 Les nouveautés chez @lauthieb
De mon côté, assez discret sur les réseaux sociaux car ces dernières semaines j’étais fort occupé. Par contre, une belle nouvelle s’est glissée tout de même et a fait un petit peu de bruit !
J’ai l’honneur de faire partie des finalistes lors des Design Systems Awards organisés par ZeroHeight dans la catégorie “Best Plugin” pour mon plugin Figma : Variables Converter (code source sur GitHub).
Voici le post LinkedIn où j’annonce cette nouvelle :
Merci infiniment pour vos réactions et partages qui font chaud au coeur ! Je suis aussi très honoré d’être en finale aux côtés de Nathan Curtis, Jan Six & l’équipe du Design System de Doctolib.
Je vous invite également à consulter les autres finalistes dans les autres catégories, c’est vraiment très enrichissant et plein de découverte dans le domaine des design systems ! Ah oui j’oubliais 👀, si vous souhaitez voter pour mon plugin, c’est par là 🗳️
Sinon, j’ai également eu l’honneur d’être interviewé par Romina Kavcic, fondatrice du célèbre site rempli de ressources liées aux Design Systems : thedesignsystem.guide.
Voici l’interview en question & le post LinkedIn de Romina.
Merci encore à Romina pour cette opportunité ! Ce fut très riche 😊
📰 De la veille toute fraîche
Au niveau de ma veille ces dernières semaines, des articles, vidéos et podcasts très riches en apprentissage. Allons-y !
📝 Articles
Un article intéressant d’Ahmad Shadeed au sujet des trouvailles en CSS au sein de la version web de Photoshop : c’est par ici 📖
Un article très riche d’Erik Kroes (que j’ai eu la chance de rencontrer récemment) à propos d’accessibilité, design systems et management : c’est par ici 📖
🎬 Vidéos
Canva a annoncé énormément de fonctionnalités diverses et variées incluant de l’Intelligence Artificielle au sein de leur outil. Je ne l’utilise pas régulièrement, mais j’ai toujours trouvé cet outil très puissant pour obtenir des créations graphiques réussies rapidement. Bien joué pour ces nouvelles fonctionnalités qui risquent de séduire du monde :
Ah la fameuse migration Next.js 12 vers Next.js 13, pas évidente tant les concepts ont changé ! Merci Melvyn de les avoir résumé de manière claire et synthétique dans cette vidéo :
Bon d’ailleurs, on est déjà à Next.js 14 maintenant depuis la semaine dernière 👀. Et bien, Melvyn a déjà fait une nouvelle vidéo (il est trop rapide ! 🚀) à ce sujet en montrant les nouveautés que cette version apporte par rapport à la précédente :
Je vous en avais dans l’édition numéro 2 de Webpreneurs, Arc Browser a intégré des fonctionnalités d’Intelligence Artificielle et qui mieux que Shubham Sharma pour nous les présenter en détails :
Et enfin, une dernière vidéo de type documentaire qui m’a vraiment plu, “Révolution No-Code” par Stan Verju, je vous encourage à le regarder pour comprendre comment les outils no-code ont accéléré la création d’outils modernes et performants ces dernières années :
🎧 Podcasts
Ce mois-ci, j’ai découvert un podcast que je ne connaissais pas encore : “Just a Click” par Terry Michel. Jolie découverte via cet épisode où Mathieu Sanchez (CTO d’Acasi) sur le télétravail et le travail asynchrone :
Un podcast que j’adore également, c’est “Hack ta productivité” par Baptiste Carpentier. J’ai particulièrement bien aimé cet épisode où il nous donne quelques petites astuces productivité du quotidien :
🧐 On creuse… 3 Design Systems remarquables !
Dans le vaste domaine du design et de la création numérique, les design systems ont pris une place de premier plan en tant qu'éléments fondamentaux pour la conception et le développement de produits.
Ils jouent un rôle crucial en garantissant la cohérence visuelle, l'efficacité opérationnelle, et l'extensibilité des produits tout en favorisant une collaboration harmonieuse entre les équipes de conception et de développement.
En tant que Tech Lead & Engineering Manager du Design System de Decathlon, j’ai pu parcourir un bon nombre de design systems différents alors dans cette édition, j’avais envie de vous proposer trois exemples de design systems qui se distinguent par leurs caractéristiques uniques et leur impact sur le monde du design et du développement.
1. Material Design de Google : l'élégance de la simplicité
Material Design, créé par Google, incarne un modèle d'élégance à travers la simplicité. Il s'est établi comme une référence incontournable dans la conception d'interfaces en offrant des directives claires pour des expériences utilisateur intuitives.
L'élément marquant de Material Design réside dans sa capacité à évoluer en harmonie avec les tendances du design. Il s'adapte constamment pour répondre aux besoins changeants des utilisateurs et des créateurs, grâce à une communauté dynamique de concepteurs et de développeurs qui contribuent à son amélioration continue.
Material Design se caractérise par des animations subtiles, des transitions fluides, et une palette de couleurs bien définie. Les couleurs sont soigneusement sélectionnées pour établir des relations harmonieuses entre les éléments, créant ainsi une expérience utilisateur fluide sur différentes plateformes, que ce soit Android, iOS, ou le web.
Sa dernière version (Material You, alias Material 3 ou “M3”) met l’accent sur la personnalisation. Les utilisateurs ont davantage de contrôle sur l'apparence de leurs interfaces. Ils peuvent choisir des couleurs qui correspondent à leur préférence personnelle, ce qui permet aux applications de s'adapter à leur propre style. Cette personnalisation étendue crée une connexion plus profonde entre l'utilisateur et l'interface, ce qui peut améliorer l'engagement et la rétention.
En termes de conception, Material You continue de favoriser la simplicité et la clarté. Cependant, il introduit également une nouvelle approche du design basée sur les gestes. Les gestes tactiles et les interactions sont au centre de l'expérience utilisateur, ce qui contribue à créer une expérience plus fluide et naturelle.
En somme, Material Design est un modèle polyvalent qui a laissé une marque indélébile sur l'esthétique du web et des applications mobiles. Il démontre que la simplicité et l'élégance peuvent être au cœur de l'innovation dans le design numérique.
2. IBM Carbon Design System : la puissance de la marque
Une de mes premières références lorsque j’ai démarré dans le monde des design systems a été celui d’IBM nommé Carbon Design System.
C’est un design system qui se caractérise par son engagement envers la marque d'IBM. Il offre une bibliothèque complète de composants et des directives détaillées pour assurer une cohérence totale avec l'identité visuelle de cette entreprise. Cette approche favorise la reconnaissance de la marque et instaure la confiance des utilisateurs.
Ce design system ne s'arrête pas à la conception visuelle. Il intègre également des normes d'accessibilité, garantissant que les produits développés avec Carbon sont inclusifs et accessibles à tous les utilisateurs, indépendamment de leurs besoins particuliers. Cette approche holistique contribue à la création de produits plus équitables et inclusifs.
Les couleurs sont une partie essentielle de tout design, et Carbon propose une palette de couleurs bien équilibrée. Son système de thèmes et de tokens aide à maintenir une expérience utilisateur cohérente. Il offre deux thèmes clairs et deux thèmes sombres pour s'adapter aux préférences utilisateur.
La mise en page est un autre élément crucial du design, et Carbon est une référence au niveau de son échelle de spacings pour aider à positionner les composants avec précision en garantissant une cohérence au niveau de la disposition et des espacements.
La typographie est également essentielle, et Carbon utilise des "type tokens" pour définir des styles prédéfinis pour la taille de police, le poids et la hauteur de ligne. Ils sont calibrés pour être utilisés avec la police IBM Plex.
Voici une petite vidéo qui vous montre les différents packages disponibles sur la dernière version :
Dans l'ensemble, IBM Carbon Design System est un outil complet qui favorise la cohérence de la marque, l'accessibilité, l'intégration de l'identité visuelle, la modularité, la polyvalence et l'évolution constante.
3. Nord de Nordhealth : une documentation exceptionnelle
Un autre design system que j’apprécie beaucoup, c’est Nord Design System de Nordhealth. Ce design system est vraiment une pépite déjà au niveau de sa plateforme de documentation et de son approche pédagogique sur l’ensemble des éléments qu’il fournit.
Sa plateforme de documentation offre une richesse d'informations et de ressources pour les développeurs et les designers. Elle est un modèle d'exhaustivité, comportant de nombreux exemples concrets, des playgrounds interactifs pour expérimenter en temps réel, ainsi que beaucoup d'outils pratiques.
Quelques exemples de pages que je recommande de lire :
La navigation à travers la documentation est vraiment fluide, offrant une expérience utilisateur exceptionnelle. Tout est à portée de clic, facilitant la recherche d'informations essentielles pour la conception et le développement.
Bref, vous l’aurez compris, j’aime beaucoup Nord pour son approche simple et exhaustive de la documentation d’un Design System.
Et d’autres design systems ?
Alors… Il y a bien d’autres design systems que j’adore, j’ai souhaité mettre un cap sur trois que je trouve remarquable, j’espère qu’ils vous plairont, n’hésitez pas à me dire en commentaire.
Restez connectés, je continuerais de parler de ce domaine qui me passionne dans les éditions suivantes avec notamment d’autres exemples !
📱 Les actus tech qui m’ont marqué
Voici les dernières actus autour du numérique qui ont retenu mon attention ces derniers temps :
L’Apple Event surprise “Scary fast” (“Monstrueusement rapide”) qui a révélé pas mal de nouveautés au niveau des MacBook Pro, iMac & des nouveaux processeurs Apple M3, M3 Pro & M3 Max :
Et forcément… J’ai craqué pour Super Mario Bros. Wonder 🕹️ !
🔍 Zoom sur… Basti Ui
Dans cette édition, je tiens à partager avec vous un créateur de contenu que j’apprécie particulièrement… Basti Ui !
Bastien est un créateur de contenu axé design & tech alliant ludisme et bonne humeur, rendant l'apprentissage des concepts de conception d'interfaces graphiques extrêmement agréable.
Il propose une multitude de contenus fascinants, que ce soit au cours de ses lives sur Twitch ou à travers ses vidéos YouTube. Parmi celles qui m’ont plu assez récemment, je vous recommande les suivantes :
J’ai également eu la chance de pouvoir être invité lors de l’un de ses lives il y a quelques mois pour présenter le Dev Mode au sein de Figma, c’était génial comme expérience :
N'hésitez pas à explorer le travail de Basti Ui, et je suis convaincu que vous trouverez ses contenus aussi instructifs et inspirants que moi. La conception d'interfaces graphiques n'a jamais été aussi accessible et divertissante.
D’ailleurs, si vous voulez en savoir plus sur son parcours et notamment comment il a réussi en quelques temps suite à sa croissance sur les réseaux sociaux, à quitter son CDI pour se lancer concrètement sur Internet, je vous invite à écouter cet épisode d’Offset Podcast :
💼 Le job board des webpreneurs
Dans cette troisième édition, je tenais à mettre à l’honneur WeLoveDevs.com, qui est une entreprise basée sur Lille que j’apprécie particulièrement ! Ils mettent en avant des offres d’emploi dans le domaine du numérique et réalisent régulièrement des évènements, vidéos et podcasts pour animer la communauté dev’ !
Pour consulter les offres disponibles sur leur plateforme, c’est par ici 👀.
Concernant le monde du full remote, je vous partage la dernière édition de
:Si vous êtes au sein d’une entreprise ou une école et que cela vous intéresse de partager une annonce sur ma newsletter, contactez-moi.
💌 Merci
Un grand merci à chacun•e d'entre vous d’avoir lu cette édition jusqu’au bout !
Vos retours sont importants pour moi alors n’hésitez pas à m’en faire, toute critique est bonne à prendre ! Restez connectés pour d’autres contenus à venir dans les prochaines éditions.
Merci encore pour votre lecture & à bientôt 👋
Si vous découvrez tout juste via un lien ou si quelqu’un vous a transféré cette édition et que vous souhaitez vous inscrire à Webpreneurs :