Start a project
  • eCommerce
  • UX/UI
  • Responsive

Case study — Collections

A calm store for
considered purchases.

Collections is a furniture eCommerce platform for sofas, chairs, lamps and tables, aimed at homeowners and interior designers who compare carefully before they buy. Editorial typography, a warm neutral palette and generous photography make browsing feel like a catalogue, not a marketplace.

Industry
Furniture eCommerce
Services
UX/UI · Responsive design
Screens
1280 desktop · 430 mobile
The Collections furniture store

01Context

Browsing as a catalogue,
not a grid.

Italiana for headlines, Instrument Sans for body text and a palette drawn from the products (#FDF9F4 to #1F1B15) set the tone before any UI. Every page was then designed at 1280 and 430 together.

Scope: homepage, products listing with filters, product details, newsletter and footer, with the responsive versions treated as first-class screens rather than a reflow.

Collections main page on a laptop

Let the product
set the pace.

02Homepage

Hero, collection,
proof, newsletter.

The homepage moves in one direction: a full-width room photo, the collection switcher (sofa, chair, lamp, table), one editorial feature with a shoppable hotspot, customer quotes and a newsletter block. No carousels competing for attention.

Collections homepage on desktop and mobile

03Product listing

Filters on the left,
products in a calm grid.

Categories, price range, colour and availability filter a three-column grid with hover wishlist and quick add. On mobile the same filters sit behind a single Filter control above a two-column grid.

Collections product listing on desktop and mobile

04Product details

One decision
per screen.

Price, discount, stock, product code and the two actions (Buy now, Add to cart) sit beside the gallery; description, additional information and reviews follow as tabs; similar and popular products close the page.

Collections product details on a phone

Next: the mobile experience

05Mobile

Designed from
the phone up.

Listing and product pages were composed at 430px first: the hero carousel keeps its dots, filters collapse into a sheet, and the product gallery leads with colour swatches under it.

Collections product list on a phone
Collections product details on desktop and mobile

Quiet design.
Clear decisions.

Desktop and responsive versions of the product page, presented together.

Collections product page on two displays

More work

More work.
Same level of thinking.

A broader range of eCommerce, SaaS and web projects. Swipe through, open what is relevant.

View all work

Have a project with
a similar problem?

Share the product, page or funnel you want to improve. You’ll get a straight answer on fit, scope and timing.

Start a projectEmail Dylan

Independent studio — you work directly with Dylan Allynder.