01 / Bright direction
Citrus.
Warm orange, open space and an oversized number give this fictional label a clear place in the range.
An original product-brand exploration
A LITTLE HEAT.
A LOT OF
CHARACTER.
Three imaginary bottles. One clear way to explore them. A working design study with original vector artwork.
Explore the collectionIllustrations and copy are fictional design material. These are not products for sale.
Good structure gives every detail a place.
01 / Explore the example
FIND YOUR
DIRECTION.
Try the collection filter. The cards describe visual directions for an imaginary product range, with no ingredient, heat-level or availability claim.
Showing 3 fictional concepts.
02 / Earthy direction
Smoke.
Deep green and a consistent label system create a different mood while retaining the same structure.
03 / Bold direction
Pepper.
A strong red panel provides contrast. The product name stays readable instead of becoming part of a photograph.
With JavaScript disabled, all three cards remain available. Nothing is stored, submitted or purchased.
02 / Why it is built this way
DISTINCT ON THE
SHELF. CLEAR
ON THE PAGE.
The repeated bottle shape lets colour and typography carry the differences. The artwork is original geometry, so the demonstration needs no borrowed product photography or brand marks.
The hero introduces the range; the collection lets visitors compare it; the questions explain the limits. On a phone, the composition becomes a single readable column and the filter buttons wrap into a keyboard-accessible group.
In a real project, product facts, permitted assets, accessibility checks and the actual shop destination would be agreed before launch. This concept implements no checkout, payments or inquiry form.
03 / A few straight answers
CURIOUS?
GOOD.
Is this a real business or client?
No. Sauce Studio / No. 01 is an original fictional concept by Quattro Tech. The names, bottles and visual directions are demonstration material, not a customer relationship.
Can I buy these products?
No. There is no store, checkout or order collection. The filter is a working interface demonstration only.
Which parts are actually implemented?
Responsive layout, semantic headings, anchor navigation, keyboard-visible focus, a progressively enhanced collection filter with live result announcements, and native expandable answers. No analytics or browser storage is used.
Where can I discuss a real website?
Read the Quattro website-build service and use its Start a brief action. A real project's scope, price and features are agreed separately.