Saludos de un amable estratega de contenido.

Cuando se trata de crear productos, algunas personas piensan en el contenido como una floritura final, palabras en una página o pantalla que se pueden escribir justo antes del lanzamiento.

¡Pero sabemos que esa no es la mejor manera de hacerlo! El contenido de la interfaz coherente y reflexivo es un elemento central de una experiencia de usuario bien diseñada. Estas son algunas de las formas en que incorporo contenido a lo largo del proceso de diseño. Comenzaremos con el papel del contenido en el boceto y avanzaremos hasta pulir el contenido en maquetas de alta fidelidad. Póngase su sombrero de estrategia de contenido: aquí le mostramos cómo usar su tiempo sabiamente durante cada fase, usando el lenguaje para crear mejores experiencias.

Proceso del diseño.

Dibujar con palabras

Dibujar es excelente para explorar ideas y direcciones. Se trata de poner las cosas en papel, moverse rápidamente y comunicar conceptos. Para dibujar bien, necesitamos usar algo de contenido. Las palabras son esenciales para ayudar a los usuarios a realizar sus tareas, y al pensar en ellas mientras dibuja, descubrirá problemas temprano y podrá avanzar más rápido más adelante.Las palabras son esenciales para ayudar a los usuarios a realizar sus tareas, y al pensar en ellas mientras dibuja, descubrirá problemas temprano y podrá avanzar más rápido más adelante. Descubrí que las piezas de contenido más importantes que debe incluir en los bocetos son:

Use términos que sean claros y directos, no se preocupe por ser ingenioso o chistoso. Para empezar, involucre a todo el equipo. Los desarrolladores, diseñadores, estrategas de contenido, administradores de proyectos, investigadores y su equipo de soporte usarán diferentes términos para comunicar sus ideas y describir la misma experiencia. Esta diversidad de opiniones (y palabras) es exactamente lo que quieres en esta etapa.

Ejemplo de escritura de verbos y sustantivos clave

Haga coincidir la fidelidad del contenido con el problema que está tratando de resolver. Si está tratando de encontrar un flujo más grande, necesitará saber qué contenido va en cada sección, qué botones lo llevarán a dónde y qué información encontrará en la página siguiente. Escribir un borrador para la descripción de cada sección probablemente no valga la pena en este momento.

Ejemplo de cómo escribir títulos para las secciones.

Sea específico con las palabras que elija y dedique tiempo a pensar por qué eligió ciertos términos sobre otros. No digas buscar cuando te refieres a filtrarGuardar no es lo mismo que enviar o publicar.

Si está trabajando en algo más estático, como una página de venta o una página de destino de un sitio web, incluya más contenido en sus bocetos. Por ejemplo, no podría dibujar el diseño de una página de venta para Shopify Payments si no supiera cuántos beneficios para el cliente quiero incluir. ¿Debo tener 3 cajas o 4? ¿Cuánto espacio ocuparán? ¿Necesitan ilustraciones correspondientes? No puedo responder a estas preguntas a menos que use contenido real.


No se preocupe por esbozar contenido que no cambiará ni tocará, como menús laterales o elementos de una página que permanecerán iguales. Esto ayudará a las personas a concentrarse en las secciones nuevas o cambiantes y no distraerse con un área que está fuera del alcance.
Haga que todos dibujen solos y luego presenten sus ideas al grupo. Este es un buen momento para tener una discusión abierta sobre por qué todos eligieron ciertos términos. ¿El lenguaje refleja cómo piensan sus usuarios y las palabras que usan?
A medida que cambie a estructuras alámbricas o maquetas de baja fidelidad, comprenderá mucho mejor cómo entra en juego el contenido. Como dice John Zeratsky de Google Ventures en su sabia publicación de blog : «No se conformaría con un diseño sin explorar algunas alternativas, así que asegúrese de probar diferentes soluciones de texto antes de decidir qué dirección es la mejor».
 
Wireframing con la cantidad adecuada de contenido.
Si pensamos en el boceto como el paso 1 en el proceso de diseño, el wireframing es el paso 2. Tomamos nuestras ideas preliminares y las convertimos en ideas más sólidas e intentamos responder las preguntas que surgieron del boceto.
Una actividad que encuentro que realmente ayuda a informar a los wireframes es mapear todos mis elementos de contenido y luego determinar su jerarquía.
 
Mapeo de elementos de contenido
Por elementos de contenido, me refiero a todas las piezas individuales de contenido en una página. Puede usar una herramienta como Mindmeister, escribirlos en una hoja de cálculo o anotarlos en un archivo de Sketch.
Me resulta muy útil tener los elementos de contenido separados de la estructura metálica porque:
·         Documenta todas las cosas posibles que podrían mostrarse en una página, especialmente porque todos los elementos rara vez aparecen al mismo tiempo
·         Mantiene las maquetas realistas: no necesitamos mostrar todos los escenarios posibles o las formas en que la información podría mostrarse en estructuras alámbricas.
·         Ayuda a los desarrolladores a saber qué piezas de información se están incorporando
·         Establece relaciones de contenido entre diferentes elementos.
·         Se asegura de que no nos olvidemos de las piezas ni nos saltemos cosas en el futuro.
Por ejemplo, aquí están todos los diferentes elementos de contenido que podrían aparecer en la página de inicio de la aplicación de un banco.
Elementos de contenido y estructura alámbrica para la página de destino de la aplicación de un banco.

