L’utilisation d’un style guide pour votre projet est un must have pour créer des pages web avec une homogénéité de conception. Il améliore grandement l’expérience utilisateur et votre expérience de conception ! De nombreuses entreprises ont tendance à sauter cette étape lors de la création de site web, et elle regrette le plus souvent ce choix par la suite, quand il s’agit d’effectuer des modifications.

‍

‍

Les avantages d'utiliser un style guide webflow

Il y a plusieurs raisons pour lesquelles utiliser un style guide Webflow peut être avantageux pour votre site web :

• Il permet de maintenir une certaine homogénéité dans la conception visuelle du site, en définissant les couleurs, les polices et les éléments graphiques à utiliser, il est directement lié à votre design system Figma.
• Il facilite la collaboration entre les différents intervenants sur le projet (designers, développeurs, etc.) en leur fournissant un ensemble de règles claires et précises à suivre.
• Il peut améliorer l'expérience utilisateur en proposant un design cohérent et facile à utiliser.
• Il améliore votre workflow pour la création de votre site web.

‍

À la manière de client first, il vous permet de rester organisé en utilisant une méthode de conception, et de créer un projet Webflow avec une base solide pour avoir un site qui suit votre croissance.

‍

‍

Quels sont les éléments à inclure dans votre style guide Webflow

Il y a de nombreux éléments importants à inclure dans votre style guide comme :

• Votre palette de couleur
• Les différents boutons
• Le style de vos headings (H1, H2, H3, H4, etc.)
• Les différentes classes pour vos textes
• Les différents styles de texte
• Vos champs de formulaire (imput, label, checkbox, radio button)
• Vos classes CSS de marge
• Vos classes CSS pour le padding
• Rich text

‍

Utiliser un style guide d’un template Client-first de Finsweet

Nous vous conseillons fortement de cloner le projet client first de Finsweet sur Webflow, un article est en cours de rédaction pour vous expliquer comment utiliser la template de Finsweet. Stay tuned !😄