Designing the main finance screen
About the project
ROLLOUT is a non-profit open source platform: free design libraries based on shadcn for launching e-commerce and fintech products. From December 2025 to March 2026 I worked on the finance dashboard module (PFM).
Who it's for. The platform's client is any business that wants to accept payments online, from a bakery to telemedicine. The end user is that business's customer, checking their accounts and cards in a personal dashboard.
The problem. Businesses have very different numbers of accounts: a bakery has one bonus account, a fintech service a dozen in different currencies. One template doesn't fit all: a carousel of 10 accounts is unreadable, and a list of one looks empty.
The task
Design an accounts block that works for any business, and build the finance dashboard home screen on top of it.
Research
I went through banking apps in Russia, the CIS and Europe: Sber, T-Bank, Alfa, Revolut, Kaspi and others. I found four patterns:
- Carousel for quick switching, like Sber.
- List for an overview of all accounts, like T-Bank.
- Highlight + hidden: one main account, the rest collapsed, like Revolut and Alfa.
- Card stack in the spirit of a wallet, like Yandex Pay.
Which variant when
| Scenario | Variant | Why |
|---|---|---|
| 1–2 accounts: bonuses, cashback | Highlight + hidden | the main account is in view, the rest stays quiet |
| 1–2 accounts or cards, wallet, loyalty | Card stack | emotional, like a physical wallet |
| 3–5 accounts, frequent switching | Carousel | quick to swipe, little vertical space |
| Many accounts or currencies, overview needed | List | everything at a glance, easy to compare |
How I built it
I took the base components from shadcn and assembled organisms from them: cards, account tiles, lists and home screen widgets. shadcn is a web library, so it gave the foundation and component logic, and I built the mobile blocks on top.
For the home screen I took work from neighbouring teams (loyalty, transaction history, transfers) and adapted it into widgets.
Result
- Account components in 4 variants went into the open PFM module library.
- The finance dashboard home screen is built on them.
- The libraries are open and free: view in Figma.