Curso Diseño UI - 12. Patrones de Diseño

Summary

En este vídeo se exploran los patrones de diseño, que son soluciones preestablecidas para problemas comunes en la interfaz de usuario. Se explican conceptos como la cabecera con logotipo y menú, la navegación inferior en dispositivos móviles, y las tarjetas de contenido. También se menciona la importancia de conocer patrones universales y crear patrones locales consistentes para mejorar la experiencia del usuario en sitios web y aplicaciones.

Takeaways

• 😀 Los patrones de diseño son soluciones recurrentes que resuelven problemas de diseño comunes.
• 🏠 Al igual que se espera que una cocina tenga un lugar para lavar y otro para secar los platos, los patrones de diseño se basan en expectativas preestablecidas del usuario.
• 🚪 Los patrones de diseño también pueden ser convenciones, como la disposición de un mango en una puerta para indicar su uso.
• 🌐 Los diseñadores web siguen patrones comunes, como la colocación del logotipo a la izquierda y el menú a la derecha en la cabecera de un sitio web.
• 📱 La ergonomía y las expectativas de los usuarios influyen en la colocación de elementos de la interfaz, como la navegación inferior en dispositivos móviles.
• 📰 Los patrones de tarjetas de contenido son útiles para resumir información y fomentar la interacción del usuario en sitios de noticias y blogs.
• 🔗 La navegación por pestañas es un patrón de diseño efectivo para presentar contenido relacionado en una sola página sin la necesidad de cambiar de pantalla.
• 🌐 Los patrones de diseño universales, como los menús desplegables, son expectativas globales que los usuarios esperan encontrar en diferentes sitios y aplicaciones.
• 📝 Los patrones locales son aquellas convenciones que se establecen en una aplicación o sitio web específico y que los usuarios aprenden y esperan ver consistentemente a lo largo de la experiencia.
• 🔍 Para explorar patrones de diseño comunes y documentados, se recomienda visitar la página web 'whitejonpatterns.com'.

Q & A

¿Qué son los patrones de diseño según el guion proporcionado?

Los patrones de diseño son soluciones recurrentes que resuelven problemas de diseño que se presentan una y otra vez. Son ideas preestablecidas o soluciones preestablecidas para problemas que sabemos que van a ocurrir en el proceso de diseño.

¿Por qué son importantes los patrones de diseño en la experiencia del usuario?

Los patrones de diseño son importantes porque responden a las expectativas predefinidas que los usuarios tienen antes de comenzar a usar un producto. Ayudan a que la experiencia de usuario sea coherente y predecible.

¿Cuál es la relación entre los patrones de diseño y las convenciones de diseño?

Los patrones de diseño también se pueden referir a como convenciones de diseño, ya que ambos tratan sobre soluciones o ideas preestablecidas que se utilizan para resolver problemas comunes en el diseño.

¿Cómo se relacionan los patrones de diseño con la ergonomía en la creación de interfaces móviles?

La ergonomía influye en la elección de los patrones de diseño para interfaces móviles, como la colocación de la navegación en la parte inferior de la pantalla para adaptarse a cómo los usuarios suelen sostener su dispositivo con el pulgar.

¿Qué es un patrón de diseño de 'cabecera con logo a la izquierda y menú a la derecha' y por qué es común?

Es un patrón de diseño común en sitios web donde el logotipo aparece a la izquierda y el menú a la derecha en la parte superior de la página. Es común porque muchos sitios lo utilizan y los usuarios han desarrollado la expectativa de encontrar esa disposición.

¿Qué problemas pueden surgir si un diseño no sigue los patrones de diseño esperados por los usuarios?

Si un diseño no sigue los patrones esperados, puede causar confusión o frustración en los usuarios, ya que no cumple con sus expectativas preestablecidas, lo que puede afectar la usabilidad y la satisfacción del usuario.

¿Cuál es la función de las 'tarjetas de contenido' en la interfaz de usuario y por qué son importantes?

Las 'tarjetas de contenido' son un patrón de diseño que muestra resúmenes de contenido, como una imagen, título, texto de introducción y un enlace para acceder al contenido completo. Son importantes porque facilitan la navegación y la organización del contenido en sitios web y aplicaciones.

¿Qué se entiende por 'navegación por taxi' o 'navegación por pestañas' y cómo se aplica en el diseño de páginas web?

La 'navegación por taxi' o 'navegación por pestañas' es un patrón de diseño que permite mostrar contenido relacionado en diferentes secciones o 'pestañas' dentro de la misma página, permitiendo al usuario acceder a diferentes categorías de contenido sin tener que cambiar de página.

¿Qué recursos se recomienda para aprender más sobre los patrones de diseño?

Se recomienda visitar la página 'whitejonpatterns.com' para aprender más sobre patrones de diseño comunes, donde se documentan problemas y soluciones, y se ofrecen ejemplos de implementación.

¿Cuál es la diferencia entre patrones de diseño universales y locales?

Los patrones de diseño universales son soluciones que responden a expectativas y necesidades generales de los usuarios en diferentes sitios o aplicaciones. Mientras tanto, los patrones locales son aquellas soluciones o convenciones que se definen específicamente para un sitio web o aplicación, y que los usuarios de ese entorno esperan que se mantengan consistentes.