You don't have access to this class

Keep learning! Join and start boosting your career

Aprovecha el precio especial y haz tu profesión a prueba de IA

Antes: $249

Currency
$209
Suscríbete

Termina en:

0 Días
7 Hrs
41 Min
28 Seg

Interacción

10/20
Resources

Contributions 21

Questions 3

Sort by:

Want to see more contributions, questions and answers from the community?

Mis notas

  • Umbral de Doherty: 400 ms como tiempo ideal de espera para el usuario y carga de la información, se evita añadiendo Microinteracciones para simular y añadir más control.
  • Ley de Fitts: el tiempo para completar una tarea depende de la distancia al elemento.
  • Ley de Jacob: Los usuarios tienden a valorar lo conocido y prefieren que usar sitios con patrones conocidos.
  • Entrenamiento: guía de usabilidad y familiarización del producto.
  • Descubrimiento progresivo: gestionamiento de la información necesaria de acuerdo a la progresión de la tarea.
  • Mapeo: ordenamiento de la información para facilitar ubicación.
  • Destino común: lo que se mueve en el mismo sentido están agrupadas.
  • Affordance: la capacidad de otorgar información para que el usuario navegue de forma intuitiva.

Principios heurísticos de interacción

  • Umbral de Doherty: La productividad se dispara cuando unaPC trabaja a un ritmo menor a 400 ms, como tiempo ideal de espera para el usuario y carga de la información. Si esto no se puede controlar, se pueden añadir microinteracciones para enganchar al usuario y simular que algo esté tardando mucho tiempo en cargar.

  • Ley de Fitts: El tiempo para adquirir un objetivo, es una función de la distancia y el tamaño del objetivo. Ejemplo: Cuando se diseña una app, debemos tener en cuenta donde el usuario colocará sus dedos, si es zurdo o diestro, donde colocar las acciones principales, etc.

  • Ley de Jakob: Los usuarios pasan la mayor parte del tiempo en otros sitios. Los usuarios prefieren lo conocido, y esperan que tu sitio o app funcionen de la misma manera.

  • Técnica de entrenamiento: Se usa mucho en el mundo de los videojuegos. Ejemplo: Un tutorial o guía de usabilidad, para familiarizarse con el producto.

  • Descubrimiento progresivo: Estrategia para gestionar la complejidad de la información, dando solo la información necesaria en un momento dado.

  • Mapeo: Existe una relación entre los controles y su movimiento. Un buen mapeo, da una mayor facilidad de uso.

  • Destino común: Las cosas que se mueven en un mismo sentido, parece que están agrupadas.

  • Affordance: Son todas las posibilidades que naturalmente ofrece el objeto para conocer cómo usarlo.

Puntos clave de las leyes de UX

Las leyes de UX son pautas útiles para elegir un producto o crear soluciones personalizadas.

Acatarlas aumenta las posibilidades de adopción, ya que se basan en nociones de utilidad, facilidad de uso y eficiencia.

En resumen, tanto si estás del lado de los creadores como de los usuarios, para tomar una decisión acertada sobre una herramienta, ten en cuenta lo siguiente:

  • La primera impresión es importante.

  • La velocidad es clave.

  • Un poco de orden también es relevante.

  • Los objetivos deben ser fácilmente localizables y accesibles.

  • Las opciones no deben ser abrumadoras.

  • La memoria de los usuarios no es infinita.

  • Y les encantan las cosas conocidas.

**Recuerda: **la funcionalidad, las integraciones y las necesidades no son los únicos pilares en los que basar una decisión. Incluye las leyes de UX y empieza a tomar decisiones más inteligentes. A la larga, seguro que darán sus frutos._

Interacción

  • Umbral de Doherty
  • Ley de Fitts
  • Ley de Jakob
  • Entrenamiento
  • Descubrimiento progresivo.
  • Mapeo
  • Destino Común
  • Affordance

