This is a speculative project

The Challenge

Venmo ‘s mission is to make the transfer of money between users as fast and easy as possible. And they have succeeded! With over 40 million users on their mobile app, and the majority of them millennials splitting rent, bills, and dinner, it has followed in the footsteps of other great products, in which “Venmo-ing” has become a verb. In order to continue to grow and retain their users, Venmo wants to add a personal finance feature into their existing app.

Design Process

Market Research

Market research was conducted to understand the industry. I focused on Venmo demographics and millennial saving trends. What became apparent through market research was the general distrust that millennials have with banks. I immediately could see the unique position Venmo was in as a millennial-trusted FinTech app.

Venmo Statistics

• Venmo is only available in the US

• Venmo has over 40 million users, as of April 2019

• 26% of young millenials use Venmo

• 34% of older millennials use Venmo

• 25% of Gen Xers use Venmo

• Venmo is accepted at over 2 million retailers

View Full Market Research Findings

Competitive Analysis

I conducted a competitive analysis with Venmo’s direct and indirect competitors to understand what they do better or worst.

Heuristic Evaluation

Using Nielsen and Molich’s interface guidelines, I did a heuristic evaluation on Venmo to make sure I keep those strongly in mind as I design the new feature.

1. Match between system and real world: When transferring funds, using “request” and “pay” are commonly used and are very clear in which direction the transfer goes in.

2. User control and freedom: The clear “Cancel” button which has an equal hierarchy as who the payment goes to, makes it easy for you to cancel a transaction.

3. Error Prevention: After choosing “Pay” a large green CTA has you double check that that’s the transaction you want to do. If not, the Cancel button is clear on the left top.

4. Visibility of System Status: After paying someone, a page indicates the system status with a bar on the top moving across the page and content that says “paying [name]…” making it clear where you are in that process.

5. Flexibility & Efficiency of use: The icons clearly indicate what action pressing them will take. 

6. Recognition rather than recall: The green type for when you receive money and red type for when you pay someone is a great way to indicate the type of transaction that happened.

7. Consistency & Standards: Regardless of the complexity of the task, there is a clear consistency across the app and it abides by typical UX patterns and standards.

8. Aesthetic & Minimalist design: Venmo uses white space and loose padding to create a minimalist aesthetic. Additionally, the color scheme is simple.

9. Help users recognize, diagnose, and recover from errors: Venmo makes it very clear when you have made an error and gives you a clear CTA to recover from that error.

10. Help & Documentation: Venmo provides easy access to help and documentation options in the settings.

Provisional Personas

I then created three different provisional personas that would help guide my interview participants.

User Interviews

In order to conduct primary research, I interviewed six Venmo users, two male, and three female, who lived in major cities like San Francisco, Boston, and New York. I asked them open ended questions about their Venmo and saving habits.

Empathy Map

Once I conducted the user interviews, I created an empathy map with every thought and quote that my users said. From there, I organized it by thinking'/feeling, doing, saying, and hearing. Then I pulled out patterns across the empathy map.

User Persona

My empathy map lead me to my user persona, whose goals, motivations, needs, and frustrations, are based on my research.

POV & HMW

Once I had my user persona, I built out POV statements and How Might We questions which would be the vehicle for all the brainstorming.

Brainstorming Session

I ran an individual brainstorm session, in which I did two two-minute rapid-fire ideation to answer the HMW questions.

Group Brainstorming Session

From there, I ran a brain thinking brainstorm session with five other friends. It was my own version of the 6-3-5 Brain Writing Technique, in which I gave each person a sticky pad & pen. We did two rounds of two-minute rapid-fire ideation on the HMW questions. In the second round, they could either come up with new ideas or build on existing ideas. In the third round, we discussed our favorite ideas and unanimously built upon those. The result was a large compilations of ideas to solve the HMW questions.

Business, User, and Technical Considerations

I then identified the business goals based on research, and user goals based on my personas. Where these diagrams overlap is where I focused my project.

Product Roadmap

I created a product roadmap to determine the main features my product would have and the priority.

App map

It was important to understand where the Venmo feature would fit in to the architecture of the existing Venmo app so I created an app map. This helped me visualize where Venmo Savings would fit in.

Task Flow

In order to understand how a user completes a task, I created a task flow and three individual tasks. This helped me understand the flow of the feature.

User Flow

A user flow was integral into understanding the flow of the app and highlighting any points of contention within the app.

Low-Fi Wireframes

Based on my task & user flows, I started building out my first iterations of my low-fi wireframes, based on existing Venmo patterns.

UI Kit

Using the color dropper tool, and recreating common Venmo design elements, I developed a UI kit that would help guide my own Venmo feature to match with the overall Venmo aesthetic. I even created new icons that I would need for my screens!

High-Fidelity Wireframes

I crated my first version of my high-fidelity wireframes to do some usability testing amongst users. Below is the first version of the Venmo Savings feature.

Some important notes:

• I chose to include Savings under “Preferences” in the Settings menu because as of right now, the feature is limited and it made sense to be nestled in other settings related to transactions. When the Savings product grows and develops, I expect it to be under its own section in Settings.

• The graph in the Potential screen is interactive and that dot can be pulled up and down that graph to see the hypothetical projection change

Usability Testing

In order to test the Venmo Savings feature amongst Venmo users, I developed a high-fidelity prototype in Invision with three complete task flows. This would allow me to test complete functionality of the feature and collect valuable feedback for the iteration stage. In order to test the functionality of my Venmo feature, I recruited five participants and had them go through a series of scenarios and tasks.

The tasks were:

1. View your Venmo savings account

2. Change your Venmo savings potential

3. Update features to maximize Venmo savings

Affinity Map

Once I had completed my testing, I added every note, comment, and observation onto an affinity map. From there, I pulled out patterns to figure out what I should update in my wireframes.

Revised Wireframes

Once I prioritized what to change, I went back to recreate some low-fi wireframes. One major thing that came about from my research was that I had given my users too much control in the potential screen. The potential screen was overly complicated, when the goal was quite simple: to show users what their savings would look like if they saved more.

Additionally, I added a “Manage Balance” because it’s a Venmo patterns and I realized I had given my users no way of actually transferring their funds back into their checking.

Revised Prototype

Conclusion

This project was challenging as I had to work within the confines of the Venmo brand and create a complex feature in an otherwise simple app. However, in the end, I created a feature that fulfilled the needs and goals of the Venmo user. There is a lot I learned from this project.

• What went wrong and why? Three user testing sessions in, I realized that one of my screens was very confusing for my users. It was frustrating to carry on with my testing because I wanted to change it. In retrospect, I wish I spent a bit more time on my high-fidelity wireframes, including getting some feedback from other designers before putting it in front of users.

• What could I have done better? Understanding the flow of the app was difficult. I could have done a better job mapping out the flow of the app feature in advance of designing it. In fact, once I created my low-fi wireframes, I had to go back to fix my user flows and task flows to match up with the new wireframes.

• What did I learn? This was a great project in really understanding how non-linear the design process is. In doing this project, it emphasized the important of keeping documents organized, including artboards in Sketch and research documents.

Next Steps

With more time, since I made major changes to the potential screen, I would liked to do more usability testing. Additionally, I would like to flesh out the savings feature with the following:

• Adding specific savings buckets where users can save for specific items and goals

• Partnering with an investment fund to offer ETF’s to our users

• Partnering with an IRA company to offer retirement plans to our users