Edvard Osnaya← Volver al portafolio
Caso de Estudio 03 · Liderazgo de Diseño y Rediseño de Plataforma

Liderar una práctica de diseño y reconstruir la plataforma que la sostenía

Cuatro años embebido en una cuenta de tecnología para el sector salud como Lead Designer: haciendo crecer un equipo que llegó a 13 diseñadores, siendo dueño del sistema de calidad que todos seguían, y liderando el rediseño de la plataforma de Providers del cliente mientras migraba de un sistema heredado a Angular.

Tecnología para salud Plataforma para Providers Migración de sistema heredado a Angular Liderazgo de diseño y DesignOps
RolLead Designer (embebido)
Duración4 años
EquipoHasta 13 diseñadores
MétodosDoble Diamante · Investigación · Pruebas de usabilidad · Accesibilidad
4
Años liderando la práctica de diseño de la cuenta
13
Diseñadores en el equipo en su punto máximo
6
Quality gates por los que pasaba cada entregable
100%
Adopción del sistema de diseño en la plataforma reconstruida
El Rol

Dos trabajos a la vez: dirigir la práctica y seguir diseñando

Durante cuatro años lideré la práctica de diseño en una cuenta de tecnología para el sector salud, sin dejar nunca de llevar mis propias asignaciones. La mitad de liderazgo mantenía alineado y con staffing a un equipo en crecimiento; la mitad práctica me mantenía lo bastante cerca del producto para liderar con credibilidad.

Dirigir la práctica

Equipo, operación y la relación con el cliente

  • Lideré un equipo de diseño que creció y cambió de tamaño, llegando a 13 diseñadores
  • Seguimiento semanal de las actividades y compromisos de cada diseñador
  • Reportes de Quarterly Business Review para el cliente
  • Town halls para mantener alineado al grupo completo
  • Staffing: asignar diseñadores a proyectos según habilidad, objetivos de crecimiento y necesidad de la cuenta
  • Alineación de proyectos entre líneas de trabajo simultáneas
Sin soltar el trabajo

Mis propias asignaciones de proyecto

  • Investigación de usuarios y sesiones de descubrimiento
  • Entrevistas con stakeholders
  • A/B Testing
  • Planeación y dimensionamiento de proyectos
  • Facilitación de talleres
  • Análisis y remediación de accesibilidad
  • Prototipado
El Sistema de Calidad

Controles de Calidad UX: cómo sobrevivió la calidad con un equipo de 13

Un equipo de ese tamaño es un problema de consistencia esperando a ocurrir. Trece diseñadores, trabajando en proyectos simultáneos, producirán trece interpretaciones de "terminado" a menos que la definición esté escrita y se haga cumplir.

Por eso el proceso se formalizó en seis etapas, cada una con sus tareas, más un conjunto de checkpoints obligatorios que ningún entregable podía saltarse. Yo era responsable de este proceso para todos los diseñadores de la cuenta: no para frenar el trabajo, sino para que la calidad dejara de depender de quién tomara el ticket.

01Etapa

Wireframes

Empezar por el problema y las palabras, no por los pixeles; el redactor técnico entra antes del primer boceto.

Contactar al redactor técnico Crear bocetos Crear flujos de trabajo Crear wireframes Iterar con la retroalimentación
02Revisión

Revisión de viabilidad Obligatorio

Antes de pulir un solo pixel: ¿esto se puede construir, y resiste la revisión de pares y del equipo del sistema de diseño?

Revisión de factibilidad con stakeholders Revisión de pares + sistema de diseño a media etapa
03Etapa

Investigación

Cuando un proyecto requería investigación, sus tareas se vinculaban directamente desde el plan de investigación al proyecto, para que la evidencia viviera en la misma vía que la entrega, no a un lado.

Vincular las tareas del plan de investigación
04Etapa

Diseño

Trabajo en alta fidelidad, compartido como un recorrido grabado para que revisores en otras zonas horarias pudieran responder sin necesidad de una junta.

Crear comps de diseño en Figma Grabar video para compartir los comps Iterar el diseño con la retroalimentación Preparar archivos para el handoff a desarrollo
05Revisión

Control de Calidad Obligatorio

