What interactions will be most intuitive to our users, making the content most digestible, yet still creates room to add our unique brand to it?
We started by exploring many interaction models in whiteboard form, narrowing it down to four.
After choosing an interaction model, we tested wireframes on a small cohort.
Using a human-centered design approach, we designed and tested in agile rounds, showing designs to potential users for usability testing and feedback. Interally we ideated along the way on UI, UX, data visualization, and more.
Working closely with the development team, we iterated on designs as needed, launched, collected feedback, and continued to respond to feedback with more iterations throughout the next few cycles.
Working in design sprints, then dev/design sprints, we created the mobile experience in a matter of weeks. Using material design and a light design language system we were able to move quickly, and get our validated designs into the hands of more users for feedback, pretty fast.
Empty Data States
After launching mobile, we discovered that users love how Charlie automatically categorizes their transactions, but he's not 100% accurate. For Charlie to be their single-use banking product, they have to know that the data is accurate, and they are willing and eager to recategorize it themselves. This was the #1 most requested feature.
How might we allow users to correct Charlie's mistakes as easily as possible? Working with a developer, we analized the user data to help inform what the most common errors were. We interviewed a few users, then went forward with a simple deisgn.
Working 1:1 with a developer, we cranked out a solution in a few weeks, working through hero paths and edge cases.
We developed a roll-out strategy to track success. First we pushed the feature only to those who requested it, following it's annoucement up with a survey. After analyzing the responses, we pushed to 100% of users, 5% of whom received a survey request, 10% were asked for in-chat feedback. Then we quickly began speccing a second iteration.
Identifying our top 2 entry points to reclassification, we pushed users to the new flow from both.
We decided to create a high fidelity prototype, then validate the usability of the UI with a handful of users. That led to minor refinements, then we released it to only the users that requested it, tracking success by asking for feedback (qualitative) and by analyzing behavior (quantitative). Interactive prototype created in Principle for mac.
In a low fidelity format, we decided as a team what the most important information to show was, and the most delightful, on brand, way to show it.
Leveraging a few common economic budgeting models, we created our own variant, guiding a user through thinking about their budget. The two main flows were 1) set up budget for the first time, and 2) revise budget.
Focusing on every friction point of the conversational UI to the mobile experience, our goal was to reduce churn at every point in the funnel. After analyzing the current data, we identified a few moments, developed some hypothesis, interviewed some users, then developed a new user flow. The flow had to succesfully take a user through installing the chatbot, creating trust, getting the user to connect a bank account (or a few!), and getting them to their 'Aha' moment, fast.
Throughout the year we had constant iterations on these 3 sites. These sites were mobile first, but designed for all breakpoints.
Charlie's main medium is chat. The mission statement of Charlie Finance is to make Americans feel at ease and in control of their finances. We believe that chat, as a medium, allows us to do both of these things, while gaining trust and rapport with each individual. Designing conversational UI was a challenge and extremely fun.