APM Terminals, part of A.P.Moller-Maersk, operates one of the world’s most comprehensive shipping terminal networks, with over 22,000 employees and a network of 76 ports globally. With more than a century of industry experience, APM Terminals helps both shipping line and landside customers grow their business and achieve better supply chain efficiency, flexibility and dependability.

Designing to solve customer problems

When it came to designing the new APM Terminals website, the Codehouse design team wanted to make sure that that they were solving real-world problems, and reducing the friction that customers faced on their online journeys to achieve their goals - whether this be to check the nearest port facilities, or to check the progress of their shipment through the terminal.

Understanding the APM Terminals business in its entirety was an essential step of determining how Codehouse could provide a sophisticated online solution to customers – APM Terminals is a truly global company, operating a complex business, serving thousands of customers every day.

Codehouse held a number of discovery workshops in order to identify and define a number of customer personas, user journeys, business objectives, and customer goals. This allowed the team to firmly establish a unified understanding of the unique problems both the business and their customers were facing.

This up-front understanding ensured that that Codehouse designed an experience that not only delighted customers, but also – and more importantly – solved their problems.

Bringing confidence to the brand

The Codehouse design team focused on stripping back an over-reliance on brand colours and visual brand language that was in use on the old site, making very deliberate choices around detailing, bringing a new level of confidence to the brand.

By pulling back on an over reliance of brand colours and elements, and simplifying their use across the new website, the team could ensure that when brand elements are used, they are both effective and meaningful, and that web content – specifically imagery – is accentuated as part of the overall look and feel.

By bringing real people to the fore within imagery, and giving a human face to the company, users are immediately left with a distinct impression of the APM Terminals brand that is transparent, trusted, and instantly recognisable.

APM Terminals website - desktop view 
The APM Terminals website builds trust by being human

Making clever use of animation

For the new APM Terminals website, the UX and UI solutions were holistically considered as an experience – adding animations to provide context and delight, but also to support customers in navigating the website with ease, including on mobile devices.

APM Terminals’ all-important Track & Trace function and interface underwent a complete re-think in design from its previous iteration, with a heavy focus on the context and situation of the user when interacting with this feature of the site.

The new interface is designed to cater to both occasional visitors and power users. Codehouse employed a technique to visually convert package / shipping ID entries into tags when entered on the site, providing customers with a clear distinction between different entries, whilst at the same time providing them with a touch-friendly visual format when editing. Power users of the Track and Trace function have the option to paste a large number of package / shipping IDs and have them converted in the same way, without losing any benefits of the clever user interaction.

APM Terminals - vessel schedule 
APM Terminals vessel schedule

The Vessel Schedule listing was a challenge in design, as the component would be handling a lot of content – in the old website, this led to a visually dense interface that was difficult to digest.

Redesigning from the ground up, the Codehouse design team used animated icons with colour coded keys to indicate the status, type and distance travelled for any given vessel. By doing this, the customer is presented with a significant amount of information that is visually interesting. This then also enabled the team to section off each vessel with a clear and easily scan-able table.

In today’s digital-first world, it was vital that we built a website that could deliver the same high level of service and customer experience that our employees around the world deliver to customers on a daily basis. As a truly international business, developing our new website was an extremely challenging project, with multiple stakeholders involved, but thanks to a fantastic internal team at APM Terminals and a great partnership with Codehouse, we got it over the line. The website looks stunning and the response from customers has made all the hard work worthwhile.
Alex Race, senior customer experience manager – APM Terminals

Learn more about Sitecore

The APM Terminals website is built on Sitecore.

We’ve been working with Sitecore since its beginnings. We’ve designed and built websites on Sitecore across a variety of industries including financial services, retail, leisure and travel, education, health and pharmaceutical, food and drink, membership organisations, IT and technology, and companies selling B2B, using personalisation to drive improved customer experiences and increases in conversions and revenue.

And we don’t just build you a Sitecore website and run away, we’ll hold your hand and support you through the lifetime of your website, helping you to continually optimise customer journeys for better results, and getting under the skin of Sitecore’s powerful marketing features.

If your organisation is thinking about a new website and considering Sitecore as your digital experience platform, then we can help.

To learn more about Sitecore for your website, just get in touch.