Cuatro aprobaciones distintas (contenido, heurísticas, liderazgo de diseño y el equipo del sistema de diseño) antes de que algo se considere final.

Aprobación de tech writing Crítica heurística de diseño Compartir comps con el design lead Comps aprobados por el equipo del sistema de diseño
06Revisión

Revisión Final Obligatorio

La accesibilidad no es un checkbox de último momento: es una revisión formal con su propia firma, junto a la aprobación del manager.

Revisión formal de UX y accesibilidad Revisión y firma del manager
Checkpoint obligatorio · no se puede saltar Tarea de etapa
El Proyecto

Reconstruir la plataforma de Providers

El producto del cliente dirigido a Providers estaba migrando de un stack tecnológico envejecido a Angular. Una migración de ese tamaño suele tratarse como un ejercicio de ingeniería: levantar las pantallas y publicar el mismo producto sobre rieles nuevos. Nosotros la tratamos como la única oportunidad de arreglar aquello con lo que los usuarios realmente batallaban: la navegación misma.

Eso lo convirtió en un rediseño completo en vez de un port, y elevó el riesgo: cambiar la forma en que la gente se mueve por una plataforma que usa todos los días es la manera más rápida de perderla. Todo lo que vino después (la metodología, la decisión del sistema de diseño, las pruebas) se desprendió de ese riesgo.

Metodología

Doble Diamante: divergir, decidir, divergir, entregar

El rediseño corrió sobre el Doble Diamante: dos rondas de abrir antes de cerrar. El primer diamante estableció qué estaba realmente mal con la experiencia actual; el segundo exploró modelos de navegación antes de comprometerse con uno.

Discoverexplore the problemDefineframe the problemDevelopexplore solutionsDeliverbuild the solutionPROBLEM SPACESOLUTION SPACEproblem definition agreed

Discover

Entrevistas con stakeholders, sesiones de descubrimiento y una auditoría de cómo se usaba realmente la plataforma heredada.

Define

El flujo de trabajo y el modelo de navegación, más los criterios de adopción del sistema de diseño que gobernarían la construcción.

Develop

Bocetos, wireframes y prototipos llevados a pruebas con usuarios internos, iterando con los resultados.

Deliver

Diseño final, handoff con el equipo de desarrollo y documentación de accesibilidad.

Sistema de Diseño

Una decisión deliberada: adopción total, no parcial

Trabajamos directamente dentro del sistema de diseño del cliente, y tratamos el nivel de adopción como una decisión explícita y no como un default. Al ser un rediseño total sobre un stack nuevo, no había deuda heredada que valiera la pena preservar, lo que hizo que la opción más exigente fuera también la más barata de construir.

Nivel 1

Solo como referencia

El sistema informa las decisiones, pero la interfaz conserva sus propios componentes. Rápido, y acumula desviación.

Nivel 2

Adopción parcial

Los componentes principales vienen del sistema; los patrones heredados se quedan donde reemplazarlos cuesta demasiado. El compromiso habitual en una migración.

Nuestra elección
Nivel 3

Adopción total

Cada componente, token y patrón del sistema del cliente. Reconstruir desde cero significaba que no había nada que preservar, así que la plataforma salió consistente con el resto del ecosistema por default.

Antes y Después

La navegación cambió de raíz

La plataforma heredada había crecido por acumulación: cada nueva capacidad llegaba como otro punto de entrada, y encontrar algo dependía de saber dónde se había atornillado. La plataforma reconstruida reemplazó eso con un solo shell consistente y una estructura basada en tareas.

Antes

Plataforma heredada

Legacy contract details screen, shown as an anonymized wireframe
  • Capacidades alcanzables solo desde su propio punto de entrada
  • Árbol de menús profundamente anidado, donde encontrar dependía de la memoria
  • Sin un shell consistente entre módulos
  • Patrones de interfaz anteriores al sistema de diseño
Después

Reconstruida en Angular

Redesigned contract details screen
  • Un solo shell global en todas las áreas de la plataforma
  • Navegación primaria agrupada por tarea, no por módulo
  • Breadcrumbs para que el usuario siempre sepa dónde está
  • Cada componente tomado del sistema de diseño del cliente

La misma pantalla, antes y después. El estado heredado se muestra como wireframe anonimizado; todos los nombres, IDs y valores son datos de ejemplo.

