18 consejos para mejorar la usabilidad e interaccion visual de tu producto
•Download as PPTX, PDF•
0 likes•154 views
¿Cómo podemos guiar a los #usuarios de la mejor manera en nuestros productos #digitales? Al #diseñar debemos acercarnos al #modelomental de nuestro público objetivo. Veremos los factores que debemos contemplar para diseñar #interacciones #visuales usables.
Recommended
Recommended
More Related Content
What's hot
What's hot (15)
Similar to 18 consejos para mejorar la usabilidad e interaccion visual de tu producto
Similar to 18 consejos para mejorar la usabilidad e interaccion visual de tu producto (20)
More from Daphne Repain
More from Daphne Repain (18)
Recently uploaded
Recently uploaded (20)
18 consejos para mejorar la usabilidad e interaccion visual de tu producto
- 1. Gabriel Pacheco & Daphné Repain - Noviembre 2019 18 consejos para mejorar la Usabilidad e Interacción Visual de tu producto
- 2. ¿Y si fracasa una interacción? 1
- 3. El usuario se pueda sentir frustrado, ansioso o perdido… No completar la compra abandona el sistema Llamadas a soporte técnico… clientes infelices
- 4. “ Los humanos, no siempre se comportan torpemente. Los humanos no siempre se equivocan. Lo hacen cuando las cosas que utilizan están mal concebidas y diseñadas” D. Norman En lugar de usar la misma contraseña en todas partes, uso múltiples variaciones diferentes de la misma contraseña donde cambió una letra o agrego un número, etc. Esto es súper seguro y protege todas mis cuentas para que nunca yo pueda iniciar sesión.
- 5. La duda que valía 12M$ Variante A (Original) Variante B (Variación )
- 6. La interfaz que mató a Jenny….
- 7. ¿El diseñador...un científico del comportamiento? 2
- 8. Cuando diseñamos debemos responder a una necesidad Rosenfeld Media
- 9. Los usuarios formarán sus modelos mentales basados en interacciones con aplicaciones y sitios web existentes. En resumen, esperan consistencias con estas experiencias anteriores y tener un patrón estándar de UI. Author/Copyright holder: Nathanael Crawford. Copyright terms and licence: CC BY-SA 3.0
- 10. Elaboramos y formamos nuestros modelos mentales a partir de Las costumbres La cultura Las ideas importantes recibidas durante la infancia Situaciones que vivimos En psicología cognitiva, un modelo mental es una representación para simular mentalmente el curso de un fenómeno para anticipar los resultados de una acción.
- 11. Al diseñar debemos acercarnos al modelo mental de nuestro público objetivo. Un modelo mental es cómo tú crees que algo funcionará, basado en tu aprendizaje y experiencia. The Nature of Explanation, K.J.W Craik
- 13. Los modelos mentales que no coinciden son comunes, especialmente con diseños que prueban algo nuevo. Si puede comprender los modelos mentales de sus usuarios, puede simular estos modelos dentro de sus diseños para hacerlos más útiles e intuitivos. Modelos mentales evolucionan
- 15. El primer auto. ¿Cómo se veía? .
- 16. El rediseño del espacio... Y de la interacción vehículo/ecosistema .
- 17. Las personas perciben los productos interactivos en dos dimensiones (Hassenzahl, 2008) Las cualidades hedónicas / Be Goals La capacidad del sistema para apoyar el logro de los "objetivos¨, foco en el ser. Necesidades psicológica y satisfacción de ellas, porque usamos…. Ej. Relacionarse con los demás, sentirse seguro. Las cualidades pragmáticas / Do Goals La capacidad del sistema para apoyar el logro de los "objetivos¨ es decir tareas, foco en el producto, utilidad, usabilidad, task completion Ej. Hacer una llamada, encontrar un libro... Percepciones
- 19. Capacidad limitada del sistema - Carga Cognitiva
- 21. Interacción 1 Objetivo de usuario 2 Acciones 4 Evaluación 3 Percepción Tarea del Sistema Retroalimentación INTERFACE DE USUARIO Acción Respuesta
- 22. Retroalimentación Visibilidad del estado del sistema El sistema siempre debe ser capaz de dar retroalimentación oportuna y apropiada, informar al usuario de lo que está pasando para que éste pueda tomar acciones. Esta retroalimentación la tenemos todo el tiempo con los sistemas a nuestro alrededor En nuestro teléfono En nuestro auto
- 23. Cuando un usuario interactúa con un sistema, necesita saber si la interacción fue exitosa. Falta de conocimiento es igual a una falta de control. ¿Está funcionando? ¿En qué piso está? ¿Está bajando o subiendo?
- 24. Coherencia Ser coherente entre lo que conoce el usuario del mundo real Para que un sistema sea usable debe en un principio asemejarse a lo que los usuarios ya conocen y les es familiar en el mundo real. Presentar una interfaz digital de algo que les es familiar evita una curva innecesaria de aprendizaje.
- 25. Mundo Real Representación digital (Esqueumorfismo) Evolución Usar palabras, conceptos, diseños familiares para el usuario. Por naturaleza los seres humanos encuentran confort en lo familiar
- 26. Control Ofrecer al usuario control y libertad Los usuarios suelen escoger opciones por equivocación, curiosidad o porque piensan que tiene una función diferente a lo que esperaban. Esta heurística se centra en permitirle al usuario estas equivocaciones y darle opciones de recuperación.
- 27. Tener control sobre las acciones y escoger deshacerlas. Utilizar una salida de emergencia
- 28. Consistencia Estándares y patrones Éste punto tiene mucho que ver con el número 2, el usuario debe ser capaz de entender el significado de las palabras, acciones o situaciones del sistema de acuerdo a los estándares de la plataforma, o el resto de sistemas que utiliza. Familiar ????
- 29. La consistencia puede ser interna (CTA) o externa. A veces es mejor ser estándar, que innovar y el diseño no funcione
- 30. Prevención de errores Errores de interfaz y de usuario Mucho mejor que un buen diseño de mensajes de error es realizar un diseño cuidadoso que prevenga la ocurrencia de problemas. Eliminar o minimizar las condiciones para que se den errores.
- 31. Un error en sistemas como salud, financieros, defensa, etc puede tener consecuencias muy graves. Si un usuario no es advertido o puede revertir una acción accidental, es una falla de diseño.
- 32. Memoria Reconocimiento en lugar de recordar Un usuario difícilmente va a memorizar información que el sistema le brinde o necesite para completar un proceso. Es más fácil reconocer algo familiar que recordar un información.
- 33. Minimizar la carga de memoria del usuario mostrando los objetos, acciones y opciones. Dar al usuario opciones claras, o pistas como en un login.
- 34. Flexibilidad y eficiencia Interfases para todo tipo de usuarios El sistema debe ser flexible para todo tipo de usuarios, tanto para los más expertos como para los recién llegados. El sistema debe reconocer al tipo de usuario y dejar que éste personalice su experiencia de uso.
- 35. Ayudar a maximizar la eficiencia utilizando aceleradores sin dejar de lado al usuario inexperto. Macros en exel - Like en instagram
- 36. Estética y minimalismo Conservar el foco en el objetivo del usuario El sistema debe ser capaz de aportar la mínima información relevante para el usuario sin que éste último pierda de vista el contenido más importante del sitio web. Debe ser lo más minimalista y sencillo posible para que el usuario no se pierda entre tanta información. Minimalismo + Retroalimentación
- 37. No significa usar diseño plano o monocromático, sino enfocarse en lo esencial. Comunicar no decorar. Cada información extra en la interfaz compite con la información relevante.
- 38. Manejo de errores 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. A diferencia de la heurística 5 de prevención de errores, esta se dá cuando un error ya ocurrió y como me recupero de éste
- 39. Inclusive cuando el error no es específico, ofrecer contexto y opciones. Reducir el trabajo para corregir un error y al mismo tiempo educar al usuario
- 40. Ayuda y documentación Reconocer, diagnosticar y recuperarse de errores Muchas veces, aunque la interfaz sea clara, se debe guiar al usuario a completar su acción principal, a través de formas como tooltips, chatbots, páginas de onboarding, etc. ● Es fácil de encontrar ● Está enfocada en la acción del usuario ● Ofrece acciones específicas para completar una acción Una buena interfaz de ayuda
- 42. Es fácil de encontrar Está enfocada en la acción del usuario Ofrece acciones específicas para completar una acción Una buena interfaz de ayuda
- 43. Principios y leyes de percepción visual para potenciar la toma de decisión en línea 4
- 44. La construcción de la percepción visual por el cerebro Falso = Espejismo Verdadero Objeto (forma, color, movimiento) Estimulador de luz Centro integrador que garantiza la construcción de la percepción visual. Imagen retiniana invertida Ojo Cerebro Memoria Interpretación Áreas corticales involucradas en la visión. Aprendizaje El origen de Mensajes nerviosos Estímulos Construcción cerebral Percepción visual única
- 45. El todo es diferente a la suma de sus partes Proximidad ContinuaciónContinuación Semejanza Figura y fondo (árbol dentro de la letra "A")
- 46. El todo es diferente a la suma de sus partes Ley de figura y fondo, para el logotipo, el cuadro de texto, el botón y el contexto sobre un fondo blanco. Toda la sección utiliza posicionamiento simétrico Ley de similitud con el mismo tamaño y color de fondo para los botones de acción Ley de proximidad aplicada al menú de navegación Ley de sincronía aplicada para mostrar todos estos elementos a la vez. Ley de región común aplicada al menú de navegación
- 48. Ley de Fitt - distancia y tamaño Lento Rápido Medio Medio
- 49. Ley de Hick - Opciones Tiempoderespuesta Número de opciones
- 50. Ley de Jacob - Costumbres
- 51. Ley de Miller - Memoria de trabajo 5/7/9
- 52. Efecto de posición en serie: primero y último
- 53. Efecto Zeigarnik - Incompleción
- 54. Cómo aplicar eso a mi producto? 5
- 55. Entrevista Abierta con rol play de resolución de problema Observación Auto confrontación Pensar en voz alta Why, why, why Card Sorting Metodologías para acercarnos al modelo mental de nuestro público objetivo 01
- 57. Evaluar los principios del Diseño UI sin usuarios 03 Ver formato
- 58. Evaluar los principios del Diseño UI y UX con usuarios 04
- 60. En 2030 80% de la busqueda de informacion en linea estara hecha por Interacción vocal.
- 61. En 2030 80% de la busqueda de informacion en linea estara hecha por Voice Interaction…. En 2050 ... 2 mil millones de personas necesitarán un dispositivo asistido
- 62. ¿Te interesa el UX? Escanea este código y súmate a nuestra comunidad en Slack. Asociación Profesional Ecuatoriana sobre la Experiencia de Usuario info@uxpa.ec UXPAEcuador UXPAEcuador
- 63. Próximos eventos 2019 ● UX Writing (Taller) Diciembre / Guayaquil ● Why UX (Charla) 12 Dic. / Impaqto República del Salvador / Quito 2020 ● Evaluación sin usuarios - Usabilidad & UI - Parte 2 Enero / Centro Digital Banco Pichincha / Quito ● User Research: El hábito de investigar (Charla) Enero / Quito ● Potenciar sus presentaciones para incentivar a la toma de decisión Enero - Centro Digital Banco Pichincha - Quito ● Diseñar para las emociones (Taller) Febrero / Centro Digital Banco Pichincha / Quito ● Diseño Inclusivo (Taller) Marzo / Centro Digital Banco Pichincha / Quito ● UXLAT 2020 (Conferencia Internacional) TBD / Quito
Editor's Notes
- OBJ: Aprender las bases de criterios de usabilidad con Interaccion visual Publico Meta: design & Front https://www.nngroup.com/articles/cloud-storage/
- Cuando diseñamos interfaces y fallamos en la usabilidad básica, lo peor es que nuestro producto falle. Sin embargo, cuando los diseñadores de este sistema, o incluso en una cabina de un avión, fallan en su diseño, hay daños físicos reales.When most of us design a User Interface, and fail at basic usability, the worst that happens is that our product fails. Yet, when the designers of this system, or even an airplane’s cockpit, fail at their design, there are real physical harms.
- instead of using the same password everywhere, i use multiple different variations of the same password where i change one letter or add one number and so on. this is super secure and protects all my accounts fro ever being able to get logged into by me. What users believe they know about a UI strongly impacts how they use it. Mismatched mental models are common, especially with designs that try something new.
- http://www.conversionvoodoo.com/blog/2011/11/expedia-deletes-one-field-from-their-registration-process-increases-profit-12m/ http://www.zdnet.com/article/expedia-on-how-one-extra-data-field-can-cost-12m/ Why was changing this field so critical? Because that single field broke the flow of their entire UI: When visitors see the “Company” field, they were confused. Visitors thought Expedia meant they should put in their Bank name. Users then put their’s Bank’s address into the billing fields. This led to failed transactions, which led to abandons. Conversion rate optimization gains are often just a function of getting your broken UI the $!@$!@ out of the way of your end user . . . Yes, it’s that damn simple and you need to start by understanding how users ACTUALLY interact with your funnel. Expedia analysts realised the site needed to be changed after investigating why many customers who clicked the 'Buy Now' button on the company's site did not complete the transaction. "This is someone who was on our site, found the right location and hotel, put in all their billing and travel information and clicked the 'Buy Now' button," Megibow said. "As far as leading indicators of purchase intent go, this is as good as it gets and yet we weren't taking the money." Analysts began examining and correlating information about these failed transactions to identify what traits they had in common. The answer, it turns out, was quite simple: "We had an optional field on the site under 'Name', which was 'Company'," Megibow said.
- https://medium.com/tragic-design/how-bad-ux-killed-jenny-ef915419879e Jenny, as we will call her because the patient's name was never shared, was a little girl who had previously been in the hospital ward for cancer for four years and was discharged. Then a while later she relapsed and had to be given a very strong chemo treatment medicine. This medicine is so strong and so toxic that it requires pre-hydration and post-hydration for three days with I.V. fluid. However, after the medicine was administered, three nurses were attending to the charting software to enter in everything required of them and make the appropriate orders, missed a very critical piece of information. Jenny was supposed to be given 3 days of I.V. hydration. But the three nurses, with over 10 years experience, were too distracted trying to figure out the software they were using, they completely missed it. When the morning nurse came in the next day, she had died of toxicity and dehydration. For two shifts, she had missed her hydration and all because the three, very good nurses, were stuck trying to figure this out…
- Les besoins des utilisateurs ne sont pas les vôtres … ou ceux que vous croyez être les vôtres. Le principe essentiel de la méthode exposée ci-après, c’est de revoir vos priorités pour qu’elles coïncident avec celle des utilisateurs. Pour cela, je vous recommande de définir des priorités vitales, celles qui touchent à l’existence même de votre organisation, à sa raison d’être. Back to basics Pour Amazon, la priorité est de vendre des produits. J’en reviens à la plateforme de marque et au mission statement Our vision is to be Earth’s most customer centric company ; to build a place where people can come to find and discover anything they might want to buy online. Extrait de la page Facebook d’Amazon Ma priorité en tant qu’acheteur, c’est de pouvoir trouver n’importe quel produit en ligne. On dirait que les priorités se rejoignent, non ? S’effacer sans se renier Ce que vous proposez pour répondre aux besoins des utilisateurs est essentiel, au sens littéral du terme. Votre organisation est importante également puisqu’elle contribue à crédibiliser votre offre, mais elle reste secondaire. Vous avez remarqué qu’on ne voit jamais l’annonce de la nomination d’un directeur quelconque sur la page d’accueil d’Amazon ? Cela ne signifie pas que l’information n’a pas d’intérêt en soi. Mais si on se réfère au Mission statement, elle n’a pas de raison d’être priorisée. Une étude montre qu’Amazon est l’enseigne préférée des Français, et pourtant, Amazon cache cette information dans une sous-page d’une sous-rubrique…
- https://uxdesign.cc/mental-models-in-ux-design-in-examples-f75b083cd487 A mental model is how you think something will work, based on your learning and experience.When it comes to mental models, there are two things to differentiate. First is a system model and second — interaction model.The system model is how something works, and the interaction model is how to interact with it, how to use it.
- https://uxdesign.cc/mental-models-in-ux-design-in-examples-f75b083cd487 A mental model is how you think something will work, based on your learning and experience.When it comes to mental models, there are two things to differentiate. First is a system model and second — interaction model.The system model is how something works, and the interaction model is how to interact with it, how to use it.
- It is an all too common failing of designs for designers to base their ideas on their own mental models; their models are often too complete and detailed to bear any relationship with a user’s model. This in turn leads to failure in UI where the user does not find their mental model and is left confused and frustrated. It is worth noting that a mental model is not a static creation. It is capable of evolution and may change based on using other products, from interacting with other users or taking on board learning from other sources.
- Parecía un carruaje sin caballo. Porque si alguien entraba manejando un nuevo s-class, no hubiera relación en el marco de compresión
- Por lo tanto, los modelos mentales evolucionan con el tiempo. Una vez que las personas han entendido que esta es una pantalla y pueden tocar interactuar y algo sucede, evoluciona ese paradigma, porque ya no necesitan guía, no necesitan las páginas. Ocurre esto cuando hay un nivel suficiente de conocimiento en la conciencia pública, y así es como todos obtenemos el diseño plano. Durante los últimos años, la base de conocimiento de la población en general ha llegado a un punto en el que las personas saben que pueden interactuar con ciertas cosas en una pantalla, por lo que ya no necesitan verse como objetos físicos. Y algunas de esas metáforas físicas en realidad no aprovechan algunos beneficios que trae una interfaz digital. Pero primero, necesitas construir el conocimiento. ….. So mental models can evolve over time like once you’ve done some work to take people into a new paradigm. Once people have understood that this is a screen and they can tap something and something happens, then evolve that paradigm, because you don’t need the leather anymore, you don’t need the pages. Actually, Apple did it when it switched from skeuomorphism. It happens when there is a sufficient level of knowledge in the public consciousness, and that’s how we all get the flat design. For the last couple of years, the knowledge base of the general population has gotten to a point now, where people just know that they can interact with certain things on a screen, so they don’t need to look like physical objects anymore. And after a while, those metaphors actually start holding you back because even looks like a book it is still not a book. Some of those physical metaphors actually not take advantage of some benefits that a digital interface brings. But first, you need to build the knowledge.
- Hablar que las personas son diferentes y que cada uno posee diferentes características, dependiendo de la cultura a la que pertenece, experiencias, etc. Teoría - Las personas son diversas, impredecibles, desordenadas, tienen habilidades diferentes
- Selon leur modèle de système, un administrateur central contrôle d’autres sous-systèmes, ou systèmes esclaves, connus sous les noms de boucle phonologique, de calepin visuospatial et de tampon épisodique. L’administrateur central est présenté comme un système qui concentre, partage et déplace l’attention entre les éléments d’information détenus par les sous-systèmes, dans le but de manipuler ou de traiter l’information pendant qu’elle est gardée dans la mémoire de travail. La boucle phonologique est le sous-système responsable du stockage et de la conservation de l’information verbale, tandis que le calepin visuospatial est responsable du stockage et du maintien des informations visuelles et spatiales. Le tampon épisodique, ajouté ultérieurement au modèle (Baddeley, 2000), combine les éléments visuels et auditifs pour créer des scènes; il correspond à l’imaginaire par lequel une personne se représente mentalement des scènes ou des scénarios.
- Memoria + Atencion limitadaç Parmi les divers modèles de mémoire de travail qui ont été proposés, celui créé par Baddeley et Hitch (1974) bénéficie possiblement de l’assise empirique la plus solide. Selon leur modèle de système, un administrateur central contrôle d’autres sous-systèmes, ou systèmes esclaves, connus sous les noms de boucle phonologique, de calepin visuospatial et de tampon épisodique. L’administrateur central est présenté comme un système qui concentre, partage et déplace l’attention entre les éléments d’information détenus par les sous-systèmes, dans le but de manipuler ou de traiter l’information pendant qu’elle est gardée dans la mémoire de travail. La boucle phonologique est le sous-système responsable du stockage et de la conservation de l’information verbale, tandis que le calepin visuospatial est responsable du stockage et du maintien des informations visuelles et spatiales. Le tampon épisodique, ajouté ultérieurement au modèle (Baddeley, 2000), combine les éléments visuels et auditifs pour créer des scènes; il correspond à l’imaginaire par lequel une personne se représente mentalement des scènes ou des scénarios. Le tampon épisodique est également l’espace où l’on anticipe des résultats et planifie un comportement (Baddeley, 2006); il est considéré comme l’espace de travail où se produit la manipulation de l’information (Hofmann, Friese, Schmeichel et Baddeley, 2011). La charge cognitive est une notion associée à la mémoire de travail; elle fait référence à la capacité limitée de ce système et à la façon dont l’exécution de différents types de tâches requiert un degré d’attention variable. Sweller (1988), auteur de la théorie de la charge cognitive, distingue trois types de charge – intrinsèque, extrinsèque et essentielle. La charge intrinsèque renvoie à la complexité inhérente d’une tâche, tandis que la charge extrinsèque est liée à la façon dont est présentée l’information, dont les éléments ont le potentiel de surcharger la tâche. La charge essentielle correspond à l’effort consacré au traitement ou à la compréhension d’une tâche. Pour illustrer chaque type de charge, on peut penser à l’élève qui apprend le nom des planètes qui composent notre système solaire. La charge intrinsèque est formée de la quantité d’information à apprendre (nombre de planètes), tandis que la charge essentielle correspond à l’effort requis pour traiter l’information qui doit être assimilée. La charge extrinsèque est définie par les caractéristiques de l’environnement d’apprentissage de la nouvelle matière : niveau de bruit, autres activités en cours dans la classe, etc. Idéalement, le professionnel de l’enseignement réduit la charge extrinsèque autant que possible de façon à ramener la charge cognitive à l’essentiel – autrement dit, la majeure partie de l’énergie et de l’attention de l’élève doit être consacrée au traitement de la nouvelle information. Comme la charge intrinsèque ne peut être manipulée, le personnel enseignant doit limiter la charge extrinsèque et favoriser la charge essentielle. Selon la théorie de Sweller (1988), la façon de présenter l’information a une influence sur la charge et détermine, en conséquence, si la personne retient l’information ou devient surchargée et ne la retient pas.
- Introducir que existen 9 principios que tenemos que tener en consideración al momento de aplicar el diseño de un interfaz ya que sin ellos la calidad y la facilidad de uso estaría comprometida. https://www.wired.com/story/how-dumb-design-wwii-plane-led-macintosh/
- Explicar mediante el gráfico que es la interacción. Teoría Se define como el dialogo entre humanos y computadoras. El interfaz entre humanos y computadoras que se implementa, es crucial para facilitar la interacción. Gráfico Objetivo El usuario establece el objetivo Acción Formular la intención Especifica acciones en el interfaz Ejecuta la acción Tarea del sistema El sistema recepta la acción y la procesa. Retroalimentación del sistema Respuesta sobre la acción solicita por parte del sistema. Percepción Percibe el estado del sistema Interpreta el estado del sistema Evalúa el estado con respecto al objetivo Evaluación Como conocen los usuarios que cumplieron su objetivo.
- Una comunicación abierta entre el sistema y el usuario no solo te ayuda a entender que está pasando, sino a actuar basado en esa información. Esta retroalimentacion puede ser permanente, actuar en base a una acción, etc. No quiere decir que al usuario se le debe mostrar todo lo que esta pasando con el sistema, se debe mostrar información clave y útil en el contexto de uso.
- Esta retroalimentación puede ser a través de un cambio color, un sonido, un mensaje explícito etc, dependiendo del contexto en el cual se desarrolle la interacción.
- https://miro.medium.com/max/1600/1*bYWgQJDTDuj4tMR4_bKQMA.gif Gif Tarjeta MAstercard Frase Descriptiva: ¡Creo que lo he visto antes! Diseñe interfaces para tener una operación y uso similar (elementos similares para lograr tareas). Permite a las personas transferir rápidamente conocimientos previos al nuevo contexto y enfocarse en tareas relevantes
- Again, the less the users have to guess the better. The system should speak the users’ language (use words, phrases and concepts familiar to the user), rather than special system terms. Good Example: Payment proceeding (by Ramakrishna) Sequence of actions should be organized into groups with a beginning, middle and end. When a process is finished, remember to display a notification message. Let the user know that she has done all that’s needed. Design: Grouping of actions Explicit completion of an action Well-defined options for the next step
- El ejemplo mas facil de esto es el eliminar mensaje enviado de whatsapp
- Explicar que es un buen diseño de estructura Pregunta: ¿Puedo encontrar lo que espero? Poner cosas relacionadas juntas y separar cosas no relacionadas.
- Explicar que es un buen diseño de estructura Pregunta: ¿Puedo encontrar lo que espero? Poner cosas relacionadas juntas y separar cosas no relacionadas.
- Explicar que es un buen diseño de estructura Pregunta: ¿Puedo encontrar lo que espero? Poner cosas relacionadas juntas y separar cosas no relacionadas.
- Explicar que es un buen diseño de estructura Pregunta: ¿Puedo encontrar lo que espero? Poner cosas relacionadas juntas y separar cosas no relacionadas.
- Explicar que es un buen diseño de estructura Pregunta: ¿Puedo encontrar lo que espero? Poner cosas relacionadas juntas y separar cosas no relacionadas.
- Explicar que es un buen diseño de estructura Pregunta: ¿Puedo encontrar lo que espero? Poner cosas relacionadas juntas y separar cosas no relacionadas.
- Explicar que es un buen diseño de estructura Pregunta: ¿Puedo encontrar lo que espero? Poner cosas relacionadas juntas y separar cosas no relacionadas.
- Explicar que es un buen diseño de estructura Pregunta: ¿Puedo encontrar lo que espero? Poner cosas relacionadas juntas y separar cosas no relacionadas.
- El buscador de Google es el máximo exponente de esto. Google.com consta de una barra de búsqueda, dos botones y una lupa. Punto y pelota. Es simple, sencillo y cualquier persona entiende a primera vista qué debe hacer.
- Podría decirte “La contraseña que usted ha introducido es incorrecta. ¿Se ha equivocado? ¡Pruebe una nueva y veámos si funciona!”, pero el primer mensaje es más simple, más efectivo y, por tanto, más apropiado para el usuario.
- Podría decirte “La contraseña que usted ha introducido es incorrecta. ¿Se ha equivocado? ¡Pruebe una nueva y veámos si funciona!”, pero el primer mensaje es más simple, más efectivo y, por tanto, más apropiado para el usuario.
- Explicar que es un buen diseño de estructura Pregunta: ¿Puedo encontrar lo que espero? Poner cosas relacionadas juntas y separar cosas no relacionadas.
- Hay que tener en cuenta el criterio al momento de utilizar las ayudas, ya que si nos guiamos por el ejemplo, clippy que era el ayudante de word, poseía las 3 caracteristicas, sin embargo nunca se enfoco al contexto de uso lo cual fue su principal falla. En el caso de smart compose de GMail, aprende de tus expresiones y te da sugerencias en base a tu comportamiento, el contacto al cual escribes etc y te muestra una opción simple para la acción de ese momento.
- Hay que tener en cuenta el criterio al momento de utilizar las ayudas, ya que si nos guiamos por el ejemplo, clippy que era el ayudante de word, poseía las 3 caracteristicas, sin embargo nunca se enfoco al contexto de uso lo cual fue su principal falla. En el caso de smart compose de GMail, aprende de tus expresiones y te da sugerencias en base a tu comportamiento, el contacto al cual escribes etc y te muestra una opción simple para la acción de ese momento.
- https://openclassrooms.com/fr/courses/5248981-auditez-lexperience-utilisateur/5634896-utilisez-les-heuristiques-de-bastien-scapin
- Cortex visual toma info en las dos areas de atras del cerebro Cada ojo tare input a parte campo visual derecho y campo visual izqueirdo
- La psicología de la Gestalt (también psicología de la forma o psicología de la configuración) es una facultad de la psicología moderna, surgida en Alemania a principios del siglo XX, cuyos exponentes más reconocidos fueron los teóricos Max Wertheimer, Wolfgang Köhler, Kurt Koffka y Kurt Lewin. El término Gestalt proviene del alemán, fue introducido por primera vez por Christian von Ehrenfels y puede traducirse, aquí, como "forma", "figura", "configuración", "estructura" o "creación".1 La mente configura, a través de ciertos principios descubiertos por esta misma corriente, los elementos que llegan a ella a través de los canales sensoriales (percepción) o de la memoria (pensamiento, inteligencia y resolución de problemas). En la experiencia que tiene el individuo en su interacción con el medio ambiente, esta configuración tiene un carácter primario sobre los elementos que la conforman, y la suma de estos últimos no podría generar por sí sola la comprensión del funcionamiento mental. Este planteamiento se ilustra con el axioma que dice: El todo es diferente a la suma de las partes.
- Ley de similaridad con el mismo tamaño y color para los botones de acción Ley de figure and ground para el logo, texto, botón y contexto en el blanco de fondo. La sección entera usa Law of figure and ground, for the logo, textbox, button and context blow on a white background. The entire section uses symmetrical positioning Law of similarity with same size and background color for the call to action buttons Law of proximity applied for the navigation menu Law of synchrony applied to display all these elements at once Law of common region applied for the navigation menu
- Efecto de Von Restorff / Isolation effect predicts that when multiple homogeneous stimuli are presented, the stimulus that differs from the rest is more likely to be remembered.[1] The theory was coined by German psychiatrist and pediatrician Hedwig von Restorff (1906–1962), who, in her 1933 study, found that when participants were presented with a list of categorically similar items with one distinctive, isolated item on the list, memory for the item was improved.[2] The study utilized the isolation paradigm, which refers to a distinctive feature of an item in a list that differs from the others by way of dimension. Such distinctiveness, leading to the von Restorff effect, can be generated from changing the meaningfulness or physical nature of the stimulus in some way, such as in size, shape, color, spacing and underlining. For example, if a person examines a shopping list with one item highlighted in bright green, he or she will be more likely to remember the highlighted item than any of the others. Additionally, in the following list of words – desk, chair, bed, table, chipmunk, dresser, stool, couch – chipmunk will be remembered the most as it stands out against the other words in its meaning.
- Ley de Fitts: distancia y tamaño LEY → "El tiempo requerido para alcanzar un objetivo depende de la distancia y el tamaño de ese objetivo. " La Ley de Fitts es una fórmula que define cuánto tiempo le toma a una persona mover su puntero de un área de la pantalla a otra. Esta ley debe aplicarse mientras se mantienen consideraciones estéticas, para evitar demasiado cerca las acciones importantes que el usuario debe realizar. ORIGEN En 1954, el psicólogo Paul Fitts, al examinar el sistema motor humano, mostró que el tiempo requerido para moverse a un objetivo depende de la distancia entre ellos, pero es inversamente proporcional a su tamaño. Según su ley, los movimientos rápidos y los objetivos pequeños conducen a tasas de error más altas, debido al compromiso de velocidad y precisión. Aunque hay varias variaciones de la ley de Fitts, todas abarcan esta idea. La ley de Fitts se aplica ampliamente en el diseño de la experiencia del usuario (UX) y la interfaz de usuario (UI). Por ejemplo, esta ley ha influido en la convención de hacer grandes botones interactivos (especialmente en dispositivos móviles con los dedos): los botones más pequeños son más difíciles (y requieren más tiempo) hacer clic.
- "El tiempo necesario para tomar una decisión aumenta con el número y la complejidad de las elecciones. " Podemos dividir una tarea en 4 fases: A / Detecta un problema o identifica un objetivo B / Determine las opciones para resolverlo o alcanzarlo C / Elija una opción D / Hacer la opción elegida La ley de Hick se encuentra en la fase C. Se aplica a procesos simples, como la elección de un botón para presionar. El diseñador puede tener en cuenta esta ley al diseñar interfaces con menús y paneles. ORIGEN La Ley de Hick (o Ley de Hick-Hyman) lleva el nombre de un equipo de psicólogos británicos y estadounidenses por William Edmund Hick y Ray Hyman. En 1952, comenzaron a examinar la relación entre el número de estímulos presentes y el tiempo de reacción de un individuo a un estímulo dado. Como puede imaginar, cuantos más estímulos elija, más tiempo le tomará al usuario tomar una decisión con la que interactuar. Los usuarios bombardeados con opciones deben tomarse el tiempo para interpretar y decidir, esto les da trabajo que no quieren
- LOI → « Les utilisateurs passent la majorité de leur temps sur d’autres sites. Cela signifie que les utilisateurs préfèrent que votre site fonctionne comme ceux qu’ils connaissent déjà. » ORIGINE La loi de Jakob a été inventée par Jakob Nielsen, le directeur du groupe Nielsen Norman, qu’il a co-fondé avec le Dr. Donald A. Norman (ancien vice-président de la recherche chez Apple Computer). Pour permettre des améliorations rapides et peu coûteuses des interfaces utilisateur, il a inventé plusieurs méthodes d’étude et d’analyse d’interfaces basées sur ce principe, dont l’évaluation heuristique. Ce principe, aussi évoqué par Steve Krug dans “Don’t make me think”, prend le parti d’utiliser les conventions existantes du web pour concevoir des interfaces.
- La loi de Miller postule que le nombre moyen d’objets pouvant être mémorisé est 7, plus ou moins 2. Ce nombre magique, « sept », plus ou moins « deux », se base sur la psychologie cognitive. Elle nous informe sur nos capacités de traitement de l’information. Cette loi a été énoncée par le psychologue cognitif George A. Miller du département de psychologie de l’université de Princeton, dans les années 50. UNE MÉMOIRE À COURT TERME À PRENDRE EN COMPTE DANS L’ERGONOMIE DES INTERFACES La loi de Miller donne une indication sur le nombre moyen d’éléments que l’on peut mémoriser sur une courte durée. Cette indication peut également être employée pour estimer notre capacité à traiter les informations. D’après cette loi, nous ne pouvons, en moyenne, traiter simultanément plus de sept éléments. Ce nombre est du à notre empan mnésique ou mémoire à court terme. Toutefois, il est important de garder en tête que cette indication est une moyenne, l’empan mnésique peut être très variable d’un individu à l’autre. Il suffit d’observer le nombre de commandes que peut retenir un serveur simultanément pour s’en rendre compte ! Dans le cadre d’utilisation d’interfaces interactives (site web, tablette, Smartphone, logiciel pour borne interactive etc.) cette loi conditionne l’expérience utilisateur (UX). En prenant en compte les capacités cognitives et mnésiques de l’utilisateur dans le processus de conception des interfaces, les ergonomes et UX designers peuvent faciliter la perception des informations. A l’inverse, s’il est trop sollicité, notre cerveau n’arrive plus à traiter de manière efficace l’information.
- LOI → « Les utilisateurs ont une propension à mieux se rappeler les 1ers et derniers objets d’une série. » Cet effet s’explique par le fait que les éléments présentés en premier seront plus facilement enregistrés dans le mémoire à long terme, et ceux vus en dernier le seront dans la mémoire à court terme. ORIGINE L’effet de position en série (serial position effect), un terme inventé par Herman Ebbinghaus, décrit comment la position d’un élément dans une séquence affecte la précision du souvenir. Impliquant deux concepts, l’effet de primauté et l’effet de récence, explique comment les éléments présentés au début d’une séquence et la fin d’une séquence ont plus d’impact dans l’esprit que les éléments au milieu d’une liste. ILLUSTRATION Sur Instagram par exemple, le premier élément est la page d’accueil (le flux) et le dernier élément est votre profil. Ce sont les 2 fonctionnalités principales de l’application.
- LOI → « Les utilisateurs se souviennent des tâches incomplètes ou interrompues mieux que des tâches complétées. » ORIGINE Bluma Wulfovna Zeigarnik (1900 – 1988) était psychologue et psychiatre soviétique, membre de l’École de psychologie expérimentale de Berlin et du Cercle Vygotsky. Dans les années 1920, elle a mené une étude sur la mémoire, dans laquelle elle a comparé la mémoire par rapport à des tâches incomplètes et complètes. Elle a constaté que les tâches incomplètes sont plus faciles à retenir que les réussites. Ceci est maintenant connu comme l’effet Zeigarnik. La motivation d’achèvement insatisfaite est mieux mémorisée qu’une tâche finie. C’est Bluma Zeigarnik est un psychologue américaine qui a fait la découverte de cet effet. Assis à la terrasse d’un café il remarqua que les serveurs retenaient les commandes tant qu’elles n’étaient pas servies. Une fois servies ils les oubliaient tout de suite. Il décida alors de réaliser une expérience pour confirmer son observation. Il demanda à des enfants d’accomplir, en une journée, une série de travaux. La moitié des activités restèrent inachevées. Quelque temps après il interrogea les enfants sur les tâches. Résultat : celles qui n’avaient pu être conduites à leur terme étaient citées environ deux fois plus que les autres. Conclusion : les informations incomplètes restent plus longtemps dans le cerveau. L’état d’attente d’achèvement crée une tension intérieure, un inconfort qui disparait progressivement quand la tâche est complétée. ILLUSTRATION Par exemple sur le site de Creme de la creme (plateforme de freelancing), un indicateur d’avancement rappelle aux utilisateurs qu’ils ont encore des tâches à réaliser.
- Metodologías para entender el modelo mental con mis usuarios? https://uxdesign.cc/mental-models-in-ux-design-in-examples-f75b083cd487 A mental model is how you think something will work, based on your learning and experience.When it comes to mental models, there are two things to differentiate. First is a system model and second — interaction model.The system model is how something works, and the interaction model is how to interact with it, how to use it.
- Frase Descriptiva: ¡Simple para tareas comunes! El diseño debe hacer que las tareas comunes se comuniquen fácilmente en el idioma propio del usuario.
- https://blog.f1studioz.com/is-vui-voice-user-interface-the-future-of-smart-tech-5545b2ca3c6a