Masterclass de conception de formulaires

C'était un atelier de 4 jours divisé en deux segments de 45 minutes, avec 15 minutes des pauses suivies d'une période de questions-réponses de 30 minutes avec des devoirs facultatifs entre les jours. Chaque jour, nous nous efforçons de résoudre un gros problème. Cela a fourni une manière d'aborder le problème comme nous le faisons dans la vraie vie: en analysant et en discutant des options avant d'arriver à une bonne solution.

Dans l'ensemble, c'était une expérience amusante. J'ai beaucoup appris et j'ai passé un bon moment à enseigner et à discuter avec tout le monde. J'attends déjà avec impatience le prochain qui est provisoirement prévu pour l'été 2021.

Quelques faits saillants de chaque jour

Voici un bref aperçu de chaque jour, y compris quelques-uns des faits saillants.

Jour 1: Clouer les bases de la conception de formulaires

Le premier jour, nous avons conçu un formulaire d'inscription simple à partir de zéro. Cela a fourni un moyen idéal pour clouer les bases de la conception de formulaire. Il a couvert des choses comme le positionnement d'étiquette le style de formulaire et les types d'entrée. À la fin de la première journée, nous avions nous-mêmes un formulaire d'inscription qui couvrait les bases et le rendait aussi simple que possible pour les utilisateurs.

Mon point culminant de cette session a été l'exercice question protocol . Au lieu de nous concentrer sur la façon d'économiser artificiellement de l'espace sur les formulaires (en utilisant des éléments tels que des étiquettes flottantes, des info-bulles, des étiquettes alignées à gauche et du texte d'espace réservé), nous avons utilisé une feuille de calcul pour aider à savoir pourquoi chaque question est posée et la meilleure façon d'obtenir le réponse.

Pour notre formulaire d'inscription, ceci signifiait une analyse approfondie de la demande du nom, de l'adresse e-mail et du mot de passe d'une personne. Et à la fin de l'exercice, nous avions réduit de moitié le nombre de champs de formulaire et avions une justification claire pour ceux qui restaient.

Jour 2: Validation de formulaire et écriture de bons messages d'erreur

Le deuxième jour, nous avons pris notre formulaire d'inscription bien conçu et avons examiné comment aider les utilisateurs à récupérer des erreurs de deux manières:

1. Nous avons décidé quand valider les formulaires et comment afficher les messages d'erreur;
2. Nous avons appris à rédiger des messages d'erreur clairs, concis, cohérents et spécifiques qui aident les utilisateurs à se remettre rapidement sur les rails.

My Le point culminant de cette session a été l'exercice de remodeler les messages d'erreur sur le formulaire d'inscription de Smashing Magazine.

Sophy Colbert un concepteur de contenu qui a assisté à l'atelier, s'est porté volontaire pour partager sa ne w messages d'erreur expliquant sa justification pour chacun d'eux.

Les messages et le La justification était superbe, et je pense que le groupe en a beaucoup tiré parti car il a pu avoir un aperçu de l'état d'esprit du concepteur de contenu de Sophy.

Jour 3: Redesigning A Real World Checkout Form

Le troisième jour, nous avons repensé l'ASOS flux de paiement à partir de zéro. Cela comprenait le départ des invités (première expérience) et le départ en tant que personne possédant un compte (expérience d'utilisation répétée). Nous avons abordé de nombreux sujets tels que l'utilisation d'onglets, d'accordéons ou de boutons radio. Et nous avons également examiné les extractions d'une page par rapport aux extractions de plusieurs pages.

Mon point fort de cette session a été que le processus de refonte de plusieurs interactions a exposé de nouveaux défis en matière de conception de contenu et de conception de services. Par exemple, nous avons converti les onglets qui demandent à l'utilisateur de spécifier s'il a un compte ou non:

Grand aperçu )

Et nous les avons redessinées sous une forme avec des boutons radio :

Et cela a exposé le problème que dans la vraie vie, les choix sont rarement binaires. J'ai donc demandé au groupe quelle était l'option manquante et ils ont dit à juste titre: «Que faire si l'utilisateur ne se souvient pas?»

Donc, même si nous avons d'abord considéré cela comme un problème de conception d'interaction, c'est devenu un problème de conception de contenu et de service.

Tous ces problèmes résumaient bien l'une des règles de la forme UX: «Faites-vous des amis avec d'autres départements ». En tant que concepteurs, nous devons travailler efficacement avec les parties prenantes de toute l'organisation pour nous assurer d'éviter autant de complexité que possible. Et c'est encore là que le protocole des questions brille vraiment.

Jour 4: Utilisation de la syntaxe abrégée et conception de formes longues et complexes

Le jour 4 a été divisé en deux parties que je discuterai dans l'ordre inverse.

Dans le Dans la deuxième partie, nous avons examiné divers modèles qui aident les utilisateurs à remplir des formulaires longs et complexes – le genre de formulaires qui prennent des jours, des semaines ou même des mois à remplir. J'avais vraiment hâte de l'exécuter parce que les défis de conception à ce sujet sont intéressants et pas bien maîtrisés.

Dans la première partie, nous avons repensé le formulaire d'inscription de Smashing Magazine en utilisant une syntaxe abrégée.

Mon point fort de cette session était que Vitaly, M. Smashing Magazine lui-même, était devenu notre partenaire commercial. Le groupe lui a posé des questions pour comprendre pourquoi le formulaire avait été conçu comme il était et pour savoir pourquoi certaines questions avaient été posées.

Voici quelques exemples:

