Westeria.

Westeria's product assortment is divided into four main categories. We took these categories and made them the main focal point of the homepage with an impressive visual hero element.

On entry, a user will be introduced to a full-screen 3D visual that explains all four categories. As a result, complex operations are made easy to understand, and experienced users will have a fast-track route to the right products for them. Novice users will be introduced to the site's terminology and be visually guided through the next steps.

Westeria's marketing team can create highlights within the animation to further explain features that sets Westeria apart from its competitors.

Westeria is an innovative company, so it was crucial we'd create a machine overview page that would allow them to scale as they grow.

The page structure is based on the Atomic Design Principles system, where we start small to create reusable content blocks, also known as components. This method is perfect for designs that need to scale.

The 'Machine Detail' page is entirely modular. Westeria can edit, re-order, remove, or add various content blocks with different functionality. Westeria's marketing and sales teams now frequently come together to structure and compose new detail pages, something they could not do before.

At the beginning of this project, we specified multiple user flows, with one being crucial; the manager (with decision power).

We first explored their feelings, needs, pain points, and moments of delight, as we knew that the website was only one part of their journey. Westeria's goal for the manager is to sign up for an in-person meeting in their demo facility, allowing them to introduce the complete range of possibilities.

The manager is usually higher up in the chain of command and possesses purchasing power, and typically buys multiple (connected) machines to improve their material handling. In addition, they also love systems that connect well to their existing setup, as it's their responsibility to ensure the recycling facility runs smoothly and effectively. For Westeria, these are the type of customers they'd love to show the demo center. Therefore, creating an informational flow explaining all the primary benefits of Westeria's products was necessary to motivate them to sign up for a demo appointment.

Each page and module is flexible and editable, which was an essential efficiency requirement, allowing Westeria to set up new pages and flows they can test, iterate and optimize without involving Naam.

As a result, we had to create a foolproof Design System that would give autonomy to Westeria's marketing team. At WDS's (Westeria Design System) core, you'll find sections consisting of molecules (such as Cards), which are, in turn, composed of atoms (such as Icons). Put together, these sections become a complete Page Template.

Westeria can now consistently push updates and naturally grow its main digital channel (the website) with the new Westeria Design System.

Westeria's new website contains numerous overview, detail, and macro pages, all consisting of various sections. To help create a clear visual hierarchy, we introduced a collection of dark components and pages to contrast the light product pages.

Conceptually, darker pages are used throughout the design to create contrast between sections. But, more specifically, pages consisting of only dark sections are used for landing pages. For example, the Materials pages — a unique collection of landing pages that present the various materials Westeria's machines can handle. The marketing team uses these landing pages to improve natural search results (SEO).

Westeria's main digital touch point, the website, has been online for a few months, and new pages are being created by the team frequently. Although I'm not allowed to comment on specific numbers or details, it's safe to say the new website has increased requests and, more importantly, demo facility visits, which was the ultimate goal for Westeria.

Westeria and Naam still work closely on adding new iterations and elements. I'm excited to see the WDS (Westeria Design System) come to life, and I can't wait to see what happens next.