UX Designer

London Gateway

MC Kinney Moller.jpg

London Gateway

Website redesign and tool

DP World London Gateway is the UK's most integrated logistics hub; a state-of-the-art, globally connected deep-sea port and rail terminal, on the same site as an expansive land bank for the flexible and fast development of logistics facilities and warehouses.

London Gateway’s website was originally designed to attract new customers, to show the benefits of a London based port that could handle extremely large container ships and get products to market more quickly than other rival ports in the North.

As the port gathered more customers and started building their giant logistics park it became clear that the website also had to cater to existing customers.

I identified quick wins on the site such as making the opening hours clearer and understandable by making a distinction between landslide and shipside hours. I also suggested that the ship and rail schedules be made available to all visitors to the website as previously they were hidden behind a login wall.

Shipside, London Gateway is almost fully automated allowing it to be open 24 hours, 7 days a week.  The landslide however involved the entry of vehicles, inspections of cargo, and customer service.

While opening hours seem simple we had to visit London Gateway to truly understand the scale and the terms involved to really refine their website for their customers.

While at the port we spent time and interviewed the customer service team, the port’s manager, a ship captain (whose ship we went on), and various other staff members available to us on the day. After our visit we also interviewed freight forwarders and hauliers.

As our understanding of London Gateway grew, we realised another way we could improve the experience for both the customers and the staff was to develop a way to track containers as they travelled through the port. Freight forwarders, hauliers, and drivers would benefit from the visibility of their containers also saving time if containers were delayed or held in inspections. And the customer service team would benefit from the decrease in calls/emails to locate a group of containers.

Mapping out the journey of the container through the port and understanding the terms used at the port became our mission to start to design a solution for customers and staff.

Quay - where the ship arrives and docks ready to unload.

Waterside transfer zone - cranes unload the containers and put them on dock ready to be sorted.

Yard - automated cranes pick up and sort containers based on when they will be picked up.

Inspection - containers can be selected by customs for inspection. Containers containing produce and other perishables are taken to other areas for checking and can be held if needed. Fumigation can happen here too if incects etc need to be taken care of.

Refer - refridgerated containers for perishables such as meat, veg, fruit.

VBS - vehicle booking system. Every truck that enters London Gateway must register and book a slot to enter the port, they can only wait for a short time and everything is automated. Their truck is identified by cameras as they enter, once they park in a slot the automated cranes pull their container. VBS controls what slot is assigned to the truck and moves around the containers to have the fastest turn around times.

Restitution - return of empty containers through the port back to the shipping line

Hauliers - trucking companies hired to pick up and drop off containers

Freight Forwarders - company hired by a brand/store to organise shipment of goods through containers

Shipping Line - ships containers world wide for multiple freight forwarders

While we did spend a lot of time designing this feature the client decided to use our design/discovery work but build it in house. This is currently live and being used by London Gateway.

Other areas we affected were the main navigation of the website, opening hours, and ship/rail schedules.