Páginas 404
Ajustando voz y tono
Proyecto propio para curso de UX Writing.
Rol: UX writer.
Punto de partida
La página que muestra el error 404 dentro de una web es una oportunidad única para entablar una conversación con el usuario. En ella, la voz de la marca se hace más presente que nunca y su capacidad para suavizar este punto de fricción a través del tono adecuado puede marcar la diferencia entre una buena y una mala experiencia.
El reto
Diseñar la página 404 de tres compañías con distintas voces.
Planteamiento de trabajo
Para la realización del reto escogí tres organizaciones diferentes con un elemento en común: su interacción con el usuario es muy valiosa para aportar valor añadido y construir su marca de cara al mundo.
Freepik es una startup que ofrece recursos gráficos gratuitos y de pago para diseñadores, creativos, etc. La marca invita a sus usuarios a desarrollar su propia creatividad a partir de los recursos que les proporciona.
El mayor ecommerce de productos para mascotas de España. Su objetivo es ayudar a los dueños de mascotas a disfrutar de ellas ofreciéndoles los productos de calidad que necesita sin importar su ubicación geográfica y en un plazo de tiempo récord.
Sistema de geolocalización que permite ubicar cualquier punto en el mapa con una frase de tres palabras, fácilmente compartible y con una precisión de 3 x 3 metros, incluso sin conexión a internet.
Cada voz de marca define su manera de dirigirse al usuario y cada situación exige un tono específico coherente con esa voz.
Voz y tono
Para establecer un marco teórico sólido sobre el que trabajar, utilicé los arquetipos de Jung. Con ellos definí las tres voces de marca a partir de las que establecería el tono adecuado para cada página 404:
Arquetipo de marca: El creador
Personalidad de marca: Freepik es tu amigo lleno de recursos que siempre está ahí para ayudarte a plasmar ideas y desarrollar tu creatividad.
Voz: Inspiradora – Positiva – Desenfadada
Tono según contexto: Usuario confuso → Tono seguro, transmite confianza. Usuario enfadado → Tono sincero, da soluciones.
Arquetipo de marca: El cuidador
Personalidad de marca: TiendAnimal ayuda a sus clientes amigos a disfrutar al máximo de sus mascotas poniendo a su disposición los productos de calidad que necesita sin importar su ubicación geográfica y en un plazo de tiempo récord.
Voz: Familiar – Protectora
Tono según contexto: Usuario confuso → Tono amistoso, da tranquilidad. Usuario enfadado → Tono informativo, aclara la situación.
Arquetipo de marca: El sabio
Personalidad de marca: what3words te ayuda a localizar cualquier ubicación en el mundo por GPS con una herramienta fácil de usar en cualquier situación, incluso sin conexión a internet.
Voz: Científica – Analítica – Didáctica
Tono según contexto: Usuario confuso → Tono conciso, directo al grano. Usuario enfadado → Tono resolutivo.
Herramienta: el copy doc
Para cada uno de los proyectos elaboré sus correspondientes copy docs, con toda la información que necesitarían los equipos de UX, diseño y desarrollo para abordar los proyectos.
Las nuevas páginas 404
Después de analizar la propuesta de valor de cada marca, usando la voz de cada una de ellas y el tono adecuado a este punto de fricción específico en la experiencia de usuario, estas son las tres propuestas que elaboré para las nuevas páginas 404.
➔ Transformamos la página de error en una oportunidad de marketing, dando la posibilidad al usuario de probar la herramienta Freepik Stories.
➔ Usamos el contenido (copy y elementos gráficos) para reforzar la voz de la marca.
➔ Ofrecemos al usuario la posibilidad de sacar algo útil de este error de sistema.
➔ Mejoramos la usabilidad ofreciendo más información sobre el error y reordenando los elementos de ayuda de una manera más lógica.
➔ Usamos el contenido (copy y elementos gráficos) para reforzar la voz de la marca.
➔ Damos valor añadido al usuario ofreciéndole posibilidades para solucionar el error.
➔ Usamos el contenido (copy y elementos gráficos) para reforzar la voz de la marca.
Antes y después
Aquí se pueden comparar las nuevas propuestas de página 404 con los ejemplos de partida.
Herramientas utilizadas
- Google Docs
- Adobe Illustrator
- Chrome DevTools
En la mochila
En este trabajo aprendí que la coherencia en tu marca sirve para allanar el camino y que siempre, siempre, siempre hay que meterse en el pellejo de la otra persona para ver las cosas desde su perspectiva. La empatía es una gran herramienta para ayudarnos a diseñar contenidos útiles.
