Skip to case study
Product & design team

Ten thousand books in stock. The reader came for one.

An online bookstore in Ukraine keeps more than ten thousand titles on its shelves. We rebuilt the store around one job: get a reader to the right book, in the right format, and through checkout without leaving the page they are on.
What the redesign answers to

+102%

Average order value

+128%

Mobile Conversion

+104%

Catalog-to-Purchase Conversion
Service
UX/UI design & CRO
VIEW SERVICE
The home page after the redesign: search across the whole header, the catalogue one click away, then this week’s arrivals and the category shelf.
Client
Under NDA
Industry
E-commerce · books
Market
Ukraine
The client
An online bookstore that ships across Ukraine
Fiction, children’s, business and study books from its own warehouse, plus pre-orders, e-books and audiobooks. The store’s name stays with the client under NDA.
10,000+
titles in stock
18
sections in the catalogue
3
formats of one book
5
ways to receive an order
What we were asked for
A redesign of the whole store, from the home page to the reader’s account.
Screens
Home, catalogue, category, product page, cart, checkout, order confirmation, account, wish lists, authors, publishers, promotions, news, blog, contacts, about, sign-in and 404.
Platforms
Desktop at 1920 and 1440, phone at 375. Every page has its own phone layout, not a shrunk copy.
New arrivals, pre-orders and promotions change every week. The layout had to take that without being redrawn each season.
The problem

Ten thousand titles need more than one way in.

What the store had to solve · online bookstore, under NDA
[ 01 ]
More than ten thousand titles in eighteen sections. A reader who knows the book has to reach it in one step; one who doesn’t needs a shelf that narrows.
[ 02 ]
One book comes as paper, e-book and audiobook, each at its own price. The reader has to see all three before choosing, not after.
[ 03 ]
New arrivals, pre-orders and discounts change every week, so the first screen has to work as a shop window that updates itself.
The catalogue opens from the header on any page: eighteen sections on the left, their shelves beside them. Any genre is two clicks from wherever the reader is.
Who buys
Two readers, one catalogue
Both land on the same home page. What they need from it is different.
[ 01 ]
Knows the title
The reader who knows the book
Comes with a title or an author in mind, often from a review or a friend, and wants to buy before the moment passes.
Comes for
The book, in stock, in the format they want, at a price they can see.
Stops at
A search that returns nothing, a format hidden on another page, a checkout that wants an account first.
Answered by
Search across the header with covers and prices in the results, paper, e-book and audiobook on one page, and quick purchase in one short form.
[ 02 ]
Browsing
The reader looking for the next book
Knows the genre or the mood, not the title. Looks at what is new, what is popular and what is coming on pre-order.
Comes for
A short list worth opening: new arrivals, bestsellers, pre-orders and deals.
Stops at
A shelf of thousands with no way to narrow it, and a page that doesn’t say whether the book is any good.
Answered by
A category tree with counts, filters that stay visible as chips, ratings on every card, and a tab to read an excerpt before buying.
The bet

Every book is one step from search and one screen from paying.

[ 01 ]
Search and the catalogue sit in the header of every page, and an empty search still offers a way on.
[ 02 ]
One page per book, not per format: paper, e-book and audiobook switch in place, each with its own price.
[ 03 ]
Buying never takes the reader off the page: the cart opens over it, and quick purchase needs one short form.
Three rules, five stages. Every change below is one of them applied.
Stage by stage
What the reader needs at each step, and what we put there
One block per stage. Each carries the question it answers, what shipped, and the number we watch to know it works.
[ 01 ]
Home & search
The question it answers
Where is the book I came for — or, if I don’t know yet, what should I read next?
What we did, and why
A search field across the whole header and a Categories button beside it that opens the full catalogue, then the week’s banners, bestsellers, new arrivals and pre-orders, because a reader either types or browses, and both start here.
[ 02 ]
Catalogue
The question it answers
How do I get from thousands of titles to a shelf I can actually read through?
What we did, and why
The category tree on the left with a count beside every genre, each active filter as a chip above the grid with one ‘Clear all’, and sorting by rating, because in a catalogue this size the filters are the navigation.
[ 03 ]
Product page
The question it answers
Which format, at what price, and is it any good?
What we did, and why
Paper, e-book and audiobook as three switches with their prices, rating and stock under the title, delivery, payment and returns under the button, and tabs for reviews and an excerpt, because this is where the reader decides.
[ 04 ]
Cart & checkout
The question it answers
What will it cost in total, and how does it get to me?
What we did, and why
A cart that opens over the page, then one checkout in numbered blocks — order, delivery, payment, recipient — with Nova Poshta and Ukrposhta, a branch picker on a map, and every discount on its own line in the summary on the right.
[ 05 ]
Account & wish lists
The question it answers
Where are my orders, and where did I put that book for later?
What we did, and why
Order history, addresses and recipients in the account, and wish lists the reader names, fills and moves books between, because a bookstore lives on the second order and the tenth.
Stages 03 and 04 carry the order. Both are below, closer up.
FOR ONLINE STORES · THE 90-DAY OFFER

