Product designer

Rediseño de Extensión

Rediseño del producto principal de Harmonix: migración de una extensión inyectada en cada página web a un Side Panel único, simplificando la arquitectura, eliminando funciones que nadie usaba y mejorando la estabilidad del producto.

Rediseño de Extensión

Rol

Product designer

Duración

1 año

Herramientas

Figma

Equipo

Harmonix

Contexto

Harmonix es una herramienta que se establece sobre los lugares habituales de trabajo de los usuarios de CRM — Outlook, Salesforce, Dynamics, LinkedIn — y unifica sus herramientas de comunicación e información. Funciona principalmente a través de una extensión de navegador que se adapta al contenido de cada página web, pero también cuenta con una aplicación web que sirve como centro de control: configuraciones para administradores y personalización para cada usuario (firma, números de teléfono, avatar…).

Al tratarse de una extensión de Google Chrome, para poder ponerse sobre cualquier página web necesita permisos específicos de Google.

El problema

La extensión tenía un problema de arquitectura que afectaba directamente a la experiencia. Cada vez que el usuario navegaba a una nueva página, se cargaba una nueva instancia de la extensión — con su propio marcador de teléfono, email, mensajería — lo que provocaba conflictos entre instancias, recargas inesperadas y pérdida de contexto. Además, cada página web tiene una estructura interna distinta, lo que obligaba a un proceso de adaptación personalizado para que la extensión no tapara ni desplazara los elementos nativos de cada sitio.

El resultado era una extensión que funcionaba de forma inestable y que requería un esfuerzo técnico desproporcionado para mantener.

La oportunidad apareció cuando Google introdujo el Side Panel: un espacio dedicado del navegador para extensiones, independiente del contenido de la página. Una única instancia, sin necesidad de inyectarse en cada web, sin conflictos. Esto no era solo una mejora técnica — era la posibilidad de replantear toda la experiencia del producto principal.

Extensión original

Lo que nos dijeron los clientes

El feedback de los clientes reflejaba los problemas de arquitectura en forma de frustraciones concretas: las llamadas a veces no entraban, la extensión se recargaba después de un tiempo de inactividad, a veces no aparecía donde debería, y la sincronización entre vistas no era fiable. Eran síntomas distintos de un mismo problema de fondo — cada página cargaba su propia instancia y no había garantía de estabilidad.

Pero más allá de los problemas técnicos, las conversaciones con clientes también revelaron algo sobre el producto en sí: había funcionalidades que nadie usaba. La sección de nurturing, la bandeja de salida, ciertas vistas que se habían añadido con el tiempo — los clientes no las mencionaban porque directamente las ignoraban. Al mismo tiempo, las funciones que sí valoraban — el detalle de contacto, el historial de actividades, las sugerencias de follow-up — quedaban enterradas entre todo lo demás.

El rediseño no podía ser solo un cambio de contenedor. Tenía que ser también una oportunidad para decidir qué merecía seguir existiendo.

Soluciones

Navigation and general view of the application on top of a page
Organized work that's unified in a single inbox
Different screens for the application
Sidepanel rediseñado

Una sola instancia, un contexto que no se pierde

La migración al Side Panel resolvió de raíz el problema de las múltiples instancias. Ahora la extensión vive en un espacio único del navegador, independiente de la página que el usuario tenga abierta. Esto eliminó las recargas inesperadas, los conflictos entre marcadores y la pérdida de contexto al navegar. Para desarrollo supuso un punto de control mucho más manejable; para los usuarios, una extensión que por fin se comporta de forma predecible.

Simplificando lo que sobra, unificando lo que se repite

Con el cambio de contenedor llegó la oportunidad de revisar todo el contenido. Las secciones que nadie usaba — nurturing, bandeja de salida — se eliminaron. Las que eran demasiado similares, como tareas y bandeja de entrada, se unificaron en una sola vista. El objetivo era que cada elemento del Side Panel justificara su presencia: si no aportaba valor demostrable, no merecía el espacio.

Reorganizando la navegación para un espacio reducido

La extensión original contaba con una barra lateral izquierda para navegar entre vistas generales (tareas, bandeja de entrada, pipeline) y una zona de detalle de contacto a la derecha con historial de actividades, sugerencias de follow-up e informes de agentes de IA. Al comprimir todo en el Side Panel, esta estructura ya no funcionaba. La navegación se rediseñó para que las vistas principales y el detalle de contacto convivieran de forma fluida en un espacio más reducido, priorizando lo que los usuarios consultaban con más frecuencia.

Reflexión

Este fue un proyecto de un año y la decisión más difícil no fue técnica — fue decidir qué quitar. Cuando llevas tiempo diseñando un producto, conoces cada función y sabes cómo resolver sus problemas, lo que hace fácil justificar que todo se quede. Pero los clientes no ven lo que tú ves: ellos ven funciones que ignoran compitiendo por espacio con las que realmente necesitan.

La migración al Side Panel forzó esa conversación. No era posible trasladar todo tal cual a un espacio más pequeño, así que cada función tuvo que ganarse su sitio. Esa restricción resultó ser la mejor herramienta de diseño del proyecto: obligó a tomar decisiones que llevaban tiempo pendientes.

Si continuara iterando, me centraría en medir cómo la simplificación ha afectado a la adopción de las funciones que sí se mantuvieron, y en explorar cómo el Side Panel puede adaptarse contextualmente — mostrando información diferente según la página que el usuario tenga abierta, sin volver a los problemas de la arquitectura anterior.

Siguiente proyecto

AI Agents

AI Agents