VEI Contracting is a remediation and dewatering company that provides a wide range of environmental engineering services across Canada and internationally. W Design Co., VEI's digital partner, created their first website many years ago while the company was rapidly growing. Over time, the website accumulated a large number of new service and content pages, which slowed the site and resulted in a poorer experience for both visitors and content editors.

In 2025, VEI began a gradual rebrand to better reflect its expanded range of services. After consulting with W Design Co., the team decided that a full website overhaul would support the rebrand, strengthen VEI's industry presence, and eliminate existing UX issues.

VEI’s old website was built with WordPress and, without proper long-term support and information architecture planning, accumulated several issues over time:

Navigation made it difficult to find specific content

Adding new content was complex and time-consuming due to the limitations of the visual page builder resulting in poor user experience

The large number of pages slowed the website down, creating a poor experience for both visitors and content editors

Conflicts between plugins required constant fixes and maintenance

> Usability Testing

In order to implement meaningful changes into new VEI website we started with usability testing to see what current experience was lacking. Running some moderated testing with members of VEI team and non-VEI users led to these findings:

> Card sorting

Since VEI provides highly technical services, we enlisted the help of their project managers to establish a new sitemap. We asked them to audit the existing pages, add new ones, and organize them based on topic relevance. After three rounds of updates, we received a final version that made sense to their team.

I then refined their content map into a sitemap structured around a distinction between unique pages and service pages with multiple levels of dependencies. This structure could be easily understood and used throughout the design and development phases.

The biggest challenge of this project, which significantly impacted the timeline, was stakeholder management. A website revamp of this scale involved project managers, VEI's leadership team, W Design's creative team, and developers. I had to balance business objectives, creative execution, and technical feasibility while keeping the user experience cohesive.

This involved coordinating schedules, managing visual iterations, and working closely with developers on technical implementation and handoff.

Once I understood the key problems VEI website visitors were facing, I defined a clear plan of action.

Goals

Proposed Solution

Reduce the number of clicks required to find specific pages and resources

Clear, scalable navigation and site-wide search

Build a scalable, future-proof website

Template-based design system

Improve the content management experience

Headless CMS with fast performance and a familiar editing experience

Improve performance, accessibility, and SEO while reducing maintenance overhead

Custom-coded Next.js website with minimal bloat

> Page templates

To make execution more manageable, I divided pages into two categories based on their content type: unique and templated. Some pages required a tailored approach, while most service pages shared enough similarities to be built from interchangeable components.

This approach significantly reduced the time required for both design and development while improving the experience for content editors by providing them with a set of pre-configured building blocks.

> Navigation

To address complex navigation, I implemented a mega menu to provide clearer organization and support future growth. I also introduced site-wide search and page tagging, helping users find specific content faster with fewer clicks.

> Dynamic content

A significant portion of VEI’s traffic comes from content marketing, including newsletters, blogs, and case studies, making the experience for both readers and editors a key priority.

Blog pages were redesigned with a templated structure featuring quick navigation, social sharing, and a “back to top” feature for longer articles.

For content management, we implemented Payload CMS, giving editors flexible building blocks and greater control over their pages. Its modular architecture also makes it easy to add functionality with minimal development effort. Combined with Next.js performance, this reduced the time required to add or edit content by nearly half.

> Development Hand-off

To support a smooth hand-off, I prepared a lightweight style guide, organized reusable components and templates, and adapted designs for mobile devices.

After implementation, I conducted multiple rounds of QA to ensure consistency between Figma designs and live website.

After launching the redesigned website, VEI saw a 42 percent increase in overall performance along with faster loading times and improved SEO scores.

Within the first week after launch, VEI’s team highlighted the clarity of the new navigation, the convenience of the search feature, and how much easier it was to add new content. The improved content management experience began saving their team time immediately.

They even used the new website during an in-person meeting with a large prospective client to showcase their services.