Un mapa digital

Construyendo soluciones digitales junto a OSDE

Cuando conocimos al equipo de OSDE, la empresa se encontraba transitando el proceso de transformación y adopción de una cultura digital y, con ello como punto de partida, nos sumamos al equipo de UX para potenciar y construir los procesos y metodologías que permitieran el crecimiento orgánico del área y de su impacto dentro de la organización.

El slogan “Con Vos, Siempre” sería el eje de la experiencia digital del socio y los prestadores.

El desafío

Potenciar equipos y construir las bases del proceso de diseño de OSDE.

Qué hicimos
  1. Potenciar y estructurar
  2. Construir el Design System
  3. Diseñar productos digitales

1 / Potenciar y estructurar

Diseñamos el proceso de diseño de un producto digital.

Desde el primer día trabajamos junto al equipo UX de OSDE en la definición de procesos y metodologías que potenciaran el crecimiento del área y aceleraran la adopción de una cultura digital dentro de la empresa.

Creamos procesos

Una gestión transparente, colaborativa y previsible involucra a todas las partes y promueve proyectos.

Fomentamos la colaboración

Equipos compuestos por diversos roles compartiendo un objetivo común.

La misión era potenciar el crecimiento del equipo de experiencia de usuario para internalizar la cultura digital y llevar la filosofía de OSDE a sus productos digitales.

CAPÍTULO 1

Relevar. Priorizar. Ejecutar. Revisar. Repetir︎.

Los procesos enmarcan las condiciones ideales para la creación de soluciones centradas en el usuario. No nos malinterpreten, es muy importante abrazar la inspiración y la espontaneidad, pero dentro de un proceso de diseño de un producto digital dónde existen diversos equipos, intereses y objetivos, la planificación, organización y previsibilidad delimitan espacios seguros donde la creatividad y las soluciones pueden fluir.

Las 6 premisas que aplicamos en la estructuración de los procesos

Usar sprints

Creemos en la incrementalidad planificada y la definición de objetivos a corto plazo.

Usar sesiones de Mapeo

Relevamos y organizamos todas las tareas y objetivos del proyecto.

Usar Plannings para priorizar

Todo en todas partes al mismo tiempo es una gran película, pero los proyectos necesitan priorizar.

Revisar constantemente

Más allá de la comunicación cotidiana del equipo, durante el sprints se definen instancias de check.

Dar seguimiento semanal

Semana a semana se revisa el estado de las tareas para detectar problemas y/o desvíos.

Aprender de lo sucedido

Las sesiones de retro son la herramienta perfecta para revisar lo que sucedió en el sprint.

CAPÍTULO 2

Redefinimos el proceso de diseño

A medida que los equipos crecen así como la demanda hacia ellos, el margen de error evitable debe reducirse, por eso es muy importante documentar las necesidades de negocio, partir de patrones existentes y respaldarse en el design system.

1

Requerimiento

El punto de partida siempre será un requerimiento y/o historia de usuario relevada, priorizada y documentada.

2

Diseño

Las interfaces deben partir en un primer momento del Sistema de Diseño y en los patrones de diseño existentes, de no aplicar, evaluar nuevas soluciones.

3

Prototipo

Todo flujo y/o funcionalidad estará acompañada de un prototipo para permitir un mejor entendimiento del mismo.

4

Documentación

Se documentarán los componentes, interacciones y features de accesibilidad para que sean correctamente interpretados.

CAPÍTULO 3

Un stack para mantenernos comunicados

Procesos y colaboración son el eje de un proceso de diseño. Por eso elegimos un stack tecnológico cloud-based, accesible desde cualquier dispositivo, que permita la colaboración en todas las instancias y que además, permita documentarlo todo.

De la mano de Slack nos mantenemos comunicados, en Notion lo documentamos todo y le damos seguimiento a las tareas y asignaciones, Figma es la casa de los diseños, prototipos y Design System y Figjam es nuestro playground para explorar y encontrarnos.

Sumar a EGO fue parte del proceso de digitalización de OSDE y está mostrando excelentes resultados. Compartimos una visión centrada en las personas y eso nos potencia y nos une como equipo.
Juan Pedro Danculovic Head of User Experience. Grupo OSDE

2 / Construir el Design System

Construyendo la experiencia digital OSDE

La plataforma digital de OSDE se compone de un sinfín de interfaces que responden a necesidades tan específicas como importantes. Por eso la solución no es unificar todo en una sola solución, sino construir un lenguaje único, el idioma digital propio de OSDE que le permita tener flexibilidad, escalabilidad y consistencia a lo largo de sus productos digitales.

