Hipra
Una herramienta que ayuda a mejorar la comunicación entre las personas
Funciones: UX/UI
- Research
- Conceptualización
- Wireframes
- Diseño
- Prototipado
Hipra, una multinacional farmacéutica orientada a la medicina veterinaria, tiene filiales alrededor de todo el mundo, lo que se traduce en miles de trabajadores y decenas de departamentos.
Cuando los trabajadores necesitan contactar entre ellos, por ejemplo, de país a país, se encuentran con una serie de fricciones que les hace el trabajo y la comunicación poco eficaces.
Nos pidieron una solución que reduzca el máximo posible esas problemáticas; una herramienta que permita una comunicación rápida para colaborar entre los distintos equipos.
Research
Requerimientos técnicos y benchmarking
Debido a que el cliente era el propio usuario, la primera fase del proyecto fue entender los requerimientos del negocio y las limitaciones técnicas a las que nos teníamos que ceñir.
También realizamos una investigación de mercado que nos permitió validar las expectativas del cliente y enfocarnos desde el primer momento en un objetivo útil y funcional.
- Análisis de requerimientos
- Benchmarking
Conceptualización
Ideación de layouts y elementos
A partir de un trabajo de brainstorming creamos una lista de prioridades y elementos clave que debería tener la solución, elementos que empezamos planteando en forma de bocetos: formatos, detalles del empleado, disposición de los filtros, etc.
Wireframes
Cómo organizar la información
Empezamos con los wireframes para desktop porque es el principal tipo de dispositivo que utilizan los empleados. Aquí planteamos dos tipos de formato para los resultados: tarjeta y tabla. Y, en ambos casos, al hacer clic sobre un empleado, se abre un modal con todos los detalles del empleado.
Diseño & Prototipado
Aplicación del look & feel de la marca y prototipo final
Se aplicó el look&feel de la marca, siguiendo su brandbook y se realizó un test heurístico para evaluar la usabilidad. También se mejoraron algunos aspectos en la tipografia y los colores tras hacer un test de accesibilidad.
También se trabajaron las versiones para tablet y mobile y, en ambos casos, se determinó eliminar los resultados en formato tabla. Esto nos ayudaría a prevenir posibles conflictos de maquetación al contar con tantas columnas y tantos atributos por empleado.
Versión tablet
Versión mobile
Test A/B
Componentes
Evolución de la tarjeta
Prototipo
Conclusiones
En este proyecto trabajé de manera autónoma de principio a fin, sin contar la parte de programación. Teniendo en cuenta las distintas fechas de entrega de cada fase, me organicé para poder proponer soluciones que testeaba constantemente para así validar mis decisiones.
Trabajar de esta manera me permitió tener un mayor control del proyecto, trabajar de una manera ágil y lograr presentar mejores resultados a los stakeholders, de forma clara y concisa.
