Increase Adoption
Create a customizable feature within the platform that helps drive sales & adoptions
Reduce Abandonment
Improve and optimize current flows in order to reduce applicant abandonment
Build Trust
Transform the Platform into a Premium User Experience Reinforced with Trust
Terafina, Inc. offers an account opening product that streamlines onboarding and sales experiences for banks and credit unions across multiple channels, including digital platforms, call centers, and physical branches. Their comprehensive suite of products encompasses deposits, loans, and mortgages for both consumers and businesses. They didn't have any functionality issues, it was a growth one. In order to grow, the platform needed to feel reliable and trustworthy, and to serve as a selling point for new adoptions.
When I came on board to help transform Terafina's web product, it was a skeleton Salesforce implementation. The visuals and overall presentation lacked a premium and trustworthy feel, which was critical given the need to handle sensitive, personally identifiable information securely and confidently.
User Experience
User inputs lacked meaningful feedback, and some critical information was being hidden by default; requiring users to search for it. The application flow progression itself was unclear, leading to a fragmented user experience.
Sales Difficulties
Selling the application platform was unnecessarily challenging due to the significant development effort required to customize the branding, making it less accessible for potential clients.
Lack of Trust
The platform lacked an overall sense of trust, refinement, and accomplishment that is required to give applicants the reassurance they desire when handling anything of financial significance.
The primary objective was to elevate Terafina's presentation layer to deliver a more premium and trustworthy user experience, achieved through iterative UX improvements focused on customer acquisition flows, business user pipelines for account openings, and an updated application tracker that empowered customers to manage their processes seamlessly. Equally important was client customization, which led to the creation of a white-label style guide for easy implementation of brand colors and typography, resulting in a more feature-rich platform that immediately addressed key sales challenges.
To revamp the application's presentation layer, we started at the foundational level, redesigning atomic elements and letting those changes propagate across the platform. This approach showed how significant improvements could be achieved with minimal effort, effectively highlighting the impact of our strategy and work.
Color Palette
The color scheme was updated for trust, contrast, and accessibility, with tokens enabling easy white-label customization.
Iconography
A new icon family was introduced using Streamline's 10,000+ icons, giving the UI a cohesive, modern, and premium look.
Typography
Montserrat was chosen for its wide, solid structure and tall x-height, giving the UI a sense of stability and reassurance.
The primary objective was to elevate Terafina's presentation layer to deliver a more premium and trustworthy user experience, achieved through iterative UX improvements focused on customer acquisition flows, business user pipelines for account openings, and an updated application tracker that empowered customers to manage their processes seamlessly. Equally important was client customization, which led to the creation of a white-label style guide for easy implementation of brand colors and typography, resulting in a more feature-rich platform that immediately addressed key sales challenges.
The progress stepper UI was not available on mobile, which was a critical gap that needed to be addressed. The updated version, incorporating the new color scheme, offers high contrast to clearly indicate the applicant's current position in the flow and how much remains to be completed.
1. Progress Stepper
The progress stepper UI was not available on mobile, which was a critical gap that needed to be addressed. The updated version, incorporating the new color scheme, offers high contrast to clearly indicate the applicant's current position in the flow and how much remains to be completed.
2. Hierarchy Addressed
Consistent typographic hierarchy, color usage, and spacing are fundamental to the design. Fields are now marked as optional rather than required, reducing the use of alert red on the page. This change helps ease applicants' apprehension and cognitive overload, making the flow feel more approachable.
3. Exposing Critical Content
Content that was previously hidden behind helper tooltips has now been made visible, providing applicants with all the necessary and useful information upfront, without requiring any additional action on their part.
Engaging with the engineering team early in the process fosters better collaboration, helps identify technical limitations, and enables a more truly agile workflow. The current platform posed challenges for engineering, particularly when customizing platform-based components. Effectively communicating the reasoning behind design decisions is crucial, as it educates stakeholders and ensures they are better informed, supporting a smoother and more agile process.
Increased Sales & Client Adoption
The creation of a standardized, systematic solution made it easier for clients to implement the design while staying aligned with their own unique brand guidelines.
User Experience Wins
By reducing cognitive load through consistent forms and layouts, the user experience was significantly improved. Making it easier for applicants to complete their applications. As a result, abandonment rates decreased by 12%.
Premium Visual Upgrade
The white-label solution now allows clients to easily brand their experience without the need for extensive customization efforts.
This project underscored the importance of foundational design elements in creating a cohesive and user-friendly experience. By focusing on atomic design principles and collaborating closely with engineering and product teams, we were able to deliver a solution that not only met but exceeded client expectations.