Overview

Invoicing and payments made easy

Viewpost is a B2B and B2C network for electronic invoicing and payments. The goal of Viewpost is to help expedite the invoicing and payment process and provide transparency of to the biller and the billee through the platform.  


My Role

Lead designer 

I was brought onboard as a UX designer on a team with a Design Manager, a Visual Designer and two Product Managers. I led and implemented a new user research strategy which meant talking to users on a more regular basis and conducting usability studies out of our San Francisco office. I lead the recurring invoices project and did the underlying user flows and wireframes. Throughout the project I brainstormed and got feedback from my team and key stakeholders for shared ownership. 

The team

I worked closely with the product manager, my UX Design manager and Visual Designer

Deliverables

Research summary, flows, & wireframes


Challenge

Simplify & Clarify 

Problem

Recurring invoices was one of the primary issues from the customer support team. Users were confused as to how to set-up recurring invoices, once they were set-up how to edit them, and confused as to why their were conflicting dates on their invoices. 

 

Solution

I simplified the recurring invoices feature by changing the placement of the recurring CTA and the edit CTA for easier discoverability. Additionally, I solved the confusion about invoice dates by simplifying the recurring bills flow. 

Below is the finished product demo

Discover

Understanding user pain-points

I spoke with customer service about the main issues around recurring payments to understand what we needed to prioritize when redesigning the recurring invoice feature. I spoke to five users to make sure I understood their specific pain-points and their primary goals.  

Comparative Analysis

I looked at our key competitors including bills.com, Bonsai, Quickbooks, and AND CO. Each had recurring payments either before as a separate invoice, gave the option after the invoice was complete or in the invoice. I looked at these 3 different options and chose to keep the recurring feature in the invoice. I did this because our customers were used to the recurring feature being offered in the invoice. I looked at the two other options. Before didn't work because they would be unable to easily switch between a regular invoice and a recurring invoice. And with it after users were confused  If users had to choose to make it recurring before they were in the invoice they were unable to switch from recurring to a regular invoice and if they needed to switch had to reenter in all of their invoice details. 


Define

User flows to understand complex interactions

I created user flows for both creating recurring invoice and editing user invoices. It was important to understand the different paths users could take to get to both these functions and make sure that nothing was overlooked when designing the wireframes. Before handoff, I put the final wireframes in these flows for the developers to clearly understand the interactions. 

Recurring invoice flow

Click image to enlarge

Editing a recurring invoice flow

Click image to enlarge


Deliver

Final handoff is never the final handoff

I worked with our visual designer to make sure that all of the UI was good to go and created a clickable prototype with InVision. I worked closely with the developers as they implement the changes. The final wireframes are always more of a conversation with the developers rather than a handoff. Additionally, I consulted with the developers before starting the design to understand development constraints. 

Final Wireframes - Desktop


Final Wireframes - Mobile

I updated the mobile wireframes effected by the recurring changes. 
(Click images to enlarge)


Next steps

Do we need recurring billing?

After redesigning the recurring invoices there is question as to whether adding a recurring billing option would help users and how recurring billing would work with auto pay. To discover if this is necessary we need to go back to our users and understand if and how this would help them with their billing needs.