Back
My CV
UX / PRODUCT DESIGN CASE STUDY
Armaghan — designing
an ATM interface for
real life
A multi-bank ATM platform used for everyday cash
transactions, redesigned for readability, accessibility,
and consistency across banks, hardware generations,
and lighting conditions no user can control.
Role
UI/UX Designer
Team
Design, Engineering & Product
Timeline
[Add project duration]
Platform
Multi-bank ATM interface
01 — OVERVIEW
One interface, many banks, millions of everyday transactions
Armaghan is a multi-bank ATM interface platform — the software layer that runs across cash machines operated by different banks. Every day it serves people withdrawing cash, checking balances, and transferring money, from digitally fluent younger users to people who rarely interact with technology. Unlike most digital products, an ATM interface can't be adjusted by the person using it. There's no brightness slider, no font-size setting, no way to close the app and try again later. Whatever ships to the machine has to work for everyone, exactly as it is, in whatever light and hardware it happens to be running on.
Why ATM UX is different
→ Fixed hardware, no user-side personalization
→ Uncontrolled lighting — direct sun to dim branches
→ Wide range of ages and digital literacy
→ One design running across many bank brands
02 — THE CHALLENGE
An interface users couldn't fix, adjust, or personalize
The existing interface had drifted away from modern UX principles over years of incremental change. The problems weren't cosmetic — they affected whether people could complete a transaction with confidence.
Direct sun, an awkward angle, and a
screen that has to work anyway.
Poor daylight readability
Contrast that worked on a studio
monitor failed outdoors in direct
sun.
Text over busy imagery
Some bank themes placed labels
over detailed background art,
genuinely hard to read.
Unclear affordance
Buttons lacked containers,
blending into the background and
hiding what was tappable.
No screen reader support
Older hardware models couldn't
run assistive technology at all.
03 — RESEARCH & DISCOVERY
Learning the system before redesigning it
Interface audit
Reviewed every screen and bank theme
against current UX standards, not just
visual polish.
User behavior
Observed how different age groups and
comfort levels moved through a transaction.
Accessibility limits
Mapped which hardware generations could
and couldn't support assistive technology.
Hardware range
Catalogued display quality and input
differences across the ATM fleet.
Key insight
The core problem was never that the UI looked dated — it had quietly drifted away from modern UX principles, and no single fix would repair that on its own.
— CONTEXT
People aren't sitting comfortably at home
They're standing. Sometimes under time pressure, sometimes distracted, often in a public space with someone waiting behind them. Every decision had to hold up in that reality, not just on a designer's monitor.
A line forming behind
The pressure of someone waiting shapes how
fast a decision needs to feel — and how
forgiving of hesitation the flow can be.
Elderly and accessibility needs
Larger, well-spaced tap targets and plain
language matter as much as color contrast.
A public, watched space
Handling money in public adds a layer of
vigilance the interface needs to respect, not
ignore.
Quick, confident decisions
One obvious next step beats several equally-
weighted options every time.
04 — DESIGN PROCESS
Designing one flexible system, not one fixed screen
A shared foundation, themed per bank
Every bank needed its own identity without fragmenting the experience — so we fixed the rules that mattered and left three variables open per bank.
Shared foundation
Typography · Text colors · Interactive states ·
Layout structure
Bank A theme
Primary color · Logo · Background
Bank B theme
Primary color · Logo · Background
Bank C theme
Primary color · Logo · Background
The dark-mode hypothesis
The early assumption: switch to a dark theme at night and a light one by day. On paper it promised better contrast. Tested against real glare, it made things worse — and revealed the actual problem wasn't color, it was the environment.
Hypothesis — dark theme outdoors
Select transaction
Withdraw · Balance · Transfer
Glare washed out the text
Adopted — controlled light system
Select transaction
Withdraw · Balance · Transfer
Held up under the same glare
Stable backgrounds · Consistent text colors · Defined contrast rules
The fix was never the palette itself — it was designing for the light the screen actually lives in.
Testing on real hardware
A bench of real machine models let us watch how each display shaped
readability, beyond what a laptop screen could show.
Legacy Ext JS stack
→
Modern foundation
Modernizing more than the interface
The aging tech stack limited every future UI change — so the redesign paired
visual decisions with the technical foundation beneath them, in close
collaboration with engineering.
— PRINCIPLES
The five rules every screen had to follow
Visibility
Nothing important should require
the user to search for it.
Aa
Readability
Contrast and type that survive
direct sun, not just a studio monitor.
Accessibility
Designed to work without relying
on assistive technology being
present.
Reduced cognitive load
One clear focus per screen instead
of competing options.
Clear transaction flow
Always know what step you're on
and what happens next.
05 — FINAL SOLUTION
A calmer, clearer ATM experience
Please select language
English
فارسی
Welcome & language. High contrast from the first screen,
largest text at eye level.
Select a service
Withdraw
Balance
Transfer
Deposit
Transaction menu. Every action gets a defined container —
nothing blends into the background.
Amount confirmed
$500.00
Confirm
Confirm & complete. One unambiguous primary action, always
in the same place.
Stronger contrast
Legible in direct sunlight and dim branches alike.
Clear affordance
Every interactive element has a visible container
and state.
Consistent identity
One shared system, themed per bank without
feeling like a new product.
Accessible by default
Legibility built into the visuals, not dependent on
assistive tech.
06 — IMPACT & LEARNINGS
What changed — and what it taught us
Legible everywhere
A single visual system reliable across
lighting and hardware conditions.
Consistent across banks
Each bank kept its identity without
fragmenting the customer
experience.
Less reliant on assistive tech
Legibility designed into the visuals,
since not every machine could run
one.
Easier to evolve
A configurable theming system, so
future changes don't mean rebuilding
per bank.
Designing for mobile
Users control brightness, size, contrast
Consistent, modern hardware
Users can leave and return
Designing for ATM hardware
Nothing is user-adjustable — it has to work as shipped
Old and new machines, side by side, for years
One attempt, in front of a real transaction
07 — REFLECTION
Good design isn't always about the newest or most impressive
experience — sometimes it means designing within constraints,
and building something reliable enough for millions of
interactions.
On collaboration
The best answer lived at the intersection
of user needs, engineering reality, and
business constraints — not any one
alone.
On constraints
Every gain in readability had a cost in
space — trade-offs had to be made
deliberately, not by default.
Looking ahead
deeper
accessibility testing, adaptive contrast,
expanded hardware coverage
Armaghan — ATM Interface Redesign, Tosan
Due to the Non-Disclosure Agreement (NDA) and confidentiality requirements, I cannot share the final product screens or design assets. This case study focuses on the design process and key decisions while respecting project confidentiality.