Este idioma digital es lo que llamamos OSDE Design System

El Design System, un lenguaje para construir experiencias digitales

A medida que los equipos crecen así como la demanda hacia ellos, el margen de error evitable debe reducirse, por eso es muy importante documentar las necesidades de negocio, partir de patrones existentes y respaldarse en el design system.

CAPÍTULO 1: DEFINIR UN CONCEPTO

La experiencia OSDE

Todo el diseño de la experiencia va a estar centrado en las personas: usuarios en general, prestadores, socios, beneficiarios, etc. El foco estará en la necesidad de brindar soluciones dinámicas y cotidianas desde las diferentes plataformas digitales en las cuales OSDE tiene presencia.

Definir usuarios
Definir principios

Construir la experiencia sobre una base sólida de “Principios” que nos permitan tomar decisiones a lo largo del diseño de la experiencia, que marquen la personalidad y el valor agregado de nuestra experiencia.

Diálogo
App → Usuario

Generar conversaciones con el usuario. Comunicación cercana y transparente que transmita confianza.

Una cosa a la vez
Facetados y dinámicos

Ser claros para comunicar, una cosa a la vez, simple y previsible, transmitiendo seguridad en cada interacción del usuario.

Sé por donde empezar
Orden visual

Ser consistentes en la organización de las interfaces, respetar patrones culturales de los usuarios.

Me animo
Previsible y segura

Las acciones anticipan lo que sucederá. Los feedbacks nos comunican y nos orientan. La incertidumbre no es una limitante.

Inmediatez
Para todos los días

Priorizar las acciones que resuelven situaciones cotidianas.

Construir mensajes

Las interfaces se construyen alrededor del contenido y la forma en que estos se estructuren determinarán la experiencia de los usuarios.

Contexto
Reconocer al usuario

OSDE trabaja para +2.000.000 de socios y +160.000 prestadores a lo largo de todo el país.

Servicio
como mensaje

Construir un mensaje cercano, humano y simple. Tener en cuenta al usuario y su manera de entender. Adaptarnos a su evolución a través del tiempo.

Las bases
del mensaje

Coloquiales y respetuosos, simples y concisos, hablamos como personas, ofrecemos acciones claras que promuevan la certeza.

Minimalismo
Efectivo y conciso

El contenido debe ser conciso para que la persona pueda completar su objetivo sin distracciones y con el menor esfuerzo posible.

Apoyo visual
Ilustraciones "Manos"

Las manos representan la ayuda, la compañía y la cercanía. Nos valdremos de ellas para reforzar mensajes.

Invertir tiempo y esfuerzo en la exploración de los principios de diseño en las etapas iniciales de un proyecto es, sin dudas, una de las decisiones estratégicas más importantes del ciclo de vida de un producto digital.
Julio Spinetto Chief Design Officer at EGO

CAPÍTULO 2: COMPORTAMIENTO

Patrones de comportamiento

La consistencia y reconocibilidad de los elementos de la interfaz es un concepto clave en la construcción de un sistema de diseño escalable y consistente. No se trata de hacer todo igual, sino sostener criterios fácilmente reconocibles que le permitan al usuario apropiarse de las interacciones e interactuar con ellas con confianza y autonomía.

Feedback

Comunica al usuario el resultado de una acción o proceso que realizó. Dependerá del momento en el que se encuentre, de su nivel de importancia, de cuánta atención debe prestarle, si se necesita una confirmación, si es informativo, etc.

Splitter

Ofrecen al usuario diferentes acciones sobre una misma pantalla. Su función es redireccionar, disparar flujos y comunicar diferentes estados. El uso del mismo de la importancia de la decisión que deba tomar la persona usuaria.

Skeleton

Comunica al usuario a través de una previsualización, el contenido de una misma pantalla hasta que la misma efectivamente sea presentada en pantalla.

Spinner

Se utilizan cuando se recuperan datos o se realizan acciones que pueden demorar, y ayudan a notificar a los usuarios que la carga está en curso.

Ilustraciones

Las ilustraciones se utilizan para dar mejor contexto visual, dependiendo la instancia requerida.

CAPÍTULO 3: ACCESIBILIDAD

Diseñando para todas las personas

En un sentido amplio, el 99,98% de las personas en el mundo tenemos algún tipo de discapacidad en algún momento de nuestras vidas. Comprender la accesibilidad del producto puede mejorar la usabilidad para todos los usuarios y así una mejor experiencia.

