Designing a mobile trading web app
Launched to friends and family after 8 months, now evolving through feedback, and a light theme is in progress.
Intro
Role
UX/UI designerDuration
Jan 2025 — present timeDue to confidentiality agreements, only certain aspects of the design work can be shared, without revealing specific details about the project.
Goal
Design a mobile trading web application that's easy for casual investors, yet powerful enough for professionals, seamlessly integrate it into the bank's ecosystem.
Outcome
The project went from draft to a friends & family release in 8 months. The final product introduced two modes for different types of investors and became a fully integrated part of the bank's mobile app.
Process
Identifying core flows
Starting with the bank's existing desktop application as the foundation, I mapped out the information architecture and identified which elements needed to be streamlined for mobile.
I designed adaptive navigation patterns that support both quick and simplified flows.
Challenges:
- Translate complex trading workflows into an intuitive mobile experience.
- Provide two distinct modes: a simplified flow for casual investors and a professional mode for experienced traders.
- Ensure consistency with the desktop product while optimizing for mobile usage patterns.
Ideation & style definition
I began by exploring different approaches to navigation and layouts. I used the bank's existing branding materials to create a familiar and comfortable experience for users.
In collaboration with the client, we defined the style of the main screens to ensure brand alignment and validated usability through interactive prototype testing.
Design handoff
To accelerate development, I used internal design system. During the project, I expanded and adapted it for mobile needs, including various screen sizes. Besides that, I created customizable components that could be reused across different screens.
This approach allowed the team to move fast while keeping the interface consistent and flexible for future iterations.
I prepared design documentation with UI mockups, interaction flows, and developer specifications.
The full scope of the mobile version was designed, simplifying complex workflows and keeping it consistent with the desktop platform.
Two tailored modes are available for the Order Entry feature: simplified for casual investors and advanced for professionals. Users can switch to the advanced mode at any time, accessing the full trading functionality.
Outcome
The mobile version was designed to be clear on small screens, with touch-friendly interactions and reduced cognitive load, without sacrificing functionality.
8 months into the project, the mobile trading integration was released for friends and family. Early users are providing valuable feedback that is actively collected and analyzed to guide ongoing improvements.
At the same time, we working on a light theme, giving users more flexibility and enhancing the overall experience.