No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Aprende todo un fin de semana sin pagar una suscripción 🔥

Aprende todo un fin de semana sin pagar una suscripción 🔥

Regístrate

Comienza en:

4D
17H
44M
47S

Principios de Usabilidad y Heurística

6/29
Recursos

Los principios de usabilidad y heurística son diez principios que fueron creados por Jakob Nielsen y que ayudan a crear interfaces intuitivas.

1. Visibilidad del estado del sistema

Cuando un usuario está realizando un proceso dentro de una interfaz, hay que darle retroalimentación de lo que sucede en cada estado, a través de gráficos, animaciones o mensajes.

2. Relación entre el sistema y el mundo real

Siempre que se haga referencia a algún objeto del mundo real, proporcionar al usuario alguna referencia descriptiva que le indique más detalles sobre lo que se requiere del mismo. Un ejemplo, sería mostrar una tarjeta de crédito e indicar la ubicación de los datos que debería contener para su eventual uso.

3. Control y libertad del usuario

El usuario debe mantener en todo momento la capacidad de cancelar un proceso, salir de un flujo o deshacer alguna acción, esto para que se sienta libre y sin la sensación de una experiencia negativa.

4. Consistencia

Adaptar los elementos de la interfaz a una línea de estilo uniforme, ya que si se usan muchos, esto puede generar una interacción incómoda que puede confundir al usuario.

5. Prevención de errores

Hay que darle al usuario instrucciones claras de cómo manejar el sistema o de la acción que tienen que hacer. Así se pueden evitar errores y disgustos en los procesos.

6. Reconocer antes que recordar

Esto se refiere a la ventaja que representa para el usuario contar en todo momento con la información que le interesa, por ejemplo, en un e-commerce. Aquí un usuario encuentra muy útil poder contar con una lista de lo que está por comprar y la suma total de su compra. Así puede tomar decisiones más rápido sin tener que consultar saliendo de su flujo.

7. Flexibilidad y eficiencia de uso

Un ejemplo excelente es el buscador de Google. En este, una búsqueda puede ser realizada por cualquier tipo de usuario, tanto principiante como avanzado, otorgando las herramientas y las opciones a cada uno de estos tipos para resolver mejor su propósito.

8. Diseño estético y minimalista

Es importante no saturar la interfaz con demasiado contenido a la vez. Es mejor mostrarle al usuario solo la información que va a necesitar en ese momento, de una manera amigable y atractiva par no perder la continuidad de su interacción.

9. Ayudar a los usuarios a corregir y resolver errores

En caso de errores, la manera de decirle al usuario cómo debe solucionarlo o si no es posible hacerlo, es fundamental. La interfaz debe mostrar siempre un tono amigable y comprensivo, en el que se planteen pasos concretos como solución si es que la hay, y mensajes complementarios que le ayuden a seguir con un flujo tomando otro camino que le pueda ser útil dentro de la plataforma.

10. Ayuda y documentación

Poner a disposición del usuario una sección donde pueda hallar respuesta a sus preguntas, como la sección de preguntas frecuentes (FAQ). Así como una documentación más detallada sobre los procedimientos que lo requieran.

Contribución creada con aportes de: Luis Enrique Herrera.

Aportes 208

Preguntas 6

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

o inicia sesión.

Principios de usabilidad y Heurística:

1- Visibilidad del estado del sistema: el usuario debería saber que está pasando en cada interacción con el producto (cargando, guardando, errores). Debe recibir un feedback del estado del producto.
2- Relación producto y mundo real: El usuario no debería tener dudas al momento de interactuar con el sistema, se le debe brindar toda la información para que pueda operar el sistema.
3- Control y libertad del usuario: El usuario debe poder cancelar o salir de un proceso, sin finalizarlo y sin compromisos.
4- Consistencia: En el diseño de los bloques visuales del flujo del sistema, tratar de llevar un patrón en todos los elementos del sistema.
5- Prevención de errores: Proveer instrucciones claras de lo que se espera que el usuario realice dentro de nuestro producto.
6- Reconocer antes de recordar: Entregar información valiosa al usuario y ademas proveer una forma en que el usuario pueda revisarla cuando la necesite sin acudir a su memoria.
7- Flexibilidad y eficiencia de uso: Entregar una interfaz capaz de satisfacer a usuarios avanzados y no avanzados. Permitir el uso del producto sin necesidad de conocimientos especializados.
8- Diseño estético y minimalista: no saturar de contenido al usuario, mostrar únicamente el contenido relevante para cada vista o cada acción que el usuario ha decidido acceder. No poner elementos que distraigan al usuario del objetivo de la vista.
9- ayudar al usuario a reconocer y corregir errores: Dar información al usuario de lo que esta generando errores o inconsistencias en el sistema.
10- Ayuda y documentación: Detectar las dudas mas comunes de los usuarios a la hora de usar nuestro producto y proveer información que pueda resolverlas de manera inmediata.

  1. Visibilidad del estado del sistema, pantalla de carga

  2. Relación entre el sistema y el mundo real

  3. Control y libertad del usuario

  4. Consistencia

  5. Prevención de errores

  6. Reconocer antes que recordar

  7. Flexibilidad y eficiencia de uso

  8. tético y minimalista

  9. Ayudar a los usuarios a corregir y reconocer errores

  10. Ayuda y documentación

