A new online store for a handmade jewellery brand: minimal, editorial and product-first, with a simple way to order personalised pieces.
UM studio makes handmade rings, earrings, necklaces and bracelets, including personalised pieces with fingerprints or other personal prints. The store had to feel as refined as the jewellery and still make buying easy.
A jeweller needed a new online store, designed from scratch, in Lithuanian and English.
UX/UI designer for the whole project: research, sitemap, wireframes, UI for desktop and mobile, a prototype test and handoff.
I mapped what could stop a shopper at each step of buying, and designed one clear answer for every step.
Three kinds of shoppers, one path. For each step I wrote down what the shopper is thinking, what could stop them and how the design answers it.
Something minimal for every day.
I don't know her size.
Something only ours.
Jewellery is bought with the eyes, but it also needs precise information. The store had to stay minimal and editorial, while giving shoppers every detail they need to order with confidence.
“I want people to feel the same calm online as in my studio.”
The jeweller, in our first talk
Products must look as good online as in real life.
Material, size and weight must be easy to find.
Personalised jewellery needs a clear, simple process.
Payment and delivery must feel safe and familiar.
Before drawing anything, I looked at how good stores solve the same problems, and turned what I learned into four principles for this one.
Jewellery and fashion e-shops, and how they balance mood and product information.
The best stores show the piece worn, and let the photo do the selling.
arrow_forwardLet photos speakPublished e-commerce research from Baymard Institute and NN/g.
Shoppers want exact facts, like size, metal and weight, but only at the moment of choosing.
arrow_forwardDetails on demandWhat sells, and what customers ask in the salons.
A personalised order sounds complicated until it is shown as a few steps.
arrow_forwardThree clear stepsLocal delivery and payment methods that Lithuanian shoppers expect.
People finish a purchase when delivery and payment look like what they already use.
arrow_forwardA familiar checkoutTen steps in four phases: structure first, then the look.
OutputFour design principles.
OutputEvery flow, from homepage to payment.
OutputThe store on desktop and mobile.
OutputTested, approved and ready to build.
One decision for each step of the journey. Each starts from the risk it removes and names the UX principle behind it.
Full-width photos with large titles, best sellers and categories in simple carousels, reviews, and a strong brand block at the end.
Products in a four-column grid with name and price on a taupe bar under the photo. Hovering swaps the photo for the piece on a hand. Filter, sort and category links sit at the top.
The product page keeps photos big. Dimensions, materials, weight and product code open in a side drawer when needed.
“How it works” explains the process: choose the jewellery, send your print by post or leave it at a salon, and receive your piece.
Contact, delivery (ship or pickup), local delivery companies and payment methods on one page, with the order summary always visible.
Four people tried a clickable prototype: two who buy jewellery for themselves, one buying a gift and one choosing a personalised piece. What they stumbled on was fixed before handoff.
Size 18 wasn't available.
Unavailable sizes are greyed out, not hidden.
Didn't notice my size was selected.
The selected size turns solid black.
Wrong size, had to go back.
Size, colour and quantity are edited in the bag.
Is it made to order?
“In stock: 10” under the options.
How does the fingerprint get to you?
“How it works” became three numbered steps.
Delivery price only at the end.
A price next to every delivery option.
A black-and-white base with warm, stone-coloured product photos lets the jewellery be the only colour on the page. Large headings and generous white space bring the editorial feel.
Montserrat, a clean geometric sans, carries prices, forms, labels and buttons. Playfair Display is kept for product names and headlines in the store.
Photo, then name and price, then one black action.
Four product columns on desktop, two on a phone.
Default, hover, selected and unavailable states for cards, sizes and delivery options.
Labelled icon buttons, visible focus and large tap targets.
DefaultHover
Every page of the store, on desktop and on a phone. Hover a page to scroll through it, click to open it full size.
Browse the collection, open a product, fill the bag. The real store opens in a new tab.
Visit the live store open_in_new
