Two buyers, one catalogue
58% of visits came from a phone, and many of them were buying a gift. From our case on Clutch.
[ 01 ]
The buyer who will wear it
Knows her taste and often a collection, and looks for one more piece that goes with what she already wears.
Comes for
The piece on a person, the size and the price.
Stops at
A banner where the pieces should be, and a ring size she has to guess.
Answered by
Sub-categories and filters above the grid, photos on a person, and a size guide next to the sizes.
[ 02 ]
The buyer choosing for someone else
Knows the person and the occasion, not the pieces. Wants a finished choice and to know it will arrive in time.
Comes for
A ready answer, gift wrapping and a delivery date.
Stops at
Hundreds of single pieces to match up alone, and a size they don’t know.
Answered by
Ready-made sets with their pieces shown on the card, gift certificates, and dispatch, delivery and gift wrap answered under the button.
[ 01 ]
Home
Before
A full-screen photo of the new collection. No button, no piece and no price before the first scroll.
What we did, and why
The offer with its terms, free delivery and same-day dispatch, and the first row of new pieces at the fold, then bestsellers, collections and categories, because a first visit needs a reason to stay and a place to start.
What it had to move
Home → catalogue · [100 → 126]
[ 02 ]
Catalog
Before
A banner across the first screen, then one flat grid; on desktop, names and prices began below the fold. 64% left collection pages without going further.
What we did, and why
The title, the count and sub-categories (with stones, with hearts, with a chain) above the grid, sort and filters beside them, and photos on a person, because splitting a long grid into kinds is faster than scrolling it.
[ 03 ]
Product page
Before
One photo in a slider, sizes 15.5 to 18 as plain text with no guide, and the answers about delivery and gift wrap below the fold.
What we did, and why
A photo grid, size chips with a size guide, the cart and “Hint to a loved one” side by side, and dispatch, delivery, gift wrap and payment answered on the first screen, because a ring bought as a gift fails on the size or the date.
What it had to move
Add to cart · [100 → 119]
[ 04 ]
Sets
Before
A banner, then large photos with a name and a price. What a set held was one click deeper.
What we did, and why
One line that says the choosing is done, and each card showing its pieces as thumbnails under the photo, because a set is judged by what is in it.
What it had to move
Sets → set page · [100 → 112]
[ 05 ]
Set page
Before
The pieces as two lines of names with checkboxes, one price for the whole set, and characteristics for the ring only.
What we did, and why
Each piece on its own row with a photo, its own price and size, and its characteristics one row at a time; a sold-out piece is unticked and asks to be told when it’s back.
