06 Selected work / Human Factors Institute

HDFC Bank · Internet banking

Enterprise banking · Responsive web

HDFC
Bank.

Move the complexity.
Not the task.

Five banking systems exposed five ways to find the same thing: transactions. We redesigned that fragmented experience around one customer input—a date range.

The core moveInfrastructure stays complex. The experience becomes coherent.
Exposed to the customer
  • Download Statement
  • Request Statement
  • Historical Statement
  • View Statement
  • Transaction Summary
51routing moves
behind the interface
Customer intentView
transactions
FromDD / MM / YYYYToDD / MM / YYYY
The customer chooses a period. The system finds the transactions.
RoleSenior Human Factors Specialist
ConstraintFive backends could not change
DeliverableWorking HTML wireframes
CoverageFive responsive breakpoints
01

The diagnosis

The interface
was a system diagram.

We mapped the existing flows and found that backend boundaries had become customer choices: recent or historical, download or request, statement or summary.

Customer“I want to see
my transactions.”
Forced to decide
  • Recent or historical?
  • Download or request?
  • Statement or summary?
  • Which system holds the date?
ResultThe customer
carries the routing.
The customer had to know where a transaction lived before they could retrieve it.
02

The design move

Ask for the period.
Route the rest.

The redesigned flow asked for only what the customer knew: a date range. The system then identified the right source, fetched the records, and presented one transaction list.

01 · Human inputFrom01 / 01 / 2020To31 / 12 / 2023
02 · Routing layer
Read date rangeResolve sourcesQuery systemsMerge results
Complexity is handled here.
03 · Existing infrastructureRecent activityStatement storeRequest serviceHistorical archiveTransaction summary
One task replaced the old labels without requiring the bank to rebuild its backend.
03

Early responsive interaction design

One task.
Five widths.

We designed the flow at 960, 768, 540, 480, and 320 pixels, then delivered working HTML so the client and developers could test the behavior rather than infer it from static screens.

960
FROM01 / 01 / 2020TO31 / 12 / 2023VIEW
Desktop · horizontal action
768
FROM01 / 01 / 2020TO31 / 12 / 2023VIEW
Tablet
540
FROM01 / 01 / 2020TO31 / 12 / 2023VIEW
Phablet
480
FROM01 / 01 / 2020TO31 / 12 / 2023VIEW
Mobile
320
FROM01 / 01 / 2020TO31 / 12 / 2023VIEW
Mobile · stacked action
Prototype evidence

The same information order and date-selection task survived every breakpoint; only the layout and action placement changed.

04

The outcome

The system carries
the constraint.

The bank kept its five data sources. Customers stopped navigating them.

A single date-range task made the service easier to understand, responsive by design, and feasible within the existing architecture.

End of selected work

← Previous · Standard Bank IVR
AI
Next chapterEnter the independent
AI laboratory.
Ask Rohan
Powered by reflective memory · Phase 1