3.Facilitate the process for the user and make the process more fluid.
3.1 Avoid the user to make calculations
Indicate how many elements are left for exhaust the maximum available.
3.2 Include the actual location of the user under your interface.
Highlight the actual section inside the menu of browsing.
Show “bread crumbles” or maps of sequence for facilitate complex interfaces.
Show the most important information at the beginning of the page.
3.3 Simplify the make of decisions
Indicate the most selected option by the users.
Offer a list with the most searched terms.
Each section of the menu must have a number of manageable options or categories.
3.4 Use the conventions of design that your user already know.
Use menus of browsing according to the accepted conventions by the users.
Place useful functions in the right upper corner.
3.5 Give information to the user after every interaction
Show the message of success after every important interaction
Highlight the element in which the user passes his cursor.
3.6 Minimize the negative effects of waiting periods.
Use attractive colours for decreasing the impatience of the waits.
Keep the users interested during long periods of waiting.
Avoid users to upload non compatible archives.
Summarize and show the different actions that are being carried out.
3.7 Avoid that the user has to remember data.
Avoid the tags of the forms disappear when introducing data.
Insert the help to the forms outside the field where normally data is inserted.
Offer the possibility of copying passwords, codes, etc.
3.8 Do not abuse of the “zig zag” designs
Line up similar data so that the user could compare products.
In different forms, place some tags inmediately next to their
3.9 communicate in a clear way, which areas you are allowed to click and also interactives
Give three-dimesional features to the buttons.
use sharp edges to the areas where them can be dragged and drop elements.
Use icons to help the comprehension the meaning of an action.
3.10 Use always familiar symbols and words
Use the same language for user, and don´t speak like a machine.
Show a buttom to translate whatever content in other languages. AN IMAGE IS MISSING
Chose and use congruent colors with meaning of each element.
3.11 Scan your interface as much as possible
Keep short paragraphs and highlight the most important words.
Place the most important information at the beginning of the lists.
Add shading to the lines of your boards.
Write headlines that have sense by itself.
Break all the blocks of the large text with visual elements to give variety.
3.12 Your text has to be easy to read
create contrast between the text and the bottom.
Line up to the left site the most part of your text.
3.13 Use always the same form and the structure along the interface
create a style guide for your front-end design.
Keep the browsing menu in the same position through all your pages.
3.14 Tu diseño debe ser agradable a la vista y estar equilibrado
Diseña siguiendo principios matemáticos.
Elige tipografías diferentes y con mucho contraste para texto y encabezados.
4. Adáptate al máximo a todos los usuarios y situaciones
4.1 Adáptate al nivel de conocimiento y habilidad de los usuarios
Utiliza la cantidad justa de tutoriales en las primeras sesiones.
Usa tooltips para ayudar a los usuarios nuevos, sin molestar a los usuarios expertos.
Utiliza una estructura de cartas para organizar la información.
4.2 Adáptate a las herramientas y métodos que utilizan tus usuarios
Deja que los usuarios controlen el aspecto de la información.
Deja que los usuarios controlen el orden de la información.
Deja que los usuarios controlen la cantidad de información.
Crea “personas” para identificar métodos de trabajo específicos.
Permite a los usuarios abrir páginas en nuevas ventanas o pestañas.
4.3 Haz tu interfaz lo más accesible posible para todos los usuarios
Utiliza etiquetas semánticas en HTML5.
Utiliza varias vías para comunicar la misma información.
4.4 Ten en cuenta y adáptate a todos los posibles resultados
Evita que los mensajes automáticos tengan un resultado no deseado.
Acepta varios formatos posibles en los campos de tu formulario.
Muestra resultados que resuelvan la búsqueda del usuario.
Gestiona erratas, sinónimos y variantes con tus formularios de búsqueda.
4.5 Adáptate a todos los dispositivos y navegadores
Adapta las instrucciones al navegador de cada usuario.
En móviles, usa menús del tamaño de la pantalla.
5. Ayuda a los usuarios a evitar y superar posibles errores
5.1 Es mejor prevenir y eliminar la posibilidad de que se produzcan errores
Elimina, anula o reemplaza los botones una vez que el usuario ha hecho click.
Ofrece sólo las opciones válidas para rellenar un campo.
Ciertas opciones sólo deben estar disponibles cuando el usuario completa una acción concreta.
Dale a cada campo de un formulario la estructura correcta.
5.2 Identifica señales de que se ha producido un error
Localiza palabras que contradicen la intención del usuario.
Recuerda a los usuarios que ya han comprado un producto.
5.3 Diferencia claramente las acciones que podrían tener un resultado no deseado para el usuario
Diferencia las funciones más importantes mediante el color o dejando un espacio.
Pregunta o confirma antes de realizar un cambio irreversible.
5.4 Ofrece siempre la posibilidad de volver atrás o salir de una situación
Utiliza “deshacer” en lugar de obligar a confirmar cada paso.
Ofrece siempre una vía de escape o la posibilidad de dejar un campo en blanco.
Muestra una forma visible de cerrar los popups y mensajes del sistema.
5.5 Minimiza los efectos negativos de abandonar una secuencia de acciones
Guarda todos los datos que introduzcan los usuarios.
Permite a los usuarios volver atrás.
5.6 Haz las áreas clicables y arrastrables lo suficientemente grandes
Añade un borde transparente para los botones pequeños.
Espera uno o dos segundos antes de abrir un menú drop down.
Coloca el enlace sobre todo el contenedor del menú, no sólo sobre el texto.
Ofrece al usuario varios lugares en los que hacer clic para llegar al mismo lugar.
5.7 Muestra mensajes de error que ayuden al usuario
Explica la razón por la que una contraseña no es válida.
Cuando haya errores complejos, ofrece al usuario documentación o la posibilidad de hablar con Soporte.
No digas “tú” en un mensaje de error.
5.8 Ofrece un registro del historial de acciones del usuario
Muestra las búsquedas recientes del usuario.
Usa un color diferente para los enlaces ya visitados.
Indica los elementos que el usuario ya ha visto antes.
5.9 Analiza el comportamiento de los usuarios para saber donde tiene problemas tu interfaz
Pide feedback al usuario en el lugar adecuado.
Crea alertas en Google Analytics para saber si aumentan los errores 404.
Identifica páginas con alto porcentaje de rebote.
