
UX Design
UX Research
Competitive Analysis
User Testing
July 2024 - November 2024
4 Months
The client, a Fintech company, aimed to launch a brand-new trading platform to expand their suite of financial services.
As the UX designer for this project, I was responsible for the end-to-end user experience design of the platform, starting from the ground up. This involved a comprehensive understanding of the competitive landscape, identifying opportunities for differentiation, and ultimately crafting a user-centered design that enhances the trading journey for both novice and experienced traders.
UX Research: Analyze the trading platform market to pinpoint competitor strengths and uncover unmet user needs.
User Journey Mapping: Map the complete user experience, from initial onboarding to stock discovery to advanced portfolio management, ensuring a smooth and intuitive flow.
UX Design: Develop wireframes for each platform module, creating a standout user experience that differentiates us from competitors and addresses all key use cases.
User Testing: Rapidly prototype and test diverse design concepts to optimize trading workflows and enhance usability.
Conducted competitive analysis of rival trading platforms (Groww, AngelOne, Dhan, Kite) to identify areas for user journey enhancement.
Focused on evaluating navigation, user experience, and feature sets across competitor platforms.
Mapped the thought process of professional traders to create an accurate representation of their user journey.
Synthesized findings to pinpoint pain points and potential opportunities for improvement in the trader's daily experience.
SEARCH + WATCHLIST
Simplified scrip addition
Instead of requiring users to navigate through the marketplace or stock detail pages to add scrips, I introduced a "Predefined Watchlist" tab. This allows traders, especially novices, to add collections of scrips based on categories like Top Market Gainers or Nifty50 directly to their watchlist, significantly reducing navigation.
Dynamic and goal-oriented lists
The Predefined Watchlist is dynamic, updating with live data. This enables both new and experienced traders to quickly add multiple scrips relevant to their goals.
Enhanced search functionality
I integrated chips into the search bar for quick selection of categories like Cash, Futures, and Options.Customization options
Users can now customize their watchlist by managing the order of their watchlists and using sorting and filter options.
Quick Options trading
I added an Options List feature, enabling quick trading on options with a single toggle at the bottom of the Watchlist.
HOLDINGS
Easy access
Holdings are directly accessible via the "Investments" section in the top bar, divided into clear Stocks, Bonds, and Mutual Funds tabs.
Empty state journey
Empty states include categories to explore scrips, promoting efficient navigation.
Minimal interface and prioritised actions
Actions are hidden until needed via a "three-dot" menu on hover, reducing clutter.
Detailed information
A modal provides detailed information on holdings, including order breakdowns and dividends, with integrated pledge actions.
Pledge/Unpledge flows
Streamlined user flows for pledging and unpledging.
Phase-2 planning
An upcoming "All" tab will offer portfolio analytics and insights.
POSITIONS
Categorized access
I organized Positions into clear categories (Equity, F&O, Commodities, Currency - each for Intraday/Carry & Delivery), using accordions for easy navigation.
Prioritized Open Positions
Open positions are displayed by default, with closed positions hidden under an accordion, allowing traders to focus on active trades.
Clear performance overview
Each category displays total P&L, providing an immediate understanding of performance. An "Exit All" option is also available for each category.
Bulk actions
A toggle on the top bar enables bulk selection, allowing users to exit multiple positions simultaneously.
Accordions for Customisable layout
The information architecture prioritizes a clean interface, leveraging accordions to minimize clutter and keep traders focused on essential details.
PROFILE
Centralized access
The Profile tab, accessible via the avatar icon, provides a single entry point for essential modules: User Profile, Bank Details, Add/Withdraw Funds, Orders, Reports, and Settings.
The Account Details tab displays both editable and non-editable user information upfront, with options to enable MTF or add nominees.
Balance visibility
The user's account balance is prominently displayed in the left panel, facilitating quick funding decisions for experienced traders.
Simplified funds management
Clicking the balance amount leads directly to the Funds tab, where users can add/withdraw funds and view transaction history in one place.
Efficient funding process
To avoid multi-screen navigation common on competitor platforms, I introduced a widget that allows users to add funds, select an account, and process the transaction quickly.
Additional user flows for editing bank accounts, viewing trading reports, and customizing settings were designed for clarity and ease of use.
OPTIONS CHAIN
Instant market condition
The Last Traded Price (LTP) is highlighted with orange/green backgrounds, allowing users to gauge market conditions at a glance.
Chevrons enable users to expand Call and Put options, while a separate action opens a Detailed Options List in a new tab.
Minimal hover actions
Buy/Sell options are easily accessible, with additional actions available via a three-dot menu.
A toggle activates Basket mode, allowing quick Buy/Sell actions for each option, which are added to a floating basket for easy access.
Floating widget for basket orders
Clicking the floating basket opens a widget for editing and executing Basket orders.
Controlled data display
Secondary data in the Greeks table is hidden by default, preventing information overload until users choose to expand the list.
BASKET ORDERS
Successfully executed or failed basket orders are non-editable, while uninitiated orders remain editable.
The left panel features icons indicating execution status for quick reference.
Buy/Sell and order type changes are easily accessible with a single tap.
A search bar allows users to quickly add scrips to their baskets, enhancing efficiency.
User research helped identify editable and non-editable actions, informing the design process.
Mapped userflows for all use cases, including Default, Advanced, and Expanded chart views.
Users can easily switch between the Terminal view, Stock detail page, and Options Chain for selected scrips using icons on the top bar, which display the scrip name and live LTP data.
GTT orders are divided into four types: Open, Executed, Partially Executed, and OCO orders, with user flows designed for each.
The left panel displays icons for each order category, providing quick status recognition.
Users can add, edit, or delete orders for all types except Executed GTT orders.
Selected GTT order details are shown alongside their current status for easy tracking.