Curso de

Bagde
del curso UX Writing
Isis García
@isisconvelo
Investigación
Estrategia de
Contenido

Diseño
¿Qué es?

Es el diseño de las palabras que

nos guían cuando
interactuamos con páginas
web, aplicaciones, software y
otros productos y servicios
digitales.
¿Qué hace un UX Writer?

Escritura
Ícono
Y Diseño
Ícono
 Un UX writer no se limita a
escribir textos inconexos en un
botón o en un menú, lo que
hace es escribir flujos

Blanca Rego, UX Writer

USER JOURNEY

Usuario + Escenario + Metas

Fase 1 Fase 2 Fase 3

Oportunidades + Ownership
 El UX Writing se enfoca en
ayudar a los usuarios a lograr
sus metas a través del lenguaje

Giang Anh Linh Nguyen, UX Researcher

 Bagde
Curso de
del curso escritura online
 Ruta de aprendizaje

Diseño de
Bagde
del curso Experiencia de
Usuario
Diferencias entre UX
Writing y Copywriting
 Copywriter UX writer
Usa palabras atractivas Usa un lenguaje sencillo
para atraer a los usuarios para explicar cosas

Orientado a ventas Orientado a producto

Trabaja con el Trabaja con diseñadores

departamento de
Marketing

Cuenta historias Comparte conversaciones

Puede trabajar solo No puede trabajar solo

Yo uso el lenguaje para resolver
problemas. Yo uso las palabras
como material

Nicole Fenton, autora de Nicely Said

¿Qué hace un UX Writer?

Microcopy
Ícono
Y UIÍcono
Copy
Perfil profesional
 Un poco de historia

● En 2013 se contrató al primer UX Writer en

Youtube.
● Empresas como Mercado Libre tienen equipos
de UX Writers que han desarrollado un Manual
de Estilo
● En 2017 en Google incluyeron por primera vez
una charla sobre UX Writing
Mejores prácticas
de UX
 3 conceptos

1. Claridad
2. Precisión
3. Utilidad
Claridad
 Claridad

● Los problemas de software no son los

problemas de los humanos
● Presta atención a los verbos
● Elimina los términos técnicos
● Pon en contexto a tu usuario
Ejemplo
Precisión
 Conciso
● Corto vs Eficiente
● Asegúrate de que cada palabra cumpla
con una función distintiva
 Jerarquización
Pon las palabras importantes al frente.
Utilidad
 Utilidad
● El Call to Action debe señalar qué paso sigue
después
● Tus textos deben indicarle a los usuarios hacia
dónde deben ir
 Responsabilidad

● ¿Es cierto lo que estás diciendo o es un

mensaje engañoso?
● ¿Es inclusivo?
● ¿Es amable?
Alinearlo con tu voz de marca
Voz de Marca
¿Cómo lo dices? Voz de
marca

¿Qué dices?

Principios de UX
Writing
La voz de tus productos

Ícono Ícono

Principios de marca Guía de estilo

Principios de marca

Haz una lluvia de ideas.

Elige 3 o 4 adjetivos que
identifiquen a tu marca
 Ejemplo

Simple y poderoso, como Apple

En la intersección del arte y la ciencia,
como Adobe
 Imagina que estás
registrando tu producto
en un sitio de citas

¿Qué palabras o información pondrías en tu perfil?

¿Qué hace que tu producto resalte sobre los otros?
¿Qué te podría hacer más interesante para otras
personas?
Ir a Guía de Estilo de
Mercado Libre
 This, but not that

Mailchimp
● Divertido pero no infantil
● Confiado pero no arrogante
● Inteligente pero no pesado
● Informal pero no descuidado
● Experto pero no mandón
El tono
Diferencias entre tono y voz

La voz es una persona.

El tono es cómo habla esa
persona dependiendo de las
circunstancias.
 Desde dos ángulos
1. Elección de palabras o frases: ¿ Frases cortas o
comentarios y explicaciones?
"Error 404: Inténtelo de nuevo" vs "No pudimos
encontrar la página que estás buscando".
2. La estructura del mensaje: ¿diriges la
conversación o describes lo que pasa?
"Restablezca su contraseña ahora" vs "Mantenga su
cuenta segura restableciendo su contraseña".
 Para elegir el tono, contesta
estas preguntas

● Dónde se encuentran los usuarios en el

User Journey
● Qué tan experimentados son al usar la
interfaz
● Cuáles son sus intenciones
● Cuál es su estado de ánimo
 Las 4 dimensiones del tono

Serio Divertido
Formal Casual
Respetuoso Irreverente
Realista Fantástico
Tone spectrum
Piensa en:

¿Cuál es la meta de tu usuario?

¿Qué siente él en un momento
determinado?
¿Qué le gustaría sentir?
Reto
Los 10 principios
de la usabilidad
1. Visibilidad del estatus
del sistema
2. Compatibilidad entre el
sistema y la vida real
3. Dale libertad al usuario
4. Consistencia y estándares
5. Prevén el error
 6. Reconocer vs Recordar

