Hey guys,
We are in the planning process to give our invoice designer an overhaul.
Before we get started, we’d like to get some feedback on the features you would like to see in the next version of the designer.
We can’t promise that we will integrate everything, but we certainly want to hear your pain points, and what you would like to see in the next iteration of the invoice designer.
I would love some kind of WYSIWYG editor. Absolutely NO other invoicing or accounting program has this so it may not be possible, but if it was this would put you way ahead!
One of my biggest problems is positioning. I always struggle with the css (or sometimes in-line html) to get the positioning perfect.
Some easier ways to move sections and easier logo control (positioning and size) would also be my suggestions.
Hi @david
When I look back to InvoiceNinja 4.x there was the designer made with pdfmake. The recent v5 Designer is easier to use, as it use plain html and css…
Ideas for a further evolved Designer:
More flexibility
Drag and Drop Template Builder
Page Handling
Thx for your work and the great support with answers in no time…
Hi @david
Referring to my previous post, I have additional idea
Using Word as “Template Engine”
Hi @david
I found something about this idea…
It looks like there is a existing solution for laravel…
pdf-Engine
Hi ! (sorry for my English, I’m French)
The new version is ok, BUT the only request I would give is the ability to change the look of our invoice like we could do with the last version of Invoice Ninja…
My logo is half blue, half white, and the white part is invisible on the Basic style of the invoices… I used to take the bold style to change the look of my invoices so that my logo could be entirely visible (the Bold look was very beautiful by the way).
Now we can’t change the version of our invoices… It’s White Basic and nothing else 
So I have to change the colors of my logo now… And I’m not very happy with that… Sorry.
I hope some improvements will be brought concerning that point.
I also want to thank you for the creation of Invoice Ninja in general.
This website is really helpful.
Have good day. Bye !
Wishlist:
Backgrounds (Really missing this feature from V4)
Invoice Components
Editor
Font
Not invoice designer related, but want to note
One of the reasons I haven 100% switched to Invoice Ninja (or any other billing software for that fact) is that I can’t have control 100% of the design of my invoices and quotes. I have to have the control on how my brand looks on ALL my documents and that includes my invoices.
What am I using? Peachtree Complete Accounting 2009 (yes it continues to work up to date). It’s the only software that gives me FULL control of the design of my documents.
I’m going to share some screenshots on how they do it, and you can take a look to see if you can adjust to IN editor.
This is how it looks when you want to edit any of the reports/documents you have available. You have a list of defaults and you can clone it and customize your own (you can also start from scratch:
You can add an image, text, shape, line, table. Everything can be customized… order, font, size, color, placement on the page, etc.
Rudimentary? Yes. Does it work? You bet. NOBODY has the design I have for my invoices and I have modernized them as the time goes by. I tried to make my invoices in IN as similar as possible but not having FULL control of the table columns sizes, for example, makes it impossible. That’s why I always upload my own PDF with every invoice.
I know people don’t care, but I do. I’ve been complimented many times for it, so I know my customers DO notice. I also have a Spanish version for my non-English speakers.
I thought maybe for IN you could upload a PDF that can be used as background, instead of designing everything in the editor, and use the editor only for placement of the data (I really don’t know if that’s possible). Actually I don’t know if anything of this is possible in coding but I’m just pitching ideas. I do agree with most of the other posters ideas, I just don’t think it should be a “drag and drop” editor, since that will be very very complicated and can mess up the rest of the coding (but I’m not a programmer so I don’t know).
I can help with some designs for new templates because in my opinion the ones available need a little love <<whispering: update>>.
I WOULD LOVE to have at least:
PS: Sorry if I fill up the post with “too many screenshots” feel free to remove if you think it’s not helpful.
Drag and drop editing/arrangement would be handy, with the ability to enter/edit HTML of course.
It would be good to have a place for adding custom CSS for the designs that is separate from the core design CSS so that the core design CSS can be updated without affecting the custom CSS. Similar to the way a WordPress child theme allows custom CSS to be added that’s independent of the parent theme.
When a custom design is implemented, a snapshot of the base design is used.
We never update the custom design after this point so that we don’t make any of these types of changes.
Yeah it’s a bit of a double edged sword as you don’t want a base design update to affect a custom design if someone already has it exactly how they want it, but if you don’t then you can run into the situation that I encountered where the css from the older snapshot of the base design has incompatibilities.
It took me a full week to have some sort of a “custom design” (I just wanted something plain and simple but that was not easy).
So far, I think it’s great app. I will use it mainly for invoice and quotes. But the UI gave me a headache.
Settings are easy, but quickly you notice that they are in a lot of places, too many IMO.
Confused at first with Custom fields VS Custom Labels (Localization).
When you understand Custom Labels, you now have to find/imagine a list of possible labels to translate and then find/imagine how to use it.
If you rushed by creating a fake invoice/quote, you will be stuck a half-baked-empty Invoice Design preview when you start customizing.
5a. The preselected terms won’t work if the Invoice Design preview don’t show some info or if you didn’t know where to fill it (you have to find where and come back)
5b. Preview should be full or should let us decide first what we want to display then customize. (as a graphic designer, it’s better to have a lot then to choose how and what to keep, you can’t guess what to design)
5c. Once you finally purge clients/invoice/quotes, you get a new generated preview, but it still misses a lot of useful informations (back to 5a)
Switching between data-ref, $terms, $custom.terms #essentials-ids is confusing.
In order to design outside InvoiceNinja, first you have to toggle preview in HTML mode (only in browser, not in app), then copy paste the HTML/CSS in a text editor. The original html files (in host or github) are filled with custom fields that won’t work outside IN.
You finally can design with text editor + browser 
Still have to switch back and forth and try inside IN those $terms $custom.terms
Settings>Custom fields should display which $custom.terms to call right next to it.
You have to locate the right panel in order to fill the Custom field (eg. Custom Field is $company1, which you fill under Settings>Company Details but as your custom term, then you select it as Custom 1 without remembering the term or the field you chose. Maybe it could be field in the same place where it was created ?
If HTML/CSS done outside, you still have to translate it with IN Design process. They can be conflict between Target elements and your custom code
You have to find scripts to customize targets elements, because they call some useful stuffs that you want in the first place but not like they are.
I don’t think it’s necessary to live preview when you change the HTML/CSS. It’s slow and could be easier to have a refresh button. (and less ressources)
Sorry my feedback is more like tour of what I had to do. I see a lot of people with good knowledge here on this forum, but I think a more simple UI (not less functions), and full and consistent translation could really help getting started whether you a professional accounting or not (eg. due date in french has 2 translations, same for quotes, etc.)
I’m not so good at accounting, i’m a freelance so I still have to do it myself, and graphic designer willing to put his hands into code with a lot of research, errors and trials
