Dec 16, 2023
CREDpay checkout, best checkout is no checkout
“Best checkout is no checkout”, the pursuit of building the most seamless and functional checkout experience, that scales.
Checkout was my first project at CRED, ~4.5 years back, we only had credit card bill payments as a product offering back then. We didn't have a payment system of our own, it was Justpay for us. We had a contract that the design language would be still CRED, so my designs were developed by the Justpay engineering team.
We have come far, CREDpay today is a much more evolved and mature (we built our own SDK) payment platform supporting on-us payments like credit card bill payments, rent payments, EMI payments for CREDcash, utility bill payments, UPI payments, and off-deck payments for different online merchants like Swiggy, Dunzo, Amazon, etc. all Razorpay gateway merchants, Shopify gateway merchants, and much more.
We also launched CRED balance, which is a platform wallet housing user’s cashback earned which users can redeem while paying bills. And we also launched a payment option, CRED flash, it’s a BNPL credit line that makes all your payments a single swipe. We also designed our payment success sound!
So how did we go about building a payment system that is fast and reliable?
Design had a major role to play in this journey. The design philosophy of this part of CRED is quite different from the rest of the app’s design. Why is that?
Some of CRED’s design principles:
All users are not customers, it’s about getting it to work incredibly well for a smaller set of people
The joy of achieving the goal is as important as achieving the goal itself
Simplicity is not all we need
Beauty is subjective, but good design is always beautiful
Optimizing for “functionality” alone is a horrible idea
Aesthetics is a v0 feature
Build flamboyant experiences, and have some song and dance in the show.
Utilities need to have a design that only makes the problem disappear, unfortunately, we aren’t only a utility payments app, except our payments experience, which is one of our features.
While designing for money matters, one needs to keep it simple, and to the point. If you run crazy flying lotties in loader states, the user will get anxious.
So keeping in mind these differences, our payment flow is quite crisp and very functional. It gives you only the information you need.
One of the most important decisions that worked in our favour was instead of taking the user to a new page (which most other Indian apps do), we kept it like a bottom sheet which makes it lighter and keeps the user in the context of where they came from. The user feels more in control and confident about taking the next step.
The scalability of the systems comes from rock solid information structures.