El Proceso, Paso a Paso

De la auditoría del sistema heredado a un diseño en desarrollo

El rediseño avanzó deliberadamente de baja a alta fidelidad, cada paso lo bastante barato como para desecharlo hasta que el modelo de navegación se ganó la confianza.

01

Auditoría del sistema heredado

Dónde se rompía la navegación actual, y por qué.

02

Flujos de trabajo

Cómo deben fluir las tareas reales, antes de cualquier layout.

03

Wireframes

Primero la estructura: barata de cambiar, fácil de discutir.

04

Probado e iterado

Usuarios internos sobre la nueva navegación; los hallazgos regresaron directo al diseño.

05

Diseño final

Adopción total del sistema de diseño, entregado a ingeniería.

El Diseño Entregado

Lo que entró a desarrollo

Las dos pantallas centrales de la experiencia reconstruida: nueva navegación, nuevo front end y cada componente tomado del sistema de diseño del cliente.

Redesigned contract list screen
01

Listado de contratos

Búsqueda y filtros por encima de la tabla, filas agrupadas, acciones explícitas por fila y paginación: un solo punto de entrada claro hacia cada contrato.

Redesigned contract details screen
02

Detalle del contrato

El formulario denso del sistema heredado reorganizado en tarjetas agrupadas: detalles, esfuerzo y honorarios, y asignaciones y términos de un lado; estatus, clasificación y notas del otro, con alertas, adjuntos, notas e historial elevados a la parte superior.

Validación

Cambiamos cómo navega la gente, así que lo probamos antes de publicarlo

Rediseñar la navegación es el cambio de mayor riesgo que puedes hacerle a una plataforma que la gente ya conoce. Una mejor estructura a la que nadie logra adaptarse sigue siendo un fracaso, así que el nuevo modelo se puso frente a usuarios internos antes de acercarse a un lanzamiento.

Pruebas con usuarios internos

Sesiones con usuarios internos que conocían la plataforma existente, enfocadas en si el nuevo modelo de navegación era aprendible, no en si se veía mejor.

Iteración con los resultados

Los hallazgos regresaron directo al diseño. Lo que salió mal en las pruebas se cambió y se volvió a probar, en vez de justificarse.

Una mejor estructura a la que nadie logra adaptarse sigue siendo un fracaso. Por eso el modelo de navegación tenía que probarse, no discutirse.

El principio detrás de la ronda de validación
Entrega

Entregado como algo que ingeniería sí podía construir

Implementación con el equipo de desarrollo

El diseño final entró a implementación junto al equipo de ingeniería sobre el nuevo stack de Angular, con acompañamiento de diseño durante la construcción y no un handoff y adiós.

Documentación de accesibilidad

Entregada junto con el diseño final: la documentación de accesibilidad que la construcción necesitaba, para que el cumplimiento quedara especificado y no parchado después del lanzamiento.

Resultados e Impacto

Lo que produjeron los cuatro años

Una práctica, no un pool
Un equipo de diseño que llegó a 13 diseñadores con una definición compartida de "terminado", con staffing deliberado según la necesidad del proyecto y el crecimiento de cada persona.
Calidad que escaló
Los Controles de Calidad UX hicieron de la calidad una propiedad del proceso y no del diseñador individual, incluyendo revisión obligatoria de accesibilidad en cada entregable.
Una plataforma reconstruida
La plataforma de Providers migró a Angular con un modelo de navegación fundamentalmente nuevo, validado con usuarios y con adopción total del sistema de diseño del cliente.
Una relación de confianza
Cuatro años de seguimiento semanal, QBRs y town halls mantuvieron al diseño visible para el cliente como un socio de la cuenta, no como una mesa de servicio.
Reflexión

Lo que me llevo

La consistencia, junto con dedicación genuina y buenas ideas, fue lo que convirtió la relación con el cliente en una alianza real: confiaron en nosotros lo suficiente como para incluirnos en su planeación estratégica, no sólo en la ejecución. Manejar esa confianza mientras dirigía al equipo y varios productos al mismo tiempo fue la parte más difícil del rol.

Siguiente caso de estudio

Recuperar la confianza en un score que nadie creía

Leer caso de estudio →
ENES