Diseño de Interfaz

¿Qué son los patrones de diseño en interfaz de usuario?

Diseño 3 min. de lectura

¿Has notado que cuando entras y navegas un sitio, tienes la sensación de haber visitado muchos sitios similares? Esto no se debe a que los sitios web y/o aplicaciones se copien entre ellas, sino que fueron creadas siguiendo patrones de diseño estandarizados.

Patrones de diseño de interacción en Blog IDA

Al crear nuevos productos digitales, siempre buscaremos lugares comunes. Esto tiene que ver con la confianza que transmitirá nuestra plataforma, ya que hay acciones básicas de los usuarios que deben nacer por instinto. En este sentido, siempre existirán patrones comunes y no necesariamente, elementos nuevos.

Aprender a convivir con ellos y utilizarlos positivamente, dependerá de nosotros y la visión estratégica de nuestro proyecto. Por eso hoy, te ayudo a entender cuál es su funcionalidad y porque son “inevitables”.  

¿Qué son los patrones de diseño?

Como su nombre lo indica, son elementos o componentes que observamos repetidamente en los productos digitales que utilizamos. Estos nos proveen de soluciones recurrentes a problemas de diseño comunes. 

Como consumidores constantes de información, estamos acostumbrados a que ciertos componentes visuales funcionen de una forma específica. Por ejemplo, los “Tabs” son utilizados para resolver ciertos contenidos en donde el usuario no necesita cambiar de página. En ellas, el problema o contexto requiere que el contenido deba separarse en secciones. Las tabs permiten acceder a las diferentes partes a través de un área de contenido única que no actualiza la página al hacer click en cada sección.

Ejemplos de Tabs

Ejemplo de Tabs en patrones de diseño ui en Blog IDA.

Por experiencia y costumbre, reconocemos una estructura visual que ya hemos visto antes. Por lo tanto, el usuario puede percibir que si hace click en un objeto de la interfaz, esta le devolverá una respuesta. Intentar romper estos esquemas mentales o innovar demasiado en ellos puede provocar que los usuarios se frustren. En estos casos la expectativa sobre la respuesta esperada es un gran indicio.

¿Para qué sirven los patrones de diseño?

Si bien los patrones de diseño nacen del arquitecto Christopher Alexander para ser introducidos posteriormente al desarrollo de softwares, estos se utilizan en diferentes disciplinas. Su esencia recae en que un patrón es una solución a un problema recurrente de diseño. Desde este punto de vista, para que una solución sea considerada un patrón debe comprobarse su utilidad. Esto significa que debe estar confirmada su efectividad resolviendo problemas similares en otros contextos digitales. Por ello, cada patrón debe ser reutilizable.

Los patrones permiten crear componentes que brindan soluciones efectivas. Con ellos, los equipos de trabajo no tendrán que invertir horas intentando reinventar la rueda, si no que adaptarla para un uso específico, agilizando los procesos de desarrollo en general.

El uso de los patrones de diseño se puede evidenciar fácilmente, ya que ayudan a mejorar notoriamente la experiencia de usuario. Como mencioné anteriormente, los usuarios poseen hábitos de comportamiento frente a dispositivos digitales, por lo tanto, podemos adelantarnos a estas conductas para generar menos roce al momento en que ellos usen los productos digitales.

Patrones de diseño comunes

Estos son algunos ejemplos de patrones que frecuentemente son usados en sitios y aplicaciones y que de seguro puedes identificarlos.

Carruseles

Ejemplo de carruseles como patrones de diseño en Blog IDA.

Cards

Ejemplo de cards en los patrones de diseño de interfaz de Blog IDA.

Notificaciones

Ejemplo de notificaciones en los patrones de diseño de interfaz.

Breadcrumbs

Breadcrumbs como ejemplo de patrones de interacción en diseño ui.

Modales

Modales como ejemplo de patrones de diseño ui.

En todo diseño, habrán patrones que se repetirán. De hecho, crear un patrón nuevo es algo difícil de consolidar. Aunque en caso de querer probar con nuevos diseños e interacciones, debemos considerar preguntas de usabilidad y diseño UI en las etapas de UX Research y UX Testing. 

Te invitamos a probar, conociendo profundamente a tus usuarios y los objetivos de tu producto digital. 

Acerca del Autor

Luciano Cimino - Diseñador UI

La comunicación visual es un elemento clave a la hora de generar empatía. Por eso mi trabajo busca que los usuarios puedan identificarse con los servicios digitales mediante la creación de un lenguaje gráfico específico, logrando un diálogo entre lo funcional y lo emocional; para así conseguir buenas experiencias.

Agregar un comentario