PLATZI
De acuerdo a los principios de usabilidad y heúristica, analicé lagunas cosas que tiene Platzi. Me encantaría saber si están de acuerdo con mi análisis, o no lo están. Déjenme saber si encuentran más principios aplicados en nuestra escuela favorita C:

  1. Puedo reconocer que en el estado de la clase estoy a punto de agregar un aporte, usando un highlight bottom azul en la pestaña de aportes, además, al dar clic en “escribe aquí tu pregunta” sabemos de primeras que nos toca escribir por el text box con header azul que aparece enseguida.
  2. Los menús son abstracciones del mundo real que son super comunes en el mundo digital. En cada clase tenemos a la izquierda un menú desplegable.
  3. Un aporte puede ser agregado, editado y eliminado, dando control para el usuario en sus aportes.
  4. Todas las pantallas de los cursos usan colores y contrastes muy consistentes, dando realce en los botones y apartados azules que indican acciones importantes dentro del control del usuario.
  5. Al ingresar una búsqueda en Platzi, puede que cuando no logra encontrar un resultado destacado nos lo hace saber antes de hacer realmente la búsqueda.
  6. En todo momento Platzi nos indica en qué apartado de su sitio nos encontramos, por ejemplo, si estamos en una clase, en el menú de cursos, en un blog, aporte, etc.
  7. Al crear un aporte podemos simplemente hacer un texto plano, o si deseamos indagar más en el estilo hay opciones para estilizar de mejor manera el aporte. De igual manera en la edición de nuestro perfil tenemos este principio aplicado.
  8. Personalmente creo que Platzi usa diseños muy minimalistas, con colores claros que hacen un buen realce en un entorno de pocos elementos, siempre tratan de mostrar menos, quedándose con sólo lo importante en un momento dado.
  9. Cuando hacemos una búsqueda demasiado especifica es probable que nos arroje a un sitio que nos indica que hay 0 resultados, y nos sugiere que hagamos una búsqueda diferente.
  10. En el footer de la página principal, encontramos varios apartados interesantes de documentación, como preguntas frecuentes, contacto, etc. Además el último feature del chat “Message Us” nos ayuda a tener una documentación muchísimo más personalizada.

