Responsibilities
Spearheading the user experience design of TIFIN Sage & Helix, AI assistants intended to streamline financial workflows for wealth management professionals. Creating a unified design system that could be used across both these products and creating a seamless experience using the principles of conversation design.
Timeline
November 2023 → Present
Team
3 Designers, 2 Frontend Developer, 2 Backend Developer
Tags
UX Design
Product Strategy
Product Design
Design System
Conversation Design
What is TIFIN.AI?
TIFIN.AI is the new phase of innovative fintech products and tools powered by artificial intelligence, helping financial advisors with client portfolios, exploring alternative investment options, and even bringing wealth management solutions to workplaces and the insurance industry.
The two products that I worked on within TIFIN.AI are -
User Goals -
As a financial advisor I should be able to -
Discover and compare diverse investment strategies tailored to my clients' unique goals
Understand relevant market data and trends that could impact my clients and inform my investment decisions
Receive personalised recommendations for my clients keeping in mind their investment objectives, portfolio constraints, risk tolerance etc.
Monitor all client portfolios in real-time, with a clear view of key performance metrics and holdings and have access to suggested actions based on market trends and client goals
Overview of the old experience
Visual Harmony: Inconsistent padding and spacing across elements create a cluttered look. We wanted to establish consistent spacing guidelines for a cleaner and more organised user interface.
Component Consistency: Variations in the design of basic elements like buttons, input fields, and cards make the platform feel disjointed. Implementing a consistent design system will ensure a unified and intuitive user experience.
Colour Accessibility: The heavy reliance on orange for navigation and chat accents limits opportunities for visual hierarchy and might present accessibility challenges for some users. We wanted to explore a broader color palette that balances user experience and accessibility best practices.
Process and Approach
Streamlining Development with a UI Template
To ensure a consistent and user-friendly experience across our conversational AI platform, we developed a comprehensive UI template for developers. This template provides clear guidelines for -
Content Formatting: The template outlines best practices for text formatting, defining paragraph breaks, and chat bubble sizing for optimal readability.
Responsive Layouts: Detailed specifications guide the behaviour of UI elements across different screen sizes and resolutions, guaranteeing a seamless experience for all users.
Building a Robust Component Library for Efficiency and Consistency
In an effort to maintain visual consistency and accelerate development across our conversational AI platform, we created a comprehensive component library. This library houses a collection of reusable UI elements, including newly designed chat bubbles and input fields. Each component comes with predefined behaviours and interaction patterns, ensuring a uniform user experience and streamlining the development process.
Design Principles
The challenge for designers is to make interactions with digital systems feel less robotic and more personal, creating systems that succeed on human terms. Hence we wanted to embody these design principles -
Goal Oriented
Keeping the user engagement poignant and outcome driven is crucial and leveraging context will enable you to reduce much of the friction of the transaction.
Anticipate & Adapt
Anticipating user needs based on the context of the conversation and adapting in accordance to the desired outcome is key to a success.
Reflect & Pull
Designing an experience, using the method of pull, create cues, directions or clear instructions on how to get the conversation where you want it to go.
Anticipating User Needs for a Seamless Experience
We designed our platform to understand user intent and respond accordingly. For instance, when a user asks a broad question, we proactively offer multiple avenues based on potential needs. Consider the scenario where a user inquires about the impact of a portfolio change. Instead of a single response, the platform might ask: "Would you like to see a list of clients who might benefit from this adjustment?" This proactive approach clarifies user intent and streamlines the conversation.
Principles Applied
Goal Oriented
Anticipate & Adapt
Guiding Users with Clear Prompts and Suggestions
We ensured users always have a clear direction to follow in the conversation. The platform suggests insightful follow-up questions that might align with the user's potential interests. This encourages them to explore related topics and delve deeper into the conversation.
Principles Applied
Anticipate & Adapt
Reflect & Pull
Personalization Through Dynamic User Interfaces
We went beyond just text-based interactions to create a more personalized user experience. By utilizing modular components, we can assemble these elements in various combinations, ensuring an outcome-driven experience that aligns with each user's specific goals and interests.
Principles Applied
Goal Oriented
Anticipate & Adapt
Eliminating Uncertainty from Onboarding to Ongoing Exploration
We prioritised user clarity from the very beginning. During onboarding, we outlined the steps needed to unlock the platform's full potential. This eliminates any initial uncertainty and ensures users feel confident navigating the platform.
Furthermore, we've implemented a readily available "What can I ask Sage?" call to action within the input field. This feature presents users with a list of potential prompts, fostering exploration and eliminating the fear of getting lost in the conversation.
Principles Applied
Reflect & Pull
Anticipate & Adapt
Enhancing Client Management Experience
We wanted to reimagine the client page experience by moving beyond traditional table layouts. To prioritise actionability and user experience, we implemented a novel approach: interactive client cards. Inspired by mobile contact books, these cards provide a familiar and intuitive interface for managing client information on a web platform. Additionally, the inclusion of quick filtering capabilities empowers users to efficiently locate specific clients within their portfolio.
Principles Applied
Goal Oriented
Streamlined Navigation for an Immersive Conversation Experience
Collapsible Navigation: A collapsible navigation bar minimizes screen real estate when not in use, ensuring the conversation window remains the primary focus. Users can easily access navigation elements when needed, but the interface prioritizes the ongoing dialogue.
Dynamic Drawer: A dynamic drawer provides contextual information relevant to the current conversation. It can also display popular questions at any point, allowing users to explore related topics without disrupting the flow of the conversation.
Principles Applied
Anticipate & Adapt
Empowering Portfolio Decisions with Intelligent Recommendations
We prioritised informed investment decisions through a robust recommendation engine. This engine analyses a client's portfolio and generates personalised recommendations, considering factors like potential wealth growth, liquidity impact, and investment style nuances.
To further enhance the recommendation experience, we leveraged the dynamic drawer. This feature displays key client portfolio details alongside configurable input parameters for the recommendation engine. This allows users to:
Gain Context: View essential portfolio data within the recommendation workflow.
Refine Recommendations: Adjust input parameters to tailor recommendations to specific investment goals and risk tolerance.
Principles Applied
Goal Oriented
Reflect & Pull
Streamlined Fund and User Administration
Considering the nature of the platform we designed a comprehensive set of tools managing private market funds and user permissions. This admin instance offers a centralised hub for:
Fund Management:
Add, edit, and remove private market funds available to advisors on the platform.
View a comprehensive list of all available funds.User Management:
Manage advisor access at an enterprise level, granting or revoking permissions as needed.
Add and remove advisors from the platform.Data-Driven Insights:
Access key metrics displayed at various hierarchical levels, providing administrators with a clear view of platform usage and performance.
Principles Applied
Goal Oriented
Anticipate & Adapt