Getting Paid in 7 Inches or Less (with notes)

Many of us now hop out of cabs without handing anything to the driver. We walk away with our morning coffee, offering the barista only a smile in return. We purchase sofas while riding the bus. The growing ubiquity of mobile devices is causing the biggest shift in commerce since the dawn of the web. Only this time, it’s escaping the confines of our computers and spilling out into every aspect of our daily lives. As designers and technologists, we need to consider the implications of this shift on the things we build, and the people who use them.

In this presentation, I explore the global shift to mobile commerce - which is happening even faster than you think. We will look at emerging hardware and software technologies behind an explosion of experimentation in how we pay for almost everything. We’ll also look at the ways designers and developers can create great experiences in the world of mobile commerce.

A version without speaker notes is also available at https://speakerdeck.com/mvboeke/getting-paid-in-7-inches-or-less

Transcript

1. Getting paid in
   7 Inches or less
   Michael Boeke | @mvboeke
   Hi, I’m Michael Boeke. I’m a designer who has worked at few different startups in Chicago. I currently work as a product manager at Braintree. I’m here to
   talk about commerce - specifically getting paid - on mobile devices.
   

   View Slide

2. 2
   flic.kr/p/6gL93t
   Why commerce? As creative people, we sometimes like to distance ourselves from concerns about money - like selling things means that we are selling
   out. But commerce is a fundamental human activity. It can be one of the most meaningful ways humans communicate with each other, and I think it’s why
   the marketplace has long been central to human communities. Photo: https://flic.kr/p/6gL93t
   

   View Slide

3. flic.kr/p/6gL93t
   People who don’t even speak the same language find ways to trade with each other. And commerce binds us together. No two countries that have a
   McDonalds have ever gone to war against each other. As a designer, I find great satisfaction in facilitating these interactions. https://flic.kr/p/7bxLDZ
   

   View Slide

4. Image: Uber
   And this is an excited time to be working on this problem, as we are seeing radical shift in commerce. I think most of us in this crowd have had the
   experience of hopping out of a cab without handing the driver any form of a payment. Thanks to this amazing service from Uber.
   

   View Slide

5. Image: Blue Bottle
   Some of us might even have had a similar experience when buying a cup of hipster coffee, thanks to an app that is running on our phone and knows we
   are at the coffee shop. Side note, one of the ways you can tell if your coffee is hipster coffee, is if there is no sign on the coffee shop. A lot of new and
   amazing things are happening with how we pay, and that’s what drew me to working at Braintree.
   

   View Slide

6. We simplify payments for

   thousands of amazing companies
   Braintree is a full-stack payments platform that makes it
   easy to accept payments in your app or on your website.
   6
   If you’re not familiar with Braintree, we are a payments platform that makes it easy for developers to accept payment in their apps and on their website.
   We’ve been around for a five years, but you may have heard that we were recently acquired by PayPal.
   

   View Slide

7. 7
   Our Clients
   Braintree powers payments for many of the companies that designers and developers love, like Fab, GitHub, and 37 Signals.
   

   View Slide

8. Pay your friends instantly
   with the first fun and social
   payment platform. Make
   ultra secure transactions
   without any fees.
   Braintree also has fantastic payments app called Venmo, which ensures you’ll never owe your friends money again. It makes it super simple to pay friends
   for things like cab rides, bar tabs, and even rent or utilities.
   

   View Slide

9. 9
   Mobile Payments Leader
   We power the fastest growing and most
   innovative mobile commerce experiences
   Our payments platform handles payments for some of the leaders in mobile commerce. As we started talking with then and digging into their business a
   few years ago, we realized a startling truth.
   

   View Slide

10. @BenedictEvans
    Mobile is eating the world
    The Startling Truth:
    As Benedict Evans says, mobile is eating the world. What exactly does that mean?
    

    View Slide

