Payments That Delight - Stripe

//Front-End Script

<script  
    src="https://checkout.stripe.com/checkout.js"
    class="stripe-button"
    data-key="public_key"
    data-amount="999"
    data-name="Emre Tekisalp"
    data-description="Will be Used for Good Beer Only!"
    data-image="https://stripe.com/img/documentation/checkout/marketplace.png"
    data-locale="auto"
    data-zip-code="true"
    data-bitcoin="true">
</script>  
//Back-End node.js Script

var stripe = require("stripe")("secret_key");  
var token = req.body.stripeToken;  
var charge = stripe.charges.create({  
    amount: 1000, // Amount in cents
    currency: "usd",
    source: token,
    description: "Example charge",
}, function(err, charge) {
    if (err) {
      // The card has been declined
    } else {
      res.sendFile(path+"success.html");
    }
});

20 lines of code - that's it! That's all it takes to receive payments thanks to Stripe's Payments product. Even someone with minimal coding and web/mobile developing experience, like me, can start accepting money in under an hour, from a ton of alternative channels - credit cards, ACH, Bitcoin, Alipay... you name it. As a "developer", it's hard not to fall in love with it. I wanted to take a look at Stripe Payments, what qualities I thought made it a breath of fresh air and how these qualities made Stripe a successful business on a rocket ship.

Payments that don't suck!

Putting together a payment stack is inherently unsexy. There are a lot of moving pieces that are necessary, yet had never been combined into a single solution before Stripe Payments. You had to open merchant accounts, establish product and business partnerships with payment processors, ensure PCI compliance, and many others, which in total take weeks, if not months. Although I had some familiarity with how cumbersome this was on hardware platforms from my days at Intel, I had no idea it was as much time and effort consuming for e-commerce as well.

Payments Flow

So how does the same process of accepting payments take place with Stripe? And why are users not only grateful with Stripe, but are in love with it and constantly talk about it like it's the next hot social media platform?

1) Simplicity

Stripe's "secret sauce" is simplicity. All human beings are better off when they can trade more, and Stripe Payments is laser focused at making it as simple as possible. As mentioned at the beginning of the post, it takes any developer under an hour to start testing payments with Stripe. The get started with the Checkout version of Payments, the steps you need to take are:

  • Register for an account (2 minutes)
  • Download the Stripe library for your preferred language (2 minutes)
  • Add the Checkout script to the front-end view file of your checkout page. This allows your site to collect payment details (4 minutes)
  • Add the server-side code to your back-end model to call the Stripe library. This allows your site to create a charge (4 minutes)
  • Test that the charge has gone through (1 minute)

If everything's gone well, your payment will be registered and waiting to be transferred to your bank account on your Stripe dashboard.

Dashboard

Another feature that makes developing and testing different use cases super easy is the Test mode. In Test mode, Stripe allows you to test all capabilities of its platform (apart from Radar, its fraud prevention product), without having to provide information on your business and conducting transactions with real money. You're provided with a list of dummy payment information that allow you to see what works and what doesn't.

Stripe isn't the first company that's tried to make the payments experience simpler. Some might say that PayPal achieved it to some extent via its hosted checkout experience. However this solution takes the customer away from the shop's website and takes them to PayPal's own checkout page. This adds a huge friction point to the checkout experience, and thus increases lost sales. According to the Baymard Institute, 27% of customers abandon a purchase during checkout because the process is too long or complicated. Stripe's solution, on the other hand, doesn't take the customer away from the shop. Rather, it provides a streamlined, mobile ready payment form that's as subtle, fast and functional as it can get.

Stripe Checkout

Last on the simplicity front is Stripe's fee structure: most Payment Gateways / Aggregators have a complicated fee structure with hidden costs (setup, compliance, transfer, etc) that creep up on the merchant. Stripe's is very transparent and simple:

  • 2.9% + 30ยข for credit and debit cards
  • 0.8% with a $5 cap for ACH and Bitcoin