Te paso una hoja de Te paso una hoja de

papel y un bolígrafo. papel con el dibujo de
“Por favor, ¿me puedes un mapa. “Por favor,
dibujar Taiwán?” dime ¿qué país es
Taiwán?”
7. Flexibilidad y eficiencia
8. Diseño minimalista
9. Ayuda
a los
usuarios a
reponerse
de sus
errores
10. Ayuda y documentación
Escaneando el
contenido
¿Qué factores influyen?

● La meta que busca

● Su experiencia previa
navegando en Internet
● Diseño de la página
● El tipo de contenido
4 patrones que usamos para
escanear textos
1. Patrón de F
2. Patrón de
capas de pastel

Espacio para imagen

3. Punteado
4. Patrón de compromiso
¿Cómo mejorar tus textos?

1. Divide párrafos largos en

cortos
2. Reescribe párrafos cortos
como listas con viñetas
3. Agrega encabezados para
dividir el contenido en
secciones digeribles
Content First
Significa literalmente eso...

La forma debe adaptarse

al contenido, no a la
inversa.

No diseñar sin tener claro

qué se va a contar.
El diseño visual se cuida
más que el textual
 La manera tradicional de
diseñar productos digitales
siempre ha sido con Lorem
Ipsum, centrándose en el
diseño visual y dejando el
contenido, sobre todo los
textos, para el final

Blanca Rego, UX Writer

 En realidad solo hay un
principio central de buen
contenido: debe ser apropiado
para su negocio, para sus
usuarios y para su contexto

Erin Kissane, autor de “The elements of Content strategy”

La investigación
 La estrategia comienza
alineando al equipo

Michael J. Metts, Andy Welfle

Writing Is Designing: Words and the User Experience
Natalia Luna, Content Strategist for Experience en frogMX
 Drum.io methodology

1. Cada grupo designa un facilitador,

encargado de que todos estén de
acuerdo.
2. Cada grupo debe pensar en una o dos
cosas en cada espacio.
3. Haz que cada equipo comparta sus
respuestas con el resto.
 Antes de escribir, conoce a
tus usuarios

● Aprende más sobre las personas que

usan tu producto y su contexto
● Verifica que los usuarios interactúan
fácilmente con la experiencia de usuario
que tu equipo creó
● Descubre cómo la gente percibe el
producto y cómo reacciona en cada
etapa
 Queremos entender las
decisiones de los usuarios,
antes de entender a los
usuarios

Michael J. Metts, Andy Welfle

Writing Is Designing: Words and the User Experience
 Curso de CX
Bagde
del curso
Research y UX
Testing
 Enemigos

• Sin tiempo
• Sin dinero
• Sin acceso a los usuarios
• No es necesario
Las palabras que vas a
utilizar
 La primera pregunta que
debes hacerte

¿Qué palabras usa el cliente?

¿Son distintas las palabras que usan los

usuarios?
 Investiga a la competencia

¿Cómo habla la competencia?

¿Qué secciones y contenido le ofrece al

usuario?
 Curso de CX
Bagde
del curso
Research y UX
Testing
 Bagde
Curso de User
del curso Research
Content Frames
Tone spectrum
 Comprende a tu usuario

Pantallas introductorias e incorporación:

¿Quiénes son nuestros usuarios? ¿Por qué
deberían preocuparse por este producto?
¿Cómo mejora sus vidas? ¿Qué partes
pueden ser confusas?
 Comprende a tu usuario

Sistemas de facturación: ¿cuándo se

realiza el primer pago? ¿Cuándo se
renuevan los pagos? ¿Qué métodos se
aceptan?
 Comprende a tu usuario

Notificaciones: ¿ Cuál es el objetivo de esta

notificación? ¿Cómo está midiendo nuestro
equipo? ¿Cómo ayuda esto al usuario?
Paso 1
Hacer con Post it
Paso 3
Paso 4
Paso 5: Pide feedback
 La falta de claridad no solo es
frustrante para los miembros
del equipo, también es costosa

Michael J. Metts, Andy Welfle

Writing Is Designing: Words and the User Experience
Microcopy
Ejemplos

● Títulos de la página
● Encabezados de página
(titulares)
● Lemas
● Líneas de asunto del correo
electrónico
● Resúmenes, mazos
● Consejos, sugerencias,
explicadores
 Titulares

● Elimina las palabras que no son

esenciales para mejorar la capacidad de
escaneo
● Mueve las palabras clave al frente del
título para captar la atención de las
personas y admitir el escaneo
● Incluye palabras clave que aumenten la
clasificación del contenido.
 Titulares

1. Asegúrate que los titulares funcionan

fuera de contexto
2. Dile a los lectores algo útil
3. Minimiza las exageraciones y modismos
4. Omite palabras no esenciales
5. Jerarquizar el contenido
 Líneas de asunto de correos
electrónicos
● Deja en claro el beneficio para el usuario
● Da una respuesta a una necesidad
particular
● Explica claramente de qué se trata el
correo electrónico en términos
relacionados con el usuario
 Resúmenes de contenido

● Las breves descripciones pueden presentar a

los lectores un contenido extenso que de otro
modo no podrían leer.
● Los resúmenes pueden ayudar en la
comprensión al proporcionar contexto para la
información en un artículo más largo.
● Los resúmenes proporcionan atajos para las
personas que desean obtener los puntos
principales pero no desean leer el documento
completo.
 El slug y la URL corta
deben contener las
palabras clave de tu texto
No utilices pronombres,
artículos, preposiciones
ni conjunciones
 La página de tu empresa

Divide las páginas dependiendo del

servicio que quieres mostrar:

http://negocio.com/servicios/
http://negocio.com/nosotros/
 La página de tu tienda en
línea

Puedes utilizar categorías y productos.

Decide en función de qué es mejor para tus
clientes.

http://negocio.com/producto/
http://negocio.com/categoria/producto
 Tu blog o sitio de noticias

Recuerda elegir la opción que le convenga

a tu lector:
http://negocio.com/título-blog/
http://negocio.com/categoria/titulo-blog
http://negocio.com/dd-mm-aa/titulo-blog
 Elige las palabras
clave para tu texto
 Curso de

Bagde
Introducción a SEO:
del curso Posicionamiento
en buscadores
Mercado Libre
UI Copy
 ¿Qué es?

● Se refiere a las etiquetas de los comandos que

aparecen en botones, elementos de menú y
otros elementos orientados a la acción en la
interfaz de usuario.
 ¿Qué son?

● Son elementos encaminados a la ejecución

● Esenciales para una interacción fluida, rápida
e indolora
● Los nombres de los comandos suelen ser
cortos porque no hay mucho espacio en la
pantalla de una aplicación
 ¿Por qué es importante?

● Ayudan a los usuarios a navegar a través

de un espacio de contenido vinculado
● Están asociados con los flujos de
interacción y, por lo general, cambian el
estado del sistema
● Son la base de las aplicaciones
Ejemplos

● Botones
● Íconos
● Elementos de menú
● Botones de opción
● Mensajes de texto emergente
1. Mantén el texto breve sin
sacrificar la claridad
2. Describe el estado
consecuente, no el estado
actual
Usa verbos para los
comandos que inician una
acción o envían información
Utiliza adjetivos para los
comandos que desencadenan
un cambio en el estado del
sistema o la aparición de un
elemento en la interfaz
Evita usar nombres vagos
o genéricos como “Ok”
Incluye información sobre
herramientas para aclarar los
resultados
Limita el uso de términos de
marca
Usa palabras de comando
consistentes, incluso si
aparecen en diferentes
contextos
Atajos
 ¿Qué son?

Los métodos abreviados de comandos son

combinaciones de teclas que se escriben en
el teclado y permiten a los usuarios
ejecutar comandos frecuentes
rápidamente.
 Tips para hacer atajos

● Prioriza los atajos de teclado para las

tareas frecuentes de la aplicación
● No reutilice ni anule los accesos directos
de comandos estándar
● Los atajos deben ser aprendibles y
memorables
Mercado Libre
Construyendo un
lenguaje para tus
usuarios
Usa un lenguaje simple

● No requiere poner esfuerzo

en descifrar el mensaje
● Beneficioso si escribes para
un público internacional
● Mejores resultados en
motores de búsqueda
Usa las palabras que
los usuarios buscan
Crea empatía
Utiliza las
palabras del
usuario

Espacio para imagen

 Escoge bien cuándo
personalizar

Facebook se esfuerza mucho para depurar

adecuadamente su lenguaje.

Tiene más de dos mil millones de usuarios activos

mensuales y su software está localizado y
traducido a más de 100 idiomas.
Manual de Estilo
 Tus enemigos

1. Sentirte abrumado por todas las cosas

que vale la pena documentar

2. Sentir que a nadie le importa tanto este

trabajo
Shopify
 Ir a la página

A content style guide is a document that explains how your company’s

customer-facing content should be written. It usually includes rules for
grammar, punctuation, terminology, and voice and tone.

Aligning your content to a style guide means it sounds like it’s coming from one
voice and one brand. It helps your customers feel confident in your product.

If your company has a content style guide, make sure your content follows it,
and that people know you follow it. Before long, your team will see you as the
go-to person for the style guide.
Start small
¡Manos a la interfaz!
Planifica no
reacciones

Espacio para imagen

Elimina tus
blockers

Espacio para imagen

 Guía de Diseño

1. Visión estratégica para el producto u

organización, junto con consejos prácticos sobre
cómo aplicarlo
2. Guías de estilo para palabras y elementos
visuales
3. Patrones de diseño formados por activos y
código reutilizables
 Bagde
Curso de Diseño
del curso de Prototipos
 Bagde
del curso
Curso de Sketch
¡Felicidades!
@isisconvelo
Página 794 --Content testing