Caso de estudio • Caso de estudio •

Hacemos paginas web para el futuro

Cotizar

Cliente

Neutral Logistics

Proyecto

Desarrollo web + integraciones

Website

nl.com.do

Neutral Logistics

Cliente

Neutral Logistics es una empresa pionera en República Dominicana en ofrecer servicios de transporte de cargas bajo el concepto de consolidador neutral.

Es el representante exclusivo en Republica Dominicana del WorldWide Alliance, la red global mas extensa de agentes Neutrales.

Objetivos

Neutral Logistics llega a nosotros necesitando un website con unas funcionalidades muy interesantes que requirieron de mucho talento y esfuerzo de nuestra parte, entre los requerimientos teníamos:

  1. Catálogo de agentes, que muestre los agentes con los que trabajamos y pudiera ser filtrado por el país de origen y el país de destino, esto para que los clientes tengan más visibilidad de los destinos disponibles.
  2. Calculadora de peso y dimensiones, que sirve como herramienta para que el cliente pueda calcular de manera autónoma el costo aproximado de su carga.
  3. Buscador de itinerarios conectados por un API, este buscador sirve para ver que viajes tienen disponibles a nivel mundial, está conectado directamente con el World Wide Alliance que es el proveedor a quien representa nuestro cliente.
  4. Rastreador de paquetería, cada paquete cuenta con un numero único con el que se debe poder visualizar en que parte del trayecto se encuentra el paquete en tiempo real.
  5. Mapa interactivo que muestre las rutas, que dibuje de manera dinámica en un mapa interactivo las rutas que toman los barcos para hacer sus viajes.
  6. Creación de un website profesional, el diseño del website debe ser uno que represente a la empresa a nivel mundial.

Retos principales

Como se pueden dar cuenta, el trabajo requerido era bastante amplio, teníamos que entender como funciona de manera interna en la empresa cada una de estas funcionalidades para poder crearlas de manera eficaz.

El primer reto fue el de recopilar la información necesaria y llevarla al formato que usaríamos para construir la pagina, el cliente para nuestra suerte tenía todo por escrito, pero igual para poder usarlo en una web app siempre hay que dar formato a todo.

El segundo reto era el de crear las apps individuales (usamos React para alguna de ellas) y hacer pruebas con las API’s de WWA.

El tercer reto y probablemente el que más nos tomo tiempo, fue el mapa interactivo. Para este necesitamos crear cada ruta por coordenadas, eso significa que cada ruta, podía contar con mas de 30 pares de coordenadas (latitud y longitud) y mas de 90 rutas distintas, a veces con multiples destinos por ruta, esto si que suponía un reto interesante.

Estrategia

Iniciamos con la recopilación de la información, al ser tantas las funcionalidades, estuvimos en comunicación constante con el departamento de IT de la empresa, el cual nos dió un excelente feedback a nuestras solicitudes.

Determinamos cuales eran las secciones que íbamos a crear para la web y que informaciones entendíamos que eran relevantes para el cliente final, ya que esta web no solo debe ser una herramienta para clientes actuales, también debe poder atraer a nuevos clientes.

Diseño

Para iniciar con el diseño lo primero que hicimos fue crear el sitemap de como se iba a estructurar la web, enviamos el primer boceto de la home page para aprobación:

Home page

Home page neutral logistics

Red de agentes

Red de agentes

Calculadora de fletes

Calculadora de fletes

Itinerarios de cargas

Mapa de rutas

Mapa de rutas

Para la aprobación final de los diseños, enviamos al cliente un mockup (alta fidelidad) con los diseños montados para simular el uso, clicks y scroll de la pagina, luego de cambiar unos detalles, completamos exitosamente la fase de diseño.

Al código

Para este proyecto decidimos utilizar un editor visual que forma parte de nuestro flujo de trabajo (Divi), pero este solo fue para las partes informacionales del sitio.

Para las secciones interactivas decidimos utilizar React, que es nuestra librería de frontend por excelencia, aunque no la utilizamos para el mapa, ya que este tenía unas dependencias únicas que no se integraban bien con React, asi que lo hicimos con vanilla Javascript.

Por supuesto, las llamadas a las API’s se hacen desde php, ya que estas tienen llaves privadas de usuario que nunca deben ser expuestas al cliente, garantizando la seguridad de las mismas.

Test de calidad:

Como fase final antes de hacer entrega del proyecto, pasamos por un test de usabilidad, tenemos un checklist interno que utilizamos para darle seguimiento a los pequeños detalles que se puedan escapar, asegurando asi que el cliente obtenga una web funcional, responsive, que cargue rápido y que sea visualmente atractiva para el cliente final.

Resultados

Como resultado tenemos una de las webs mas completas a nivel de funcionamiento que hemos desarrollado, una herramienta de suma utilidad para cientos de clientes que ya no tienen que llamar a la empresa para obtener información de donde esta su paquete, como calcular las medidas de sus paquetes o ver que rutas la empresa tiene disponible.

Asi que si quieres crear una herramienta que te destaque de tus competidores, agilice tus procesos y sea la primera cara frente a tus clientes, no dudes en comunicarte con nosotros.

Trabaja con nosotros • Trabaja con nosotros •

Javier Santos

Founder / Developer / Designer

“Nuestra misión es contribuir con el futuro digital de tu empresa”

Comunicate con nosotros