E-commerce / Product Experience 2026
SLATE
A storefront for custom posters and stickers, where the product is configured before it is bought.
- Year
- 2026
- Status
- Built
- Platform
- Web
- Scope
- Storefront, Customisation studio, Preview and pricing engines
Overview
SLATE sells custom posters and stickers. Unlike a fixed-catalogue store, the product only fully exists once the customer has configured it, which makes the configuration step the centre of the whole experience.
Challenge
Customisation and buying pull in opposite directions. Give someone too many options and the page becomes work; give them too few and the product stops being custom. The customer also needs to see what they are getting before paying for something that will be printed.
Direction
The configuration step was treated as the product page rather than an extra stage bolted on before checkout. Options are presented in the order a customer actually decides them, the preview and the price update as choices change, and the configured item goes straight to a WhatsApp order. There is deliberately no cart, account or online payment: the owner handles payment, production and delivery directly.
What was built
- Customisation studio driven by product data: each product declares its fields, and the form renders only what it declares
- Live preview engine that maps selections to CSS custom properties, with renderers for framed prints, cut-vinyl stickers and generated album artwork
- Pricing engine: a base price plus option deltas, calculated in one place and shown as the customer designs
- WhatsApp ordering with a structured order message and reference, plus an optional rendered preview when an upload endpoint is configured
- Shop with four collections, product pages and a size guide
- Light and dark themes, keyboard-operable option groups and reduced-motion support
Technology
- React 19
- TypeScript
- Vite
- React Router
- Tailwind CSS v4
Outcome
A storefront where the custom element is the experience rather than an obstacle in front of it. Adding a product is a data entry, and re-pricing is an edit to option deltas, not to components.
Screens
Technical notes
Not built, by design
No backend, accounts, cart, checkout or payment. The site's job is to let a customer discover, customise, preview and send an order — everything after that happens in conversation.
Catalogue
The catalogue and prices in the build are placeholders held in data, ready to be replaced without touching the interface.