expense tool – UX, UI & Visual Design

I have the opportunity to make an analysis to an online app idea, which aims to help the user to manage your expenses.
The app is now online, although not yet fully public. This initial phase is optimal to make constructive critical to the application, to improve the user experience, the visual design and perform to garanty the success.

So, there some advices and tips to improve the application.

Let’s start:

Homepage.

Visual Design Issues

1.Choose the right Background

The first thing that stands out is the image used in the background. Being an application that aims to generate “expenses”, the better to use a image related to purchases, such as a people in a store, credit cards, etc ..

The first impression is very important. A good input image indicates and fit the user in the right context of the application.

2.Invest in a Logo

Is missing a logo. The logo is the face of a brand, it is with it that is recognized and where the user is related and create empathy.

3.Colors Contrast

The colors of the background and other elements must have sufficient contrast for a good eligibility of all elements.

Having an area of useful extra links that are relevant to users, such as “Help”, “Contact”, “price list” (if applicable), and others content.

User Experience Issues

1. Possibility of choice.

The user don’t have to choice to sign up before enter in the application. The user should not be required to log in to know the application. You should have a page of more informational and text descriptive of what you talking about.

Or if you want to keep the most minimalist site, create a button to “Read more” and “Sign Up or Register”. Although it should be to make life easier for the user, presenting in the first moments more information on the application.

You can have a preview or a trial, for the user can decide to assign or not.

Here a good example:

http://www.desk.com/

Login Page

User Experience Issues

1. Good differencing of Log in and Sign Up

In this case there is still no sign up option, but if it were the case it would be necessary to differentiate very well when we log in, or if we are creating a new account.

If login, we must have in addition to the email / user box, password and confirmation button, you to include the options “I Forgot my password” and “Keep me signed to.”

In New account, we have to include, besides the email, password and sign up button, have the confirmation button that you agree to the terms of use.

We have to have option to sign up with Facebook or Twitter account.

Is important to have option for showing the password: “Show Password”.

If is the case, when it is in “Lock Caps” the user must be warned.Many webapp don’t have this option unfortunately.

Welcome Page

Visual Design Issues

1.Choose the right Background and logo (Again)

Again here, the background of the header must be diference, more related to the application of the essence.
E.g. Shopping at a store, credit card, consumerism …

2.Elements Balance

Visually the elements are not balanced, should be less scattered and visually grouped by subject. Could have a higher bar and always present, with links to the most used areas.

In the central part, and they should be grouped together with icons for each of the numbers / results described.

Overall, it should look more like a dashboard.

Expense Report Software – Zoho Expense

User Experience Issues

1.More Intuitive

The areas where the numbers are (in this case still zeros) should be clickable, which really does not. The user have the desire of clicking but nothing happens.
There should be a button “New Expense” and “New Profit” even on this page, instead of being hidden in the menu. The application is forcing the user to look for something that should be right in front of eyes. This way, it will be more easy and quick.

2.More Features

The user should be able to display a graph with the evolution of their costs and profits.
Or even create a goal, to encourage the user to reach the target.

You could even have a list of reports with the latest entries.

New expense page

User Experience Issues

1.Required Fields

If there are optional fields in a registration form, make sure to clearly highligh. Usually a small mark like an asterisk (*) is enough. It can be frustrating for users to find out that they have not filled in a required field after submission.

2.Option Buttons

A form is very important to have an option to clear or cancel a form.
In this case we have lack of these options. You should create a button to clear or cancel and then another to create.

We need to pay attention to the display of them. The cancel button (clear) should be at the left side and the clear button in the right side. Taking into account that the right button is the more intuitive button even in case of error.

3.Family groups

Create an option to create family categories, or have default 2 or 3 categories already created, as household expenses, car, transport, etc …

4.Cut what is not necessary

If is a top menu always present, dont’ need the back button.

5.Menu always present

The top menu will have the links to add more expense, edit expanse, edit profile, etc…

Update Profile page

User Experience Issues

1.Make the advices said in New expense paragraph.

The issues referred to in the preceding paragraphs can be applied here also in this form.

Some information websites: