OVERVIEW

Clerkie is an early-stage startup that provides personalized financial advice and assistance to those who need help effectively managing their finances, but can't afford a traditional financial advisor. Clerkie accomplishes this in the form of an AI financial advisor chatbot, whose many "skills" include answering financial questions, applying for loans, disputing charges, and renegotiating bills.

Our team of designers was tasked with creating new flows for onboarding, financial product comparison, and budgeting in a way that fully leveraged the advantages of a chatbot UI while strategically accommodating its constraints. Our goal was to allow users to complete these relatively complex tasks on a mobile device and minimize drop-off within these flows, all while maintaining user trust in regards to the input of sensitive financial information.

ROLE

UX/UI Design

TIMEFRAME

November -
December 2018

Challenge

With nearly two-thirds of Americans being financially illiterate and 78% of Americans living paycheck-to-paycheck, there exists a serious need for affordable and trustworthy financial advice in the face of a broken financial system. For those unable to afford a financial advisor, one of their only options is to look for answers online, which can be frustrating, time-consuming, and unreliable. While online forums can sometimes be a helpful resource for those struggling with a financial predicament, it is often unsafe to reveal the personal details that apply to the issue at hand, leading to imprecise answers that only cause more frustration.

Clerkie's solution was to build an AI chatbot that gives personalized, strategic financial advice and proactive recommendations in addition to assisting the user with financial tasks such as loan applications, renegotiating bills, or orchestrating bill payments. With a functional beta underway, our design team was tasked with creating:

A more consistent visual language with reusable components
Intuitive conversational UX that maintains a relatable but trustworthy voice and tone
New approaches to the onboarding, financial product comparison, and budgeting flows

Research & Discovery

Clerkie's target market is middle-class individuals and families within the U.S. who are either in acute or chronic financial distress, or simply need help achieving better financial health.
‍
We surveyed 131 individuals between the ages of 18-51 on their current personal finance management and prior experiences with financial apps. We found that:

Participants' most common financial goals were debt reduction and saving for the future
Participants who had had negative experiences with chatbots in the past complained of generic answers and being asked too many questions
Participants evaluated the trustworthiness and security of financial apps by checking online reviews and relying on recommendations from friends and family

We also performed competitor/comparator analysis on a variety of chatbots and finance apps in order to gain a better understanding of the competitive landscape.

Ideating on a Budgeting Flow

At this stage in the project my efforts were dedicated to developing the budgeting flow, while other teammates focused on onboarding and financial product comparison. Rather than building a comprehensive budgeting framework exploring all possible branches, the client requested that we ideate on two specific scenarios that a user might encounter while interacting with the budgeting feature:

Setting up a budget for the first time (i.e. budget onboarding). The client's research had revealed that their users often preferred a prescriptive budget over a highly customizable one. For those users who were triggered to use Clerkie due to acute or chronic financial distress, Clerkie would encourage use of the budgeting feature as the next step towards avoiding future issues after meeting the user's acute need.
Adjusting the budget when the user unexpectedly overspends in a certain category. We had found that apps like Mint often increased anxiety by overemphasizing transactions rather than a holistic financial strategy. Our goal was to make the budgeting feature more flexible by helping users easily shift money in their budget when faced with unexpected expenses, allowing them to stay on track overall.

Based on our user interviews and the client's needs, we decided to explore the following features:

Defining the Visual Language

My role on the team also involved building a pattern library and shaping the overall visual language of the app. I drew upon our competitor/comparator analysis as well as the Apple Human Interface Guidelines in order to develop a visual interface that would feel familiar, trustworthy, and highlight the most effective aspects of the client's existing brand.

Some of the design decisions we made include:

Brand colors. We tested Clerkie's brand colors (blue and pink) and slightly altered the pink hue to avoid evoking "danger" or "food." The resulting combination exhibited the brand principles of being bold, vibrant, and optimistic.
Size, spacing, and color of chat bubbles. We mimicked the size and spacing of iMessage to promote familiarity but utilized neutral-colored chat bubbles in order to ensure that CTAs and action elements would be sufficiently prominent.
Placement and color of user response buttons. While multiple full-opacity buttons seemed too overwhelming, ghost buttons were sometimes difficult to identify as buttons. We used "translucent" buttons as a compromise, which would remain distinct from other CTAs. We followed the Apple HIG's recommended minimum height of 44px for touch targets.
Showing chat avatar for Clerkie. While not strictly necessary, we felt that it was important to inject Clerkie's messages with more personality by displaying his avatar. Because most users are not likely to upload a photo, we omitted the user avatar to reduce clutter.

Results

Ultimately, our team was proud of the amount of creative problem solving we were able to accomplish within a very condensed timeline. We would have ideally liked to collaborate more closely with Clerkie's engineers throughout the design process, however, we were able to deliver polished hi-fidelity explorations for onboarding, financial product comparison, and budgeting, despite limited resources. We successfully built reusable UI components and UX patterns that created a cohesive visual language throughout our various flows, in addition to maintaining a consistent voice and tone. Next steps for this project include further usability testing, user interviews, and ideating on solutions for alternative branches of the flows we created.

Reflection

Working on this project gave me the opportunity to think through some very complex and intriguing problems. Although our deliverables were meant to be explorations rather than a fully fleshed out solution, I strived to maintain consistent logic within the flows and think through alternate use cases and edge cases. It was important to think about each feature as part of a greater system, and ensure that whatever solutions we arrived at did not negatively impact other interactions or features elsewhere in the product. The scope of this project necessitated that I rely on assumptions, my instincts, and light usability testing, but if I had more time and resources I would have loved to dig deeper into the needs and behaviors of Clerkie's existing users through more thorough user interviews and contextual inquiry.

Ultimately, our team was proud of the amount of creative problem solving we were able to accomplish within a very condensed timeline. We would have ideally liked to collaborate more closely with Clerkie's engineers throughout the design process, however, we were able to deliver polished hi-fidelity explorations for onboarding, financial product comparison, and budgeting, despite limited resources. We successfully built reusable UI components and UX patterns that created a cohesive visual language throughout our various flows, in addition to maintaining a consistent voice and tone.

Next case study: SHEchange

→