Simple Invoices - Forum

Hey Charlie,

thanks for your offer - sounds just what im after!!

i've been planning to redesign the Simple Invoices UI for a while but have done anything just yet
- i really like the simplicity of webapps like http://www.ididwork.com etc..

im planning to get rid of the drop down menus in SImple Invoices and just have a couple of tabs
ie. Invoices | Customers | Products
- get rid of the currently default home page and just have manage invoices as the home page in Simple Invoices
- and maybe just have small icons top right or somethign for options/payments/billers/log(in/out)

just need to reduce the on screen clutter

if you can do some mock ups of possible redesigns for the Simple Invoices UI it would be great!!!

let me know your thoughts

Cheers

Justin

This sounds fine for tabs instead of drop down menu, SimpleInvoice is using jQuery and the tabs plugin is great.

thanks spout

jquery is very nice - though for the new menu we may just use plain old html/css tabs - see what happens

cheers

justin

Hi! I'm a graphic designer and I'm interested in contributing too.
How can I help? Is there a mockup already done?
(sorry about bumping an old thread :P )

Hey Januz,

I haven't seen any mockups from Charlie yet - so any help would be greatly appreciated!

the aim is to redo the UI of Simple Invoices so that its better and simpler

Cheers

Justin

Howdy Justin,
First of all, I wanted to say that Simple Invoices is AWESOME! You have developed a great system! I would like to offer my skills as a developer to you as well. I can help as much as I can as time allows. Like you, I am more interested in the simple look and functions of an interface. I develop databases and UIs for internal use by companies, nothing very flashy or complex. This is what first attracted me to it.

I would like to know what you have planned with the new version of SI? You stated that you may use html/css for the menu system and that is great, but what about the rest of the development? Are you planning on moving away from Smarty? Have you looked into an Ajax solution?

I would also like to know if you would like help writing advanced tutorials on installing SI on Linux systems from the ground up for non-Linux users? I personally use OpenSUSE (http://www.opensuse.org) and Fedora (http://fedoraproject.org) as well as a router software called ClarkConnect (http://www.clarkconnect.com).

Chad

Thanks Chad!!

re "I would like to know what you have planned with the new version of SI?"
- http://simpleinvoices.org/roadmap/trunk
- http://simpleinvoices.org/roadmap/dreamtime

re "Are you planning on moving away from Smarty?"
- no plans yet - smarty works well enough for us at the moment

re "Have you looked into an Ajax solution?"
- we'll be using jquery through out Simple Invoices
- the manage grid has been replaced with flexigrid - a jquery based grid solutions
- i've just checked in code that users jquery ajax to allows editing of a product price in invoice creation/editing

re Tutorial
- that would be great thanks
- feel free to create a new page in the wiki and write up as much documentation as you can
- once complete i'll link to it from the normal /documentation page

any help with development - be that UI or coding would be great!!

Cheers

Justin

fyi

http://rososo.com/ is another good example of a very simple UI

cheers

justin

Hi!
I made a couple of quick mockups for the UI.
These mockups are mostly about the navigation and how the information is shown, that's why they don't have colors or icons.
Without further ado:

img src="http://januz.com.ar/drop/mockupDash.png' />
img src="http://januz.com.ar/drop/mockupINV.png' />


Notes:

* I know SI doesn't currently have Recurrings or the ability to filter, but we can dream :D
* I put all the "make new [type of] invoice" options into one big "make new invoice" button. The user can then select which type they want in the new invoice screen.
* I know you mentioned using the "manage invoices" as the start page. But I think that may be confusing to new users. A well designed start page can be helpful for newbs and efficient for pros.
* I grouped all the tabs in three main categories: Money, Products and People. You can already see what's in the Money tab, the People tab would include billers and customers. Products would be the same as it is now.
* I also added the current user name since you mentioned adding better user management features in the future.
* I also added some noob text that should go in each section. (Of course it should be possible to hide it forever).
* The reports tab is no more. I've scattered the reports in each of the main tabs. Each of the tabs have reports that belong to that area. So, the Money tab may have reports like "Total Taxes", "Sales by customer" and "Sales".

And here's the Fireworks PNG (with layers and all) so everyone can hack the mockups :D http://januz.com.ar/drop/mockupFW.png

I can has opinions?

awesome work!!!!!!!

very nice

comments
- if you could have a think about what you would like in a new start/dashboard page - it would be great, i always have problems creating the start page :)
- i love the reduced number of menus - the People menu is a great idea - thanks for that - will definitely make this happen

