Improvement: New Invoice Creation form layout

News posted by Tommy Chung 6 years ago

Hi all,

Having taken into account all customer feedback, we have now released the following changes to the Invoice Creation form:

  • Make page container full width, the same as bulk invoices

  • Rebalance field widths, optimising for each toggle setting variation:

    • prioritise increasing the width of the description field

  • Remove the 3rd expanded state of the description field now that there is more space in the default and 2nd state

  • Make behaviour of both select style inputs consistent, giving them the same behaviour as the raw html equivalent. Paying attention to:

    • what key(s) trigger the drop-down
    • what key(s) move through the options
    • what key(s) move select the current option and hide the drop-down
    • ensure that I can still use the tab key as expected after an option has been selected
    • ensure that the VAT treatment input has a wider drop-down area so that the options are on a single line

  • Make default field values more concise so they are readable when all fields are enabled - column headers already give full context:

    • Choose a project -> Choose project
    • Choose account code -> Choose account
    • Select VAT rate -> Select rate

Please see below:

file

To enable the new layout: Click the Preview option located at the top left > Configure your features > Better Invoicing > Click Preview.

Tommy

Write reply2

2 Replies

So, I've been using the new invoice / bill creation layout for the last three days, playing 'catch up' for my VAT return... and I have to say, I love it!!! (The new invoicing layout, not my VAT return, that is!)

Seriously, I'm really pleased with it. Everything I've tried to do has 'just worked', and as expected. The keyboard navigation is brilliant, and completely natural, with tabbing between fields and selecting items in drop-downs super-easy, making data entry really fast. It's one of those situations where because it just works as you expect it to, you struggle to remember what the old layout was like.

Using the full page width is great for all the data being shown, and nothing - so far - has seemed cramped or unusable, or awkward/difficult to use.

For anyone wondering if they should try it out, give it a go when you have a spare few minutes. Sure, I've not done extensive testing, but I've entered a number of invoices now (well, mostly bills) and it's good, great even! (The last time I tried editing an invoice/bill, the new layout doesn't apply, but I mentioned that to one of the team and they said it's being worked on.)

Well done team ClearBooks! it's taken some time in the making, but it shows; great work, thank you!

I don't think Tommy mentioned in is posting: To enable the new layout, use the Preview option in the very top menu / app selector, then Configure your features and Better Invoicing.

6 years ago

Hi Simon,

Thank you for your continued support and we're glad you like it! It was quite hard to achieve consensus with something so complex and dynamic to customer needs. We do hope with the new layout, we could convert more users to give it a go as like you stated, the UX should be much more intuitive and well presented.

Re: the editing, this is currently being worked on and should be released very shortly.

Re: the navigation step, well spotted! I'll quickly add that to the post, thanks!

Edit: the invoice layout should now apply when editing invoices/ bills.

Tommy

6 years ago

Reply to this news

Attach images by dragging and dropping or upload
 

Your comments will be public and can be answered by anyone in the Clear Books community.

Find out what we do and who we are

Apps

Company

Social