Principios de comunicación de Material: Introducción a la escritura de UX
Acerca de este codelab
1. Antes de comenzar
Conoce la guía de comunicación de Material Design
La escritura clara y concisa desempeña un papel importante en la calidad de las experiencias del usuario. Conoce los lineamientos de redacción de UX de Material Design y comienza a aplicar principios para el texto de la IU que ayudarán a tus usuarios a llegar a donde quieren.
¿Sabías que la sección de comunicación de Material abarca mucho más que la escritura de UX? Consulta temas que van desde la visualización de datos hasta los patrones de incorporación y de estado vacío.
¡Piensa como un escritor!
Ya sea que trabajes con un escritor de UX o un estratega de contenido, este codelab presenta formas para que cualquier persona tome decisiones de lenguaje que funcionen bien para las interfaces. Aprenderás a hacer algunas de las preguntas en las que un escritor podría enfocarse para mejorar las experiencias del producto, como la claridad y la concisión en el texto que se muestra a los usuarios, como las etiquetas y las notificaciones.
Qué aprenderás
- Qué es la escritura de UX y por qué es importante
- Cómo determinar el tono y la voz adecuados para diferentes contextos
- Consideraciones de escritura específicas del componente
- Recursos para seguir aprendiendo
Requisitos
- Comienza un documento o toma un papel para seguir los ejercicios del codelab.
Requisitos previos
Este lab se basa en conceptos fundamentales de escritura, gramática y diseño de Material Design. Es útil tener una comprensión general de los elementos interactivos en una IU.
Enfoque en inglés, pero útil en general
En este lab, se abarcan los principios de comunicación para mejorar las experiencias del usuario. Sin embargo, los ejemplos y las elecciones de palabras se basan en las convenciones del inglés estadounidense.
Con sensibilidad a los cambios en el contexto y la cultura, esta guía se puede aplicar a una IU en cualquier idioma. Encontrarás más información específica sobre las consideraciones en idiomas distintos del inglés en los recursos que se enumeran en el paso 9.
2. ¿Qué es la escritura UX?
Descripción general
La escritura de UX (UXW) también se conoce como estrategia de contenido o diseño de contenido. Es la disciplina detrás del texto en las interfaces de usuario y un campo distinto que considera el lenguaje como un medio para mejorar las experiencias del usuario a través de narrativas claras, elección de palabras, jerarquía de la información y mucho más.
Pensar como un redactor de UX puede mejorar la finalización de tareas, la satisfacción del usuario y la facilidad de uso general.
¿En qué se diferencia la escritura de UX?
La escritura de UX es escribir para personas reales.
La redacción para experiencias del usuario debe comenzar con la suposición de que un objetivo principal del texto de la IU es respaldar los recorridos del usuario.
La elección de palabras, la longitud, el estilo y la construcción de cualquier texto pueden influir en la comprensión que tiene el usuario del objetivo y los beneficios de las funciones y las tareas.
Estilo
Las opciones de estilo de escritura deben seguir las necesidades de tu público y sus objetivos. UXW combina las reglas académicas de la escritura formal (lo que lees en periódicos o libros de no ficción) con los estilos menos formales que las personas usan cuando se comunican en línea (correo electrónico, texto, chat).
La escritura para apps y interfaces tiene un tono menos formal por dos razones principales:
- La comunicación en línea es menos formal que la escritura académica o impresa.
- El texto de la IU está limitado por el espacio disponible en la pantalla, y la longitud de los caracteres está restringida.
Escritura centrada en el usuario, también conocida como "haz que funcione"
La escritura de UX prioriza un estilo orientado a objetivos, en lugar de la adhesión a la gramática. Esto no significa que la gramática no sea valiosa para la claridad y la coherencia, pero es útil considerar primero las necesidades del usuario y dejar que las decisiones gramaticales sigan.
En cuanto a la elección de palabras y el estilo, un principio rector para las decisiones de estilo podría ser simplemente hacer que funcione. Las opciones que son mejores para las interfaces no siempre son las mismas que las reglas para la escritura formal.
Escribe de la forma en que leen las personas
La UXW debe reflejar las formas en que los lectores de muchos idiomas exploran las páginas en un patrón en forma de F, en lugar de leer párrafos completos. Si anticipas el comportamiento del lector, puedes escribir de la manera en que realmente se experimenta el texto.
En el caso del contenido web, esto suele traducirse en párrafos cortos, encabezados descriptivos fáciles de leer y un formato estratégico.
Ejemplos de seguimiento ocular de estudios de patrones de lectura en línea. Imagen y estudio de investigación de nngroup.com (2006 y 2017).
Prueba
Satisfacer las necesidades de varias culturas o grupos etarios con el mismo texto puede ser un desafío. Encontrar las palabras adecuadas para comunicar tu mensaje puede parecer sencillo, pero el lenguaje y la comprensión son muy subjetivos.
Para asegurarte de que tu texto significa lo que crees que significa, las pruebas son un paso importante para evaluar la claridad, el significado y la eficacia en el mundo real.
Approaches
Fácil y económico
- Lee en voz alta lo que escribiste. ¿Sonó como algo que le dirías a una persona real? Si no es así, intenta reescribirla.
- Pídele a otra persona que lea y te explique lo que cree que significan tus palabras.
- Encuesta a varias personas con ejemplos de tu escritura en el contexto de una IU
- Usa Google Trends o Google Books Ngram Viewer para saber si una palabra o frase en particular es más común que otra.
Las pruebas de contenido exhaustivas utilizan heurísticas, como las siguientes:
- Comprensión y legibilidad
- Finalización de tareas y tiempo dedicado a ellas
- Evaluación del tono y la percepción
3. Principios
Descripción general
Los principios de los lineamientos de redacción de Material están diseñados para generar confianza y mejorar la claridad a través de un lenguaje preciso y conciso. Puedes agregar o quitar principios de Material para satisfacer tus propias necesidades.
Los lineamientos permiten que varias personas tomen decisiones más coherentes como grupo.
Sé conciso, pero no robótico
Escribe segmentos de texto cortos y fáciles de leer que se enfoquen en una cantidad limitada de ideas.
Escribe de forma sencilla y directa
Usa un lenguaje sencillo y directo que facilite la comprensión del texto. Cada vez que escribas algo, pregúntate si hay una forma más sencilla de expresar la idea.
Dirígete a los usuarios con claridad
En inglés, la segunda persona (tú o tu) suele ser más directa y clara. La primera persona (yo, mí o mi) se puede usar cuando se debe enfatizar la propiedad.
"Tú" y "tu" son formas más directas de dirigirse a un usuario.
"Yo" o "mi" pueden ser confusos porque combinan la posición o la voz de un usuario con la voz de la app. Se pueden usar "yo" o "mi" para enfatizar la propiedad clara del contenido o las acciones.
Evita combinar la primera y la segunda persona
Para evitar confusiones, "yo"/"mi" y "tú"/"tu" no deben estar en la misma frase.
Comunica los detalles esenciales
Comunica solo los detalles esenciales para un contexto específico, de modo que los usuarios puedan enfocarse en la tarea que tienen entre manos en lugar de interpretar muchas opciones. En cualquier diálogo o notificación, considera qué información se necesita para explicar una operación y cualquier consecuencia crítica.
4. Voz y tono
Descripción general
Es difícil lograr coherencia y claridad sin tener en cuenta el tono y la voz que deseas crear para una experiencia.
Imagina leer cinco oraciones juntas, pero cada una fue escrita por personas diferentes que no vieron las otras cuatro. A veces, navegar por una IU puede parecer inconexo porque cada persona escribe con su propio sentido de voz y tono.
Cuando varias personas aportan texto a un producto, los lineamientos de tono y voz pueden ayudar a garantizar que las palabras se elijan con un sentido compartido de significado y propósito.
Ejemplo de una campaña anterior para Android que usa una voz clara e inclusiva con un tono directo.
¿Qué son la voz y el tono?
La voz debe ser coherente en toda la experiencia, mientras que el tono es contextual y puede variar.
Voz
El tono se refiere al estado de ánimo, la actitud o la perspectiva que se comunica a través de una experiencia. Es un aspecto de la "personalidad" de una marca y puede permitir que alguien se familiarice con la forma en que "suena" un producto.
Los principios de voz guían la elección de palabras y funcionan mejor cuando se acompañan de ejemplos para ilustrar la voz en acción. Sin ejemplos, los principios suelen ser demasiado abstractos para guiar las decisiones de estilo de un grupo.
Estos son algunos ejemplos comunes de principios de voz:
- Útil: Escribe como una persona, no como una máquina. Explicar los errores y sugerir una solución
- Accesible: Haz que el texto sea fácil de entender para cualquier usuario nuevo. Asegúrate de que se expliquen o reemplacen los términos técnicos o avanzados.
- Inspiradoras: Destacan los beneficios y los logros a lo largo de una experiencia. Indica los objetivos y los resultados en voz activa y positiva.
Tono
El tono de tu escritura comunica estados de ánimo y emociones, ya sea que lo intentes o no.
Por ejemplo, si una voz se define como "útil" y "humana", un tono que refuerce ese objetivo podría ser de apoyo y casual, en lugar de exigente y conciso.
En última instancia, lo que una persona considera "servicial y casual" también variará, por lo que las listas de palabras y una matriz de contenido ayudan a que la voz y el tono sean prácticos. Esto se analiza con más detalle en las secciones 6 a 8.
Por qué es importante
El tono adecuado puede generar confianza en los usuarios. Por ejemplo, si un mensaje de error tiene la forma de una broma en lugar de brindar asistencia, el tono alegre podría no mostrarle al usuario que su frustración es razonable y que el problema se puede resolver.
Cómo crear un mapa de tonos
Un mapa de tono ayuda a planificar y documentar una estrategia para ajustar tu voz y tono.
Comienza por considerar los puntos clave a lo largo del recorrido del usuario. Ya sea que crees juegos, herramientas financieras o una app de compras, tu tono debe variar en respuesta a los puntos a lo largo del recorrido del usuario, como la incorporación, las confirmaciones y los errores.
Por ejemplo, una notificación divertida para confirmar una rutina parece una buena idea al principio, pero, a la quinta vez que se recibe, la diversión puede convertirse rápidamente en molestia.
Los estados de error son otro ejemplo de dónde la asignación de tonos puede ayudar a informar un cambio de tono, de informal y conversacional a detallado y de asistencia.
1. Primero, elige dos dimensiones o espectros que puedan representar un rango en el tono deseado.
Estas son algunas ideas de ejes críticos para el tono en la escritura de UX:
- Juguetón vs. serio
- Concisa vs. detallada
- Emotivas vs. neutrales
- Casual vs. rígido
2. Dibuja una cuadrícula con dos líneas que se cruzan y, luego, identifica cada eje con una dimensión del tono que deseas definir estratégicamente.
En el siguiente ejemplo, puedes ver que divertido vs. serio y conciso vs. detallado son las dimensiones del mapa.
3. A continuación, enumera los tipos o patrones de mensajes que usas con frecuencia. Estos son algunos tipos de mensajes que puedes asignar:
- Integración
- Confirmación y reconocimiento
- Ayuda y comentarios
- Errores
- Notificaciones
- Etiquetas
- Estados vacíos
4. Coloca cada tipo de mensaje en el mapa con respecto a ambos ejes.
Algunas consideraciones incluyen lo siguiente:
- ¿Cuánto espacio de pantalla estará disponible para un mensaje determinado?
- ¿Qué tan importante o fundamental es la comprensión para un tipo de mensaje? ¿Hay una acción destructiva en juego?
- ¿Qué quieres que sepa o sienta un usuario en relación con la intención de un tipo de mensaje? Por ejemplo, la incorporación suele ir acompañada de una intención práctica, aunque alegre.
5. Ejemplo completado
A continuación, se muestra un ejemplo de los tipos de mensajes diagramados según las experiencias comunes de las apps.
Si tu app trata temas legales o de pagos, puedes ajustar el tono para que sea más serio y detallado cuando la comprensión sea fundamental. Por el contrario, si la privacidad o las finanzas no están en riesgo y también hay un Centro de ayuda disponible para obtener más información, puedes optar por ser más conciso.
5. Estructura del contenido
Descripción general
La estructura de una instrucción puede mejorar la comprensión y ayudar a un usuario a concentrarse en la tarea que está realizando. Cuando se combina una imagen con texto, otro objetivo de una estructura de información es mejorar la accesibilidad.
Comienza con los objetivos
Comienza las oraciones con el objetivo del usuario. Dado que la escritura de UX está orientada a las tareas, un patrón común para las frases es enfatizar un objetivo que establezca el marco motivador de una tarea y, luego, la oración explica la acción necesaria para completar la tarea.
Revela detalles según sea necesario
Revela la información de forma contextual y según sea necesario. Este enfoque suele denominarse divulgación progresiva. Revela detalles sobre las funciones a medida que el usuario las explora y necesita más información.
Revelar información de forma estratégica a menudo implica una consideración cuidadosa de las necesidades de información en cada punto del recorrido del usuario. El objetivo no es ocultar ni omitir nada, en especial las consecuencias de las acciones que no se pueden deshacer, pero ten en cuenta que ayudarás a los usuarios si centras el enfoque inmediato en la tarea que tienen entre manos.
Diseño de contenido accesible
La escritura eficaz se extiende a las consideraciones sobre la combinación de imágenes y texto para los usuarios con baja visión o cualquier persona que use un lector de pantalla. La sección de escritura sobre accesibilidad de Material incluye orientación para combinar imágenes y leyendas, de modo que el diseño de contenido de una página funcione para todos los usuarios.
Texto visible y no visible
El texto de accesibilidad incluye lo siguiente:
- Texto visible: Etiquetas para elementos de la IU, texto en botones, vínculos y formularios
- Texto no visible: Son las descripciones que no aparecen en la pantalla (como el texto alternativo para las imágenes).
Cuando el texto visible y el no visible son descriptivos y significativos, ayudan a los usuarios a navegar con encabezados o vínculos en una pantalla. Un lector de pantalla puede ayudarte a probar el texto de accesibilidad y a identificar los lugares en los que puedes agregarlo.
Texto alternativo
El texto alternativo ayuda a traducir una IU visual en una IU basada en texto. El texto alternativo es una etiqueta breve (hasta 125 caracteres) en el código que describe una imagen para los usuarios que no pueden verla.
En el siguiente ejemplo, un lector de pantalla proporciona contexto para el texto circundante ofreciendo los descriptores más esenciales de una imagen.
Dado que el texto alternativo es solo para imágenes, no es necesario agregar "imagen de" o "foto de". Un lector de pantalla leerá el texto alternativo en voz alta en lugar de la imagen.
6. Elección de palabras
Descripción general
Cuando el espacio en la pantalla es limitado, es fundamental elegir las palabras adecuadas para transmitir tu mensaje y tono. Usar las mismas palabras de forma coherente ayuda a los usuarios a familiarizarse con una experiencia.
Escribe para todos los niveles de lectura
Usa palabras comunes que se puedan entender de forma clara y sencilla en todos los niveles de lectura.
Sin jerga
Evita la terminología específica de la industria o los nombres inventados para las funciones de la IU cuando una frase más simple pueda comunicar la misma idea de manera similar.
Usa palabras coherentes
Usa las palabras de manera coherente en todas las funciones de la IU.
Escribe en tiempo presente
Usa el tiempo presente para describir el comportamiento del producto. Evita usar el tiempo futuro para describir la forma en que siempre actúa un producto.
Cuando necesites escribir en tiempo pasado o futuro, usa formas verbales simples.
Cómo hacer referencia a los elementos y controles de la IU por etiqueta
Las etiquetas identifican lo que hace un control o un elemento. Aparecen en el control o cerca de él, como el texto de un botón o interruptor. Para hacer referencia a un control o elemento de la IU, menciónalo con el texto de su etiqueta. (no indiques el tipo de elemento o control).
Comunica detalles esenciales
Comunica solo los detalles en los que un usuario debe enfocarse para realizar una tarea.
Conclusiones clave
- Escribe para todos los niveles de lectura
- Usa las palabras de forma coherente, no por novedad
- Tiempo presente
- Usa números
7. Cómo escribir para componentes
Descripción general
Los componentes de Material tienen una intención en la IU, y escribir para componentes específicos puede reforzar esa intención.
Estos componentes tienen orientación para la escritura en Material.io:
Diálogos
Los diálogos se usan para lo siguiente:
- Errores que bloquean el funcionamiento normal de una app
- Información crítica que requiere una tarea, una decisión o una confirmación específica del usuario
Componente | Prioridad | Acción del usuario |
Bar cafetería | Prioridad baja | Las barras de notificaciones desaparecen automáticamente |
Banner | Destacada, prioridad media | Los banners permanecen hasta que el usuario los descarta o si se resuelve el estado que los causó. |
Diálogo | Máxima prioridad | Los diálogos bloquean el uso de la app hasta que el usuario realiza una acción en el diálogo o sale de él (si está disponible). |
Títulos
El propósito de un diálogo debe comunicarse a través de su título y el texto del botón.
Los títulos deben contener una declaración o pregunta breve y clara.
Barras de notificaciones
Las barras de notificaciones contienen una etiqueta de texto que se relaciona directamente con el proceso que se está realizando. En dispositivos móviles, una etiqueta puede contener hasta dos líneas de texto.
Las barras de notificaciones pueden mostrar un solo botón de texto que permite a los usuarios realizar acciones en un proceso que realizó la app.
8. Combina todo en una matriz de contenido
Descripción general
Una matriz de contenido es una tabla para hacer un seguimiento de las palabras y las opciones que usarás y reutilizarás en tu escritura. La matriz de contenido es un recurso clave para escribir y hacer un seguimiento de las frases de manera coherente, y sirve como referencia para cualquier escritor futuro.
Es un nombre elegante para una hoja de cálculo (sí… esto incumple la guía de elección de palabras para "sin jerga").
Cómo configurar una matriz de contenido
Crea una hoja de cálculo o una tabla en la que puedas hacer un seguimiento de las opciones de redacción y palabras que funcionan bien y se pueden repetir.
El objetivo de una matriz de contenido es ayudarte a identificar y documentar cómo se conecta cada mensaje con lo siguiente:
- Objetivos y contextos del usuario
- Las necesidades de información, expresadas claramente, que respaldan un objetivo determinado
- Texto de la IU preliminar y final que reformula la necesidad de información en un lenguaje breve y sin jerga
Las decisiones sobre el texto de la IU en la matriz de contenido también deben reflejar lo siguiente:
- Principios de tono y voz
- Tipos de componentes
Por último, la matriz de contenido puede incluir una lista de palabras:
- Enumera las palabras y los términos que se deben usar para describir tus funciones, acciones y objetivos.
- Enumera las palabras que se deben evitar como sinónimos o frases poco útiles
Recuerda lo siguiente:
- Reemplaza o define términos técnicos
- Usa la opción de palabra más común para una acción o un sustantivo.
9. Temas y recursos avanzados (opcional)
Descripción general
En este codelab, se abordan las prácticas recomendadas y los métodos para comenzar a escribir textos de UX. Esto es solo la punta del iceberg.