Principios Heuriticos de Interación

  • Umbral de Doherty: La productividad se dispara cuando una computadora y su usuario interactúan a un ritmo menos a 400 milisengundos, muchas veces no se podra definir este tiempo y para ello utilizamos herramientas como intros, animaciones, efectos de carga etc.

  • Ley fe Fitts: El tiempo para adquirir un objetivo es una funcion de la distancia y tamaño del objetivo

  • Ley de Jakob: Los usuarios pasan la mayor parte de su tiempo en otros sitios. Los usuarios prefieren que tus sitios sean similares a los que ya usan. Trata de usar patrones conocidos en vez de innovar

  • Entrenamiento: Una técnica para enseñar al usuario como usar nuestra app, muy similar a los videojuegos en los primeros minutos, aunque estes jugando la interfaz esta diseñada para entrenarte mientras te hace creer que estas jugando

  • Descubrimiento progresivo: Solo se muestra la información necesaria en un momento dado.

  • Mapeo: Existe una relación entre los controles y sus movimientos y efectos y un buen mapeo da resultado una mayor facilidad de uso

  • Destino común: Las cosas que se mueven en el mismo sentido parecen estar mucho más agrupadas de las que se mueven en sentido contrario

  • Affordance: Son todas las posibilidades que materialmente ofrece un objeto para reconocer como usarlo

10. Interacción

  • Heurísticos
    • Interacción
      • Umbral de Doherty

        • La productividad se disparan cuando el sistema se mueve a una velocidad de 400 ms o menos
          • Uno se ayuda en poner micro interacciones que duren menos de 400 sm
      • Ley de Fitts

        • El tiempo para realizar una tarea es proporcionar a la distancia y tamaño de la tarea
      • Ley de Jakob

        • Los usuarios pasan mucho tiempos en otros sitios, por eso esperan que la web funcione como los sitios que ya conoce. No reinventar la rueda
      • Ley de entrenamiento

        • Enseñar al usuario en las primera etapas mientras va usando la web
      • Descubrimiento progresivo

        • Solo mostrar la información necesaria en cada etapa del usuario
      • Mapeo

        • Debe haber una relación entre los controles y su función/efecto para mejorar la intuición de uso
      • Destino Común

        • Las cosas que se mueven en el mismo sentido parecen estar agrupadas.
      • Affordance

        • Es todas las posibilidades que muestra un objeto intuitivamente de cómo se puede usar. Mucho affordance se intuye naturalmente como se usa el sistema

El affordance buscar hacer exitosa la experiencia, mostrando claramente como debe ser usado cada componente de la interfaz.

