Hey there, I'm Jonathan, a freelance digital consultant, specialising in UX/UI Design.

I help companies design and develop beautifully simple user interfaces. I work with a huge variety of clients including companies like, Smith & Nephew, KLM, Durex and the National Aids trust.

4 ways to improve the user interface of your web application

Posted By Jonathan Clift on 22 March 2015

Make it easy for users to recover from mistakes

Users will make mistakes so it's the job of the designers and developers to make it easy to undo them. In the past web applications went down the "confirm" route. This simply meant asking users to confirm if they really really wanted to carry out a certain action, such as delete a user. This helps in some way as it stops user who might of clicked on something by accident. However, it's intrusive and means the user has to go through an extra step every time even if it's definitely what they wanted to do. A far better way is to provide users with the ability to 'rollback' or 'undo' an action. This doesn't break the flow of the user and more importantly it doesn't require another click. Most of the times users are doing something they meant to, so this is a far better experience for the user, protects them from errors and doesn't get in the way.

Provide meaningful user interface feedback

Design with a blank slate in mind

In most cases, when users first sign up to a web application there will be little to no data. This is quite normal. However, designers tend to design user interfaces based on 'ideal' data and how it will look once a user has used the application for some time. When the 'blank slate' is neglected it means that the first impression a user has of your web application is not as good as it would be the user interfaces are designed with the blank slate in mind. A far better way to handle the blank slate would be to use it to show users what things might look like when they will have data. Better still, show them what it will look like and walk them through inputting their first bits of data so that they can get up and running as quickly as possible.

Design user interfaces with a blank slate in mind

Inline validation for web forms

Most commonly, forms are a two-way transaction. They ask for information from a user and then the user submits that information. The form then usually provides some feedback to the user on whether the information they provided was valid and submitted successfuly. This is by no means a bad way of handling forms, assuming it provides relevant and helpful feedback. However, it would be even better to use inline/realtime form validation to tell users of anything they might of done wrong straight away. It will save time and is far more helpful telling the user immediately as soon as something might need changing. The best example of inline validation can be seen on email capture inputs. Even at there most basic, emails require a certain format, i.e the @ symbol which can be checked as soon as the user moves onto the next input form. If it’s incorrect, it’s easy to validate the email format before a form submission occurs.

Inline form validation user interface example

Provide helpful and relevant feedback

When users carry out an action, such as submitting data on a form, they want feedback to know that it was successful. They want to make sure they completed the task they intended to. Without this feedback, users start to wonder whether it was successful, whether they did the right thing or whether they might need to do it again. Providing simple, helpful and relevant feedback immediately answers any of these questions and the user can move quickly onto the next task.

User interface feedback