Nothing else. It makes the merchant feel much better in an industry known to make excuses and overcomplicate things...

2) UX that delights

Greatly simplifying accepting payments has allowed Stripe to achieve "payments that don't suck". The delighting user experience it provides has created "payments that delight". That's why developers that use Stripe rave about the product and even sell it to their own friends on behalf of the company.

How did Stripe achieve this? By laser focusing on its core users: developers.

First of all, the documentation of Stripe is ridiculously thorough and easy to read. It allows even the most junior developer to easily navigate the requirements and steps. Not once did I have to search through Stack Overflow for missing steps and troubleshooting! What's even more delighting however are some of the small details: after you've created your account, the documentation automatically fills in your public and private API keys, remembers your programming language and location selections so you can just copy and paste the entire code! The team has gone to great lengths to ensure its core users have a delightful experience, while coding a payment stack - not necessarily enjoyable...

The same qualities shine in what the end user is exposed to as well. Although Payments stays in the background for the most part, Checkout is a prime example of how much Stripe can improve the end user (the customer of the merchant in this case) experience. It's beautifully put together in a couple of ways:

  • It shows the customer what type of card (Visa, MasterCard, etc) their card is as they type in the number. A basic (card schemes have a predetermined set of numbers that each account starts with) but useful feature that assures the user they are dealing with a safe and high quality merchant.

Checkout - Card Scheme

  • Users can opt to have their card details remembered. This is super handy as details are remembered across all other sites that use Stripe Checkout. Credentials are associated with the user's email and secured via 2-factor-authentication through text messages.

Checkout - Authentication

  • Once the user confirms the purchase, the purchase button transforms into a check mark to confirm that the payment information is correct. That, in reality, is what's happening in the background (Stripe confirms the card credentials at this stage, but doesn't charge the customer yet), but it's also good practice to let the customer know the stage the payment is in with subtle and reassuring cues.

Checkout - Confirmation

These qualities make Stripe Payments a breathtaking product not only because it is a joy to use it as a developer, but also because developers know that their customers will be delighted as well, even if they never know that they are using Stripe. Qualities that make a perfect B2B2C product...

3) Complete toolkit

Setting up credit card payments for your website in under an hour is no small feat. But the payment requirements of a merchant rarely consist only of credit cards and one geography. Stripe comes to the developer's rescue on this front as well - for the 25 (and counting) countries it's active in, it offers access to almost all available payment methods, whether it's direct debit (such as SEPA in the Euro zone), e-wallets (such as Alipay for China), or cryptocurrency (Bitcoin). And true to Stripe fashion, it's super simple to integrate most of these methods as well. For example, to include Bitcoin as a payment option, just add data-bitcoin="true" to the script tag for the Checkout button, and you're done. Some other methods (such as ACH in the U.S.) are a bit more complicated due to requirements such as account details and authentication, but are still way easier than existing solutions.

I focused on Stripe Payments' Checkout version in this post as it was my first exposure to and reason for falling in love with Stripe. As a very mature platform however, Stripe is highly customizable and supports a variety of different platforms. Starting with the core of its Payments product, Stripe.js, the platform allows developers to extend its power to many platforms, languages and form factors. I've integrated two versions of Stripe Payments (Checkout and forms with Stripe.js; both in test mode) on my own website, and the small amount of time this took for me is highly indicative of its flexibility.

Payments that delight (and worth $9b)

Stripe Payments' three defining qualities truly make it an exceptional product. It's super simple to use with a very clear and honest value proposition; delights its users with attention to detail and usability; and offers a complete toolkit to cater to almost all of its users' needs, when they need it to. It's really hard to have a product that balances such three qualities, but Stripe does so gracefully.

That is why Stripe's been on a rocket ship during the past 6 years. Their promise and actions to keep developers first and constantly improve the product to meet merchants' payment needs has made them the "operating system of commerce" on the web. Their Payments product is great, as expressed previously on multiple occasions, and has allowed the company to go through explosive revenue growth in its early days, as captured by Paul Graham.

PG Stripe

