DEV Community

loading...
Cover image for UX advices to create a good web app

UX advices to create a good web app

georgexx009 profile image Emmanuel Galindo ・2 min read

Place user in control of the interface


Make actions reversible. Be forgiving


A user should never be wondering:

  • Where am I?
  • How did I get to this screen?
  • What do I need to press in order to do my task?
  • What is this button for?

Provide informative feedback - be acknowledging


Show the visibility of system status.

Users are much more forgiving when they have information about what is going on and are given periodic feedback about the status of the process.


Accommodate users with different skill levels.

Once users are familiar with a product, they will look for shortcuts to speed up commonly used actions. You should provider fast paths for experienced users by enabling them to use shortcuts.


Make it comfortable for a user to interact with a product

Eliminate all elements that are not helping your users.


Don't ask users for data they've already entered.


When designing a product, it’s important to use language that is easy to read and understand.


Short flows and bigger targets (inputs)

It’s better to design large targets for important functions (big buttons are easier to interact with).

Also reduce the total number of targets that user interact with to complete a given task.


Metaphors

Use real-world metaphors. Metaphors are often used to make the unfamiliar familiar.


Effective error messages as return

An effective error message is a combination of explicit error notification together with hints for solving the problem.

Try to either eliminate error-prone conditions or check for them and present users with a confirmation dialog before they commit to the action.


Don't loose work while refreshing

Ensure that users never lose their work. Accidentally refresh a web page with a form that has user input.


Don't make the user think

Reduce cognitive load. It’s better to avoid making users think or work too hard to use your product.

Discussion (0)

pic
Editor guide