11. 11
    Mobile is Eating The World
    Source: Benedict Evans Mobile is Eating the World (page 6)
    Data: Enders Analysis
    1,250
    1,000
    750
    500
    250
    0
    1995 1997 1999 2001 2003 2005 2007 2009 2011 2013e
    GLOBAL ANNUAL UNIT SALES (M)
    PCs Smartphones & tablets
    Here is a slide from one of Benedict’s talks that crisply illustrates just how mobile is eating the world. Starting in 2011 mobile devices start outselling
    traditional computers like desktops and notebooks. In 2012 mobile device sales utterly eclipsed computer sales, and he projection for 2013 is that the rate
    mobile devices sales growth will continue to increase, shipping more than 3x as many mobile devices as traditional computers.
    

    View Slide

12. 12
    Mobile is Eating The World
    Source: Mary Meeker and Liang Wu, 2013 Internet Trends (page 45)
    A large chunk of that growth is thanks to an all-new computing device, which is being adopted at a faster rate than previous waves of personal computing
    technology. This chart from Mary Meeker’s celebrated Internet Trends presentation for 2013, shows that it took more than 10 years for notebook computer
    sales to eclipse desktops. However, the tablet category has existed in earnest for just 3 short years, and tablets already outsell laptops and desktops.
    

    View Slide

13. Mobile traffic as % of global internet traffic
    Mary Meeker / KPCB / Internet Trends D11 Conference
    Source: StatCounter Global Stats, 5/13. Note that PC-based internet data bolstered by streaming.
    25%
    20%
    15%
    10%
    5%
    0
    12/08 12/09
    30%
    12/10 12/11 12/12 12/13E 12/14E
    0.9%
    in 5/09
    2.4%
    in 5/10
    6%
    in 5/11
    10%
    in 5/12
    15%
    in 5/13
    Trendline
    Growing 1.5x
    per year
    So, there are a ton of new mobile devices entering the world each month. Does that have any effect on people’s behavior? Well if we look at global internet
    traffic on mobile devices, it’s been growing at about 1.5x each year. In 2014, mobile devices will likely account for about a third of all internet traffic.
    

    View Slide

14. 14
    Mobile is eating the world
    Source: Comscore
    55%
    55% of online shopping minutes already occur on mobile
    For a long time, the common wisdom of retail was that customers used their mobile devices for tasks like email and social networking, but when they
    wanted to shop, they went to a store or a website. In the last year or so, I think everyone has woken up to the fact that mobile is becoming the dominant
    channel for shopping. And it’s not just in the future. By at least one important metric, we’ve already crossed a tipping point. More than half of all time
    spent shopping online now happens on mobile devices. That number is only going to grow.
    

    View Slide

15. 15
    Mobile is eating the world
    55% of online shopping minutes already occur on mobile
    Source: Comscore
    That number is only going to grow.
    

    View Slide

16. Merchandising
    16
    Checkout Context
    These are three significant challenges to designing for commerce on mobile devices. Merchandising an array of products on a small display. Entering
    payment information on a touchscreen device at checkout. Using the contextual information from the device to address the first two challenges.
    

    View Slide

17. -Theodore Sturgeon
    90% of everything is crap
    Sturgeon’s Law:
    I love Sturgeon’s law, which states that “90% of everything is crap”. It applies to most things in life, including merchandising on a mobile screen. For
    merchandising, merchants need to combine elegant design with different types of data to quickly show a mobile user the exact product they want or need.
    Even if the items a retailer carries are high quality, their just crap if they are aren’t relevant to the customer.
    

    View Slide

18. 18
    (Image goes here)
    Amazon - the desktop warehouse club
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    Merchandising on a laptop display is like Costco - you can use the space to offer customers the widest variety possible. I’m certain Amazon is using a ton
    of smart data put this screen together. But with this much space, they don’t have to prioritize that hard. Let’s break this down: They have 3 different
    streams of products presented in the main body. Then there are 6 different ads displayed on the right rail. Plus there is the catchall navigation on the left.
    

    View Slide

