Lors de la création d'un diagramme de processus pour un site web, beaucoup de gens ouvrent directement un outil de conception et commencent à dessiner, pour finalement constater des étapes manquantes, des textes incohérents ou un style non uniforme, ce qui entraîne des révisions répétées et une perte de temps. En réalité, avec une bonne préparation en amont, la suite sera beaucoup plus fluide. Voici une liste des éléments à préparer avant de commencer, que vous pouvez suivre.
1. Définir l'objectif et le public cible du processus
Commencez par déterminer où ce diagramme sera utilisé sur le site et à qui il s'adresse. Par exemple :
- Si c'est un processus d'utilisation du produit, les utilisateurs se concentrent sur les étapes opérationnelles, le diagramme doit être simple et clair ;
- Si c'est un processus de service, les utilisateurs peuvent s'intéresser aux délais et aux livrables, il faut marquer les étapes clés ;
- Si c'est un diagramme destiné à une équipe interne, il doit inclure des branches de décision détaillées et des traitements d'exception.
Après avoir clarifié l'objectif, déterminez le style visuel principal (professionnel, plat ou dessiné à la main) et le niveau de complexité du diagramme, pour éviter de commencer à l'aveugle.
2. Élaborer un plan textuel complet des étapes du processus
Ne dessinez pas directement, écrivez d'abord le processus en texte. Il est recommandé d'inclure :
- Point de départ : D'où l'utilisateur commence (par exemple, visiter une page, cliquer sur un bouton).
- Étapes clés : Le nom de chaque étape, l'action ou la condition de décision.
- Branches : Si la condition est remplie, quel chemin suivre ; sinon, quel chemin.
- Point d'arrivée : Le signe de fin du processus (par exemple, soumission réussie, téléchargement terminé).
En même temps, rédigez une brève description pour chaque étape (de préférence pas plus de 8 mots) pour éviter que le texte ne surcharge l'image. Une fois le plan textuel prêt, faites-le vérifier par un collègue ou un client pour confirmer que le processus est correct avant de commencer la conception.
3. Rassembler des références visuelles et une palette de couleurs
Déterminer à l'avance le style des icônes et les couleurs permet d'éviter de changer fréquemment d'outil pour chercher des ressources en cours de route. Il est conseillé de préparer :
- Bibliothèque d'icônes : Par exemple, des sites de ressources gratuites et utilisables commercialement, téléchargez des icônes de style plat, linéaire ou rempli, en veillant à l'uniformité ;
- Palette de couleurs : En fonction de la couleur de marque du site ou du style général, définissez la couleur principale, les couleurs secondaires, la couleur de fond et la couleur du texte, généralement limitées à 3-4 couleurs ;
- Style des flèches et des lignes de connexion : Lignes droites, brisées ou courbes, direction uniforme des flèches ;
- Référence de mise en page : Trouvez quelques captures d'écran de diagrammes de processus sur des sites similaires pour vous inspirer de la disposition et de la taille du texte. Attention à ne pas copier, seulement s'inspirer de la structure.
4. Déterminer le type et les dimensions du diagramme
Un diagramme de processus n'est pas nécessairement un schéma linéaire vertical. Vous pouvez choisir le type approprié en fonction du contenu :
- Diagramme de flux linéaire : Convient aux processus avec peu d'étapes et un flux unidirectionnel ;
- Diagramme en couloirs (swimlane) : Convient aux processus impliquant plusieurs départements ou rôles ;
- Arbre de décision : Convient aux processus avec de nombreuses branches de décision.
Déterminez également les dimensions de sortie de l'image (par exemple, largeur de 1200 pixels, hauteur adaptable au contenu) et tenez compte du contexte d'utilisation sur le site : s'agit-il d'une illustration de page intérieure, d'une image d'article ou d'une partie d'une bannière ? Les exigences de taille et de résolution varient selon l'emplacement.
5. Préparer les outils et les modèles
Choisissez l'outil adapté à vos compétences en conception. Si vous le faites vous-même :
- Outils en ligne : Canva, ProcessOn, Lucidchart, etc., avec des modèles prêts à l'emploi, il suffit d'ajuster le texte et les couleurs ;
- Logiciels de conception : Photoshop, Illustrator ou Figma, adaptés aux besoins de personnalisation plus poussés.
Si vous faites appel à un designer externe, fournissez-lui d'abord un plan textuel et des images de référence, afin qu'il puisse produire directement selon votre cadre, ce qui réduit les coûts de communication.
6. Vérifier la conformité et les risques de droits d'auteur
Enfin, assurez-vous que toutes les icônes, polices et images utilisées sont gratuites et utilisables commercialement ou sous licence. C'est particulièrement important pour un site d'entreprise, pour éviter les litiges liés aux droits d'auteur. De plus, les descriptions textuelles dans le diagramme doivent être précises et véridiques, sans inventer d'étapes de service ni de promesses de résultats.
Conclusion
Avant de créer un diagramme de processus, prenez une demi-heure pour préparer les éléments ci-dessus. L'efficacité de la conception ultérieure s'en trouvera nettement améliorée. En réfléchissant d'abord au processus, en l'écrivant clairement, puis en le dessinant, vous réussirez généralement du premier coup. Si vous mettez à jour les pages de services ou le centre d'aide de votre site, suivez cette liste pour vous préparer à l'avance et réduire les reprises.
