Role
Principal UI/UX Designer
User Interviewer
Design Scope
UI/UX Design
Interaction Design
UX Research
Timeline
July 2024 – January 2025
Recognition
2025 Wealth Management
Industry Award Winner for
Workflow Automation
THE ASK
Reduce the operational drag of their financial advisor’s workflows through targeted AI enhancements
Create an AI experience that would be easily adopted by a traditional advisor user base
Design an AI tool that will serve as an intermediary between the current suite of tools
MY ROLE
As the Principal Designer of this product, I conducted competitive research to understand AI applications across the financial space to identify design opportunities. Through rapid, iterative testing with internal stakeholders, we explored multiple creative directions for an intuitive chat-based interface with AI-enhanced analytical tools that advisors can rely on.
How can we...
reallocate the task time of financial advisors away from dense data analysis and towards strengthening client relationships through an AI experience that melds seamlessly with the features of the existing product?
Our results
⏳
15hr/week
15 hours saved per week on portfolio I & model building task times
📊
20hr/month
20 hours saved per month on investment research, proposal creation, and meeting prep
💪
5K+ RIA’s
Registered Investment Advisors whose workflows we’ve empowered
Our features
Feature 1:
Chat Interface
A chat interface that onboards new and existing users to a totally new experience. Drawing design parallels to existing AI tools, we leverage users’ existing familiarity with other AI tools to ease the users’ transition into regular use of our AI tool. Key features include advisor-centric prompts and chat history.
AI Chat landing page
side panel
1
AI chat starting prompt cards
2
side panel of past chats
Feature 2:
Chart Generation
Advisors love charts, but creating them takes time. AI automations allow advisors to generate custom data visualizations from simple inputs, dramatically decreasing average task times. To integrate this capability into the flow of the chat tool’s conversation thread, I followed existing AI tool design conventions of displaying rich inline content such as graphs to reduce unfamiliarity and friction.
When brainstorming how to connect the AI tool with the other tools in the product workflows, we thought of what advisors would want to see after the AI output. To allow advisors to dive into the AI's data, all data visualizations generated by the AI would link to the tool it is built from to give advisors control over the data.
data visualizations generated
by the AI tool
1
inline data visualizations
2
deep links to pertinent native YCharts tools
Feature 3: Connective Tissue of the YCharts Product Suite
Besides automating tasks for advisors, the AI chat tool seeks to connect and streamline the workflows of advisors as they navigate across their suite of tools, consolidating tasks that typically traverse multiple workflows into a single, streamlined experience.
inline links to native stock pages
links to relevant news sources from YCharts Newswire
links to view AI outputs in native tools
dropdown of sources used in outputs from our databases
Design Direction Explorations
Navigating how far we would diverge from our legacy design system resulted in various design directions ranging from conservative to modern interface designs.
spectrum of conservative to more modern design directions for the chat interface
User Testing Interface Designs
After honing down design directions, higher-fidelity interactive prototypes were created for testing scenarios to account for edge cases and compound use cases. We received verbal feedback from users about their thoughts when navigating the prototypes.
user feedback taken from target users regarding interface designs
user personas
We developed user personas of the financial advisors that use our product, ensuring the needs and goals of those we’re designing for are consistent. We used these documents to ask leading questions like "How would an analyst like Rachel use this?" and "How would this benefit Clint in sales?".
designing for research/analytical users...
and client facing sales users
Applications of Color + Design System
Refreshed Color + Design System
To create a visual identity that signifies its AI capabilities, I created a gradient system leveraging existing colors in our design library. The product was a selection of bright, clean gradients that communicates an inviting and intelligent experience.
After researching other AI interfaces, it was necessary to add more modern design elements to the component library to populate the AI interface. I introduced rounded corners, cards with drop shadows, and branded AI icons all leveraging the established design components.
applications of color system
New Motion Design System
The new AI chat tool introduced new animations and new motion design rules that were applied to keep the animations consistent throughout.
regenerating AI prompt cards
scroll down button to bottom of AI response
AI loading skeleton
AI response generation
some animation design patterns
Takeaways
Recognition
🏆
In the 11th Annual Wealth Management Industry Awards, our AI Chat tool was recognized for our use of AI Technology to automate the workflows of wealth managers among several leading players in the industry. We received the finalist award in the AI Technology — Workflow Automation category among our top competitors.