Work Collection
Interactive Wine Coaster
Overview
Interactive Brokers is a global brokerage firm known for its low-cost trading, wide range of investment options, and advanced trading tools.
In this project, I redesigned the close positions function for mobile app to improve user experience on making bulk management on their securities. The new design enhance the customization and freedom of their position selection to enhance trading flexibility.
The new function has gone through compliance review and under develop phase, and it will go online this fall.
Platfoms
Scenario Storyboard
The story starts from my experience at the liquor store …
Why do we drink wine?
Design Critique
Current User Flow Analysis
An analysis on the current close positions function was conducted to have a thorough understanding on the problems and opportunities to exploit for the following design.
Currently, Close Positions only allows the user to filter the impact of their 'Close Action' in three ways:
Asset class
Long / Short Position
% to close out
As part of implementing bulk management, in addition to our existing filters, we will allow users to select one or more positions to close out.
Problems
Users lack control over their preference on security selection
Current filters are general and macro without sufficient flexibility
Opportunities
Allow user to customize their security selection
Enhance users' control over their management of portfolio
Have continuous visual identity with other interfaces in the app
Prototype 1.0
Initial UI Design
Based on the PRD(Product Requirement Document) composed by product manager and the kick-off meeting, I put together a first-edition UI design for review.
Feedback and Revisions
Move 'Select' from top to bottom
Delete 'Selected' section
Change 'All' to 'All Asset Classes'
Add 'Continue' button
Special Considerations
Software Development
Back-end system can only load 30 items of stock data information at one refresh
No Leaf page can be added after or over the original 'Close Positions' information page
Extra time is needed for buffer if more columns of data are to be shown
Compliance
Vendor Display Rules: Some data have to be shown or hidden together
Have all the design within laws and regulations
Prototype 2.0
Revised UI Design
The new version of UI takes software development and compliance into consideration, to give the design a more practical and feasible touch to put into real-world market use.
Function 1 - Add a Filter
Filter the items based on different security types and show 'empty' page when no eligible item exists
Make 'Select All' the default status to encourage users conduct more transactions for more revenues
Function 2 - Customized Select
Users can deliberately choose which security item to close, giving them more freedom in portfolio management
Function 3 - Selection Preview
Users can preview their security selection for position closure and scroll down to have full view of list
The data to be shown are deliberately chosen to be in line with VDR (Vendor Display Rules)
A New Branch: Manage Column
A sub-function is requested due to the VDR rules to ensure the lawful exposure of data from vendors. Therefore an adjustment is made towards original 'Manage Column' widget to allow conditional selection.
Interactive Prototype
Figma Prototype to Showcase Interactions
Reflection
What I learned from this project …
Useful figma and office 365 tricks
Never hesitate to raise questions
Work in an interdisciplinary team
Real-world application of design
Be precise and accurate
Jenny Wang
Product Designer