Fleetr
App de gestión de flotas para personas y empresas: flujos rediseñados, versión móvil y escritorio, un sistema de diseño y una marca nueva.
- Cliente
- Fleetr by Jooycar
- Año
- 2021 — 2022
- Mi rol
- Diseñador UX/UI de punta a punta
- Plataformas
- App móvil y escritorio web
Contexto
Fleetr es un software de gestión de flotas pensado para flotas pequeñas y medianas. Les da a sus dueños control total de sus vehículos, con información en tiempo real de los viajes y de las incidencias que ocurren en ellos.
El reto
Mejorar la navegabilidad, simplificar el flujo de usuarios y adaptar todo el producto a móvil y escritorio web.
Mi rol
- Diseño de interfaz y UX
- Gestión de producto
- Investigación de usuarios
- Mapeo del viaje
- Wireframes
- Arquitectura de información
- Diseño de interacción
- UI kit, brandbook y sistema de diseño
Herramientas: Figma, Miro, Maze, Animate, Illustrator y Jira.
Proceso
Con el equipo de Fleetr dividimos el proyecto en cuatro fases, lo que ayudó a planificar la hoja de ruta, los hitos y las fechas de entrega. El cronograma con Shape Up nos permitió definir y priorizar mejor, y los sprints de cuatro semanas me permitieron iterar y validar soluciones temprano y seguido.
- DiscoveryEvaluación de flujos de trabajo, entrevistas a usuarios, análisis de la competencia y textos de definiciones para la intranet.
- AnálisisUser journey maps, flujos de negocio y de pago, priorización del alcance del MVP y A/B testing.
- ConceptoWireframes de baja y alta fidelidad, bibliotecas de diseño atómico, iteraciones y ciclos de retroalimentación con el cliente.
- Desarrollo del sprintDiseños finales, videos explicativos, revisión con desarrollo y usabilidad, y guías de estilos y componentes.
Sistema de diseño
Creé el sistema de diseño y la guía de color con metodología Atomic Design: átomos, moléculas, organismos, plantillas y páginas.
Arquitectura
El site map ordenó la estructura de todos los elementos y funcionalidades. Los journeys de baja fidelidad para tareas específicas ayudaron a resolver interacciones y definir textos, en conjunto con desarrollo.
Diseño final
Diseños de alta fidelidad para móvil y escritorio, con especificaciones, maquetas funcionales y videos de microinteracciones.
Marca
Desarrollé el brandbook con una identidad renovada, más conectada con las otras marcas del grupo. El espaciado del logo usa el grosor de la “L” como unidad, con un margen de seguridad de dos unidades por lado. El ícono va dentro de un cuadro para funcionar como isotipo y animarse con su espacio negativo.
