Skip to content
UAEN
All work

07 /2025–2026

Real project

Stefa.books — a children's library with a subscription

A website and back office for a children's library: a book catalogue, Mini/Maxi subscriptions, rental and purchase, a parents' account and an admin that shows which book is with whom and when it is due back.

  • Product Design
  • UX/UI
  • E-commerce
  • Frontend

A real project: the site runs at stefa-books.com.ua. Prices and plans are taken from the live site.

Client
Stefa.books, Mykolaiv
Role
Product Designer · design and development
Year
2025–2026
The Stefa.books subscription page: Mini and Maxi plans, terms from a month to a year with a discount
Stefa.books — a children's library with a subscriptionWork · 07 / 09
Open the live site
plans: 1 or 2 books at a time
2plans: 1 or 2 books at a time
subscription terms, from a month to a year
4subscription terms, from a month to a year
ways to get a book
3ways to get a book
admin instead of spreadsheets and chat
1admin instead of spreadsheets and chat

01 /08

A library where books are borrowed, not bought

Stefa.books is a small children's library in Mykolaiv. Most books are borrowed: parents take a subscription, the child reads, the book comes back and the next one goes out. Some books can be bought.

Before the site, everything ran on a spreadsheet and messages. The catalogue lived in a Google Sheet, orders arrived in a messenger, and who had which book was only in the administrator's head. My job was to turn that into a product that works for both parents and the library.

Category
E-commerce · Subscription · Education
Product
Catalogue, subscription, rental, purchase, account, admin
Status
Live, stefa-books.com.ua
My role
Product, UX/UI, site branding, development

02 /08

A subscription that is easy to understand

Renting books is unfamiliar to most parents. The first question on the site is not «which book» but «how does it work and what does it cost». If the first screen does not answer it, people write to the messenger or leave.

The other half of the task is inside. The library has to see rentals, due dates, payments and stock without stitching spreadsheets together by hand.

  • 01

    Parents

    want to understand the plan, pick books for the child's age and subscribe from a phone in a few minutes.

  • 02

    Child

    picks a book by eye: the cover, the age, a few words about the story.

  • 03

    Library

    sees which book is with whom, when it is due back and who has paid, without spreadsheets or chat.

03 /08

How the library earns

Catalogue

Plan

Checkout

Rental

Return

Next book

  • Mini subscription: one book at a time
  • Maxi subscription: two books at a time
  • A discount for a longer term: 3, 6 or 12 months
  • Buying a book, with a discount for subscribers

  • Subscription

    The main income. The price is fixed for the term, so parents know the amount up front and the library knows its monthly income.

  • Rental and purchase

    A single book without a subscription, or a book to keep. A way in for people not ready to subscribe yet.

04 /08

The decisions the site rests on

The site is for parents who open it on a phone between other things. So every decision was checked with one question: will it be clearer for someone seeing the page for the first time?

  1. 01

    01. The price is visible at once

    The plans sit on the home page as a table: how many books, for how long, the monthly price and the saving. One pricing module runs on the page and on the server, so the amount at checkout never differs from what the visitor saw.

  2. 02

    02. Every book has its own address

    Each book is a page with a readable address, a cover, an age and a description. It can be shared in a parents' chat, and search engines find it.

  3. 03

    03. Soft but readable

    The yellow from the logo, rounded shapes, the Nunito typeface. Yellow stayed a background and an underline: as a text colour it failed the contrast check.

05 /08

Main scenarios

  1. FLOW 01

    Subscribe

    1. Pick a plan and a term
    2. Leave contact details
    3. Choose how to get the books
    4. Pay by card transfer and send a screenshot
  2. FLOW 02

    Borrow a book

    1. Find a book by age or category
    2. Open the book page
    3. Rent or buy it
    4. Pick it up at the library, by courier or by Nova Poshta
  3. FLOW 03

    A library working day

    1. New orders and subscriptions in the admin
    2. Hand out a book and set a due date
    3. Mark the return
    4. Update the catalogue and stock

06 /08

An admin instead of a spreadsheet

The back office matters as much as the storefront: it is what replaced the spreadsheet and the messages.

  • Catalogue: add a book, hide it from the site without losing its rental history.
  • Orders, rentals and subscriptions are separate lists with status filters.
  • Due dates live in the rental, not in someone's memory.
  • Settings without code: subscriber discount, courier price, promo codes.
  • Admin sign-in is rate-limited, and every admin route is closed by default.

07 /08

What it looks like

Site pages on desktop and phone. The interface is in Ukrainian.

The «How it works» block: three steps from choosing a book to swapping it
How it works: three steps instead of instructions
The subscription page on a phone
Subscribing from a phone
The «Liked the book? Keep it» banner with delivery options
Buying: a subscriber discount and three ways to get the book
FAQ and the library's contacts
Answers to the main questions right on the home page

08 /08

What came out and what is next

The site is live: parents subscribe and borrow books without messaging, and the library keeps its records in one place.

In autumn 2026 I reworked the interface and removed online card payment: at this scale a card transfer turned out simpler for parents and for the books.

Next case · 08 / 09

My English Book — English lessons from a single link

Open case

Tell me briefly about the product and the timeline — I'll reply within a day.

Discuss a project