Workflows Modèles HTML

Modèles HTML de flux de travail personnalisables

Une équipe qui documente un processus d'approbation connaît généralement chaque étape par cœur et perd malgré tout une journée à peaufiner la mise en page. Les modèles HTML de flux de travail vous permettent de gagner du temps. Parcourez la collection, ouvrez une démo dont les sections s'enchaînent déjà et remplacez le texte d'exemple par vos propres noms d'étapes, responsables et libellés d'état. Le balisage sous-jacent est modifiable ; ainsi, tout ce que les contrôles visuels omettent peut être géré directement dans le code source.

Sections d'étapes que vous pouvez renommer et réorganiser

Ce qui distingue ces mises en page d'un modèle de contenu classique, c'est que leur séquence est intégrée. Chaque bloc est conçu pour contenir une étape, et copier un bloc ajoute une étape sans perturber les étapes adjacentes.

Un bloc d'étape contient généralement quelques éléments importants :

• Le nom de l'étape et une brève description de son contenu ;

• Le responsable ou l'équipe chargée de faire avancer le travail ;

• Un libellé d'état tel que « En attente », « En cours de révision » ou « Terminé » ;

• Le transfert de responsabilité qui suit, y compris toute décision qui modifie le processus.

Approbations courtes versus flux d'intégration longs

Deux processus de durée similaire peuvent nécessiter des présentations opposées. Un circuit d'approbation repose sur ses points de décision : approuver, refuser et réviser font transiter la même demande par trois branches différentes. Un modèle compact avec quatre étapes visibles permet donc de les couvrir toutes. L'intégration est plus longue et plus linéaire, commençant par une demande et une vérification.

Viennent ensuite la configuration et l'approbation, et ce n'est qu'ensuite que le nouvel employé commence réellement son travail. C'est pourquoi les sections répétables et l'espace pour les notes explicatives sont plus importants dans ces étapes. La prestation de services se situe entre les deux, de la réception au traitement, où les contrôles qualité déterminent si le travail est expédié ou renvoyé à l'étape précédente.

Cartes, chronologies, étapes numérotées sur écrans étroits

Le choix du format visuel est important. Les étapes numérotées sont lisibles pour une procédure courte, les cartes conviennent aux étapes comportant chacune plusieurs champs, et une chronologie verticale permet de structurer un long parcours sans le surcharger horizontalement. L'élément Grille de Nicepage permet d'aligner les fiches d'étape dans des cellules adaptatives, et le guide de conception web adaptative présente des outils pour adapter le contenu à différentes largeurs d'écran.

Sur un téléphone, l'ordre des étapes est crucial : une ligne devient une colonne et la séquence doit être conservée. Les dépendances sont les premières à être affectées, car une étape que personne ne peut démarrer reste accessible même si ses voisines ont disparu. Avant de valider votre code, ouvrez une démo sur un écran étroit et vérifiez que l'étape 4 s'affiche toujours correctement.