Banking · Design Systems · Product
Fizz: banking at system scale
One shared system. Nine redesigned banking journeys.
- Role
- Senior Product Designer / Lead
- Timeline
- 10 months
- Year
- 2024
- Team
- Me + 3 designers · Product, QA, frontend, backend, PO and project management
A bank, redesigned as a system.
Tonic Bank · 2024
Color tokens
Type & space
R$ 24.860,42
01 — The shift
The brief asked for screens. The evidence asked for a system.
I joined through a consultancy as part of a team assembled specifically for this transformation. What could have remained a sequence of isolated redesigns became a broader product decision: align the bank's owners, product, engineering and business around evolving the journeys and their foundations together — so we would not reproduce the same fragmentation with a new interface.
- 300+
- market references
- 230
- flows and interactions mapped
- 3
- behavioural personas
02 — Discovery
First, understand the whole bank.
We mapped the end-to-end journeys, inventoried every screen we could access and compared more than 300 national and international references — at component and flow level. The work exposed duplicated decisions, broken transitions and the need for one shared product language.
Digital-first
High autonomy and confidence in digital banking.
Digitally assisted
Comfortable online, but needs reassurance in critical moments.
Bank-led
Lower digital familiarity and greater need for context.
03 — Two connected tracks
Fizz created the language. The journeys proved it in use.
System foundations
Semantic tokens, component states, accessibility, documentation and an engineering-ready handoff.
Tonic Bank
Journeys I led end to end
Pix, TED, phone top-up, bill payment, saved Pix contacts and disputes on Pix or TED.
Account benefits, card benefits and member get member.
Onboarding, profile with gamification and investments — investor profile and fixed income.
04 — Working across teams
Design happened alongside the people who would build, validate and operate it.
The team around the work
I worked alongside three other designers, without directly managing them. I owned my journeys and validated decisions continuously with the bank's product team, QA, frontend and backend engineers, the PO and project management. The wider stakeholder group included business areas, the bank's owners and CEO, and the sponsor representing the card network.
How I kept it connected
Dailies and agile ceremonies kept delivery visible. Design critiques, journey reviews, stakeholder checkpoints and close engineering handoffs kept the system from becoming a parallel initiative. I connected decisions across my journeys, made trade-offs explicit and brought the right people into each validation — leadership through influence, not hierarchy.
05 — Inside the journeys
One language, across very different moments.
Pix, TED, phone top-up, bill payment, saved Pix contacts and disputes on Pix or TED.
R$ 1.250,00
to João PereiraPix sent!
R$ 1.250,00 · João PereiraInsufficient balance
You need R$ 312,40 more to complete this Pix.R$ 1.250,00 · Pix
06 — Making scale usable
Documentation was treated as part of the product.
At the time, tokens, component behaviour, edge cases and implementation guidance were documented in Figma. That was an intentional response to the bank design team's maturity and pace: they needed something visual, familiar and immediately usable. It accelerated adoption, even without a coded repository.
Semantic color tokens
Every token carries a human name, a light and a dark value, and a rule for when to use it.
Interface presence — 55 / 22 / 13 / 6 / 4
07 — What changed
A shared foundation for decisions, journeys and delivery.
500+
system components
1,000+
screens on the system
9
journeys redesigned
Shipped
Fizz became the documented foundation for the product, and the priority journeys moved forward with the same patterns, rules and language.
Ready, not released
Open Finance and Global Account were prototyped, reviewed and ready for the backlog, but did not reach implementation within the ten-month window because of time and priority constraints.
Executive confidence
The bank's CEO praised the result — a meaningful signal that design had moved from interface execution to a credible product and business capability.
08 — Looking back
Leadership did not require managing a team. It meant owning the work, connecting people and improving the quality of decisions.
What I learned
Visible journey wins build the trust that invisible foundation work needs. The sequence matters as much as the solution.
Leadership through influence
I led my scopes end to end, created clarity between product and engineering, and used critique and prototypes to build alignment — without directly managing the other designers.
What I would change today
I would keep Figma as the team's fast visual entry point, but connect it to a coded source of truth. With AI, I would accelerate token and rule definition, check documentation coverage, surface inconsistencies and turn approved patterns into implementation-ready references — with human review at every decision.