Grouploop Cost-Sharing App

MY ROLE
UX/UI, wireframes, User research, Illustration, Visual design, Animation, microcopy in collaboration with the team and product owner.

GOAL
Spending time with friends and family is important. So is being able to take trips, go out and do big things with them, without worrying about who owes who for what. That's why we made Grouploop. So that people could painlessly track expenses they were sharing without a spreadsheet and then pay each other back easily.

Grouploop was a pilot project for Capital One. As a pilot, my team and I had freedom in the interactions, and visual language.  

Product Owner: Adam Zedler
UX Director: Shannan Hsiao

 

 
 

Process

COMPETITVE ANALYSIS
Focusing on payment and social apps like Venmo, Square Cash, Evite, Instagram, Snapchat, Pinterest and Google Wallet, I created flows to better see and understand the thinking behind these products.

TEAM SKETCHING WORKSHOPS
Collaborating with the product and development teams, I held sketching sessions to get all the good ideas out in the open, build stakeholder consensus and lend transparency to the process. 
 

 
 
 Early whiteboard sketches from one of the first team meetings, during which we together established 3 core user stories.

Early whiteboard sketches from one of the first team meetings, during which we together established 3 core user stories.

 
 
paper_prototypes.jpg

PAPER PROTOTYPES FIRST
I made paper prototypes of different flows and went through them with the team. Prior to implementation we tested these low-fidelity flows in cafes to see where users were confused and to get feedback without the distraction of their feelings about visual design.


 

 

 

Challenges

CONTINUOUS ITERATION
During this process there was a lot of iteration. About one month into the project, our team was informed that legally we couldn't currently include payments, which had been a key part of our plan. We pivoted, went wide and got really interested in the "event" aspect of things before pairing the idea down to its simple event essence and creating a simplified MVP to launch at SXSW in March of 2016.

MOVING FAST IN SPITE OF ENTERPRISE FRAMEWORKS
Early one, we established a team motto of getting things done and apologizing later. The tech team established key relationships that enabled us to push through and launch in the period of a few months –rather than years.

A SUMMARY SCREEN FOR EVERYONE
From the beginning, Grouploop was to be an iOS only pilot, yet as we all know, not everyone has an iOS device. 

While knowing from research (and life) that people want to know about themselves first, due to company and technology issues we couldn't initially create event summaries specifically for the user who's account it was. Thus I had to iterate and usability test a lot to get to an easily understandable summary screen. Thankfully the product owner was happy to buy Peet's gift cards and visit coffeeshops with me, soliciting continuous feedback on design prototypes along the way. 

And we had to take into account there being dummy users who wouldn't be able to download the app but could receive a summary via email of next steps.

summary_screen_should_add_longer.jpg

Visual Design & Illustration

One morning I made a sketch of a simple blue bear character to propose as mascot. He and his friends would be able to visually describe in a playful way how all different kinds of people could use Grouploop to do great things together.

My team loved the bears. When we tested with a high-fidelity InVision prototype, users loved the bears too so they stayed.

 

 
 

Simplified MVP flow

 
 Here are the high fidelity flows of the MVP that were developed. 

Here are the high fidelity flows of the MVP that were developed. 

 

SXSW SWAG
 I made a simple explanatory animation to explain the app and designed cards, stickers, and lightweight hoodies to publicize the app and build emotional engagement for the app. People couldn't get enough of the bears!

 
 Moo Cards did a wonderful job printing matte business cards and sharp stickers.

Moo Cards did a wonderful job printing matte business cards and sharp stickers.

 

What we learned, changed and improved

IT'S THE LITTLE THINGS
In the rush to get the app to the App Store in time, there were so many touchpoints that needed love. Starting with the verification email. At launch it looked like the image on the left, sad default Capital One verification email. As we weren't even mentioning our association with the company, I quickly designed a more appropriate experience for our users.

THE IMPORTANCE EXPLAINING WHY
We noticed watching users download that if they didn't allow the app access to their contacts, it didn't do very much. So I added an explanatory heads-up-we're-going-to-ask-for-your-contacts screen which reduced this behavior by 24%.

heads_up_contacts.jpg

 

ILLUSTRATING WHAT IT'S ALL ABOUT
Next, I had too much fun making illustrations for the image carousel while the team figured out what would be necessary for users to upload their own event photos.

 
 

 

WEB PRESENCE
Having launched the app in the App Store and to the world at SXSW,  we still had zero web presence. My mentor, Kelly Gagnon joined and made the app's introduction screens. I designed a simple, responsive marketing site. (Once the user scrolled past the first call to action module, a shorter sticky header appeared with the button. )

 
Grouploop_marketing_site_mobile.jpg
Grouploop_marketing_site_DT.jpg

 

FINALLY, THE BUSINESS CASE
The biggest challenge ended up being lack of a business case. So just as grouploop was getting great and tackling this very real human problem, we had to shut it down.

As far as I know, however, there is still a huge demand amongst my friends' parents. Hopefully, they've found a solution by now

shutting_down.jpg