Seguimiento ETSA

Seguimiento de transportes de mercancías peligrosas

Año: 2018

Mi rol: diseñadora UX/UI designer

Compañía: Este proyecto fue diseñado con Undanet para la empresa ETSA.

Equipo: Desarrollado con el jefe de proyecto y desarrolladores back y front, con los que trabajé durante la concepción del proyecto y definición de la arquitectura de la información, y más adelante para la validación del código referente a la UI.

Introducción

La compañía de transporte de mercancías peligrosas ETSA necesitaba una herramienta para hacer el seguimiento de sus camiones y conductores en el mapa en tiempo real. Este proyecto implicaba mucha información y varias entidades, y nuestro equipo fue contratado para desarrollar una aplicación responsiva que resolviese su problema y cubriese sus necesidades y requerimientos.

El proceso

1. El descubrimiento: entrevista con el cliente y un representante de los trabajadores y usuarios finales, y definición de las especificaciones.

2. Definición de la arquitectura: Definición del diagrama E-R y del diagrama de flujo del usuario.

3. Primeros mockups y feedback de los clientes.

4. Solución final: diseños de las pantallas finales.

El descubrimiento

Primero, el jefe de proyecto, el jefe de desarrollo y yo nos reunimos con el cliente y nos presentó el proyecto. Hicimos todas las preguntas pertinentes para entender mejor la naturaleza y las limitaciones de la actividad del transporte de mercancías peligrosas, y discutimos en profundidad las necesidades y deseos del cliente.

Después de esta reunión pudimos identificar los requerimientos técnicos y de negocio, y listamos las necesidades de utilización.

Requerimientos de producto:

Portal administrador

Un portal para que los administradores registren y gestionen usuarios, vehículos, conductores y alertas

Bilingüe

Aplicación accesible en 2 idiomas: inglés y español

Desktop first

Aplicación usada principalmente en escritorio, aunque también en móvil por trabajadores de guardia.

Necesidades de uso:

Los usuarios necesitan ver el mapa en la aplicación, donde elementos como los vehículos y caminos puedan ser señalados. Este mapa es muy importante y el cliente insistió en que fuese visible todo el tiempo.
Los usuarios necesitan ver la lista de alertas y poder filtrar las últimas 24 horas o hacer un filtro personalizado.
Los usuarios necesitan ver la lista de todos los vehículos, su velocidad, el momento de la última transmisión, su ubicación en el mapa, necesitan filtrarlos por grupo, área, estado y buscar matrículas específicas.
Los usuarios necesitan ver todos los conductores, su última ubicación, su última transmisión y su ubicación en el mapa.
Los usuarios necesitan poder crear, ver y editar los puntos en el mapa para poder después crear, ver y editar caminos. Los caminos serán usados por las rutas y se componen de un punto de origen, uno de destino, y entre cero y múltiples puntos intermedios.
Los usuarios necesitan poder crear, ver y editar zonas, las cuales se pueden crear a partir de un camino, definiendo un perímetro de alerta alrededor de éste.
Los usuarios necesita poder crear, editar y eliminar rutas, usando camino y estableciendo fechas y horas para el origen y el destino. Para cada punto de la ruta se deben poder activar las alertas.
Los usuarios necesitan ver las expediciones por ruta y, para cada ruta, poder ver todos los vehículos en esa ruta y su ubicación en el mapa. También podrán filtrar las expediciones para “Hoy”.
Los usuarios necesitan asignar rutas a vehículos y conductores para crear nuevas expediciones.
Los usuarios necesitan poder leer el resumen sobre los conductores y vehículos y acceder a su historial de expediciones.
Los usuarios necesitan activar las alertas de la Guardia Civil.
Los usuarios necesitan poder exportar la información del tacógrafo.
Los usuarios quieren ver el vehículo en directo en video.
Los usuarios quieren poder comparar la información de 2 expediciones diferentes y ver la ruta en el mapa.

Observando las especificaciones nos dimos cuenta de la gran complejidad del proyecto, había mucha información y funcionalidades con las que trabajar.

Definiendo la estructura

Necesitábamos ordenar y categorizar toda la información que teníamos, no sólo para que los desarrolladores pudiesen construir la base de datos de la aplicación, sino para que todos los miembros del equipo entendiéramos mejor el contenido a visualizar y las relaciones entre las categorías o clases. Entonces creamos el diagrama Entidad-Relación.

Una vez definido el diagrama E-R, la información empezó a ser más clara, así que, con el jefe de producto, creé el diagrama de flujo del usuario.

Mockups e comentarios del cliente

El diagrama de flujo era la base para crear los primeros mockups de baja definición. Compartimos estos mockups con el cliente y nos retornó algunas impresiones interesantes. Su principal preocupación era la visualización del mapa, aunque también hubiese que visualizar la información, todo el mapa debería ser visible todo el tiempo (excepto en el portal administrador). Esto resultó ser un reto, debía mostrar toda la información sin ocultar el mapa.

Solución final

Necesitaba encontrar una solución para no ocultar el mapa al mismo tiempo que se mostrase la información adicional, y la mejor solución era usar transparencias. Hice algunas pruebas, mostrando la información sobre unos contenedores oscuros con transparencias el usuario aún podía ver el mapa a través del contenedor.

La adaptación para móvil tampoco fue sencilla. Había mucha información y el cliente quería mantenerla toda en móvil para que los trabajadores de guardia pudieran consultar cualquier dato. Sin embargo, el uso de la aplicación en móvil era tan reducido que decidimos simplificar algunas vistas para aligerar el contenido en pantalla.

Validé la solución con el cliente y, como estaba muy satisfecho, pude diseñar las pantallas finales para las diferentes funcionalidades.

Finalmente, hecho todo el diseño de la aplicación, procedí a escribir el manual de uso para la formación de los nuevos trabajadores, otro requerimiento del cliente.

Conclusiones del proyecto

El proyecto Localizador ETSA, implicó cierta complejidad, había mucha información a entender y visualizar, y muchas funcionalidades relacionadas con distintos elementos a gestionar. Con todo, planificamos el proyecto cuidadosamente para entender la información, las necesidades y las limitaciones intrínsecas, y buscamos la mejor solución para cada problema.

Al final, el cliente estaba más que satisfecho con la aplicación y especialmente con su usabilidad, que resultó ser mucho mejor de lo esperado.