Industria
Fintech
Cliente
kiban
Design System para kiban cloud
Escalando diseño en solitario para un ecosistema fintech B2B
Kiban decidió lanzar Kiban Cloud, un ecosistema de herramientas que ayudaban a bancos y empresas fintech con servicios que suelen tercerizar: verificación de buró de crédito, procesamiento de préstamos, validaciones. Lo que empezó como una plataforma de suscripción eventualmente evolucionó en un servicio de APIs. Era un monstruo. Una umbrella completa dentro de las capacidades de Kiban.
Cada nuevo flujo tomaba semanas.
Cada pantalla se diseñaba desde cero. Los developers trabajaban con referencias visuales inconsistentes. No había una fuente de verdad. Con ~8 developers trabajando en prioridades distintas y yo comunicando por partes, necesitábamos algo que nos permitiera movernos más rápido sin sacrificar coherencia.
Creé un design system de 60+ componentes.
Esto fue antes de que Figma tuviera Dev Mode, así que la organización y el etiquetado eran todo. Cada componente tenía que contemplar todos sus estados posibles: hover, disabled, error, loading. A veces eran demasiadas variaciones, pero me gustaba eso—contemplar todas las posibilidades, asegurarme de que nada quedara sin resolver. Kiban Cloud era un ecosistema de múltiples herramientas, y decidí que el cambio de herramienta se marcara por color. Misma estructura, diferentes colores. Cambiabas de herramienta, cambiaba el color. Era muy limpio, muy bonito. Y súper tangible—siempre sabías en qué parte de Kiban Cloud te encontrabas solo por ver la interfaz. Los developers llevaban el Storybook en paralelo y yo mantenía links en los archivos madre para tener todo coordinado. Lo implementaron visualmente lo más fiel posible.
"Crear el sistema fue solo el principio. Hacerlo funcionar como única diseñadora trajo desafíos que nunca aparecen en los case studies corporativos."
01
El caos de mantenerlo sola
Manejar updates era difícil. Tuve que usar emojis y crear versiones de manera muy básica para marcar qué era prioritario y qué no. Todo se documentaba en JIRA, así teníamos una secuencia de prioridades y desarrollo. No era elegante, pero funcionaba. La organización y naming conventions eran críticos. También asegurar que todo tuviera un orden y nombre claros, que si algún día alguien que no fuera yo llegaba, entendiera claramente cómo y de dónde funcionaba todo.
02
Los componentes difíciles
El proyecto más desafiante fue una interfaz tipo no-code. También diseñé un visualizador de JSON con múltiples capas internas que inicialmente me pareció muy complejo de resolver, pero al verlo ejecutado me di cuenta de que resultó mucho más funcional de lo que había imaginado. Aunque diseñar cada componente individual es divertido y forma parte de la artesanía del Sistema de Diseño, lo que realmente disfruto es trabajar con sets completos de componentes para crear pantallas complejas y visualizar procesos completos ya armados, en perspectiva.
03
Sistema que se explica solo
Los developers llevaban el Storybook en paralelo y yo mantenía links en los archivos madre para tener todo coordinado. Lo implementaron visualmente lo más fiel posible. No le metimos mucho a animaciones porque nuestro sistema era más funcional—esto era B2B fintech, no una app de consumo.
