Joist Payments is a streamlined payment solution within Joist platform that allows trade contractors to process credit card, e-check payments on online & offline. As the sole product designer, I was responsible for early user research, interaction & visual design, prototypes on iOS, Android, Web.
Many Joist users are small to medium size businesses who are extremely busy managing everything from doing actual work, managing clients & sub-contractors, dealing with paperwork, etc. Taking time out of their busy schedule to pick up payments can mean losing other job opportunities, impacting other projects, or losing valuable time that they can spend with their family.
The goal of the project was to seamlessly integrate a payments solution to Joist platform, that allows users to save their valuable time and offer flexible and reliable payment options to their clients.
To kick off, we held 10 in-depth interviews with local contractors to understand their current process and pain points around payments.
Common challenges they face are:
• Losing valuable time for picking up the payments in person.
• Juggling multiple apps to manage projects, invoices, and process payments.
Contractors needed a comprehensive solution that allows them to do everything above in one place.
It was critical to have a clear understanding of how the payment service works before starting the design. I worked closely with our engineering lead and WePay engineers to understand how the payment service works, its limitations, and evaluated all the available integration options to decide the best approach that works with our bandwidth, timeline, and goal.
Different checkout states and payments account states
Joist users can start accepting an online payment by simply turning on the payment option. This creates a payment account behind the scene and enables them to accept a single online payment. Once their first payment is received, an automated email gets triggered and guides users to submit their business & bank information to finish the registration, and collect their payment.
One touch sign up
How it works dialog
Desktop & mobile versions of the client's webpage
An online payment works great for collecting payments remotely but when users are at the job site with their client, they need a quicker option to process a payment right on the spot.
We support this with a simple to use card reader that works right out of the box with Joist Payments.
Sample of the card reader flow
When a user forgot to charge their card reader, or they forgot to bring it with them. There’s an option to manually key in a card payment without the reader.
Credit card manual entry
iOS Card reader animation prototype
Joist payments now generates 75%+ of the company’s total revenue and plays a critical part of many contractors’ business.