Accesibilidad como un criterio

No se limita a los lineamientos del Design System, sino que también cuenta con referentes que actualizan los componentes, aprueban nuevas normativas e instruyen a los demás equipos.

Parte del proceso de diseño

La accesibilidad cuenta con su propio track de tareas, deliberaciones y weeklys donde se relevan constantemente actualizaciones y mejoras.

Dentro del design system
Paleta cromática

Pruebas de contraste, colores que se han utilizado como fondo para textos.

Tipografía

Mayores a 14px siempre que sea posible. En caso de usar tamaños menores reforzar el contraste.

Iconografía

Incluyen su nomenclatura y texto alternativo para ser nombrados por lectores de pantalla.

Navegación por teclado

El orden y cómo debe verse el foco de teclado al presionar la tecla TAB.

Una experiencia muy positiva. Conformamos un buen equipo dónde existe una muy buena comunicación y un rápido entendimiento.
Eduardo Bacca UX Analyst at OSDE

CAPÍTULO FINAL: THE LIBRARY

Una base de conocimiento

En la librería se encuentra la documentación de cada elemento del design system: sus usos, variantes, casuísticas y estados. Las experiencias deben construirse a partir de sus componentes.

Centralizado

Cuenta con referentes que actualizan los componentes, aprueban nuevas normativas e instruyen a los demás equipos.

Parte del proceso de diseño

El Design System cuenta con su propio track de tareas, deliberaciones y weeklys donde se relevan constantemente actualizaciones y mejoras.

Fácil de consumir

El Design System es fácil de compartir, navegar y entender. Diseñado para que cualquier persona pueda entenderlo e interiorizarse en la experiencia digital OSDE.

Siempre beta

El Design System vive en constante evolución para dar soluciones a las interacciones y necesidades de las personas.

Así está compuesta
✨ Experiencia digital OSDE
🔤 Tipografía
🦾 Accesibilidad
➡️ Buttons
✅ Feedback
📄 Surfaces
📐 Grilla
🙌 Ilustraciones
🧩 Patrones de comportamiento
💬 Data Display
⛵️ Navigation
⌨️ Text Fields
🎨 Paleta cromática
😊 Íconos y logos
🏗 Directorio de componentes
📱 Device System
🎚 Selection Controls
Sistemas de diseños sólidos y robustos permiten crear experiencias flexibles y consistentes.
Charo Espinosa Chief Production Officer at EGO
3 / Diseñar productos digitales

Diseñamos soluciones para personas

Junto al equipo de OSDE, sus stakeholders y guiados por el proceso de diseño, diseñamos soluciones para las necesidades de los diversos usuarios de sus servicios.

Credencial Digital

El corazón de un cambio de hábito totalmente internalizado. La credencial ahora es digital y es imposible ignorar la utilidad que tiene. Con la nueva app, es posible centralizar la gestión de las credenciales del grupo familiar, así como compartir credenciales con terceros sin perder el control de tus datos y brindando seguridad a los prestadores.

Consulta médica online

La restricciones del confinamiento permitieron abrirnos a nuevas formas de relacionarnos y una de ellas es la de entender que una videollamada es una valiosa herramienta para obtener un rápido diagnóstico. Lejos de reemplazar la consulta presencial, la consulta médica online brinda mayor flexibilidad a los asociados así como nuevos formatos de atención para los prestadores.


La consulta se lleva adelante desde cualquier dispositivo y todas las notas, recetas y archivos compartidos quedan documentados y archivados para cuando sean necesarios.

Asistencia a urgencias

Es una historia contadas de dos formas distintas: el asociado que solicita e informa y del otro, el personal médico gestionando las solicitudes para dar atención a las mismas.

Asistencia médica

Directamente desde el celular indicando para quien de tu grupo es, estado de salud y síntomas para determinar la mejor atención posible, además de poder visualizar el historial de asistencias solicitadas.

Atención de urgencias

La otra cara de las asistencias, con esta app el personal médico ambulatorio gestiona las visitas solicitadas, pudiendo dejar extensivamente documentado todo lo sucedido con el asociado.

Gracias al espíritu colaborativo y el anhelo de superación de OSDE pudimos formar equipos creativos, frescos y ágiles que saben crear soluciones centradas en el usuario. Estamos agradecidos de ser parte de este ambicioso proyecto.
Emiliano Porterie Chief Operations Officer at EGO