Nugent Filters - Website Redesign
MOOD Technology Consultancy | UX Designer

The Short Version

An industrial filtration supplier needed a full website redesign with e-commerce. I led discovery — competitive research, visual direction, and lo-fi wireframes across five page types. The site went to production.

The Problem & My Role

Nugent Filters had a large industrial product catalog and no way for customers to browse or buy online. The ask was a full redesign — modernized visual experience plus e-commerce functionality built to support thousands of SKUs across multiple product families.

Contracted through MOOD Technology Consultancy, I led the discovery phase — competitive research, visual direction via moodboard, and lo-fi wireframes across five core page types — before handing off to another designer for high-fidelity execution.

Moodboard & Competitive Research

The core design challenge was making an industrial product catalog feel as easy to navigate as a consumer storefront. To get there, I looked in two directions: direct competitors to understand category conventions, and leading B2C e-commerce brands — including Allbirds, Gymshark, and Kylie Cosmetics — to identify checkout and browsing patterns worth bringing into a B2B context.

That cross-domain research informed a visual system built around two typographic styles — Open Sans for body, Oswald for headings — paired with a navy and orange palette that balances industrial authority with approachability. Button styles and color tokens were defined explicitly to give the next designer a complete foundation to build from without guessing.

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

Outcome

The site went to production. My engagement ended at handoff — the high-fidelity execution and development were handled by the broader MOOD team. The foundation I delivered: a competitive research synthesis, a complete visual system, and five wireframed page types with clear IA rationale that the next designer could build from directly.

Reflections

The most interesting design problem on this project wasn't visual — it was information architecture. How do you help an industrial buyer find the right filter out of thousands of options, quickly, without knowing exactly what they're looking for? The application-based browsing pattern — organizing products by industry first, then by spec — was the answer, and it came directly from studying how B2C platforms handle large catalog navigation.

If I were taking this project further, I'd want to validate that IA pattern with real Nugent Filters customers before moving to high fidelity. The wireframes made a strong assumption about how industrial buyers actually think about their purchasing decisions — and that's exactly the kind of assumption worth testing.

Back to My Work