19. 19
    Fab - the mobile boutique
    1
    1
    Merchandising on mobile is more like a convenience store or fashion boutique - you have limited space, so you need to make sure you have exactly what
    the customer is looking for, or something that immediately inspires them to purchase. Looking at retailer like Fab, who does a major portion of their sales
    through their apps, we can see they have just one stream - full of stuff I want to buy! Look at that hello kitty Uglydoll. I want to order one of those for my
    daughter right now. With my phone, I can.
    

    View Slide

20. Location services
    Buying history
    Cloud Data
    Luckily, mobile devices provide some additional context that can be used for merchandising, to help provide the most relevant choices for customers. The
    include location services, buying history across apps, and cloud data. We are just beginning to tap into this stuff. One of the good early examples of this is
    Google Now. Here we can see the header design is based off my location in Chicago, and before I even search for anything, it shows me information I
    might be interested in like, flight info from my Gmail account. Whether we are working on a shopping site, or a Google apps, as designers, we need to
    think about how these new tools inform our design decisions.
    

    View Slide

21. Merchandising
    21
    Checkout Context
    So that was a little about the first challenge, merchandising. Next, let’s take a look at checkout on a mobile device, and see where the challenges are.
    

    View Slide

22. What’s hard about
    checkout on mobile?
    22
    What’s hard about checkout on mobile? In a word: touchscreens. We don’t have real keyboards, we have these fiddly little pieces of glass, with tiny buttons
    and no tactile feedback. What’s more, users are often trying to type in difficult environments like walking down the street, or riding the bus. We have to
    find easier ways to get users over the hump of entering payment information.
    

    View Slide

23. -Eric S. Raymond
    You are serving the machine
    When you tell a computer things it can deduce,
    As we thought about this problem at Braintree, we realized that context could help address the checkout problem. And our approach is summed up nicely
    in this quote from Eric Raymond. “Every time you require a human to tell a computer things that it already knows or can deduce, you are making a human
    serve the machine.”
    

    View Slide

24. You may be thinking “Serving machines isn’t so bad…robots are awesome! We should be friends.” But it’s a short hop from this…
    

    View Slide

25. Hey baby,
    wanna kill all
    humans?
    …to this. So at Braintree, we took the bold stance that humans must come first! And this is what we came up with.
    

    View Slide

26. One Touch checkout on the first purchase
    26
    Mobile Checkout
    Venmo Touch: one touch checkout on the first purchase. Let’s take a look at how it works.
    

    View Slide

27. Venmo Touch
    Enter your
    card info once
    1
    The first time you go to make a purchase in an app that’s part of the Venmo Touch network, you enter your payment info, credit card number, expiration
    date, and shipping address one time, and automatically store it for later use in other apps on your mobile device.
    

    View Slide

28. Venmo Touch
    Check out with
    a single touch...
    2
    Next time you come back to that app, you can check out with just one touch. This is the repeat purchase experience we’ve come to expect from most
    retailers.
    

    View Slide

29. Venmo Touch
    

    View Slide

30. Venmo Touch
    ...across multiple
    mobile apps
    3
    But it gets really interesting when you download other apps in the Venmo Touch network, because you can check out with just one touch in those apps
    too. If you enter your payment information in the Belly app, then when you go to buy some new clothes at Trunk Club for the first time, you dont have to
    enter any information at all. You can just touch the button to use the same credit card you used with Belly.
    

    View Slide

31. 31
    No redirecting to other pages or apps
    !
    No Venmo account or signup required
    !
    Lightweight but strong security verification
    Seamless
    PAY
    Context on the mobile device enables Venmo Touch to do some remarkable things. User don’t have to download another app to get started, they just join
    the network as part of checkout in one of their existing apps. They don’t have to sign up for a Venmo account to get the benefit or Venmo Touch either.
    We can also deliver strong security in a lightweight fashion that doesn’t require users to remember or type long passwords.
    

    View Slide