We make your online store convert 80% better in 90 days, without a bigger ad budget.

When ads stop working and a bigger budget no longer brings more sales, we look at how people behave in your store, read the analytics, talk to your buyers, and rebuild the offer and the interface so that purchases repeat and the average order grows by 20%.
Your name*
Email*
Free audit
A result forecast for your niche
First result within 14 days

5.0

5.0 on Clutch · 15 reviews
All fifteen are five-star
C
D
T
P
ClipSwift · DEOZEN · Tandem · PickUpShoes
Clients we can name
Clutch Special Kudos
2024 · 2025 · 2026
Stage 03 · Product page
One book, three formats, and every answer on one screen
Paper or audiobook, how much, is it in stock, when will it arrive, can I read a page first — every question a reader has at the moment of deciding sits beside the button.
The page
The product page on desktop: cover and pages on the left, formats, price and both buttons on the right, delivery terms under them, and the tabs below.
The decision block, closer
1
2
3
Both readers
[ 1 ]
Three formats, three prices
Paper, e-book and audiobook sit side by side as switches, each with its price, so the choice is made here instead of across three pages.
Knows the title
[ 2 ]
Two ways to buy
‘Add to cart’ for a basket of books, ‘Quick purchase’ for the one they came for: a short form instead of the cart and the full checkout.
Browsing
[ 3 ]
Answers under the button
Delivery options, payment methods and the 14-day return are stated right under the price, where the reader is already looking.
Stage 04 · Cart and checkout
A cart over the page, and a checkout in four numbered blocks
How much in total, which branch, how to pay, who picks it up — the checkout asks in that order and keeps the total in sight the whole time.
Cart
The cart opens over the page the reader was on: each book with its quantity and sum, the total, and two buttons — back to the shelf or on to checkout.
Checkout
1
2
3
Knows the title
[ 1 ]
New or returning, in one tap
Two tabs above the contact form. A returning reader switches tabs instead of filling the form again.
Both readers
[ 2 ]
Numbered blocks, filled in order
Order, delivery, payment, recipient. Nova Poshta or Ukrposhta, branch or courier, with the branch picked on a map.
Browsing
[ 3 ]
Every discount on its own line
The summary on the right splits goods, delivery, product discounts, the promo code and the personal discount, so the reader sees why the total is what it is.
What every decision on this page rests on
[ 02 / 04 ]
02 · Product page
[ 01 ]
How common the damage is
82%
of sites have severe usability issues on the product page
Baymard Institute · product page benchmark
[ 02 ]
How much of it gets read
20%
of the words on a page is what an average visit has time for
Nielsen Norman Group · how little users read
[ 03 ]
What one blocked size costs
68%
of sites won't let a shopper order an item that is temporarily out of stock
Baymard Institute · product page research

The books did not change. What changed is how fast a reader gets to one.

What changed
Home, catalogue, product page, cart, checkout and account. Each keeps search, stock and delivery terms within reach, and none takes the reader off the page to buy.
What we left alone
The range, the prices and the delivery partners. The store decides what it sells and how it ships; the site makes that visible.
What we would do next
Read search → product page and add-to-cart side by side. If readers search and don’t open a book, the results need work; if they open it and don’t buy, the product page does.

More of our work on Behance

View on Behance

Review

5.0

1111111DizArm UX/UI Agency's work improved user retention and navigation, increased brand recognition, and the client's professional presence in the market. Moreover...

Bohdan Lyshchenko

Founder at ClipSwift

5.0

DizArm UX/UI Agency's work improved user retention and navigation, increased brand recognition, and the client's professional presence in the market. Moreover...

Bohdan Lyshchenko

Founder at ClipSwift

5.0

DizArm UX/UI Agency's work improved user retention and navigation, increased brand recognition, and the client's professional presence in the market. Moreover...

Bohdan Lyshchenko

Founder at ClipSwift

5.0

DizArm UX/UI Agency's work improved user retention and navigation, increased brand recognition, and the client's professional presence in the market. Moreover...

Bohdan Lyshchenko

Founder at ClipSwift

5.0

DizArm UX/UI Agency's work improved user retention and navigation, increased brand recognition, and the client's professional presence in the market. Moreover...

Bohdan Lyshchenko

Founder at ClipSwift

The first step is always a conversation

Fill out the form today and get a response within 1 hour. If we miss that window, you'll receive a complimentary product audit or concept development from DizArm.

0/5000
Budget* (Optional)
0/5000
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

I would be happy to provide additional information about the solutions developed by our team and assist you in selecting the optimal approach.

Bohdan Lyshchenko
[ CEO ] DizArm.Creative
hello.dizarm@gmail.com
We want to create innovation with you
How to structure process project manager?
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.