Video meeting platform
Role
Lead product designer
Team
1 head of product, 1 lead PM, 1 head of technology, 1 UX researcher, 1 content strategist, and 2 development teams: each with 1 PM and 3-4 engineers
Timeframe
November 2020–November 2021
A little background
Once Covid hit, and Zoom’s stock price skyrocketed 700%, it was clear that virtual meetings weren’t just “having a moment.”
People were sheltering in place, and avoiding their local branches.
Chase reacted swiftly and prioritized our own secure virtual communications platform to allow people to meet with their advisors remotely.
J.P. Morgan Personal Advisors
At the same time, we were developing a new investment offering, J.P. Morgan Personal Advisors.
Work with a team of advisors via video or phone, receive a personalized financial plan, and access expert-built investment portfolios.
Goal
How might we
Build Chase’s first-ever suite of collaboration tools to allow advisors to remotely interact with clients through video, screen sharing, and co-browsing capabilities
First built for Wealth Management, the long term goal was to expand to Auto Financing, Home Lending, Business Banking and beyond.
Users + products
60M Chase users
Build a video collaboration tool with video, screen sharing, and co-browsing—all within the Chase website and mobile app
5K wealth advisors
Build a secure video meeting launcher integrated into core advisor platform, Advisor Central, with view of upcoming meetings
Measuring success
50%
Client-advisor meetings made through meeting scheduler to use this tool
50%
J.P. Morgan Personal Advisors actively using and testing the platform
Getting it done, from 0→1
Understand the technology
We used Zoom’s Meeting SDK to host the meeting.
We used Oracle’s Cobrowse SDK for a connected and secure screen share + co-browse products.
We leveraged two different technologies under the hood and provided a smooth, secure and seamless meeting experience for clients.
Meeting details
The meeting details page began as a simple information hub, holding all the essential details you needed before your advisor call. Through ongoing improvements, it transformed into a comprehensive guide, handling both 1-on-1 meetings and larger group sessions. This evolution aligned with our design system’s visual design refresh, ensuring a friendly and modern entry point.
v0
v1
Final version - Desktop
Final version - Mobile
Video meeting window
The video meeting window started as a proof-of-concept (POC) to verify seamless coexistence and user experience between the Zoom and Oracle SDKs. Then, I integrating essential video controls and optimized the meeting for dynamic interactions like expand/collapse, browser resizing, multiple participants, and even screen sharing.
v0 - Proof of concept
v1 - Video meeting window
Final version - 1-on-1 meeting
Final version - Video meeting window docked in the bottom right corner
Final version - Multiple partipants
Final version - Multiple partipants (a11y specs)
Resizing + meeting controls
I defaulted to familiar meeting controls first, then added resize controls to accommodate docking, repositioning and various screen sizes.
Resizing, resilience and responsiveness
One complexity of designing this tool was factoring in the resilience and responsiveness of browser resizing and the collapsed, expanded, minimized and maximized views of the meeting window.
Accessibility
For a sighted user, it’s easy to tell when you’re sharing your screen, but what about for someone with a visual impairment?
I created a11y specs to document how a keyboard-only users could have the same experience as someone using a keyboard and mouse, e.g., dragging and repositioning the meeting window.
User testing - before
How do I stop sharing my screen?
Screen share border hard to see in the sea of blue
What is being shared?
Confusing screen sharing messaging
Is my camera on when I’m sharing my screen?
Communicate system status
User testing - after
Change screen sharing border to green, going against semantic color guidance from our design system
Rewrite clear and concise screen sharing message, accounting for opening new tabs.
Call out important info, such as whether meeting participants can still see you, and reassure that only you can interact with your account.
Final screens
For Chase customeres
Video chat with your advisor
Meet with a licensed financial advisor, on Chase.com or in the Chase mobile app.
Review meeting details
See all of the important details you’ll need in one place, and learn how to use the tool.
Browse Chase.com during your meeting
Review meeting details or check your accounts and keep the video running—all within Chase.com
Co-browse with confidence
Your advisor is there to help point you in the right direction—just follow their cursor.
You may see your host’s cursor on your screen, but only you can make changes or click any buttons.
View your advisor’s screen
Chase advisors can guide you through your plan and show you their screen—just like in the branch.
Final screens
For advisors
Meeting launcher
Advisors can see their scheduled virtual meetings for the day and tell whether clients have joined the meeting
Integration with advisor platform
Launch the meeting from Advisor Central, and attest to the screen sharing agreement.
Business results - short term
Enabled video communications for 5K+ J.P. Morgan Wealth Management advisors with $615B of assets under supervision
Soon to expand to Home Lending and Auto Financing
Over 400 successful virtual meetings within 2.5 months after launch
Mitigated internal privacy and security risks of advisors using Zoom off-the-shelf
Users can meet with any wealth advisor in the US—no longer limited by their locale
Business results - long term
Enabled the launch of new investment offering, J.P. Morgan Personal Advisors, used by a pool of 200+ remote advisors
Currently, 200+ licensed financial professionals serving clients and plans to add over 100 in 2023
In the pre-launch, 93% of clients rated their advisor an average score of 9.5 out of 10
Appeals to a more digital savvy client with $25K minimum investment