Determinación de la jerarquía de contenido

Una vez que haya enumerado los elementos de contenido, comience a ordenarlos según las prioridades de los usuarios y los objetivos comerciales que tenga. Este ejercicio asegura que esté pensando estratégicamente sobre por qué está poniendo ciertos elementos por encima de otros y lo ayudará a proporcionar una razón sólida de por qué se decidió por un determinado diseño y jerarquía de contenido.

Uso de contenido en maquetas de baja fidelidad

En el momento en que te mueves a maquetas de baja fidelidad, deberías estar usando contenido detallado y realista para todo. Escribe el mejor contenido para tu escenario, incluso si sabes que será reemplazado por alguien en el futuro. Considéralo un primer borrador sólido. Utilizo datos que suenan reales, como fechas, horas y nombres reales, lo que ayuda a las personas a comprender la funcionalidad sin explicar demasiado.

Nunca utilizamos lorem ipsum en ninguna etapa del proceso de diseño. No podemos saber si estamos resolviendo el problema correcto, no podemos obtener comentarios adecuados de nuestros compañeros y no podemos probar nada con los usuarios si no hay palabras reales en nuestros diseños. El contenido informa en gran medida nuestras decisiones, por lo que si no usamos cosas reales, terminamos tratando de crear experiencias mal informadas. Las palabras en la pantalla son esenciales para ayudar a los usuarios a comprender las características, encontrar lo que están buscando y realmente realizar sus tareas (¡esto es especialmente cierto en pantallas pequeñas)! Pensar en el contenido temprano nos da mucho tiempo para obtener comentarios de colegas y usuarios, e iterar sobre diferentes opciones.

A menudo usamos fuentes que obviamente nunca enviaríamos (lo siento Comic Sans), por lo que la gente entiende que la redacción exacta sigue siendo un trabajo en progreso, y estamos buscando comentarios sobre cosas como el flujo y la jerarquía.

Esto debería ser evidente, pero evite cualquier contenido de marcador de posición inapropiado o divertido. Si se envía accidentalmente en la línea, puede erosionar la confianza con los usuarios muy rápidamente.

Reúne todo el contexto que necesitas para sentirte seguro de lo que estás escribiendo. Hable con gerentes de proyectos, desarrolladores y expertos en la materia. Lee la documentación de las funciones si tu empresa tiene alguna (estoy muy agradecido por el Centro de ayuda de Shopify). Uno de los grupos de personas más valiosos para hablar es su equipo de apoyo: aproveche esa riqueza de conocimientos. Tienen conversaciones con los clientes todos los días, saben qué términos usan los clientes para describir las cosas, y tienen miles de tickets de soporte esperando ser analizados.

A medida que te preparas para pasar a las maquetas de alta fidelidad y tienes resueltos tus problemas principales, querrás pensar en la experiencia de extremo a extremo:

  1. Puntos de contacto en todo el producto
  2. Mensajes de error
  3. Confirmaciones
  4. Incorporación de usuarios

La baja fidelidad todavía significa contenido y diseño de alta calidad.

Pulir contenido en maquetas de alta fidelidad

Desde la perspectiva de un estratega de contenido, la mayor parte del trabajo pesado debe hacerse en esta etapa. Si se saltó a las maquetas de alta fidelidad y no realizó algunas de las actividades anteriores, como mapear todos sus elementos de contenido o documentar todos los posibles mensajes de error, ahora es el momento de hacerlo.

«El mejor momento para plantar un árbol fue hace 20 años. El segundo mejor momento es ahora». – Proverbio chino.

En esta etapa, estás resolviendo cualquier problema con el contenido. No estás cambiando nada fundamental sobre la experiencia. En Shopify, después de que se finaliza el contenido y el diseño, y un desarrollador front-end ha construido la experiencia, nuestro equipo se sienta y hace lo que llamamos una revisión polaca.

Nuestro equipo de UX haciendo una revisión de pulido antes del envío.

Revisamos el producto final que se enviará y buscamos cualquier pequeña edición que deba realizarse. Desde una perspectiva de contenido, estamos buscando puntuación incorrecta, versiones antiguas de contenido que se deslizaron por las grietas, fechas mal formateadas y cualquier otra cosa que no siga nuestro sistema de diseño.

Tomamos notas durante estas sesiones y hacemos un seguimiento con el desarrollador front-end para asegurarnos de que todo esté actualizado. Haremos otra revisión de pulido si hubo varios cambios que deban realizarse. Esto ayuda a garantizar que los barcos sean de alta calidad y algo de lo que estemos orgullosos.

Haz que funcione para ti

Estoy constantemente ajustando estas técnicas en función del proyecto en el que estoy trabajando y su alcance, ¡y entiendo totalmente que el mundo real es más desordenado que un proceso paso a paso! Vamos y venimos, nos saltamos algunos pasos para un proyecto, pasamos más tiempo en una determinada fase para otro proyecto.

Estoy interesado en escuchar lo que estás pensando y haciendo. ¿Cómo incorporas la estrategia de contenidos en tu proceso de diseño? ¿Qué nivel de fidelidad de contenido buscas en cada etapa?

Fuente: https://ux.shopify.com/words-and-the-design-process-f41472a249fb

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *