Rendez votre microcopie complète et cohérente, et maintenezla
Vous vous souvenez d'avoir multiplié vos cadres Figma ou Sketch pour démontrer les changements d'un seul mot? Ou peut-être vous mêler au fichier .json dans le code VS lorsque vous avez besoin de mettre à jour le texte de ce bouton? Et qu'en est-il des fautes de frappe irritantes dues à un manque de plugins de vérification grammaticale dans la plupart des éditeurs graphiques? Je crains qu'appeler des documents de copie (comme tout autre framework) une solution miracle ne soit trop, mais au moins cette technique peut faciliter ces luttes.
Regardons de plus près.
Un peu d'histoire et de crédit [19659003] L'une des premières mentions publiques de copies de documents appartient à Andrea Drugay, alors écrivain UX chez Dropbox. Je l'ai rencontré lors de ma certification en écriture UX à la UX Writing Hub Academy (salut Yuval!) En 2019.
Depuis lors, j'utilise largement des documents de copie en tant que concepteur de produit et je me suis basé sur pour le modifier en fonction des besoins des spécialistes UX en général, en particulier dans les petites équipes.
Qu'est-ce qu'un document de copie?
C'est un document dans lequel vous conservez et mettez à jour tous vos textes intégrés au produit, leurs instances, et décrivez leur comportement.

Dans ce flux, Figma ou Sketch est la source ultime d'éléments d'interface utilisateur tandis que la copie de document est la source ultime de copie intégrée au produit. Cela a plus de sens: vous utilisez des outils de conception pour la conception et des outils d'édition pour travailler avec le contenu (y compris le processus de documentation). Dans l'ensemble, cela amène le travail avec la copie intégrée au produit au niveau supérieur, à la fois pour le spécialiste de la conception et pour toute l'équipe.
Raisons d'utiliser Copy Docs
En ce moment, vous pourriez vous sentir un peu curieux de l'utiliser technique mais toujours sceptique. Vous avez raison: il devrait y avoir une très bonne raison de rendre votre flux de travail plus complexe.
Permettez-moi donc de vous donner un motif.
Copier des documents peut aller avec n'importe quel outil de conception
Il peut être utilisé avec n'importe quel logiciel que vous aimez. Figma, Sketch, XD – vous le nommez.
Vous ne pouvez vous concentrer que sur le contenu
D'une part, l'objectif d'un spécialiste UX est sa ressource la plus chère. De l’autre, l’efficacité de l’environnement dans lequel ils travaillent a un impact considérable sur leurs capacités.
La copie des documents améliore les deux aspects.
Le changement d’environnement permet de se recentrer. Et travailler avec du contenu dans un outil de contenu natif signifie moins de distractions.
Pour moi, c'est l'un des avantages les plus précieux de la copie de documents. Surtout lorsque vous êtes à la fois un concepteur et un écrivain dans votre équipe.

