Luciana Godoy es LA Diseñadora de Interacción de TN. Sí, decimos LA porque es literalmente la única que se dedica los productos digitales periodísticos de Artear… por lo menos por ahora.

Ella, que firma sus mails como “Lu”, fue la Diseñadora de Interacción del equipo que rediseñó TN, que, dicho sea de paso, ganó varios premios desde su lanzamiento en 2013. Quisimos escuchar de primera boca, por no decir primera mano, cómo fue el proceso de cambio, qué rol cumplió y sobre todo cuál es su visión del rol del UX y el Diseño de Interacción en el contexto global del proyecto. Ahora sí, más que presentada: Luciana Godoy.

En sus palabras: “Yo hacía diseño de interacción antes de saber ni siquiera que existía como disciplina”. Y sí, desde que empezó a trabajar, su punto de partida para cualquier proyecto de diseño siempre fueron los usuarios.

El background de Lu es importante para entender cómo piensa y las decisiones que toma. Empezó su carrera como diseñadora de material interactivo para proyectos de educación, lo cual la marcó mucho porque este tipo de proyectos tienen, por su propia naturaleza, al usuario como centro de todas las decisiones.

Después trabajó en otra empresa como Diseñadora de Interacción para herramientas internas, concentrándose en hacer que la interfaz ayude a la productividad. Nuevamente, el punto central está en observar cómo el usuario realiza las tareas para asegurar que la interfaz facilite la tarea y absorba la mayor complejidad posible.

Así llegó finalmente a la Compañía de Medios Digitales (CDM) que desarrolla los contenidos digitales para el grupo Clarín, para incorporarse al equipo de rediseño de TN.

El proceso de rediseño

Objetivos

Como todo sitio de contenidos, el foco estaba puesto en incrementar el tráfico.

Y se definió que la solución era “ser responsive”, ya que en 2013 ninguno de los sitios de la competencia lo era.

Equipo

Para encarar este proyecto se formó un equipo compuesto de:

  • Dos periodistas con experiencia en medios digitales, que son los product owners
  • Tres desarrolladores front-end
  • Un Diseñador de Interacción (Lu)
  • Un analista de tráfico (web analytics)


La decisión de incorporar un Diseñador de Interacción fue de los product owners. Sabían el valor que aporta UX y sabían que iba a ser importante para este proyecto.

Etapa 1: UX research

El proceso de diseño empezó con analytics, haciendo foco en dos métricas particularmente relevantes para el diseño:

  1. Mapas de calor para ver cuánto scroll hacían los lectores y cómo interactuaban con el contenido. Eso ayudó a definir la distribución de los elementos dentro del diseño.
  2. Listado de las páginas más visitadas para definir la arquitectura de la información. Saber si los usuarios entran por la home o por páginas internas (es decir, entran por las notas directamente) era importante para definir qué información mostrar según el punto de entrada al sitio. Siendo que el criterio editorial para el diario es mostrar las notas principales arriba de todo y las secundarias en lugares menos prominentes, se tomó la siguiente decisión:
    • Para quienes entran por la home y de ahí pasan a notas secundarias, la barra lateral muestra noticias relacionadas con la nota principal. No tenía sentido mostrar las noticias principales porque ya se habían visto a su paso por la home
    • Quienes entran al sitio por una página interna, sin pasar por la home, no vieron las noticias principales. A esa gente entonces, en la barra de navegación se le muestran las noticias principales.

Etapa 2: Diseño de Interacción – Mockups y wireframes

Una vez definidos el layout y la arquitectura de la información, Lu y equipo se dedicaron a hacer mockups de bajo nivel donde se mostraban en qué lugar iban los componentes principales (títulos, subtítulos, banners, notas relacionadas, contenido secundario, navegación, etc.).

Esos mockups los validó con el resto del equipo (equipo editorial y de desarrollo) para asegurarse de que los lineamientos editoriales se estaban respetando y de que todos los componentes planteados estaban disponibles o se podían realizar.

Etapa 3: Diseño visual

Una vez consensuados, los prototipos de bajo nivel pasaron a la agencia de diseño con la que TN trabajó para agregarle la capa visual.

Etapa 4: Maquetación e implementación

En esta etapa se usaron metodologías ágiles adaptadas a la configuración del equipo.

Una vez hechas las maquetas, éstas se implementaron en el CMS.

Todo el proceso, desde UX research hasta la puesta en producción, tardó 7 meses. Un tiempo relativamente corto considerando la dimensión del sitio.

¿Y ahora?

Ahora que el nuevo diseño está lanzado, el mantenimiento se realiza de tres maneras:

  • Relevando el feedback de los usuarios a través de los comentarios que dejan en el store (para la app).
  • Relevando problemas técnicos a través del equipo de QA.
  • Con A/B testing para ir haciendo mejoras incrementales a la experiencia del usuario, enfocándose siempre en el objetivo final: el tráfico.

Próximos desafíos: la experiencia del usuario interno

“Cuando quise hacer una nota de prueba me di cuenta de lo difícil que es usar la herramienta que tiene que usar los periodistas. Y eso que yo trabajo de esto”, nos cuenta Lu.

“Si los periodistas tienen mejores herramientas, van a producir mejor contenido, y eso va a impactar positivamente en el producto final. Por eso, logré que aprobaran mi próximo proyecto: mejorar las herramientas que usan los periodistas para generar el contenido”.

Así piensa un verdadero profesional de UX.