14 Responses

  1. Robbie Manson Robbie Manson

    A quick idea to improve the current invoice status toolbar that sits directly above your draft invoice in FreeAgent. Shown are three common states.

    Bearing in mind you actually use the device to move through the various states (as opposed to it simply being a breadcrumb), do you think the various active/current, disabled, completed and actionable regions are as effective as they could be? Any other comments appreciated.

    over 3 years ago

  2. Sacha Greif Sacha Greif

    I appreciate the idea and how you're trying to convey lots of information, but I don't think people will get it. This looks too much like a hierarchical breadcrumb instead of sequential steps, and I don't think it's a good idea to change the wording according to the current step.


    over 3 years ago

  3. Christopher de Beer Christopher de Beer

    Totally user-friendly as usual mr robbie...
    The second one did confuse me a bit, the fact that the 2 items on either side of the completed 'sent' item are actionable.

    Is this cus you might make a draft of an already sent x. ?

    (Aside from it being out of context and me not knowing the process, it all made sense bar that one thing)

    Oh... and the only other thing: the fact that on the 1st line, I assume 'paid' is disabled as the user needs to progress further, yet on the 3rd line, the first 2 items are disabled cus they're completed...(as i understand it) What's getting me is that they both have the same display state... nothing to diferentiate them

    But seriously I'm nit-picking (albeit constructivly, it's still nit-picking) - looks awesome man.

    Update: i think changing the wording is what makes it more usable and users more likely to interpret it as actionable, as apposed to just a breadcrumb, that being said, i think in the 3rd line, if the process is complete then 'mark as sent' should still be 'sent' as in the 2nd line. to keep it consistent.

    over 3 years ago

  4. Robbie Manson Robbie Manson

    Thanks for the feedback Sacha. Regarding the word changing: it's probably a little confusing because of the way I've presented it here, but there are different ways a user can end up seeing these various statuses. That said, it's a fair point, and one reason why we've been looking at some completely different ways of changing the statuses of invoices. Cheers!

    over 3 years ago

  5. Robbie Manson Robbie Manson

    Chris: Yeah, you can make a sent invoice into a draft again. This is a consequence of the way the app has evolved, but something we've spoken about changing.

    Good catch with the same visual treatment of disabled vs. completed stages. A subtle tick appended to stages that are both completed and subsequently disabled could help clarify that. Thanks!

    over 3 years ago

  6. Andy Lobban Andy Lobban

    I think it works, but have you thought about replacing 'Add manual payment' with something like:

    [strong]Payment Outstanding[/strong] [smaller](Add manual payment)[/smaller]

    I think that makes more sense compared to 'Paid'

    over 3 years ago

  7. Zach Inglis Zach Inglis

    Approve of this process! It's very good and I'm pleased you are taking the time on the UX like this. :)

    over 3 years ago

  8. Sascha Michael Trinkaus Sascha Michael Trinkaus

    Very nice Robbie!

    over 3 years ago

  9. Simon Starr Simon Starr

    I like the design but, speaking as a FreeAgent user, I occasionally find myself having to look twice at this even after using it for a couple of years.

    How about keeping it as a breadcrumb trail but moving the links? I think the problem with it is the way the text has to change because it's a menu as well as a status indicator. The 'Save PDF' and 'Send by Email' links are already on a separate part of the page and I think it would make it a lot clearer if these other actions ('Make Draft', 'Mark as Sent', 'Add a Manual Payment') were in the same place.

    over 3 years ago

  10. Robbie Manson Robbie Manson

    Andy: That's a fair suggestion, though I think symptomatic of a bigger issue surrounding the way we're wrongly treating 'statuses' and 'actions' the same way here. Thanks for the input, much appreciated.

    Zach: We're constantly discussing iterative improvements like this in the dev pit all the time, so it's great to be able to open it up and get feedback from users and non-users alike before making decisions. More to come!


    over 3 years ago

  11. Robbie Manson Robbie Manson

    Sascha: Thanks :)

    Simon: I'm with you on the having-to-look-twice thing, and you're absolutely right that there's a problem with using it as a menu vs. status indicator.

    I agree with your suggestion of relocating the invoice actions next to the rest of the invoice action buttons for contextual reasons, but there just isn't enough room to accomodate them all at smaller screen resolutions (I'm inclined to think it'd be button overload too).

    I think there may be a solution in the use of a device similar to the 'More' dropdown button, where the actions appear as menu items in the dropdown and the current status appears as the button title. Thanks very much for your input.

    over 3 years ago

  12. Alex Cowles Alex Cowles

    Hey Robbie, Apple called - they said they'd like their breadcrumb back please.

    Nah - I like it. It's very Apple-y but it makes sense I guess.

    I was going to mention what Chris mentioned about the states of the Paid, and the first two items on the 3rd bar - but he beat me to it. I was a little confused to see 2 states of completeness effectively - the green tick and text, and the greyed out. Should there be so much of a difference?

    Can't think of much else to feedback. I don't use the system, so can't envisage it in place.

    over 3 years ago

  13. Robbie Manson Robbie Manson

    Haha! I particularly love the "I guess" bit, Alex. I'll be sure to tag future UI stuff with 'apple'. Cheeky bugger.

    over 3 years ago

  14. Robbie Manson Robbie Manson

    Thanks for your feedback, folks. It's now live in the app!

    over 3 years ago

keyboard shortcuts: previous shot next shot L or F like