1.
Foursquare + Visa
Mobile Wallet
Rafaela Laus | Amanda Yarmolich | Chhunpora Rith | Aicha Doucoure
Student Project for General Assembly
User Experience Design Immersive Fall 2013
Tuesday, October 1, 2013

2.
We created a mobile wallet that lives in the Foursquare app to
enhance the experience of existing Foursquare users by
allowing consumers to walk in a store and easily pay, keep
track of purchases and accrue reward points from repeated
visits.
The Challenge: Create a mobile payment system within
the existing Foursquare app.
The Solution: A mobile wallet.
Tuesday, October 1, 2013

3.
KEY SCREENS AND FEATURES
https://popapp.in/w#!/projects/
524501e94c7a8a7a47002876/preview
Tuesday, October 1, 2013

4.
PLANNING
Tuesday, October 1, 2013

5.
DESIGN RESEARCH
Method:
We created a survey and received over 100 responses
from Reddit, Facebook, LinkedIn and Fitocracy, in addition
to our in-person surveys/interviews.We asked individuals
how they share information online, preferred social
networks, and financial behavior using web or mobile
options.
Findings:
10 of those that filled out the survey use Foursquare.
Almost all use the “big 3” social networking websites,
Facebook, Instagram and Twitter. In addition, we
determined that less than 5% use Google Wallet along
with other mobile payment options. Not many are aware
that mobile wallets exist, and for those that do, most
expressed concerns about privacy and security.
Opportunities Identified:
Create a trusted mobile wallet powered by Visa that lives
within the Foursquare app, which allows users to securely
store their card or account information. We narrowed
down the target market based on Foursquare’s current
users and potential users who are open to the idea of
using a mobile wallet.
Tuesday, October 1, 2013

6.
APP FLOW
Tuesday, October 1, 2013

7.
PERSONAS
Tuesday, October 1, 2013

8.
PERSONAS
Tuesday, October 1, 2013

9.
PERSONAS
Tuesday, October 1, 2013

10.
CONCEPTUAL IDEATION
Tuesday, October 1, 2013

11.
At work Opens Foursquare app
Finds a place at proximity
Reserves a table at Palomino for two
Selects arrival time
Greg is looking for a place to dine
with his girlfriend close to work... it’s already late
SCENARIOS
GREG
Tuesday, October 1, 2013

12.
At Palomino
On arrival, Greg checks inThe host recognizes Greg
via picture
The hostess leads Greg and his girlfriend
to their table
Greg is ready for the check
Greg managed to work late and make his girlfriend happy!
Greg pays with his Foursquare WalletThe hostess sends the bill to Greg’s phone
Greg choses to receive the receipt via email
SCENARIOS
GREG
Tuesday, October 1, 2013

13.
On the Train Opens Foursquare app
Finds her usual coffee shop page
Orders her usual coffee
Selects pick up time
Teresa is late & stressed
Pays with her rewards points via the wallet
Views her receipt
At home
SCENARIOS
TERESA
Tuesday, October 1, 2013

14.
At Java Jungle Coffee Teressa checks in to notify she’s there
Madeline recognizes Teresa
via picture
iPad at Pick up Counter
Madeline hands Teresa
her Latte
iPhone buzzes to greet Teresa
Teresa is on time & happy!
SCENARIOS
TERESA
Tuesday, October 1, 2013

15.
Method:
We ideated and sketched out possible user scenarios.
- The usual joints vs. finding new place
- New order vs. usual
- Dining in vs To go orders
And came up with the flowing user journeys:
AWARENESS
- Awareness of the new wallet service
SET UP AND FIRST RUN
- First time walk-through for existing and new Foursquare
users
- setting up an wallet account
CORE PRODUCT EXPERIENCE
- Finding a new or usual food location
- Navigating through the restaurant reservation system
- Placing a to-go order and setting the pick up time
- Paying via wallet dollars or rewards points
- Receiving the receipt
- Editing wallet payment information
Opportunities Identified:
Simplification of main menu: icon based, vs. sliding menu
Add more “human” touch to technology
Tuesday, October 1, 2013

16.
DESIGN ITERATION | DESIGN HYPOTHESIS
FIRST ITERATION
Method:
Using our user research we set out to sketch our first
iterations of what we identified to be our key screens.
We tried to keep our users in mind in terms of
navigation, making sure everything was simple, clear,
and easy to navigate.
Findings:
From these sketches we didn’t conduct any user
testing, so this was more or less an exercise in
getting our ideas on paper and trying to work things
out. Technical details were worked out more in
OmniGraffle in Iteration 2.
Opportunities Identified:
This is more complicated than originally thought. We
decided that the in person experience would also be
important and we had to think beyond the app.
Tuesday, October 1, 2013

17.
DESIGN ITERATION | DESIGN HYPOTHESIS
SECOND ITERATION
Method:
Based on our first user testing, we incorporated user
feedback and and added features. We converted the
paper prototypes into digital wireframes.
Findings:
We identified holes and irregular/ unnatural flows
based on user testing behaviors. Taking into
consideration the ease of gesture, and rewording
content for effortless scanning.
Opportunities Identified:
Keeping simple and straightforward directionality adds
to the ease of use of the product. Logos are an
essential element in keeping the noise level down
which in turn creates an elegant but deceptively
simple design.
Tuesday, October 1, 2013

18.
DESIGN ITERATION | DESIGN HYPOTHESIS
PROTOTYPE
Method:
Using the POP app prototype, we ventured
around downtown San Francisco to test the
flow of the app. We tested ~8 individuals to
identify any task confusion.
Findings:
Most people do not read and rely on logos
for comprehension. Most understand the
task and flow of the prototype.
Opportunities Identified:
Eliminate half of the words and replace them
with logos. Less words complement ease of
use and replace some pages with pop-ups
to prevent clutter.
Tuesday, October 1, 2013

19.
SITE MAP
Tuesday, October 1, 2013

20.
Flow: Find Nearby
USER FLOW
GREG
Tuesday, October 1, 2013

21.
Flow: Make Reservation
USER FLOW
GREG
Tuesday, October 1, 2013

22.
Flow: Dining In
Greg arrives and checks in on foursquare... Meanwhile the host receives notice
of Greg’s check in.
Greg’s picture glows on the iPad app the restaurant has, the host recognizes
Greg and escorts him and his girlfriend to their seats.
USER FLOW
GREG
Bon Appetit!
Tuesday, October 1, 2013

23.
Flow: Confirm Transaction
They enjoy their meal and at the end of the evening the waiter asks if Greg would like anything else, Greg
replies no and the waiter hits the button on the iPhone he has used as a POS that send the bill to Greg’s
foursquare wallet account.
Greg receives notice of the receipt, reviews, selects the tip amount, selects his card, selects his receipt type
and completes the transaction.
Tuesday, October 1, 2013

24.
Flow: Search for Location: Frequent Buyer
USER FLOW
TERESA
Tuesday, October 1, 2013

25.
Flow: Menu Closed: Menu Open
USER FLOW
TERESA
Tuesday, October 1, 2013

26.
Flow: To Go Order: From Scratch
USER FLOW
TERESA
Tuesday, October 1, 2013

27.
Flow: Confirm Order: Payment: Receipt
USER FLOW
TERESA
Tuesday, October 1, 2013

28.
Flow: Payment: Redeem Reward: Receipt
USER FLOW
TERESA
Tuesday, October 1, 2013

29.
Tuesday, October 1, 2013

30.
Tuesday, October 1, 2013

31.
Tuesday, October 1, 2013

32.
THANK YOU!
Tuesday, October 1, 2013