A voice-enabled banking assistant
Finie, also known as the 'financial genie,' was a voice-enabled banking assistant that financial institutions could purchase to enhance their customer experience. I designed its successor, Finie 2.0, to align with the company's refreshed branding.
The challenge
The first version of the app was a success, created using the company's existing design language. However, after the company's recent rebrand, the founders were keen on aligning Finie with the new look and feel. They believed that a ground-up rebuild would allow us to address any overlooked aspects and dramatically improve the engineering, UI design, and user experience.
Screenshots of the original Finie app in dark mode.
A solo design journey
On this team, I held the unique position of being the sole designer (👋🏼). Though it can be challenging and lonely, I found ways to alleviate this by seeking feedback from non-designers when needed.
I was fortunate to work with a highly collaborative product manager, Matt. He was the ideal collaborator who could look past my rough sketches and get excited about the ideas they represented, ask insightful questions, and offer valuable inputs. This kind of relationship was crucial for thriving in a project as the only designer.
Voice-first design
I was guided by voice-first design principles, as defined by the Nielsen Norman Group as:
… a system which primarily accepts input via voice commands, and may augment audio output with a tightly integrated screen display.
With voice as the main focus, I stepped back from the UI to consider the broader picture: the flow of conversation. This approach helped us design an accompanying UI to enhance the user experience.
A flowchart for determining different conversational flows
Bringing ideas to life
My UI designs originated as paper sketches. Some were done quickly in low fidelity, while others served as the centerpiece of feedback sessions with my product manager. The promising sketches then evolved into high-fidelity mockups and interaction animations, which helped gather additional feedback.
Initial hand-drawn sketches of the new Finie app
As each feature was developed, I provided our engineers with design specifications and other necessary materials. After several months, our engineers brought Finie 2.0 to life using React Native.
High fidelity mockups of Finie 2.0's new app screens.
A UI specification diagram for how the conversation would be laid out.
Impact & lessons learned
The launch of Finie 2.0 was a significant milestone in the company's journey, and it had a profound impact on its sales process. The redesign aligned Finie 2.0 with the company's new branding, and sales professionals found it much easier to market and sell the product. The cohesive branding narrative resonated better with clients and facilitated stronger engagement.
One of the key takeaways from this project was the value of maintaining tight feedback loops. Throughout the design process, we prioritized open communication and collaboration, which resulted in the successful reception of the new features we implemented. By involving all stakeholders early and frequently, we ensured that the final product truly met everyone's needs.
Working with a team where my collaborators were also subject matter experts was an invaluable experience. It allowed for a deeper understanding of the product and the people using it, helping me make more informed design decisions.