Recurring Invoicing
As a sibling to the Invoice product, Recurring Invoices allows a business owner to schedule multiple invoices to the same client, on a pre-defined schedule.
The goal is to ‘automate’ as much of the invoice process as possible, including creation of each invoice, sending to a client, and getting the invoice paid.
Many of the key learnings from regular invoices were used in this design, including the invoice create interface, and the usage of a workflow to guide the user through the creation process.
In order to maintain design consistency, the recurring invoice create interface is the same as a regular invoice.
Applying the proven design principles from regular invoices, we designed a workflow to guide a user through the details of a recurring invoice.
The four steps are:
1. Create the invoice and indicate line items
2. Set the frequency and schedule
3. Choose how each invoice will be paid
4. Choose how each invoice will be sent to the client
The schedule step has a dynamic design component where options change based on user input.
For example, if the user chooses Weekly, they are prompted to choose a day of the week (e.g. Monday, Tuesday, Wednesday etc.). If the user chooses Monthly, they are asked to choose a day of the month (e.g. First, Last, 2nd, 3rd, 4th etc.).
This aids with ease of comprehension of the schedule, and the copy choices make it easy to read the options as a normal paragraph.
The payment step is critical to how fast the business owner gets paid, and also critical to Wave’s revenue from fees on credit card payment.
The design challenge was to offer the user both payment options (credit card or manual), while suggesting the automated credit card payment method.
As result, the Get Paid step clearly emphasizes automatic payments, with a text callout to switch to manual payments near the bottom.
Choosing the correct default option is a design pattern used across Wave products to streamline the user’s journey, and at the same time contribute to conversion funnels.
The credit card form is integrated in the Get Paid step if the business owner has the client’s credit card information available.
If the business owner has a saved credit card on file, we show a list of available cards to charge, and default to the first eligible card.
The last step is about choosing how the invoice will be sent to the client.
The send form is consistent with the one from regular invoicing, together with a preview of what the email will look to the customer.
The design choice was to default to automated sending of each invoice, which saves the business owner time and helps them get paid faster.
Once all four steps are completed, the design goal was to provide a final ‘check’ for the user, to reduce any information gaps as to how the automated invoice will be created, sent, and paid.
A key piece of information here is when the ‘first invoice’ in the schedule will be sent.
The user has a specific call-to-action to approve the recurring invoice, so there is little room for confusion.
The recurring invoice is now active. And the first invoice date is again communicated in the success notification banner.
The recurring invoice is now active. And the first invoice date is again communicated in the success notification banner.