Nugent Filters - Website Redesign
MOOD Technology Consultancy | UX Designer


The Problem

Nugent Filters' existing site was outdated and lacked the ability for customers to browse and purchase their product inventory online. The ask was a full redesign that modernized the visual experience while introducing e-commerce functionality to support a large product catalog.


My Role

Freelance UX Designer, contracted through MOOD Technology Consultancy. I was responsible for the discovery phase of the project — conducting competitive research, establishing visual direction through a moodboard, and producing lo-fi wireframes to define the site structure before handoff to another designer for high-fidelity execution.


Moodboard & Competitive Research

Visual moodboard for Nugent Filters website redesign showing typography, color palette, and reference imagery for an industrial filtration supplier
Competitive research reference showing e-commerce checkout flows from consumer brands including Allbirds, Gymshark, and others, used to inform best practices for the Nugent Filters purchase experience

Before establishing a visual direction, I audited both direct competitors and broader e-commerce platforms to understand industry conventions and identify opportunities to differentiate. I also studied checkout flows from leading consumer brands — including Allbirds, Kylie Cosmetics, Gymshark, and Worker — to inform best practices for the purchase experience. The research informed a visual system built around two typographic styles — Open Sans for body and Oswald for headings — paired with a bold navy and orange palette that balances industrial authority with approachability. Button styles and color tokens were defined to give the next designer a clear foundation to build from.


Wireframes

With the visual direction established, I mapped out the key page types needed to support both the marketing and e-commerce goals of the site. The structure prioritized product discoverability — with a persistent catalog sidebar, robust filtering on product pages, and application-based browsing to help industrial buyers find the right solution quickly. Five core page types were defined before handoff:

  • Homepage — hero + featured product grid

  • About — company story with image placeholders

  • Product Family — application-based browsing across 7 industries

  • Product Details — filterable specs table with pricing

  • Support — self-service order management + FAQ accordion

Lo-fi wireframe for Nugent Filters homepage showing hero section and featured product grid

Homepage

Lo-fi wireframe for Nugent Filters about page with company story and image placeholders

About Page

Lo-fi wireframe for Nugent Filters product family page with application-based browsing across seven industries

Product Family

Lo-fi wireframe for Nugent Filters product details page with filterable specs table and pricing

Product Details

Lo-fi wireframe for Nugent Filters support page with order management and FAQ accordion

Support Page


Outcome

Delivered the discovery phase — including competitive research, a moodboard, and lo-fi wireframes across five core page types — to establish the design foundation for the project. The site subsequently went to production.