I wanted to make receiving an invoice a little bit better by creating a bit more colorful, nice invoice instead of the regular ol’ black and white monochrome typewriter font-like invoices from the past.
My business color is turquoise and so I used that color throughout my business card and my invoice. However, I’ve gotten the complaint a few times my invoice is ink-heavy and therefor people don’t prefer to print it, although they have to.
Below is a screenshot of a 3-page default invoice of mine. A frontpage with with the primary product and the client, a second page with the products and their description & individual prices and a end page with my business information. It starts with turquoise and ends with turquoise.
I know it’s ink-heavy, but how would I decrease the cost of printing my invoice, but trying to keep/create the happier experience.
In my opinion, simply adjusting the turquoise to black isn’t sufficient..
This is building on David Mulders answer, and things others have said but this is something I’ve wanted to do for a long time and have never got round to doing.
An Interactive Digital Invoice
Having the whole invoice system online is actually a great Idea. You are almost guaranteed that the invoice is going to be received via an internet enabled device (be it a desktop computer, laptop, tablet, smart phone etc) so why not take advantage of that fact.
It actually makes a lot of sense from a user experience point of view to give the client the ability to view, pay, query, download, and access any other after-sales services directly from the invoice you send. Getting an invoice, which is essentially a document telling you how much money you need to part with, isn’t usually something look forward to. Making the invoice about more than just parting with your money will make it a much less unpleasant experience.
Each item on the invoice can be expandable to reveal more info and actions for that item. You can include any deliverables, so any print files or digital downloads can be downloaded directly from the item in the invoice. You can give quick preview images too so the client isn’t forced to download the files if they aren’t sure what is what. If you provide support, that can be directly accessed from the item in the invoice. You can let the client query anything on the invoice by providing an easily accessible contact form.. It completely depends on your situation but the possibilities are endless.
There are plenty of online payment systems available so of course you can include a system to pay the directly from the invoice. Making this part as easy and painless as possible will definitely keep clients happy (or at least not unhappy).
Your design, as it is, doesn’t work very well as a printable invoice for the reasons others have pointed out. But as a digital invoice it makes more sense, and fits more with what people expect on digital platforms. You can easily use a CSS print stylesheet to provide a printer friendly version via a handy “Print Invoice” button. This will save your clients ink (costs) and make scanning and archiving easier (as go-junta pointed out).
You can even send a simplified version as an HTML email that would contain all the standard invoice information and that can then link directly to the online version if they need to download/query/pay etc.
I understand from your question that you may not have been thinking about something this complicated, but this is – in my opinion – how you ‘create an experience with an invoice’.
Something like this won’t be quick or easy to set up from scratch, but it should be easily automatable and will definitely be worth the effort. There are services that allow you to invoice online like this, but i’m not sure if there are any that will let you design the actual invoice and experience to this level.
I havn’t got time now but I will try and mockup my ideas to explain more clearly.
Source : Link , Question Author : Sander Schaeffer , Answer Author : Cai