### **Puntos importantes de la clase:** 1. **Umbral de Doherty**: Mantener interacciones rápidas (menos de 400 ms) mejora la productividad. 2. **Ley de Fitts**: El tiempo para alcanzar un objetivo depende de su tamaño y distancia; clave en el diseño de interfaces móviles. 3. **Ley de Jakob**: Los usuarios prefieren interfaces que sigan patrones familiares, evitando innovaciones excesivas. 4. **Entrenamiento**: Enseñar comportamientos deseados guiando al usuario a través de tareas progresivamente más complejas. 5. **Descubrimiento progresivo**: Mostrar solo la información necesaria en cada paso para reducir la complejidad visual. 6. **Mapeo**: Relación clara entre controles y sus efectos, haciendo que la interacción sea más intuitiva. 7. **Destino común**: Los objetos que se mueven juntos parecen agrupados, reforzando la estructura de la interfaz. 8. **Affordance**: Los elementos deben ser autoexplicativos, facilitando la navegación sin necesidad de guías o instrucciones.
### Umbral de Doerthy y Estrategias para Mejorar la Efectividad El **umbral de Doerthy** establece que los tiempos de respuesta de menos de 400 ms no interrumpen el flujo de pensamiento de los usuarios y les permiten mantener una interacción fluida con la interfaz. Aquí hay algunas estrategias para mejorar la efectividad en el contexto del umbral de Doerthy: 1. **Optimización de Rendimiento del Sistema** * **Estrategia**: Minimizar los tiempos de carga y respuesta mediante la optimización del código, el uso eficiente de recursos y la reducción de la latencia de red. * **Aplicación**: Utilizar técnicas como la compresión de archivos, el almacenamiento en caché y la optimización de consultas a bases de datos para asegurar que las interacciones sean rápidas y fluidas. 2. **Carga de Contenidos Asíncrona** * **Estrategia**: Implementar la carga asíncrona de contenido, de manera que los elementos se carguen y muestren progresivamente sin bloquear la interacción del usuario. * **Aplicación**: En una aplicación como WhatsApp, los mensajes y archivos multimedia pueden cargarse en segundo plano, permitiendo que la interfaz siga siendo receptiva mientras se procesan las tareas. 3. **Retroalimentación Inmediata** * **Estrategia**: Proveer retroalimentación instantánea para las acciones del usuario, incluso si la acción completa tarda más de 400 ms en procesarse. * **Aplicación**: Mostrar indicadores de progreso, como barras de carga o íconos animados, para comunicar que la acción está en curso, manteniendo al usuario informado y comprometido. 4. **Pre-carga y Pre-renderizado** * **Estrategia**: Pre-cargar y pre-renderizar contenido anticipadamente basado en el comportamiento del usuario para reducir los tiempos de espera percibidos. * **Aplicación**: En una aplicación de mensajería, pre-cargar los mensajes más recientes o contactos frecuentemente utilizados para que estén listos para mostrarse instantáneamente cuando el usuario los solicita. 5. **Simplificación de Tareas y Flujo de Trabajo** * **Estrategia**: Simplificar las tareas y los flujos de trabajo para que las acciones del usuario requieran menos tiempo y procesamiento. * **Aplicación**: Rediseñar formularios y procesos para minimizar la cantidad de pasos necesarios y el procesamiento requerido, asegurando que las interacciones sean rápidas y directas. 6. **Uso de Técnicas de Anticipación** * **Estrategia**: Anticipar las necesidades y acciones del usuario para preparar y optimizar la entrega de contenido y funciones. * **Aplicación**: Implementar predicciones basadas en el comportamiento del usuario para pre-cargar datos relevantes o ajustar dinámicamente los recursos del sistema para cumplir con las expectativas del usuario de manera más eficiente.
* **Affordance:** Quizás una de las más importantes en el diseño digital y es el de la Affordance, la definición exacta dice que “es todas las posibilidades que naturalmente ofrece el objeto para conocer cómo usarlo.” Y si pensamos en el caso de una plataforma digital, un diseño de interfaz bien realizado nos entregará indicios de como navegar de manera fluida, sin complicaciones técnicas, ni la necesidad de leer instrucciones, ni de un manual, ni de tener que detenernos a cada paso, por ejemplo, para insertar una contraseña, un nombre de usuario o estar actualizando el sistema para que nos dé acceso a determinadas funciones. Y tampoco tendríamos que detenernos en analizar cómo están distribuidos y relacionados los iconos, botones, textos, videos e imágenes en una determinada interfaz. En otras palabras, espera que la Affordance vuelva exitoso la experiencia de navegador por nuestra plataforma.
1\. Umbral de Doherty: Simulación con el fin de llamar la atención del usuario mientras se carga el sistema, no debe ser mayor a 400 ms de espera. 2\. Ley de Fitts: El tiempo para adquirir un objetivo es una función de ley de la distancia y el tamaño del objetivo (las posiciones de los botones y los aplicativos tienen una función estudiada). 3\. Ley de Jacob: Los usuarios prefieren lo conocido y pretenden buscar que los demás sitios funcionen de la misma manera. 4\. Ley de Entrenamiento: Es para llevar a cabo un comportamiento deseado. Técnica que se aplica en los videojuegos. 5\. Descubrieminto Progresivo: Estrategia para administrar la información en una aplicación en la que solo se muestra la información principal en un momento dado. 6\. Mapeo: Esquema con el fin de generar una mayor facilidad de uso. 7\. Destino común: Lod objetos que se mueven hacia un mismo sentido dan la sensación de estar agrupados. 8\. Affordance: Son todas las posibilidades que tiene un objeto para reconocer como usarlo. Una buena interfaz nos indica como usar el objeto.
<u>Interacción</u> <u>1- UMBRAL DE DOHERTY:</u> <u>Nos dice que la productividad se dispara cuando una compu y sus usuarios interactúen a un ritmo menor a 400 milisegundos</u> <u>Que garantiza que ninguno tendrá que esperar al otro</u> <u>2-LEY DE FITTS</u> <u>El tiempo para adquirir un objetivo es el una funcional de la distancia y el tamaño del objetivo</u> <u>-Donde el usuario coloca el dedo?</u> <u>-Donde se colocan las acciones principales?</u> <u>-Posiciones de botones!</u> <u>-Todo tiene un por que?</u> <u>3-LEY DE JAKOB</u> <u>Los usuarios pasan la mayor parte de tiempo en muchos sitios</u> <u>Que los patrones sean conocidos</u> <u>4-ENTRENAMIENTO</u> <u>Tecnica muy utilizada para enseñar comportamiento deseado y preciso</u> <u>Videos juegos por ejemplo que tienen una guía</u> <u>5-DESCUBRIMIENTO PROGRESIVO</u> <u>Hay una estrategia para gestionar la complejidad</u> <u>Se muestra la información necesaria en un momento puntual</u> <u>Ejemplo Figma</u> <u>6-MAPEO</u> <u>Existe relación entre los elementos controles movimientos</u> <u>Cocina donde colocamos las cosas </u> <u>7-DESTINO COMUN</u> <u>Las cosas que se mueven en mismo sentido se agrupan </u> <u>Eje aplicaciones mobiles</u> <u>8-AFFORDANCE</u> <u>Es todas las posibilidades que materialmente ofrece un objeto para reconocer como usarlo</u> <u>Plataforma digital</u> <u>Vuelva exitoso la tendencia de como navegar en el mundo digital</u>
**Clase 10 - Interacción** * **¿Cuáles son los principios heurísticos de interacción?** * Umbral de Doherty. * Ley de Fitts. * Ley de Jakob. * Entrenamiento. * Descubrimiento progresivo. * Mapeo. * Destino común. * Affordance. * **¿En qué consiste el principio heurístico del umbral de doherty?** * La productividad y uso de un producto digital se dispara cuando el usuario es capaz de interactuar con el producto en menos de 400 milisegundos. * **¿Qué podemos hacer como diseñadores para tratar de controlar el tiempo de interacción que tiene el usuario con el producto digital?** * Podemos ir agregando transiciones animadas que le indiquen al usuario que están ocurriendo cosas, por ejemplo: * Poner animaciones en el logo * Agregar placeholders de los elemento que se van a cargar * **¿En qué consiste el principio heurístico de la ley de Fitts?** * Este nos dice que el tiempo que un usuario le toma llegar a un objetivo depende de la distancia y tamaño del objetivo, es decir, debemos de tener en cuenta: * El posicionamiento del elemento. * La manera en la que el usuario puede llegar a usar el dispositivo y/o diseño. * **¿En qué consiste el principio heurístico de la ley de Jakob?** * Este principio nos habla de que el usuario pasa mucho tiempo usando otros productos y no solo el nuestro, por lo cual debemos de garantizar que nuestro producto pueda funcionar de una manera similar a los otros productos. * **¿En qué consiste el principio heurístico de entrenamiento?** * Este principio es muy usado en los videojuegos. Lo que se quiere lograr con este principio es que debemos de tener una especie de guía o tutorial de uso del producto para que el usuario lo use de la manera en la que queremos. * **¿En qué consiste el principio heurístico del descubrimiento progresivo?** * Este principio nos habla sobre la idea de categorizar la información que queremos mostrarle al usuario, por ejemplo: * Un menú desplegable que muestra todas las opciones de navegación de un sitio web o uno que muestre todas las funciones de un programa en específico. * **¿En qué consiste el principio heurístico de mapeo?** * Este principio habla de que como diseñadores debemos de organizar eficientemente la información y darle guías visuales al usuario para que entienda mejor el uso del producto. * **¿En qué consiste el principio heurístico de destino común?** * Este principio nos habla de que el usuario percibe que los elementos que se mueven en un mismo sentido están agrupados entre ellos. * **¿En qué consiste el principio heurístico Affordance?** * Este principio nos habla de que como diseñadores debemos de ser capaces de proporcionar la mínima información al usuario para que este sepa cómo usar el producto de manera fácil. * **¿Por qué es importante el principio heurístico de Affordance?** * Porque este garantiza que el usuario tenga una buena experiencia usando nuestro producto