32. Image: Card.io
    Venmo Touch is an all-software approach to the checkout problem, but there are some interesting approaches that take advantage of mobile hardware.
    Card.io uses your phone’s camera to capture credit card information, so you don’t have to type it in. It’s cool experience that always feels like science
    fiction to me.
    

    View Slide

33. Image: Apple
    And more sci-fi hardware is entering the world. Apple introduced biometric scanning with their iPhone 5S. Instead of entering an iTunes password, users
    can scan their fingerprint to purchase apps, music, and movies from the iTunes store.
    

    View Slide

34. Image: Samsung/PayPal
    Apple isn’t the only phone manufacturer to introduce fingerprint recognition. HTC and Samsung include it on their flagship models now. Samsung even
    works with purchasing physical things - not just digital downloads. You can use a Samsung phone with PayPal Here to order your food and pay for it with
    your fingerprint, and it’s ready for pickup by the time you walk to the restaurant.
    

    View Slide

35. 35
    Beyond Mobile
    Image: PayPal
    So there are lots of advances in technology within our devices, but there are also big changes coming with introduction of beacons, which will transform
    how our mobile devices react to the environment around us. We are seeing the launch of a variety of beacon technologies, including PayPal Beacon,
    iBeacon, Estimote. The PayPal beacon will plug into a register and enable checkout automatically when your phone is nearby.
    

    View Slide

36. 36
    Beyond Mobile
    Image: Estimote
    Estimote is a startup focused on beacons in a retail setting, like offering deals to devices nearby store displays. For instance, a customer lingering around a
    shoe rack might get a coupon to purchase the shoes on display.
    

    View Slide

37. This technology feels like it’s from a sci-fi movie or maybe somewhere magical. As designers, it can make us feel like dashing young wizards. But as every
    Harry Potter fan knows, magic has a darks side as well.
    

    View Slide

38. 38
    Danger in Magic
    There is wonder in magic, but there is also danger. Your users could be scared off by automation that they think jeopardizes their privacy or security of
    their information. Even if you don’t give a damn about doing the right thing for you users, you have to think about how your product will be received.
    

    View Slide

39. Mike Monteiro, Mule Design
    You are directly responsible for
    what you put into the world.
    How Designers Destroyed the World
    Mike Monteiro gives a fantastic talk called “How Designers Destroyed the World”. It’s a tremendous call for ethics in design, and a reminder that as we are
    exploiting all of this contextual information from mobile devices, we have a responsibility to handle it carefully.
    

    View Slide

40. Cool
    40
    Creepy
    When building Venmo Touch, my colleague John Sturino camp up with the concept of the cool/creepy line. There was a lot of discussion about how we
    could provide the right information and messaging to make sure we ended up on the cool side of things.
    

    View Slide

41. Cool
    41
    Creepy
    If a user sees their sensitive show up somewhere unexpected, and they’re not sure how it got there, their going to find it disconcerting. That feeling may
    overwhelm any magic or benefit they receive from the feature.
    

    View Slide

42. Cool
    42
    Creepy
    If a user sees that their sensitive information is being used to make their life easier, they understand how the information got there, and they trust the
    company or app, then they are likely to think it’s cool.
    

    View Slide

43. 43
    Transparency Control
    How do we achieve this? Transparency and control. We offer our users transparency about how their information is being used, and give them control over
    their information, including intelligent defaults.
    

    View Slide

44. Transparency
    Control
    The team that designed the Venmo Touch UI, applied both of these principles. It clearly states what is going to happen (transparency), and offers a link to
    more detailed information. It also offers the user a choice about whether to participate or not (control).
    

    View Slide

45. If we do this right, we can get the best of both worlds - magic without the downsides.
    

    View Slide

46. Thank you.
    www.braintreepayments.com
    © 2013 Braintree Payment Solutions, LLC. All rights reserved.
    mvboeke
    @
    Thank you! If you’re interested in learning more about Braintree or Venmo Touch, please visit us at braintreepayments.com. You can also follow me on
    Twitter for more about design, startups and commerce.
    

    View Slide