• Sophy O a demandé pourquoi le champ country est demandé. Vitaly a dit que cela dépend de ce que fait l'utilisateur. Si l'utilisateur achète un livre, nous devons savoir où il va. Et les taxes sur le livre sont basées sur le pays de destination. »Cela a conduit soit à supprimer le champ et à demander ces informations lorsque quelqu'un achète le livre – soit simplement à indiquer plus clairement pourquoi nous demandons ces informations. [19659021] Milos Lazarevic a remis en question la nécessité de cocher la case «Aimez-vous les chats?». Et Dana Cottreau et Jaclyn Ziegler ont apprécié le caractère de la case à cocher . Mais je mettrais en balance la joie que cela apporte à certaines personnes contre le risque d'aliéner des personnes qui, par exemple, sont moins informées en numérique ou sont simplement pressées d'accéder au contenu.
• Emma Stotz a remis en question le utilisation de validation en direct étant donné tous les problèmes d'utilisabilité qui surgissent autour de cela. Et Vitaly était désireux d'explorer la validation instantanée des champs à la place.

Mon impression générale

Pour moi, l'atelier s'est très bien passé dans l'ensemble et j'ai été époustouflé par la façon dont les choses se sont déroulées et les commentaires que j'ai reçus des participants. Tout le monde était si amical et tolérant face à quelques difficultés techniques que j'ai rencontrées le premier jour ( merci encore à tous! ). Faire fonctionner l'atelier à distance via Zoom a ses problèmes (nous ne parlerons pas de la façon dont j'ai quitté la réunion par accident paniqué par accident le premier jour), mais en fait, j'ai trouvé l'aspect distant utile dans l'ensemble.

Par exemple, tous étant connectés à Zoom, les participants pouvaient facilement poser des questions tout en partageant leur écran pour donner vie aux problèmes.

J'ai aussi beaucoup aimé rencontrer des gens à travers le monde, quelque chose qui aurait été difficile avec des ateliers en personne, je pense. De plus, pendant la pause, je me suis précipité rapidement pour mettre mes enfants au lit, alors j'imagine que cela a également bien fonctionné pour les participants.

Mais il y a une chose que j'aurais aimé savoir plus tôt. J'avais peur qu'avec un si grand groupe de personnes (81 pour être exact), laisser les gens parler librement aboutirait à un chaos. Par conséquent, le premier jour, j'ai lu et répondu aux questions du groupe dans le document Google partagé pendant les questions et réponses. Cela signifiait que les voix des autres n'étaient pas entendues et qu'il y avait plus de barrière entre moi et le groupe.

C'est quelque chose que j'ai rectifié pour le jour 2 et cela a vraiment fait une différence. C'était agréable d'entendre la voix et les pensées des gens avec leurs propres mots et cela créait davantage un dialogue ouvert où d'autres personnes ont commencé à répondre aux questions des autres que j'aimais.

Je me souviens qu'Alex Price est intervenu une fois pour parler de son expérience dans le traitement d'un formulaire compliqué qui devait être rempli par différentes personnes.

Ce que je changerai pour la prochaine fois

Bien que mon impression générale de l'atelier soit très positive, il y a certaines choses que Je chercherais à m'améliorer pour la prochaine fois.

1. Afficher les bases, pas apprendre les bases

La première journée a couvert de nombreuses bases avant d’entrer dans les détails les jours suivants, mais cela me dérangeait un peu d’enseigner certaines de ces choses car je pensais que de nombreux participants en savaient beaucoup ce truc déjà. Alors, la prochaine fois, j'aimerais reconnaître que certaines personnes sont venues avec beaucoup de connaissances et ont mis en scène «c'est comme ça que j'enseigne les bases» par opposition à «c'est comment apprendre les bases» – grâce à Caroline Jarrett pour cette astuce.

De plus, je vais probablement demander au groupe s'il existe une approche de conception de formulaire pour laquelle ils ont eu du mal à convaincre les coéquipiers car c'est certainement quelque chose que j'ai lutté avec avant.

2. Diviser les gens en groupes plus grands

L'un des exercices impliquait de diviser des personnes en groupes de 2 en utilisant les salles d'atelier Zoom, mais parce que les gens venaient à cet atelier du monde entier, certaines des personnes qui écoutaient n'étaient pas en mesure de suivre

Par exemple, certaines personnes avaient vraiment besoin de prendre une pause déjeuner parce que leur fuseau horaire était en avance sur le mien. Cela signifiait qu'une ou deux personnes qui souhaitaient participer se sont retrouvées seules dans un groupe. La prochaine fois, je mettrais les gens en groupes de 4 et je m'assurerais que les exercices fonctionnent toujours.

3. Ajouter plus d'exercices de groupe

Malgré le problème que je viens de mentionner, les exercices de groupe ont bien fonctionné. Les gens les ont appréciés et cela a suscité des idées vraiment intéressantes de la part des participants. Certaines personnes m'ont envoyé un message après m'avoir dit qu'elles souhaitaient qu'il y ait plus d'exercices de groupe, alors je m'efforcerai de le faire.

Une affiche de toutes les règles

En parcourant l'atelier, nous avons coché ] 40 règles et principes de conception de formulaire qui ont apporté une belle structure supplémentaire aux sessions.

Quelques participants m'ont demandé si j'avais une affiche de toutes les règles et je ne l'ai pas fait – alors maintenant je '

Merci encore à tous ceux qui sont venus pour toutes leurs contributions. J'attends avec impatience le prochain.

Merci à Caroline Jarrett pour avoir non seulement revu chaque détail de mon atelier, mais aussi pour avoir édité cet article.

(vf, il)