Information Dashboard Enhancements and Redesign
Fidelity Investments
PROJECT SUMMARY
While at Fidelity Investments, I was the lead designer for trading applications used by high-volume equity traders, including the Active Trader Pro (ATP) desktop application for Windows.
A widely used feature in Active Trader Pro was the Daily Dashboard, a window that appeared when users logged in to the application, showing index performance, news related to the users' holdings, heatmaps for the users' portfolios, and other information.
A similar Daily Dashboard appeared in the Fidelity.com website, and also included a popular feature called Portfolio Events, a set of notifications about timely events related to the user's portfolio.
In response to user feedback, the Active Trader Pro product team was tasked with adding a Portfolio Events feature similar to the one on Fidelity.com to the Daily Dashboard in ATP.
My role
Design Lead
- Managed stakeholder communications, project deadlines, requirements gathering, and deliverables
- Coordinated input from visual designer and user researchers
- Reviewed visual design and software development deliverables
Interaction Design
- Defined UI components and interactions
- Produced interactive Axure prototypes for user testing
Visual Design
- Produced high-fidelity mockups of early design concepts
UX Research
- Planned usability testing in collaboration with research team
Outcomes
- On-time project delivery
- Positive customer feedback
PROJECT DETAILS
Below is a screenshot of the Daily Dashboard in Active Trader Pro at the start of the project, which lacked the Portfolio Events feature.
Daily Dashboard at the start of the project
In response to user feedback, we were tasked with adding a Portfolio Events feature to the Daily Dashboard in Active Trader Pro, similar to the one on Fidelity.com as shown below.
Your Portfolio Events from Fidelity.com
The data included several types of events related to the users' portfolios:
- Earnings Dates - when publicly traded companies announce earnings reports
- Dividend Ex-Dates - dates when dividends are paid on certain types of stocks
- ESS Changes - changes to a company's Equity Summary Score, a rating published by Fidelity
- 52-Week High - if a company's stock closes at its highest price of the last year
- 52-Week Low - if a company's stock closes at its lowest price of the last year
Adding this new data to the dashboard also necessitated changing the overall layout and styling.
One of our talented visual designers and I put together mockups incorporating Portfolio Events into Daily Dashboard, with some basic variations:
- Events grouped by type, in separate views (with and without summary view)
- Events of all types mixed together as "feeds" and grouped by chronology (past, today, and future)
Early concepts of Portfolio Events in Daily Dashboard
Based on stakeholder feedback from these concepts, we made design revisions and provided Axure prototypes to our user research team, who conducted testing to determine the following:
- What is the users' mental model for consuming this type of information?
- Which organizational structure best supports the users' mental model?
- Do users find the proposed interaction designs intuitive and user-friendly?
- Which information layouts, styling and iconography to users find most effective and appealing?
Below are screen shots of the Axure prototype I created.
Designs used in usability testing
RESEARCH FINDINGS
Test participants thought of the events in chronological terms, and were only concerned with the current day's events and those known to be occurring in the future, caring less about past events. This finding allowed us to reduce the number of events presented.
Participants weren't interested in separate views or filtering by type. Combined with the emphasis on chronology, this finding suggested a simple "feed" view as the preferred organizational structure.
For each event, test users first wanted to know the ticker (i.e., which company in their portfolio) and the type of event. They wanted visual differentiation of the various event types, but found that icons felt cluttered. After seeing the ticker and event type, they would then look for additional metrics or take specific action based on the event.
This information allowed us to optimize the layout and styling of the event cards, including replacing icons with more subtle colored dots, and led us to incorporate an "action menu" from which the user could initiate trades or other actions.
FINAL DESIGNS
Below are the final designs, produced by the talented visual designer whose work I was overseeing.
Final designs: white, blue and black themes (another team member's work product)
PROJECT OUTCOMES
Anecdotal feedback from users was overwhelmingly positive, and Portfolio Events became one of the most widely used components in ATP.
