Je me demandais comment gérer le design manquant durant un Sprint. les modifications dues au développement, aux nouvelles idées, aux problèmes techniques.. font que le design d’un projet change au fur et à mesure du temps. J’ai donc eu besoin de trouver et développer une méthode pour intégrer le design dans un sprint normal, et le faire évoluer au même rythme que le développement, par itérations successives. Et je l’écris ici pour ne pas l’oublier !

2 étapes

Avant le début du développement, il faut :

• Une “Charte graphique”, document qui contient les couleurs et leur usage (background, texte, titres, alertes, légendes…), les polices de paragraphe, titre, lien… , les textures, le rendu attendu en fonction des endroits (menus, articles, widgets…).

Chaque exemple comprend un graphisme, une explication de l’objectif du graphisme et des endroits auquels il est attendu , ansi que le CSS nécessaire (grâce à une mixin SCSS/LESS si possible)

• Une “Charte des Interactions”, qui décrit les principales possibilités d’action des utilisateurs lors de l’utilisation de ce projet, étape par étape.

Chaque exemple comprend un workflow de l’interaction et ses transitions, une explication du résultat attendu par l’utilisateur et le code basique nécessaire pour faire fonctionner l’interaction si possible.

• Une “Charte Technique” décrivant les langages, librairies et technologies front-end & back-end utilisées.

Pendant le sprint, on commence par un Sprint Planning Meeting qui décrit les tâches à réaliser par l’équipe. C’est durant cette phase que tout se joue.

• Les tâches qui ont besoin d’un redesign ou d’une description plus complête vont être assignées au designer, qui va créer un document explicatif rapide pour chacune, l’ajouter sur la tâche, puis les assignera aux développeurs par la suite.

• Le designer va regarder les autres tâches, et y noter les documents de design utiles pour la réalisation de la tâche.

De cette manière, un développeur pourra se référer uniquement au descriptif de la tâche pour réaliser son travail !

Qu’est-ce que ça donne concrètement ?

J’utilise Trello, qui permet de faire ça facilement :

La Card assignée au Designer :

La Card une fois le designer passé : (notez le changement de [design] à [dev])