Un poco más sobre la Ley de Jakob

Heurísticos de interacción. Umbral de Doherty: Pequeñas interacciones para evitar la sensación de espera del usuario. Ejem: Animación de logo de netflix al iniciar la app. Ley de Fitts: El tiempo para adquirir un objetivo se basa en la distancia y tamaño del mismo. Ley de Jacob: Los usuarios prefieren lo conocido, utilizar patrones que ya son conocidos en vez de inventar la rueda. Entrenamiento: Técnica aplicada en los videojuegos, permite guiar al usuario antes de la interacción. Descubrimiento progresivo: Consiste en agrupar campos para que se vayan descubriendo los elementos y no saturar de información. Mapeo: Un buen mapeo o guía da mejor resultado al momento de usar el producto. Destino común: Seguir un patrón de movimiento. Affordance: Todas las posibilidades que ofrece un objeto para conocer su uso.
En el ejemplo de Netflix, a estas formas que te permiten previsualizar el contenido, se le llama skeleton loading, y ayuda a como dice Emilio, a hacer más corta la sensación de espera, y a la vez da información al usuario del tipo de estructura de contenido que va a ver 😁
* Umbral de Doherty: Productividad se dispara cuando un usuario interactua en una computadora a un ritmo 400 milisegundos, garantiza que ningun otro tiene que esperar al otro, no sabemos muchas veces que esto va a ocurrir y no podemos controlar que el tiempo de espera sea exactamente eso, asi que simulamos pequeñas interacciones que son exactamente eso, que es hacer que el usuario esté enganchado con la aplicación, ejemplo básico la animación de el logo de Netflix que aparece al principio de todos los videos, o cuando se abre la app. * Ley de Fitts: El tiempo para adquirir un objetivo, es una función de la distancia y el tamaño de el objetivo, tenerlo muy en cuenta cuando diseñamos aplicaciones web, en donde colocamos el dedo si es zurdo o diestro, donde colocamos las aplicaciones principales, donde colocamos todas las cosas, todo tiene un porque y muchas de estas cosas. * Ley de Jakob: Los usuarios pasan la mayor parte de su tiempo en otros sitios, y estos usuarios prefieren que los demás sitios funcionen como el que usualmente usa, no se reinventa la rueda. * Entrenamiento: Utilizada para diseñar un comportamiento deseado, creando aplicaciones cada vez más precisas de el comportamiento, se aplica mucho en los video juegos. Sigues un guía. * Descubrimiento progresivo: Estrategia para ejecutar la información, sólo se muestra la info necesaria, ejemplo llenando un formulario.  * Mapeo: Relacion entre los botones y el objeto, cocina vemos donde esta todo y donde se coloca. * Destino común: Las cosas que se mueven en el mismo sentido parecen estar agrupadas, es como percibir la continuidad. * Affordance: Todas las posibilidades que office un objeto para reconocer el como se usa, este nos dara indicio de como se usa, sin complicaciones técnicas. Se espera que sea exitoso al navegar con este. *

Umbral de Doherty: 400 ms como tiempo ideal de espera para el usuario y carga de la información, se evita añadiendo Microinteracciones para simular y añadir más control.
Ley de Fitts: el tiempo para completar una tarea depende de la distancia al elemento.
Ley de Jacob: Los usuarios tienden a valorar lo conocido y prefieren que usar sitios con patrones conocidos.
Entrenamiento: guía de usabilidad y familiarización del producto.
Descubrimiento progresivo: gestionamiento de la información necesaria de acuerdo a la progresión de la tarea.
Mapeo: ordenamiento de la información para facilitar ubicación.
Destino común: lo que se mueve en el mismo sentido están agrupadas.
Affordance: la capacidad de otorgar información para que el usuario navegue de forma intuitiva.

![]()![](https://static.platzi.com/media/user_upload/image-fc65af12-1ef9-44c8-b628-9a726932a3e1.jpg)

Gracias

Que buen curso… Me está gustando mucho… interesantísimo y práctico.