Patrones de diseño web

Patrones de diseño web

ejemplos de patrones de diseño web

No quieres pasarte la vida rediseñando la rueda, ¿verdad? No, nosotros tampoco. Si estás buscando un diseño que resuelva un problema que ya ha sido resuelto dentro de una aplicación diferente antes; entonces la plantilla para tu rueda probablemente ya está ahí fuera. Eso es un patrón de diseño para ti y para mí.

Hemos elaborado una lista de algunos de los mejores lugares para encontrar patrones de diseño en la web. Ahora bien, aunque todos estos recursos son gratuitos, algunos pueden pedirte que pagues por recursos premium y similares; sólo queremos que sepas que NO somos afiliados de ningún otro sitio y no tenemos ningún interés financiero en que compres nada de ningún otro sitio en línea.

UI – Patterns Nos gusta UI Patterns; hace que sea fácil encontrar patrones que te gustan y agruparlos una vez que has decidido que algo es útil. También tienen un montón de artículos interesantes sobre patrones de diseño de interfaz de usuario que pueden ayudar a ampliar la forma de enfocar el uso de patrones en sus diseños.

Pattern TapPattern Tap se acerca a los 10.000 conjuntos de patrones generados por los usuarios, lo que lo convierte en un recurso inspirador para los diseñadores de interfaz de usuario. El sistema de menús desplegables hace que sea realmente fácil encontrar lo que quieres en un momento.

libro de patrones de interfaz de usuario

Los patrones de diseño de la interfaz de usuario (UI) son componentes reutilizables/recurrentes que los diseñadores utilizan para resolver problemas comunes en el diseño de la interfaz de usuario. Por ejemplo, el patrón de diseño breadcrumbs permite a los usuarios volver sobre sus pasos. Los diseñadores pueden aplicarlos a una amplia gama de casos, pero deben adaptar cada uno de ellos al contexto específico de uso.

Los sitios web y las aplicaciones tienen un aspecto convencional gracias a patrones de diseño como la navegación global y las barras de pestañas. En el diseño de la interfaz de usuario, se pueden utilizar los patrones de diseño como una forma rápida de construir interfaces que resuelvan un problema, por ejemplo, un patrón de diseño de selector de fecha para permitir a los usuarios elegir rápidamente una fecha en un formulario. Así pues, los patrones de diseño de IU sirven como planos de diseño que permiten a los diseñadores elegir las interfaces mejores y más utilizadas para el contexto específico al que se enfrenta el usuario. Cada patrón suele contener:

Cuidado con los patrones de diseñoLos patrones de diseño de interfaz de usuario, disponibles de forma gratuita, le permiten ahorrar tiempo y dinero, ya que puede copiarlos y adaptarlos a su diseño, en lugar de reinventar la rueda para cada nueva interfaz. También facilitan la creación de prototipos más rápida y la familiaridad con el usuario. Sin embargo, hay que utilizarlos con cuidado, ya que las decisiones equivocadas pueden salir caras, por ejemplo, si:

patrón de diseño

Como se explica en Web UI Patterns 2016 Vol. 1, el diseño es sólo un medio para presentar el contenido de la manera más intuitiva y útil. En este artículo, exploraremos ejemplos, mejores prácticas y escenarios comunes para 12 patrones de diseño web exitosos. También hablaremos de qué problemas de diseño resuelven estos patrones de diseño web en términos de experiencia de usuario con ejemplos de marcas conocidas.

Las tarjetas permiten que los sitios presenten una gran dosis de contenido de manera digerible. Como explicamos en nuestro Libro de Tendencias de Diseño Web 2015-2015, las tarjetas están apareciendo por todas partes últimamente, y el éxito de este patrón está directamente relacionado con su utilidad.

Una estructura cuadriculada facilita la navegación. Las tarjetas están casi siempre dispuestas en un formato de cuadrícula, de un tipo u otro. Las cuadrículas ofrecen más opciones de navegación que las simples vistas de lista, lo que hace que este estilo sea muy eficaz en cuanto a espacio.

Las cuadrículas pueden variar en tamaño, espaciado y número de columnas. Sitios como Huffington Post escalonan sus opciones para evitar esa sensación de «rectitud», mientras que YouTube juega con la organización estricta, con filas rectas y agrupadas en categorías («Recomendados», canales específicos, etc.).

balsamiq

Como propietario de un sitio web, usted sabe que sus usuarios pueden ser tanto su mayor activo como sus más duros críticos. El usuario típico de Internet pasa horas en línea cada día encontrando miles de interfaces. Saben lo que funciona bien, esperan que todos los sitios web funcionen bien, y su definición de «funcionar bien» puede diferir de la suya.

Por suerte, estás en buena compañía. Miles de diseñadores han jugado durante años para perfeccionar los componentes de la interfaz que usamos cada día, dejándonos lo que llamamos patrones de diseño web. No deberías tener que confiar en tus instintos para construir una gran experiencia. En su lugar, toma una pista de los que te precedieron.

En esta guía introductoria, explicaré la importancia de los patrones en el diseño de sitios web, cómo ayudan en el proceso de diseño, y exploraré algunos patrones de diseño comunes pero importantes que la mayoría de nosotros damos por sentado.

Un patrón de diseño web, también conocido como patrón de diseño de interfaz de usuario, es un conjunto de directrices para diseñar un aspecto o componente de la interfaz de usuario. Los patrones de diseño web se desarrollan para desafíos específicos de la experiencia del usuario y pueden ser adoptados e implementados por cualquier sitio web.

Entradas relacionadas

Esta web utiliza cookies propias para su correcto funcionamiento. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Más información
Privacidad