re recurring
- thats definitely on the list, once we've finalised the next release, improved invoice creation and started work on your design we'll look at recurring invoices

i really like this design - i'll try and turn it into reality as soon as possible - if your good with html/css if you could try and do a html/css version of the menu it would be even better - but if you can't thats no dramas, i'll sort it out soon

thanks again!! - can't wait to make Simple Invoices look like this :)

Cheers

Justin

Thanks!!

I made another mockup of the start page. I added some colors and moved things around a little. I wasn't sure of what you're aiming with SI (something serious or formal or happy, etc.) so tell me what you think about this.

img src="http://januz.com.ar/drop/mockupFront2.png' />

I can do the css/xhtml but I'm kinda busy. Maybe you could set up a SVN rep so we can all work on it?

Some ideas:

* The colors should be in a different CSS file, so that in the future users will be able to make their own themes
* The logo should be replaceable (with a config option) so people can have their company logo there :D
* For freelancers there should be an option to change "products" and "sales" to "projects"

very nice - i like!

re

I wasn't sure of what you're aiming with SI (something serious or formal or happy, etc.)

- preference is simple and friendly
- the stuff i like
-- the old http://rososo.com/ template - refer image on home page - very simple
-- and tumblr templates like:
--- http://juliocapote.com/
--- http://election.rabble.ca/

re css/xhtml
- no worries
- i'll get something setup in a few days in svn and post the details here

re ideas
- they all sound good
- i'll add them to the list
-- http://simpleinvoices.org/roadmap/dreamtime

Cheers

Justin

Great great great UI!!!! Im waiting exited for it!

As an independent module, I can suggest: expenses, time and mileage tracking. Expenses I think is the most important.

Take ideas from: feshbooks.

Try some icon for menus of buttons: http://www.smashingmagazine.com/2008/10/09/finance-and-applications-a-free-icon-set/

http://www.webappers.com/category/design/icons/

Graphics:
http://www.webappers.com/2008/09/22/sparklines-and-accessible-data-visualization/

Thanks Cansado,

i'll hopefully get started on this new UI in a week or so

re module
- agreed that these type of things are required
- re expenses:
-- a 'simple accounts' application is currently a work in progress to handle this type of stuff - long term plan is to have a simple API to link it and Simple Invoices so any payments etc. can auto sync across apps
-- reason for separate app - many to keep Simple Invoices focused on invoices and make any secondary modules as seperate apps
- re time:
-- im a big fan of google calendar as a place to enter time worked and do plan in the future a simple way to link time entered inot Google Calendar to Simple Invoices so this time can be easily billed
-- no real work has been done on this just yet - but some minor tests have started

Cheers

Justin

hey januz

im just getting started on the new UI

we'll most likely be using jquery tabs - refer http://ui.jquery.com

if you want to help out - you could have a look at creating a theme for the tabs to make it suit our needs - refer wordpress.com for inspiration

any help would be great

cheers

justin

hey guys

refer:
- http://www.simpleinvoices.org/blog/preview_of_beta_2_release_of_simple_invoices
- http://www.simpleinvoices.org/beta/

work has now started on the new UI - still a work in progress but you can see where we're going

thanks again januz for your designs

if anyone else has some ideas on how to make the UI of Simple Invoices nicer and simpler - please post

cheers

justin