Project details
-
UX strategist leading team of 3 additional UX folks (researcher, designer, content designer), responsible for data analysis and research synthesis; UXR planning & support; workshop facilitation; stakeholder alignment; wireframing & prototyping; UX/UI direction; project management & deliverable tracking; product & engineering strategy & planning for release
-
“To take a stand for all investors, to treat them fairly, and to give them the best chance for investment success.”
Vanguard is one of the largest investment firms in the world, with over $7 trillion in assets under management. Their guiding principles have always been to give investors the tools they need to grow their wealth, aligned with founder John C. Bogle’s philosophy of “buy-and-hang-on” investing.
Vanguard’s Retail Investment division, serving individual investors who hold brokerages, IRAs, and other types of individual accounts with the firm, offers a suite of digital experiences for investors to view, assess, and trade on their accounts, including native mobile apps for iOS and Android. While at Vanguard, I worked on a team of 60+ people building a new-from-the-ground-up native mobile experience for both iOS and Android.
-
While conducting user research on a new-from-the-ground-up mobile app experience, analysis showed that it would most likely lower customer satisfaction for the app's most loyal users.
While the app would have a faster, more reliable, modern backend and an updated visual design, the feature set was stripped back and it felt more like an MVP of an app, with incomplete data in comparison to the existing app. Combined with an updated information architecture, it was clear that users would be put off when the new app launched.
The goal of this project was to take the feedback received, and incorporate it into the core portfolio viewing and performance assessment experiences, so that the product launch would be highly successful.
-
The new app has received a 4.7/5 rating on the iOS App Store (compared to ~3.5 for the prior app).
The app has also been featured in a case study from Nielsen Norman Group for the team's comprehensive approach to designing with user needs in mind.
Original user research findings
Users had a lot of feedback on many different parts of the app. After assessing what was technically feasible to work on in the amount of time we had to make improvements, the ease with which we could address each user problem from a research and design perspective, and the impact:effort ratio (where could we improve user satisfaction the most with the least amount of effort?), we were able to narrow down the feedback to 3 key areas, highlighted below.
Original account screen
Original portfolio (home) screen
More focused user research & concept testing
We dialed in on better understanding the user problems with the current design of the account screen. I partnered with a UX researcher to conduct card sorts (both open and closed, moderated and unmoderated) with Vanguard clients to figure out what data points were most important to them.
Results from closed card sort
Rankings of the importance of being able to see different data points in an account summary view
Closed card sort set-up
Live co-design session with a Vanguard client
We then conducted a series of co-design sessions to ask clients how they would arrange the data points on the screen, based on how they used those data points to assess their holdings and make decisions about whether to buy/sell/hold their positions.
From these sessions, we realized that the data needed really depends on what the client’s intent is when they are looking at their portfolio — are they just “checking” on their investments? Or are they coming in to “do” something — expecting to buy or sell?
Sometimes when you're just checking, you don't want every piece of information to be shown
- Vanguard client
I used these learnings to offer a design challenge to the UX designer I was working with: how can we offer clients multiple views in the platform, one that is detailed and one that isn’t? Next, we took early wireframes of that idea and concept tested them with the same clients we’d already done the card sorts and co-design sessions with.
Design iterations & collaboration with engineering
The main new feature we wanted to add: the concept of basic and detailed views of the user’s holdings
Additional new features we hoped to add: IRA contributions information (left); breakdown of funds available to trade (center); grouping holdings by type (right)
Once we had solidified a direction for how to incorporate more data into the account page, I provided UX/UI direction to the UX designer on the project as she began to lay out the screen for different edge cases, and add in other new enhancements that we had discussed as part of the scope of work. This included thinking through how the design would need to be flexible so that it could be completely accessible. We also received guidance from senior leadership to make sure that we carried over design changes from this one screen to other parts of the app so that it would feel cohesive.
Iterating at wireframe stage on how to incorporate all new features
Applying visual language to components for the app
Refining accessibility at the component level
As visual design progressed and it became obvious that the scope of work was bigger than we’d originally anticipated, I also worked closely with our engineering team to figure out how we could break down the end-state experience we wanted into smaller chunks that we could developed and release over time.
Diagramming out how to break down the end-state design into epic-sized features to be sequenced and worked on (relatively) independently
Solution
Account details screen, with new features for available funds to trade, IRA contributions breakdown, detailed and basic views for holdings, and a refreshed visual language
Portfolio and holdings screens, with new features such as buying & selling from the holdings page, and refreshed a visual language