De plus, vous serez plus susceptible de ne pas manquer les états «cachés» (retour d'erreur ou de réussite, etc.) et pourrez utiliser divers moyens graphiques pour les annotations. Et il devient plus facile de décrire une logique complexe comme «Si l'événement X se produit… alors la copie du bouton devient Y…» – vous ne changez littéralement que le texte, sans vous mêler au graphique.
Ici, vous pouvez objecter que travailler avec une copie en dehors d'un l'interface semble douteuse. En réalité, dans 9 cas sur 10, vous pouvez clairement dire quelle longueur est raisonnable. En ce qui concerne les cas incertains, vous pouvez toujours essayer une ligne spécifique dans votre interface lorsque vous en avez vraiment besoin.
La cohérence est facile
Alors que dans IELTS, plus vous utilisez de synonymes, mieux c'est, ce n'est pas la même chose dans le domaine UX . Par exemple, si vous utilisez le terme "Supprimer" dans vos conceptions pour désigner une action de suppression d'un élément, mais à un endroit particulier, "Effacer" pour la même action apparaît, cela peut dérouter les utilisateurs: ils pourraient penser qu'une autre action est implicite.
Dans un document de copie, vous pouvez rapidement mettre en évidence toutes les instances d'un mot. Cela devient pratique lorsque vous souhaitez vous vérifier. Et si nécessaire – disons, vous avez effectué des tests d'utilisabilité et découvert que dans votre contexte même «Effacer» fera mieux – vous pouvez rapidement renommer en masse et le remettre aux développeurs ou aligner vos conceptions. En effet, il vaut bien mieux fixer un terme dans un document et ensuite simplement adapter vos cadres Figma ou Sketch que de ramper là-bas à la hâte et de picorer chaque élément avec la peur d'en sauter un.
Et cela fonctionne dans le sens inverse. : parfois vous voudrez peut-être scinder un terme. Par exemple, dans un premier temps, en travaillant avec ma propre copie de document, j'ai utilisé le mot «commentaire» pour désigner deux idées différentes: dans le premier cas, je parlais de l'outil de commentaire natif de Google Docs, et dans le second, j'ai fait référence à mes remarques dans le corps de la copie doc. Essentiellement, ils sont différents: le premier implique une discussion ping-pong avec mon équipe tandis que le second signifie mes seules notes d'information aux développeurs sur le comportement de l'objet. Alors maintenant, j'utilise les «commentaires» et les «annotations» de manière correspondante.

Les relecteurs sont heureux
La majorité des spécialistes linguistiques travaillent généralement dans des formats de type Word. Et ici, ils peuvent faire une estimation basée sur le nombre de mots.
Collaboration Is Nice And Deep
Puisqu'un logiciel d'édition fournit un ensemble d'outils merveilleux adapté à une coopération spécifique au contenu, votre équipe est maintenant amenée au prochain niveau de collaboration .

Et j'ai déjà mentionné les avantages du processus de distribution. Désormais, pour mettre à jour la microcopie dans les composants en direct, vous ne distribuez que la copie, organisée et annotée.
Les fichiers sont légers
Avec la copie de documents, vous évitez la redondance lorsque vous copiez-collez des cadres avec uniquement des modifications textuelles – maintenant vous le conservez dans un document dédié séparé. Inutile de dire que cela améliore les performances.
Cela signifie une grammaire «intégrée» pour vos créations
N'en avez-vous pas rêvé chaque fois que vous tapez une chaîne de texte dans votre Figma, Sketch ou XD
Comment créer un document de copie
Voici les étapes que je suis lors de la création de mes documents de copie.
1. Projetez votre interface
Pour commencer à copier des documents, vous avez besoin du squelette de votre interface. Je préfère créer des documents de copie au stade des maquettes, mais vous pouvez commencer au stade du prototypage. Cependant, si vous suivez une approche axée sur le contenu, il est même possible de créer un prototype avec des documents de copie, puis de les utiliser comme une liste d'éléments nécessaires lors de la conception de l'interface utilisateur.
2. Créer un aperçu du document de copie
Créer des sections correspondant aux noms de vos écrans.

3. Coller des captures d'écran
Vous devez suivre un modèle «En-tête + Capture d'écran + Tableau» pour chaque unité.

4. Coller des tableaux
Idéalement, vous voulez créer un tableau vide avec des styles prédéfinis sous chaque capture d'écran. Pour cela, créez un tableau pour votre premier écran et remplissez-le. Ensuite, copiez-collez le tableau rempli sous la deuxième capture d'écran, effacez-le, copiez-le à nouveau et collez-le plusieurs fois sous les captures d'écran restantes.

5. Remplissez-le
Tout est prêt pour votre travail de copie .
Travail écran par écran. Commencez par les espaces de noms. Ensuite, remplissez la microcopie même, en évitant les pièges courants que je partage ci-dessous.
6. Gardez votre copie de document à jour
Ainsi, votre copie de document est prête. Maintenant, vous devez prendre l'habitude de refléter immédiatement toutes les mises à jour de la copie. Chaque fois que votre copie de document est ouverte, elle doit afficher la copie intégrée la plus réelle.
Cela peut nécessiter un peu de travail, mais la bonne nouvelle est que vous n'avez pas besoin de mettre à jour les captures d'écran à moins qu'elles ne subissent des changements dramatiques.
Quant à votre Fichiers Figma, Sketch ou XD, il est fortement conseillé de refléter également les changements dans la copie, mais maintenant c'est votre deuxième priorité – vous travaillez avec la copie dans un document de copie et ensuite alignez simplement vos fichiers de conception plus tard.
Conseils et pièges
Faites attention à la taxonomie
L'espace de nom commun pour un élément de contenu ressemblera à:
Section / Subsection / Group /… / Item
Table / Head / 1st column
Assurez-vous vous faites correspondre les noms avec les noms de vos composants d'interface utilisateur.

Et, à leur tour, les composants doivent correspondre au cadre de développement. Si vous ne savez pas quel nom choisir, consultez vos développeurs.
Créer la légende
En dehors de l'outil de conception, vous pouvez utiliser une variété de graphiques pour communiquer des idées, pas de l'esthétique.

Par exemple, utilisez:
- Faits saillants pour les variables
- Crochets pour les annotations
- Symboles Emoji ou Unicode pour les états
Et soyez cohérent – utilisez la même mise en évidence méthode pour chaque événement correspondant. Vous vous souvenez des synonymes?
N'oubliez pas non plus l'accessibilité: c'est une bonne idée lorsque différents éléments diffèrent avec plusieurs paramètres.

Évitez la redondance et les chaînes en conflit
Ne réutilisez pas des éléments identiques.
Par exemple, si vous avez une page avec un titre et des onglets communs, mentionnez le titre dans la première unité, et plus tard dans les autres unités, ne les mentionne pas à nouveau mais ne reflète que les changements sur ces pages.

Pensez aux états
Certes, les instances de vos éléments peuvent varier, mais vous trouverez ci-dessous les plus courantes auxquelles vous devez penser.
Commentaires: messages, alertes , notifications, etc.
Entrées et autres:
- Placeholder
- Typing
- Filled
- Null
- Diverses erreurs
Vous voyez l'idée.
Utilisez-les littéralement comme un liste de contrôle pour fournir un contenu exhaustif pour chaque changement d'état de vos éléments.
Quant à leur apparence, vous pouvez soit créer une ligne distincte pour chaque instance, soit les regrouper dans une cellule, annotée.

Pensez aux variables
Les variables sont les parties de la copie qui changent avec le contexte. Généralement, il s’agit de la date et de l’heure, des noms d’utilisateurs, des numéros, etc.
Vous les avez probablement déjà pris en compte au stade de l’architecture de l’information ou, en partie, dans la politique éditoriale. Et maintenant, un document de copie est juste l'endroit pour refléter quelles données sont constantes, et quelles données changent selon le contexte, et comment.
Mettez en évidence les variables et choisissez leur forme. Suivez la même règle de contre-redondance: indiquez la forme de la variable une fois, de préférence au début, puis faites-y référence dans votre document.

N'oubliez pas de penser à la valeur minimale et maximale de chaque variable – si vous remarquez qu'elle affecte l'interface utilisateur d'une manière ou d'une autre, vous pouvez laisser une annotation correspondante.
Postface (et un bonus)
C'est à peu près tout. La technique de copie de documents a changé la donne pour mon flux de travail et je serais heureux si elle booste le vôtre aussi!
Et s'il vous plaît, dites-moi comment vous l'utilisez ou, peut-être, répondez à vos besoins. Captures d'écran, description de votre expérience, messages audio ou vidéo – tout sera génial! Je le pense.
Et j'ai préparé un modèle pour vous. Copiez donc votre [Template] Copiez le document – et restez en sécurité!

Source link