Commerce design studies
Some of these designs began as pitches to clients who picked a different direction. We liked them too much to leave in a folder, so we finished them under new names, as four shops and a landing page you can click through, with pretend payments.
Designs we didn’t want to leave in a folder
Some of these designs started life as pitches. The clients picked a different direction, which happens, but we kept coming back to the ideas. So we finished them properly, as working sites, and changed the brand names.
The set covers a fair spread of things to sell: an online movement studio, DJ equipment, an event agency that sells a service instead of products, a morning milk round and table lamps. We finished every one of them on a real platform, with payment as the only part left pretend.
Borrow widely, keep very little
Each design starts with a pile of references, real sites that handle a similar problem well. For each one we write down what we’re taking and what we’re leaving behind, and the second list usually does more of the work. Sometimes the thing we drop is our own first idea.
The list of things we don’t do
Every one of these designs came with a short list of banned tricks. No invented reviews or star ratings, no “only two left”, no invented urgency, no made-up certificates. They’re easy to add, and they teach customers not to trust the page.
The same restraint runs through the visuals. Each brand gets one colour for actions and keeps it there. Movement confirms that something happened and otherwise stays out of the way. Below, each site gets its own section, with what it was for and how the design answers it.
wearecrossing
An online movement studio that brings strength, Pilates, mobility and recovery into one practice, with a lesson library, memberships and one-to-one time with a coach.
Crossing paths became the structure of the whole brand, down to the bundles of lines that meet in an X on the home page. The photographs carry most of the colour, and the interface stays warm and quiet around them.
Visitors filter the lessons, compare monthly and annual membership and book a consultation. The booking calendar keeps the coach, date and timezone on screen at every step, with a review before payment. Purchasing is switched off in the demo, and a placeholder stands in for the payment step.
Basssuply
A DJ equipment shop for first-time selectors, home producers and working club DJs. Its job is to help someone find the right kit, understand what it does and build a setup around it.
It borrows the feel of an independent record shop and adds catalogue-level detail to each product. An all-dark shop looked great in the references, but black hardware disappears on black, so browsing stays light and the dark is saved for one editorial band. Orange appears on the main purchase button and nowhere else.
Category, brand and budget filters live in the page address, so a shortlist of controllers can be bookmarked or sent to a friend. The logo is one S-shaped line repeated three times, like parallel audio signals or the grooves of a record. Basket and checkout are WooCommerce’s own, and an order is recorded as a test that takes no money.
to-to
A landing page for an event agency, a business that sells a service and has no shop at all. We kept it in the set because a brand has to work before anyone reaches a basket.
The headline says the agency makes rooms full of people, and next to it a grid of seats fills up under the caption “A room, filling.” The seats light in the same order on every visit, and visitors who turn animations off see the room already full. There are no shadows or gradients anywhere, so the hierarchy comes from colour bands, thin rules and type size.
The headlines are set tight, but we stopped just before a comma could touch the capitals on the line below. The discovery-call scheduler shows real dates and books nothing. The whole page, fonts included, weighs about 130 KB.
Lark & Pail
An organic milk round: milk and breakfast staples from nearby farms, left on the doorstep before six on Monday, Wednesday and Friday.
Its customers think in mornings, as in “what arrives on Wednesday?”, so the basket is called My week and is grouped by delivery day. Tapping a bottle asks how many for each morning, or just once. Changes close at 9 pm. That’s a real rule of the round, so it’s stated plainly, without any urgency dressed around it.
Pure white felt like a supermarket shelf, so the pages are cream with navy ink. Milk is sorted by cap colour, always next to a name like “Blue cap · Whole”, so a colour-blind customer can still find their milk. We placed a whole test order using only the keyboard, and the confirmation says honestly that no money was taken and no milk is on its way.
Aure
A shop for table lamps, sold in three families. People buy a lamp for the light it gives, so the product page has to show that light, not only the object.
On a product page you can switch the photographed lamp on, dim it, and see it in day or evening surroundings. What you’re buying and what you’re only previewing sit in separate groups of controls, so playing with the light never changes the order.
We first rendered the lamps in 3D, looked at the result honestly, and switched to photographs. The basket stays free of upsells and finance offers. In this demo the checkout is simulated.