Although this was back in 2013, Stripe has continued this explosive growth to this day, to a point where 50% of all U.S. online consumers have purchased something using Stripe, and the company has recorded an estimated revenue of $450 million in 2015. They've managed this by expanding the three qualities that's made the Payments product great to other products with complementary value propositions, such as Connect for marketplaces, Radar for fraud prevention, Atlas for global commerce, amongst others.

IMHO, the best way to analyze their success though would be to look at how they are doing with their target customer base - developers. A simple Github search makes things quite obvious.

Stripe vs others

Not only does Stripe have the highest number of repos and code commits, they also have way less flagged issues than the 15 year old PayPal!

Flat world of payments

Stripe's already simple and amazing enough - what more can we ask? Although it is a god sent gift to developers and merchants, I think Stripe Payments can go even further in simplifying payments and making commerce easier for everyone.

Future Features

  • 2-Factor Authentication for Forms: I already lauded the SMS authentication feature included in the Checkout version of Payments. When building custom forms with Stripe.js, although developers can save the card credentials of customers for reuse, the 2-factor authentication (2FA) service is not provided. Stripe could expose this feature via Stripe.js and have more merchants start integrating 2FA for account protection. Developers can (and currently do) use other 2FA services, but most of them are complicated and costly. Stripe could make the whole process a lot easier, which will not only increase Payments' value proposition, but also be a catalyst for a larger market and more commerce on the web by making it securer.

  • Form Scripts: Another small yet valuable feature of Checkout is the small scripts that run as a customer fills out the form. Stripe could expose these through Stripe.js as well and give developers immediate access to simple checks - displaying credit card type, basic front-end checks for exp date and CVC number, etc, essentially allowing Checkout like functionality for custom forms. There might be several strategic reasons why Stripe wants to keep Checkout's high value compared to custom forms, but I still think empowering developers is good practice.

  • Call References and Tests in API Documentation: Although not a part of the actual product, as a documentation that developers refer to a lot when putting together their stacks, I believe the API documentation could do with some further additions (and upgrade itself to "Payments for Dummies" status). One would be to refer to the API calls each object is associated with. Right now the docs display the below for each object type. It would be very functional however if it were to display which call(s) and parameter(s) return the highlighted object. An even further improvement could be to have a self-executing environment on the right panel where the developer could change parameters and see how the API response changes (similar to the Jupyter notebook for Python). As it so happens, Stripe recently announced the acquisition of Runkit, which is a sandboxed JavaScript environment for node scripts - this might be an indication that they're already thinking of adding such a feature.

API Doc

All of the above suggestions are aimed at making it even easier to understand and develop with Stripe Payments. Simplicity is Stripe's secret sauce. That's what's making them the answer to the question "why is money (i.e. value) not as easy to send as an e-mail?". Stripe Payments should make sending and accepting money as easy as that, which in turn enables: i) more transactions to each person and merchant able to transact; ii) more people that are able to transact. Combine these two, and you get a multiplier effect on your business.

Payments is complicated. And Stripe is adding a ton of features every month, both on the product and the business side. Especially as they become more global, their approach to commerce can (and will) ease up a lot of the frictions present. One approach I had exercised here is on how to achieve faster payouts to global merchants, as currently they face delays anywhere from 2 days to weeks. I believe Stripe and its likes will have a key role in easing up the global supply of commerce with products such as Payments. That is, until payment methods such as this become the norm.

What I love about product in general, is that a company's approach to it (Simplicity, Delighting and Toolkit in Stripe's case), usually represents their approach to the whole business. In this case, what I have observed and loved with Stripe Payments seem to be true for Stripe overall as a company. The journey they started with Payments has put them on a rocket ship to become the first true "operating system for commerce". On the other hand, what it has meant to me, as a user and developer, is that now I feel a lot more empowered and willing to experiment with different ideas; ideas I know I can monetize! Although it's exciting to watch how Stripe grows and rolls out new products, it's way more exciting to think about what products developers using Stripe will come up with.