The new product definition
Setting up new banking products used to be a fragmented, confusing process that forced bankers to rely heavily on technical support. We changed that by redesigning the entire flow and introducing an intuitive stepper component.
Year:
2018
Location:
Prague, Czech Republic
Design framework:
Lean UX
Tools:
Figma, Leveris Design System, Zoom
The problem:
Bankers struggled to set up new products because the interface was fragmented and unnecessarily complex. The chaotic structure caused users to get lost, forcing them to constantly rely on technical support or senior colleagues just to complete a basic task.
Goal:
To redesign the product setup flow and introduce an intuitive stepper component. The goal was to restructure the form sections and clarify terminology so banking administrators could complete the process completely independently.
My role:
UX Designer leading the end-to-end redesign of the product setup flow. Responsibilities included mapping the existing user journey, identifying friction points, high-fidelity prototyping, guerrilla testing, and final dev handoff.
Methods:
Process mapping
"How might we" framework
User journey mapping
High-fidelity prototyping
Guerrilla usability testing
Dev handoff
Think
Before designing anything, I needed to understand exactly why bankers were struggling to set up new products. By mapping the existing journey and analyzing failed user sessions, I could pinpoint exactly where the chaotic structure was breaking down.
01.
Identifying
Pain Points
Analysis revealed that the form sections were fragmented and unnecessarily complex. The descriptions and mandatory fields were unclear, causing 4-5 users to completely fail the setup process. Bankers were forced to rely on technical support just to finish basic tasks.
02.
Current process
mapping
I mapped the "As-is" user journey to expose the core bottlenecks. The map clearly showed that users pre-populated basic data fine, but got lost when extending parameters. This visualization allowed me to categorize steps and find opportunities to eliminate structural gaps.
Create
With the bottlenecks identified, I focused on simplifying the architecture. The goal was to build a clean, self-serve interface that guided users naturally and significantly reduced their cognitive load.
01.
Restructuring the flow
I completely reconstructed the user path for entering a new product definition. By grouping related settings logically, I was able to eliminate two entire steps from the original flow without needing to build any new components.
01.
High-fidelity prototyping
I designed a new stepper component in Figma featuring a structured menu with short, helpful descriptions. I also completely rewrote the item names to ensure immediate understanding and eliminate technical jargon.
Validate
To ensure the new architecture actually solved the problem, I put the high-fidelity prototype in front of internal users. Validating our assumptions early allowed us to catch remaining friction points before handing the design over to development.
01.
Guerrilla testing
I ran internal guerrilla testing sessions which revealed a few key issues. Users didn't need labels under all main categories, and the "Pricing scheme" logic was too grouped and needed to be split into separate functional entities.
02.
Iteration with UX Writers
I collaborated closely with UX writers and technical teams to address the testing feedback. We stripped away redundant labels, refined the copy, and updated the final prototype to ensure it was completely foolproof.
Deliver
The project concluded with an optimized prototype and a smooth stakeholder sign-off. We successfully transformed a frustrating administrative task into a streamlined, intuitive process.
01.
Dev Handoff
I presented the final design during a grooming session and provided detailed behavioral specifications. This ensured the new stepper component was properly prepared and integrated into our broader design system.
02.
Product launch & results
We deployed tracking codes to measure real-world performance. The simplified copy alone increased conversion by nearly 20%. Overall, the redesign achieved a massive 90% increase in the task success rate, completely eliminating the reliance on internal support.
Outcome
The final redesign transformed a frustrating, error-prone administrative task into an intuitive, self-service process, allowing banking administrators to set up new products completely independently
01.
DEV Handoff
Following a successful sign-off and grooming session, I delivered comprehensive UI and behavioral specifications. This allowed the engineering team to seamlessly integrate the new stepper component into our global design system.
02.
Impact
The business impact was immediate. Tracking metrics revealed a massive 90% increase in the task completion success rate. Furthermore, simply refining the copy and terminology boosted early funnel conversion by nearly 20%.
03.
What I learned
I learned that even complex banking systems don't need to rely on technical jargon. Simplifying the architecture and copy not only reduces the user's cognitive load but drastically cuts down the company's internal support costs.
04.
Next Steps
Monitor the long-term adoption of the new stepper component across other banking modules and continue testing the new design system components with a wider pool of internal administrators.
