Nourison Home Website Redesign
Redesigning the digital experience for a leading home furnishings brand by improving navigation, creating a scalable design system, and modernizing the B2B customer journey.
A rebrand, and the site that had to carry it
Nourison was becoming Nourison Home. The rebrand needed a website that matched it — but the existing site was a traditional product catalog, built page by page over fifteen years, and most of the people using it were professionals with a job to do.
My job was to lead the design end to end: understand the business, rebuild the structure around how buyers actually work, define a visual language for the new brand, and leave behind a system the team could keep building on.
Before anything was drawn, we listened
I put the team on two parallel tracks — one inside the business, one on the people who use the site — so the design direction could be argued from evidence rather than taste.
Business research
Why redesign now, what the business needs the site to do, and what the current platform makes impossible.
User research
Five professional audiences, each arriving with a different task and a different tolerance for browsing.
Website audit
Every template screenshotted and sorted — what repeats, what exists once, and what nobody visits.
Looking outward, deliberately
We studied luxury furniture brands, textile houses, interior design publications, premium B2B commerce, and material libraries — not to copy them, but to find where a trade audience is served well and where everyone is failing at the same thing.
Real rooms in daylight, furniture and plants in frame, no white-seamless product shots. The photography had to look like somewhere you live, because that is the only place color enters the design.
The tan and terracotta palette dated the brand and fought the product. Removing color entirely from the interface was the single decision that set the direction for everything else.
Eight principles, agreed upfront
Written before the first wireframe and used as the review criteria for the next twelve months. When a decision was contested, we checked it against this list rather than debating preference.
If a section needs explaining, it is wrong.
Two clicks from home to any product family.
Photography carries the page; the UI recedes.
Depth is the enemy of a working buyer.
Every page built from the same section set.
One hover, one focus, one motion timing.
Reps browse on phones between appointments.
Visible focus, 5:1 contrast, real hit targets.
Re-cutting the whole structure
The old sitemap had absorbed every new business line without ever being redrawn. We card-sorted the catalog with merchandising and sales until the structure matched the way buyers describe what they need.
Hospitality, licensed brands, and trade moved into a persistent utility bar instead of competing in the main nav.
Commercial, contract, and hospitality were three names for one audience. Now one path.
Categories renamed to the question being asked — performance, fiber, upkeep, custom.
New collections slot into existing categories without another nav item.
Three audiences, three routes
Each journey was mapped end to end, then the templates were designed backwards from the last step — the moment someone contacts sales, downloads a spec, or orders a sample.
Retail buyer
Interior designer
Hospitality designer
Grayscale until the structure held
Photography stayed as flat gray blocks through every review, so the argument stayed about hierarchy, CTA placement, and discovery — not about which rug looked best.
Search moved into the header on every page, with collection names, SKUs, and brand terms all matching the same index.
Filters rebuilt around trade criteria — construction, fiber, performance rating, size, and lead time — and made persistent across pagination.
Three rounds per template with sales and marketing in the room, each one narrowing rather than adding.
One system, every page after
Tokens first — color, type, spacing, surfaces, motion — then twenty-four components in five families, each with its states and responsive rules documented. New pages get assembled, not designed from zero.
Hover changes fill only. Focus is a 2px outline at 2px offset. No lift, no shadow, no radius.
BestsellerFixed stack — image, swatches, name, meta, action. Every card in a row shares one ratio.
1px hairlines everywhere, 1.5px on controls, 2px on the one active tab rule.
Designed as working pages
Six templates, built as real responsive HTML rather than static comps. The frames below are the running prototypes — carousels advance, accordions open, video plays, hover and focus behave as specified. Pick a page and scroll inside either frame.
{{ noteTitle }}
{{ noteBody }}
Banner, performance block, style grid, FAQ, closing CTA — every landing page is the same parts in a different order.
Nothing on these pages is bespoke. Each was assembled from the documented component set.
Desktop and mobile were reviewed together in every critique, never retrofitted after sign-off.
Built for people doing a job
Most visitors are not browsing. They are specifying a hotel corridor, sourcing for a client, or checking whether a size exists before a call. The redesign is organised around that.
Collection organisation, product comparison, and downloadable assets in one place — no email round trip to get a spec sheet.
Inspiration pages that lead into real collections, sample ordering on every product, and a dealer locator that is two clicks from anywhere.
A dedicated path with commercial constructions, specification documents, installation guidance, and a direct line to the contract team.
A site that works on a phone in a showroom — full catalog, current availability, and shareable product links.
Three widths, one system
Breakpoints were written into the system rather than improvised per page: 1180 tightens the nav, 1100 collapses two-column splits and drops grids from four to two, 720 turns the nav into a hamburger, 640 goes single column.
Never below 44px, including swatches and stepper controls.
Hamburger with search kept visible, utility links folded in.
Frames keep their ratio at every width; crops never reflow the layout.
Fluid display sizes, fixed body, section padding 96 → 64.
Handoff as a conversation
Engineering joined the weekly critique from the wireframe stage. By the time specifications were written, the team had already argued through the hard parts — so handoff was about integration, not interpretation.
Tokens, measurements, and a migration table naming every retired value and its replacement.
Each component with its variants, states, content rules, and the places it may not be used.
Breakpoint behaviour, hover and focus states, and motion timings — 0.2s buttons, 0.3s cards, 0.4s accordions.
Staging reviewed against the system for visual consistency, responsive behaviour, accessibility, browsers, and CMS implementation.
Designs refined against real content and implementation constraints rather than frozen at handoff.
From product catalog to digital platform
The site launched as a complete responsive experience with a design system, component library, scalable templates, and documentation behind it — and a visual language that finally matches the Nourison Home brand.
Navigation and product discovery rebuilt around how retailers, designers, and trade partners actually search.
The new Nourison Home identity applied consistently across every page, template, and component.
New pages are assembled from documented parts, cutting design and build time for every campaign that follows.
Marketing can expand the site without design support for routine pages.
A cleaner, quieter aesthetic that lets the product photography carry the premium quality of the brand.
Design, development, marketing, and content working from one documented source instead of four opinions.
This was not a visual refresh. It was a change in how the company shows up digitally — and a system that keeps it that way.