martes, 17 de enero de 2023

Heurísticas de Jakob Nielsen

1. Visibilidad

El usuario siempre sabe lo que el sistema está haciendo, open Communication te permite
tomar buenas decisiones. Vida de batería, botón color, fue reconocido por parte del sistema.
Trust.

Migan de pan = Rastro

2. Semejanza con el mundo real

El sistema habla el lenguaje del usuario, palabras y conceptos familiares, un orden lógico y
natural. Previous digital experiences. Ejemplo de libros, Kindle, closely aligned entre el mundo
real y lo digital.

Ejemplo de Axtel: Axtel X-tremo

Ejemplo de HEB: Salsas vs Salsas para espagueti, sitio web vs mundo real

3. Control y libertad

Si el usuario comete errores tiene salidas de emergencia claramente marcadas

Ejemplo de Alexa: Alexa guarda silencio
Ejemplo de Of ce Depot USA y México: Tomar plantilla que no permite regresar a un producto,
no da control.
Ejemplo de optimo workshop: Orden de realización

Si no tiene el botón de editar, no hay libertad.

fi
 4. Consistencia y estándares
Formas convencionales para palabras, situaciones y acciones. Predecible, Interno: producto o
familia de estos mismos, COLORES. Externo: cómo se ve, dónde debería de estar, considerar
si es necesario romper la consistencia, yo hago lo que todos los demás sitios.

5. Prevención de errores
Exactamente qué quiere o qué necesita, datos requeridos, sistema utiliza javascript para
validar las formas.

Ejemplo: Texto de con rmación, prevenir antes de que suceda.

Ejemplo: Número de tarjetas, cvv

6. Reconocer más que memorizar

Number of cues, recognition over recall.

Asociaciones

7. Flexibilidad y Eficiencia
Shortcuts, lo más reciente, artículos que consultaste hace poco.

Aceleradores para procesos, friendly y no tannnn friendly.

8. Minimalismo y Estética
Menos es más, mecanismos para reducir el amontonamiento, call to actions evidentes,
eliminar los adornos (antros de ash).

Relevante a irrelevante información.

Grá cos y animaciones que no tengan un objetivo.

Comunica no decora.

9. Recuperación de Errores
Ayuda a los usuarios a reconocer, diagnosticar y recuperarse de los errores.

1. Date cuenta de que lo cometieron o comunícalo

2. Cómo la regó

3. En lenguaje común se ofrece una solución.

fi
fi
fl
10. Ayuda y documentación

Fácil de encontrar, el uso de FAQs, además de iconos, búsqueda avanzada, pop-ups, ayuda
en línea y/o chat en línea.

Help contextual

NOTAS: NO SON UN CHECKLIST, UNA ACCIÓN PUEDE ESTAR CONECTADA CON OTRA, EL
EJEMPLO DE BREADCRUBMS.

Jerarquía Visual
Link: https://www.lancetalent.com/blog/como-aplicar-la-jerarquia-visual-en-tus-
disenos/

1. El tamaño

2. El color y el contraste

3. La jerarquía tipográfica

4. Las fuentes tipográficas

5. El espacio

6. La composición

Principios del Diseño

1. Proximidad

2. Alineación/Grid

3. Repetición

4. Contraste

5. Tipografía

6. Color (agregado)