Me encanto esta grafica para ver los principios de usabilidad.
![](

**Principios de usabilidad y heurística: Jacob Nielsen. **
1.Visibilidad del estado del sistema: Indicar cómo va el proceso.
2.Relación entre el sistema y el mundo real
3. Control y libertad del usuario: El usuario debe tener el control y decidir cuando quiere salir.
4.Consistencia: mismo tamaño y color
5.Prevención de errores: Hay que dar instrucciones claras, esto nos ayuda a evitar la frustración.
6.Reconocer: Darle la información al usuario.
7.sencillez: Que usuarios novatos puedan acceder
8.Diseño estético y minimalista: no saturar al usuario
9.Permitir corregir los usuarios.
10.Ayudas y documentación: resolución de problemas.

10 Principios de Usabilidad y Heurística (Jacob Nielsen)

1- Visibilidad del estado del sistema: Dar retro de lo que está pasando al hacer un proceso de un producto.
2- Relación sistema - mundo real: Utilizar elementos del mundo real para explicar procesos.
3- Control y libertad del usuario: Siempre poder cancelar proceso, salirse de flujo o deshacer acción.
4-** Consistencia:** Cuidar la consistencia de dentro de los estilos de los elementos de la interfaz.
5- Prevención de errores: Dar instrucciones claras de como manejar el sistema o acciones.
6- Reconocer antes que recordar: siempre hacer recordar el recorrido y elementos de navegación.
7- Flexibilidad y eficiencia: Abarcar tipo de usuario al diseñar un producto.
8- Diseño estético y minimalista: No saturar de información y mostrar lo que se usará en ese momento.
9- Ayudar a corregir y reconocer errores: Explicar el error y dar soluciones para ello.
10- Ayuda y documentación: Ayudar a los usuarios a encontrar soluciones de manera fácil y rápida.

NOTAS:
10 Principios de Jakob Nielsen
Nos ayudan a crear interfases intuitivas.
1.- Visibilidad del estado del sistema
Indicar al usuario los procesos que se están llevando acabo o el inicio/termino del mismo.

2.- Relación entre el sistema y el mundo real
Guiar (mediante imagen) al usuario para colocar la información correcta y de donde puede obtenerla.

3.- Control y libertad del usuario
El usuario es libre de elegir continuar o no una accion de programa.

4.- Consistencia
El diseño (tamaño, color, letra) debe ser similar cuando se trata de un mismo item

5.- Prevención de errores
Dar indicaciones claras al usuarios de como manejar el sistema.

6.- Reconocer antes que recordar
Resumir los datos que el usuario debe acatar antes de aceptar la función o actividad, asegurándonos que el usuario lo sabe.

7.- Flexibilidad y eficiencia de uso
Diseñar el producto para que pueda ser usado por cualquier usuario: principiante o experto

8.- Diseño estético o minimalista
Diseño simple sin estar saturado. Solo contenido indispensable.

9.- Ayudar al usuario a corregir y reconocer errores
Dar indicaciones o posibles soluciones a trabas que el usuario encuentre.

10.- Ayuda y documentación
Brindar al usuario ayuda con las dudas mas frecuentes que se generan

1.- Visibilidad del estado del sistema

2.- Relación entre el sistema y el mundo real

3.- Control y libertad del usuario

4.- Consistencia

5.- Prevención de errores

6.- Reconocer antes que recordar

7.- Flexibilidad y eficiencia de uso

8.- Diseño estético y minimalista

9.- Ayudar a los usuarios a reconocer y corregir errores

10.- Ayuda y documentación

Les comparto un artículo que escribí en LinkedIn, acerca de las 10 Heurísticas de usabilidad de Jakob Nielsen en un formato visual (Posters)

https://www.linkedin.com/pulse/10-heurísticas-de-usabilidad-jakob-nielsen-posters-francisco-mujica-/

++Los 10 principios heurísticos de Jacob Nielsen
++

**1. Visibilidad del estado del sistema: **el sistema siempre debe mantener informados a los usuarios sobre lo que está sucediendo, a través de comentarios apropiados dentro de un tiempo razonable.

**2. Relación entre el sistema y el mundo real: **el sistema debe hablar el idioma de los usuarios, con palabras, frases y conceptos familiares para el usuario, en lugar de términos orientados al sistema. Siga las convenciones del mundo real, haciendo que la información aparezca en un orden natural y lógico.

3. Libertad y control por parte del usuario: hay ocasiones en que los usuarios elegirán las funciones del sistema por error y necesitarán una “salida de emergencia” claramente marcada para dejar el estado no deseado al que accedieron, sin tener que pasar por una serie de pasos. Se deben apoyar las funciones de deshacer y rehacer.

4. Consistencia y estándares: los usuarios no deberían cuestionarse si acciones, situaciones o palabras diferentes significan en realidad la misma cosa; siga las convenciones establecidas.

**5. Prevención de errores: **mucho mejor que un buen diseño de mensajes de error es realizar un diseño cuidadoso que prevenga la ocurrencia de problemas.

**6. Reconocimiento antes que recuerdo: **se deben hacer visibles los objetos, acciones y opciones, El usuario no tendría que recordar la información que se le da en una parte del proceso, para seguir adelante. Las instrucciones para el uso del sistema deben estar a la vista o ser fácilmente recuperables cuando sea necesario.

7. Flexibilidad y eficiencia de uso: la presencia de aceleradores, que no son vistos por los usuarios novatos, puede ofrecer una interacción más rápida a los usuarios expertos que la que el sistema puede proveer a los usuarios de todo tipo. Se debe permitir que los usuarios adapte el sistema para usos frecuentes.

8. Estética y diseño minimalista: los diálogos no deben contener información que es irrelevante o poco usada. Cada unidad extra de información en un diálogo, compite con las unidades de información relevante y disminuye su visibilidad relativa.

9. Ayudar a los usuarios a reconocer: diagnosticar y recuperarse de errores: los mensajes de error se deben entregar en un lenguaje claro y simple, indicando en forma precisa el problema y sugerir una solución constructiva al problema.

**10. Ayuda y documentación: **incluso en los casos en que el sistema pueda ser usado sin documentación, podría ser necesario ofrecer ayuda y documentación. Dicha información debería ser fácil de buscar, estar enfocada en las tareas del usuario, con una lista concreta de pasos a desarrollar y no ser demasiado extensa.

Fuente: [](https://medium.com/pildorasux/10-heuristicos-nielsen-abc9c6ad04c0

PRINCIPIOS DE USABILIDAD Y HEURISTICA

1- Visibilidad del estado del sistema
ej. Barras de progreso, pantallas de error.
2- Relación entre el sistema y el mundo real
3- control y libertad del usuario
4- Consistencia
ej. Si usamos una tipografía y un espaciado especifico hay que seguir usándolo en todo el sistema
5-Prevención de errores
Dar instrucciones claras al usuario de como manejar el sistema (aunque sin ser densos)
6-Reconocer antes que recordar
Siempre darle la información al usuario y que no dependa de su memoria
7-flexibilidad y eficiencia de uso
El sistema tiene que ser intuitivo de usar para los nuevos usuarios pero a la vez tener “atajos” y formas de aplicarse mas eficientemente para los users mas avanzados.
8-Diseño estético y minimal
No saturar de info al user y darle a este lo que realmente necesite.
9-Ayudar a los user a corregir y reconocer errores
10-Ayuda y documentación

Seguí utilizando la pagina de Netflix para estos ejercicios y encontré todas las leyes de usabilidad y heurísticas aplicadas a la pagina, realizar estos ejercicios es muy interesante, ya que nos da la capacidad de identificar donde se aplican cada una de estas leyes

1.- Visibilidad del estado del sistema

2.- Relación entre el sistema y el mundo real

3.- Control y libertad del usuario

4.- Consistencia

5.- Prevención de errores

6.- Reconocer antes que recordar

7.- Flexibilidad y eficiencia de uso

8.- Diseño estético o minimalista

9.- Ayudar al usuario a corregir y reconocer errores

10.- Ayuda y documentación

Les comparto esa captura, les va a servir mucho para recordar fácilmente los 10 principios.

Les mostraré Ada, una app de salud que me gusta mucho.

  1. Barra de Progreso.
  2. Preguntas como en el doctor.
  3. Al dar click allí, te permite devolverte con facilidad.
  4. Los botones y elecciones en sí tienen el mismo formato y diseño.
    5-6. Te muestran lo que acabas de colocar.
  5. Preguntas sencillas y claras.
  6. TODO.
  7. Se puede ver en el buscador de síntomas.
  8. Puedes acceder a un menú en cualquier momento o dar feedback.

Me parece que Instagram cumple con todos los principios

Van 6 videos del curso, y. definitivamente. arrojan mucho valiosa info. Me gustaria tener. en las descripciones de los videos, sintetizado de manera textual todo lo que dice. La parte de la transcripcion ayuda, pero algun recurso extra. para. todo lo que. la maestra dice sería genial.

Acabo de hacer una lista explicando cada uno de los
10 PRINCIPIOS DE USABILIDAD POR JACOB NELSON

Enlace aquí

*Te recomiendo rehacerlo, así podrás asimilarlo con tus propias palabras y entenderlo correctamente.

Dios mio! creo que primero me pasare por el curso de usabilidad 😛

Gmail y Outlook me parece que no hacen un trabajo tan bueno como WeTransfer a la hora de enviar un archivo y retroalimentar lo que está ocurriendo.

Heurística procede del término griego εὑρίσκειν, que significa encontrar, hallar, descubrir, comprender
Heurística: es la estrategia sistémica, para que, inmediata o gradualmente se generen alternativas que son innovaciones positivas. La facultad heurística es un rasgo característico de los visionarios, se define como el arte y la ciencia del descubrimiento, de la creación, así como resolver problemas a través del pensamiento lateral, la intuición, la inspiración, el pensamiento divergente, los cuales conforman y estructuran el complejo proceso conocido como creatividad, que refiere al pensar y hacer diferente. Los principios de Usabilidad y Heurística son una de las bases del Diseño UI / UX, como vimos en esta clase.

Principios de usabilidad y heuristica:

1- Visibilidad del estado del sistema:
el usuario debería saber que está pasando en cada interacción
Debe recibir un feedback del estado del producto. (barras o signos de carga\avance, etc)

2- Relación producto y mundo real:
El usuario no debería tener dudas al momento de interactuar con el sistema,
se le debe brindar información descriptiva como instrucciones, imagenes y/o diseños

3- Control y libertad del usuario:
El usuario debe poder cancelar o salir de un proceso, sin finalizarlo y sin compromisos.

4- Consistencia:
tratar de llevar un patrón de diseño en los bloques visuales de un proceso
para optimizar del flujo del sistema o proceso

5- Prevención de errores:
Proveer instrucciones claras de lo que se espera que el usuario
realice dentro de nuestro producto.

6- Reconocer antes de recordar:
Entregar información que el usuario pueda revisarla cuando la necesite sin acudir a su memoria.
Ejemplo, carro de compras.

7- Flexibilidad y eficiencia de uso:
Entregar una interfaz capaz de satisfacer a usuarios avanzados y no avanzados.
Permitir el uso del producto sin necesidad de conocimientos especializados.

8- Diseño estético y minimalista:
Mostrar únicamente el contenido relevante para cada acción
No poner elementos que distraigan al usuario del objetivo de la vista.

9- ayudar al usuario a reconocer y corregir errores:
Dar información al usuario de lo que esta generando errores o inconsistencias en el sistema.

10- Ayuda y documentación:
Detectar las dudas mas comunes de los usuarios a la hora de usar nuestro producto
y proveer información que pueda resolverlas de manera inmediata.

Principios de usabilidad y Heurística
• Visibilidad del estado del sistema, es la retroalimentación del sistema. Mostrar al usuario como se da el proceso de su acción.
• Relación del sistema y el mundo real, una simulación real de la acción del usuario.
• Control y libertad del usuario, donde el usuario puede o no realizar una acción.
• Consistencia, mantener una misma diagramación de color, icono, gráficos etc.
• Prevención de errores, instrucciones claras de lo que tiene que hacer el usuario.
• Reconocer antes que recordar, que tenga la información en su momento y no depender de usar su memoria.
• Flexibilidad y eficiencia de uso, emplear una interfaz sencilla, además de abarcar todo tipo de usuario.
• Diseño estético y minimalista, mostrar solo lo esencial.
• Ayudar a los usuario a corregir y reconocer errores, mostrarle recomendaciones para evitar errores.
• Ayuda y recomendación, para que los usuarios sepan como reconocer sus problemas que puedan encontrar.

Se llaman “heurísticos” porque son reglas generales y no directrices de usabilidad específicas.
Con estas reglas generales podemos no solo diseñar sino también analizar lo diseñado.
Recomendado: Shneiderman’s “Eight Golden Rules of Interface Design”

Los 10 principios de usabilidad y heurìstica son siempre a tener en consideraciòn para el correcto desarrollo de cualquier proyecto

Pareceria que son un poco obvios, pero al momento de meterse en la ingenieria del producto a veces se pasa por alto algunos de estos principios, excelente contenido.

Para garantizar una buena UX y una buena usabilidad dentro de nuestro desarrollo, solemos seguir varios principios que nos ayudaran a mejorar la experiencia de cada persona con nuestro desarrollo, siendo los mas importantes a mi parecer, la correccionalmente de las acciones que ha realizado un usuario, para permitirle conocer en todo momento en que estado se encuentra y que acciones podrá tomar después de la realizada al principio.

Para un diseño eficiente de interfaz de usuario es necesario tener en cuenta los 10 principios de usabilidad y heurística

El checkout de Mercado Libre es un ejemplo muy claro de la aplicación de estos principios

1- Visibilidad del estado del sistema
Estado de Log-in

2- Relacion de sistema
Aliexpres
Comentarios y fotografias de los compradores.

3- Control y libertad del usuario
Aliexpres
Poder cancelar pedido en cualquier momento de la compra

4- Consistencia

Behance, mantiene sus colores en las diferentes pantallas del sistema, aun en la app, su estructura es uniforme.

5- Prevencion de errores

Aliexpres, muestra diferentes facilidades de log, que puede obtener el usuario.

6- Reconocer antes que recordar

Junto con los datos de pago y dirección de envío el ultimo paso para hacer una compra siempre es confirmada por el usuario.

7- Flexibilidad y eficiencia

En el Upload de Youtube hay 2 facilidades

  • Subir videos normalmente sin configuración
  • Con una configuración avanzada.

8- Diseño estetico y minimalista

9- Ayuda a corregir y reconocer errores

**10- Ayuda y documentación
**
Aliexpres permite abrir disputa por alguna inconformidad con alguno de sus vendedores.

Es un conjunto de pequeños comportamientos que como usuarios aveces nisiquiera notamos a conciencia pero nos vuelve mucho mas comoda nuestra experiencia, el simple hecho de retroalimentar que el usuario esta haciendo lo correcto ya lo hace sentir comodo. Buen contenido!

![](

Consistencia: formas, colores y tipografía
Estético y minimalista: no saturar de información


1.Relación producto y mundo real
2.Control y libertad del usuario.
3.Prevención de errores.

Diseño estético y minimalista

Ayuda y documentación
Ayuda y documentación

Aquí podrás encontrar los principios de usabilidad web de Jakob Nielsen con sus respectivos ejemplos.

Ejemplos de los principios de Usabilidad y Heurística

  • Visibilidad del estado del sistema: La barra de progreso de lectura en el blog.

  • Relación entre sistema y mundo real: Uso de íconos similares a los iPhones.

  • Control y libertad del usuario: Posibilidad en Notion de borrar el texto redactado.

  • Consistencia: Diseño de botones, estilo gráfico de los íconos y tipografía de Twitter.

  • Prevención de errores: Aviso en Gmail al no escribir el destinatario correctamente.

  • Reconocer antes que recordar: Checkout de Mercado Libre

  • Flexibilidad y eficiencia de uso: El buscador de Youtube permite agregar filtros.

  • Diseño estético y minimalista: Diseño de landing page de Linear, con un texto breve y un CTA.

  • Ayudar a los usuarios a corregir y reconocer errores:

  • Ayuda y documentación: Sección de preguntas frecuentes.

  1. Visibilidad del estado del sistema
  2. Relación entre el sistema y el mundo real
  3. Control y libertad del usuario
  4. Consistencia
  5. Prevención de errores
  6. Reconocer antes que recordar
  7. Flexibilidad y eficiencia de uso
  8. Diseño estético y minimalista
  9. Ayudar a los usuarios a corregir y resolver errores
  10. Ayuda y documentación
  1. visibilidad estado del sistema.
  2. Relacion sistema y mundo
  3. Control y libertad usuario.
  4. Consistencia.
  5. Prevencion de errores.
  6. Reconocer antes de recordar.
  7. Flexibilidad y eficiencia
  8. Diseño estético y minimalista
  9. Ayudar y corregir errores a los usuarios
  10. Ayuda y documentacion

No es mi sitio favorito, pero suelo entrar mucho para llevar el registro de mis lecturas y descubrir libros. Acá vi estos ejemplos:

  • Consistencia

  • Visibilidad del Estado del Sistema

  • Ayuda y Documentación

  • Relación entre el sistema y el mundo real (se me ocurre porque cada portada del libro se asemeja a cómo se vería el libro en la realidad, pero no estoy segura)

En en mi caso hice el análisis con el sitio de paqueteria DHL, la primera imagen que comparto es la que se muestra actualmente como pagina principal en el sitio web, se puede observar que se cumplen las siguientes principios de Nielsen:

  1. Relación entre el sistema y el mundo real, al ingresar al sitio y ver la pantalla de la pagina principal podemos observar que como actividad principal esta la opción de rastrero de un envió con ingresar el numero de guía, no es necesario crear un usuario ni logearse con una cuenta para poder hacer esta actividad, también se muestran las otras actividades que pueden hacerse en el sitio, resaltando la opción DHL para EMPRESAS, que por la naturaleza del servicio es posible que el perfil principal de cliente sean las empresas que realizan muchos envíos como tipo amazon.
  2. Consistencia, 7. Flexibilidad y eficiencia de uso, 8. Diseño estético y Minimalista y por ultimo el punto 10, Ayuda y documentacion.
    Como lo mencione antes, los elementos tanto de las actividades que se pueden hacer dentro del sitio como los servicios con los que cuenta DHL quedan claramente identificados, los menu de la parte superior están ordenados, también queda establecido que el sitio cuenta con mas información en la parte de abajo cuando desde la pagina principal se ve el texto ACTUALIZACIONES IMPORTANTES DEL SERVICIO, por lo que el usuario identifica que hay mas elementos y que para acceder a ellos debe dar scroll al sitio.

En cuanto al punto 1 Visibilidad del estado del sistema, cuando el usuario ingresa el numero de rastreo y le da clic al botón RASTREAR el sistema muestra una animación de un circulo que indica que se esta realizado la búsqueda y al termina muestra la información perteneciente, identificada claramente dentro de una tabla dividida según los procesos o status que haya tenido el paquete desde que el usuario inicial comenzó con el proceso.
Para el punto 9 Ayudar a los usuarios a corregir y resolver errores, cuando el usuario ingresa el numero de rastreo incorrecto, el sitio indica que el código es incorrecto y le invita a hacerlo de nuevo, agregado a eso, le muestra una sección de preguntas frecuentes en la cual vienen algunas posibles dudas que pueda tener en el usuario en el momento de la consulta. Esto también aplica para el punto 10. Ayuda y Documentación

Aquí mi analisis.

Adjunto mi trabajo sobre lo aprendido en clase.

visibilidad del estado del sistema

relación producto mundo real

consistencia en el diseño de los bloques

prevención de errores
!IMG_0296.png](https://static.platzi.com/media/user_upload/IMG_0296-f87b4da9-3f81-42db-a7f9-049df44b3b24.jpg)

reconocer antes de recordar

diseño estético y minimalista

posee todos los principios de usabilidad heurística

Basado en los conceptos de la clase, este es mi ejercicio:

Hola! revisnado las paginas me di cuenta que hay varias leyes o principios que se repiten. Adjunto mis ejemplos.

Principios de usabilidad

Visivilidad del sistema

Relación sistema/mundo real

Control del usuario

Consistencia

Prevención de errores

Reconocer antes que recordar

Flexibilidad y eficiencia de uso

Estético y minimalista

Ayudar a corregir errores

Ayuda y documentación

Flexibilidad y uso: Cualquier usuario puede usar la interfaz de ML en Venezuela. Es sencilla y no es compleja.

  1. Visibilidad y estado del sistema.
  2. Relacion entre el sistema y el mundo real.
  3. Control y libertad del usuario.
  4. Consistencia.
  5. Prevencion de errores.
  6. Reconocer antes de recordar.
  7. Flexibilidad y eficiencia de uso.
  8. Diseño estetico y minimalista.
  9. Ayudar a los usuarios a corregir y resolver errores.
  10. Ayuda y documentacion.

Yo elegí analizar la página de Mercadolibre.

Los reecursos visuales ayudan bastante a entender cada principio.

  1. Visibilidad del estado del sistema:

  2. Relación entre el sistema y el mundo real:

  3. Control y libertad del usuario:

  4. Consistencia:

  5. Prevención de errores:

  6. Reconocer antes que recordar:

  7. Flexibilidad y eficiencia de uso:

  8. Diseño estético y minimalista:

  9. Ayudar a los usuarios a corregir y resolver errores:

  10. Ayuda y documentación:

Aquí un ejemplo de los 10 principios de Usabilidad y Heurística, usando la app de Rappi.

ejemplos de apps que estan bien armados paypal por ejemplo

Consistencia

Control y libertad de usuario

Flexibilidad y eficiencia de uso


Relación entre el sistema y el mundo real

Wetransfer también es un buen ejemplo para una interfaz del punto 8, diseño estético y minimalista.

Visibilidad del sistema: Estado de la canción, cuánto lleva cuánto le falta
Control y libertad del usuario: salir o logearte
Consistencia: todos los rectángulos son iguales para podcast,recomendaciones, escucha reciente, descubre.
Prevención de errores
Reconocer antes de recordar: da información relevante de que he escuchado recientemente y así no dependo de mi memoria para volver a escucharlo.
Flexibilidad y satisfacción: crear una playlist con minuciosidad o ir a la radio entre más cosas.
Diseño estético y minimalista: 2 columnas, la principal solo 6 opciones, la columna de la derecha sobria nada titila ni llama la atención.
ayuda al usuario a reconocer y corregir: segundo texto aclarando dudas.
Ayuda y documentación

Principio de consistencia:

Principio de consistencia:

  1. Visibilidad del estado del sistema.

2.Relación producto y mundo real.

  1. Control y libertad.

  2. Conistencia. (botones, marcador de favoritos y visualización)

  3. Prevención de errores.

  4. Reconocer antes que recordar.

  1. Flexibilidad y eficiencia de uso. (filtros para hacer más especifíca la busqueda)
  1. Diseño estético y minimalista.

  2. Ayudar al usuario a corregir y reconocer errores

  3. Ayuda y Documentación

Hice el ejercicio en mi pág. personal hecha con No Code
Encontré consistencia, por los colores, tamaño y tipo de letra

Prevención de errores, porque indica que hacer.

6- Reconocer antes de recordar: al momento de realizar una compra el sistema te muestra y detalla los productos agregaste al carrito de compras

¡Hola compañeros!
Este es un buen ejemplo de manejo tipográfico, contraste, de la ley de Miller (conjuntos) y de la ley de Jakob (estándares).

Y este mini-formulario me parece muy útil y fácil de diligenciar (ley de Fitt y ley de Hick)

Saludos.

  • Visibilidad, Reconocer, Diseño minimalista, Consistencia, Sencillez.
  • Corregir a los usuarios, prevención de errores, ayuda y documentación


Ayuda y documentacion


Ayudar a los usuarios a corregir y reconocer errores


Consistencia


Control y libertad de un usuario


Diseño estetico y minimalista


Flexibilidad y eficiencia de uso


Prevencion de errores


Reconocer antes que recordar


Relacion entre el sistema y el mundo real


Visibilidad del estado del sistema

Estan enumerados segun el orden de los principios


la pantalla de web, se visualiza de forma directa lo que el usuario va realizar dentro de la pagina web.

Un ejemplo de casi todas las caracteristicas de principios de usabilidad es platzi

Principios de Usabilidad y Heurística

Estos principios nos ayudan a crear interfaces intuitivas

  1. Visibilidad del estado del sistema: Se debe dar información al usuario del proceso que se esta realizando.
  2. Relación producto y mundo real: Si se interactúa con algo del mundo real en la aplicación se le debe mostrar al usuario en donde encontrarlo.
  3. Control y libertad del usuario: El usuario siempre debe tener la capacidad de cancelar un proceso.
  4. Consistencia: Mantener los colores, tamaños, etc en todas las interfaces.
  5. Prevención de errores: Se deben dar instrucciones claras de que se debe usar.
  6. Reconocer antes que recordar: Mostrar la información a la cual el usuario esta accediendo, no hacer que la recuerde.
  7. Flexibilidad y eficiencia de uso: Cualquier tipo de usuario debe poder utilizar el sistema.
  8. Diseño estético y minimalista: No saturar de información al usuario, solo mostrar información que se va a utilizar.
  9. Ayudar a los usuarios a buscar y corregir errores: Dar solución a los usuarios respecto a errores.
  10. Ayuda y documentación: Tener un apartado de ayuda sobre los errores más comúnes.
  1. Visibilidad del estado del sistema
  1. Relación producto y mundo real
  1. Control y libertad del usuario
  1. Consistencia
  1. Prevención de errores
  1. Reconocer antes de recordar
  1. Flexibilidad y eficiencia de uso
  1. Diseño estético y minimalista
  1. ayudar al usuario a reconocer y corregir errores
  1. Ayuda y documentación
  1. Visibilidad del estado del estado del sistema.
    Te muestra si el usuario se logro ingresar o tuvo algún error.

  2. Control y libertad del usuario
    Tienes la opción de volver a la pasarela de pago.

  3. Consistencia
    Se logra interpretar que manejan la misma gama colores oscuros.

  4. Prevención de errores.
    El loguin de Amazon en el campo de contraseña te advierte que mínimo debes haber 6 caracteres.

  5. Reconocer antes de recordar
    Lineo te hace un resumen detallado del producto y su valor al finalizar la compra.

  6. Diseño estético.

RETO 02: identificar qué principios de usabilidad | heurística se aplican en:
https://intelligence.weforum.org/

  1. Cuando se pasa mouse por encima de un botón (una posible acción), se hace un acercamiento en la imagen que están en el fondo y se modifica el tamaño y la cantidad de texto asociada al mismo.

  2. Cuando se hace una selección en un tema de un mapa, se resaltan las opciones asociadas a cada uno (el nodo y los enlaces entre los diferentes nodos).

  3. Cuando se hace click en una opción que modifica el mapa, aparece un texto que le informa al usuario que está en proceso (”loading…”). Una vez se termina el proceso, se modifica la imagen que está en el centro del mapa y varían los enlaces entre los nodos relacionados con el tema.

  4. En la esquina superior derecha aparecen opciones para apoyar al usuario en el manejo del mapa (tutoriales, configuración de opciones, novedades, detalles de cuenta personal, opción de búsqueda, etc).

  5. Cantidad de texto asociada a cada nodo es de máximo 4-5 palabras, de tal manera q puedan verse muchas opciones al mismo tiempo.

  6. Dependiendo del nivel de jerarquía, aumenta o disminuye el tamaño del texto, cuidando q siempre sea legible (alto contraste ayuda a q esto se logre, así como fuente elegida).

Diseño estético y minimalista: te permite ver diversidades de manera sencilla con palabras claves

1.Visibilidad del Estado del sistema

3.Control y Libertad de usuario

4.Consistencia / 7. Flexibilidad

5.Prevencion de Errores / 8.Diseño Estetico y minimalista

9.Ayuda a Corregir errores

10.Ayuda y Documentación

1-Visibilidad del estado del sistema: Indicar cómo va el proceso.

2-Relación entre el sistema y el mundo real

3-Control y libertad del usuario:

4-Consistencia: mismo tamaño y color

5-Reconocer

6-Sencillez

7-Diseño estético

8-Ayudas y documentación: resolución de problemas

Muy interesantes estos principios. Deberían convertirse en un Checklist para cuando diseñamos cualquier tipo de interfaz.