Alfredo Cisneros — Diseñador Senior UX/UI, Estratega de Producto y Director Técnico Saltar al contenido principal

Panel de supervisión en tiempo real — Creado para integrarse con Salesforce

Optimización de la gestión de consejeros de crisis mediante un marco de interfaz escalable y nativo de Lightning.

Diseño UX
The Trevor Project
2023–2024
3 meses
Diseñador UX/UI
Volver a casos de estudio

Sistema visual e integración de marca

Una mirada completa al lenguaje visual renovado: iconografía unificada, paleta accesible, layouts optimizados y consistencia de componentes en el ecosistema WordPress.

Resumen del proyecto

The Trevor Project Logo

The Trevor Project necesitaba un tablero escalable en tiempo real para que los supervisores de crisis monitorearan sesiones de consejería en vivo. El objetivo era diseñar una interfaz nativa de Lightning dentro de Salesforce que simplificara los flujos de supervisión, mejorara la visibilidad de la actividad de los consejeros y aumentara la velocidad de respuesta en situaciones de alto estrés.

Mi aporte se enfocó en transformar datos de interacción complejos en una interfaz clara y accesible que equilibrara empatía, estructura y desempeño.

Resumen del proyecto

Plazo y equipo

3 meses

Senior UX/UI Designer, Product Manager, equipo de ingeniería de Salesforce

Herramientas y metodología

Figma, Salesforce SLDS v2

Wireframing, implementación del sistema de diseño de alta fidelidad, cumplimiento de accesibilidad

Entregables clave

  • • UI Kit modular
  • • Biblioteca de componentes alineada con los estándares de SLDS
  • • Tokens de Lightning y variables de tema
  • • Documentación de accesibilidad

Métricas de rendimiento

100%

Consistencia de diseño en todos los módulos integrados con SLDS

(validado durante revisiones de QA y auditorías de interfaz entre módulos)

30%

entrega a desarrollo más rápido entre diseño y desarrollo

(medido por la velocidad de los sprints en Jira y la reducción de tickets de retrabajo)

40%

Reducción de incidencias de QA relacionadas con accesibilidad

(tras adoptar tokens de color y tipografía conformes con SLDS)

Planteamiento del problema

Los supervisores de The Trevor Project necesitaban una herramienta centralizada para monitorear en tiempo real las sesiones de consejería en crisis. Los flujos anteriores dependían de pantallas fragmentadas y seguimiento manual, lo que aumentaba la carga cognitiva y retrasaba la respuesta ante casos de alto riesgo.

El reto fue diseñar una interfaz unificada y nativa de Lightning que simplificara el flujo de información y permitiera decisiones oportunas y con confianza.

Desafío

Crear una base de interfaz modular dentro de Salesforce asegurando desempeño, accesibilidad y escalabilidad.

El sistema debía adaptarse a distintos roles de usuario, soportar múltiples estados (sesiones activas, en pausa y finalizadas) e integrarse sin fricción con las estructuras de datos existentes, sin afectar la estabilidad de la plataforma.

Enfoque

Siguiendo una metodología basada en sistemas de diseño:

  1. Investigación y auditoría: revisé los patrones de Salesforce Lightning y los flujos internos de supervisión.
  2. Wireframing: mapeé las secuencias de tareas para reducir el ruido visual y la fricción cognitiva durante las sesiones activas.
  3. Diseño de componentes: construí componentes en Figma conformes con Lightning y con estados definidos (hover, focus, deshabilitado).
  4. Integración del tema: apliqué los tokens de marca de The Trevor Project (color, tipografía) manteniendo el contraste WCAG 2.2.
  5. Pruebas con prototipos: validé escenarios de usabilidad con las partes interesadas y ajusté la densidad de la interfaz para una legibilidad óptima.

Solución

Entregué un tablero de supervisión totalmente responsivo y orientado a datos, construido con Salesforce Lightning Design System v2.

La interfaz unificó múltiples indicadores en tiempo real —estado de la sesión, carga de los consejeros, protocolos de emergencia— en una sola jerarquía visual.

El UI Kit modular y los design tokens agilizaron la colaboración entre diseño e ingeniería, asegurando el mantenimiento a largo plazo de las herramientas internas.

Resultados

El sistema rediseñado generó mejoras medibles en usabilidad, accesibilidad y colaboración entre equipos. Los supervisores experimentaron flujos más fluidos y mayor visibilidad de los datos, mientras que el equipo de ingeniería reportó menos fricción durante la implementación.

El proyecto reforzó las buenas prácticas de Salesforce Lightning, mejoró la escalabilidad del diseño y aumentó la confianza de los usuarios, demostrando cómo un sistema de diseño unificado puede acelerar tanto la velocidad de entrega como la confiabilidad del producto.

Conclusión clave

Los sistemas de diseño pueden fortalecer los flujos de trabajo guiados por la empatía cuando la claridad, la jerarquía y la accesibilidad se tratan como elementos inseparables de la experiencia de usuario.

Construir dentro de marcos de trabajo establecidos como Salesforce Lightning permite a los equipos avanzar más rápido sin sacrificar oficio ni consistencia.

¿Le resultó interesante este caso de estudio?