Ahorra tiempo y evita caer en errores, utiliza patrones de diseño.

Los patrones de diseño agilizan el desarrollo, permiten  aplicar soluciones efectivas a problemas comunes evitando la necesidad de evaluar y revaluar cada aspecto de un proyecto.

Concebidos originalmente en el campo de la arquitectura se están convirtiendo en una herramienta muy popular en el desarrollo web.

Orígenes

Los patrones de diseño nacen en el campo de la arquitectura de mano de Christoper Alexander como una forma de ofrecer una solución  común a un problema de diseño.

En su clásico The Timeless Way of Building (1979) establecía el concepto de patrones  y describía más de 250 patrones históricos.

Definía un patrón de la siguiente manera:

«Cada Patrón describe un problema que ocurre una y otra vez en nuestro ambiente, yluego describe el núcleo de la solución a ese problema, de forma tal que esa solución puede ser usada un millón de veces, sin hacerlo de la misma manera dos veces»

Su teoría de los patrones se desarrolla  lo largo de tres volúmenes, el ya mencionado

The Timeless Way of Building que constituía el marco teórico.

Posteriormente A Patern Languaje (1977) que constituía el manual de uso y The Oregon Experiment (1975) que presenta un ejemplo concreto.

Más tarde, en 1987, Ward Cunningham y Kent Beck trasladaron de la Arquitectura al campo de la interacción hombre-ordenador (HCI) varias ideas de Alexander para desarrollar cinco patrones de y publicaron un artículo en OOPSLA-87  titulado Using Pattern Languages for OO Programs

Los patrones de diseño en el campo de la ingeniería del software empezaron a hacerse populares a principios de los 90 a partir de la publicación del libro Design Patterns escrito por el GoF (Gang of Four): Erich Gamma, Richard Helm, Ralph Johnson y John Vlisides, en el que se recogían 23 microarquitecturas orientadas a objetos  como patrones diseño comunes.

Finalmente en  el campo de los patrones de diseño de interacción la primera agrupación relevante fue Common Ground de Jenifer Tidwell  (la autora del mejor libro sobre patrones) posteriormente aparecerían:Interaction Design Patterns de Martin van Wellie, The Design of Sites  de van Duyne, Landay y Hong y la librería de patrones de Yahoo  entre otros.

En la actualidad existe una amplia bibliografía y varios sitios de referencia.

Patrones de diseño de interacción

A la hora de diseñar una interfaz de usuario existen multitud de recursos para encontrar el patrón adecuado.

Librerías de patrones de diseño de interacción

Ofrecen una descripción del problema, una solución a través del patrón, recomendaciones de uso del mismo así como múltiples ejemplos.

Los sitios más populares son los siguientes:

Welie.com

De las primeras librerías y de las más completas. Los patrones están agrupados por categorías. Los patrones se explican mediante capturas de pantalla (algunas algo viejas) y wireframes.

Yahoo! Design Pattern Library

También de las más antiguas, integrada en la red para desarrolladores de Yahoo.  Tiene menos patrones que la anterior y con mayor relevancia a patrones de aplicaciones sociales.

Ui-patterns

Es de las más completas, tanto por la calidad de los patrones como por el número de ejemplos asociados a los mismos. Los usuarios pueden crear sus propias colecciones y compartir capturas  propias.

Patternry

Es un sitio orientado a compañías para documentar, compartir y colaborar en el diseño de patrones.

Tiene una librería general en la que además ofrece el marcado en HTML de varios patrones.

Librerías visuales

Prescinden de todo el apartado  analítico de los patrones y se centran en recopilar soluciones visuales.

Pattern Tap

Es uno de los sitios más populares para buscar inspiración. Permite  a los usuarios crear sus propias colecciones. Tiene una gran comunidad de usuarios detrás.

Web & Patterns

Inspiración visual para 22 categorías. Simplemente.

MephoBox 

15 colecciones de elementos de diseño, del estilo de la anterior.

Elements of Design

Como las dos anteriores pero con mayor numero de colecciones. 37 colecciones de elementos de diseño.

Brian Christiansen  Design  Patterns

Una colección de las mas grandes que existen recopiladas  en Flickr.

Librerias especializadas en móviles

Entre las librerías especializadas en patrones de diseño para dispositivos móviles , muchas siguen el esquema de las librerías  visuales comentadas anteriormente como:  Inspired UI , Lovely UI ,pttrns994 , Patterns of design  ,Android pttrns, Mobie UI Patterns .

Como librerías en si de patrones de diseño de interacción:

Android Patterns

Como su nombre indica recoge patrones para la plataforma Android con sus correspondientes capturas, permite añadir patrones a los usuarios.

Android 5.0 patterns

Son patrones descritos dentro de la guía oficial para el diseño de aplicaciones Android publicada por Google.

 

• http://www.ischool.berkeley.edu/programs/masters/projects/2006/uidesign
• http://www.smashingmagazine.com/2009/06/15/40-helpful-resources-on-user-interface-design-patterns/
• http://sourcemaking.com/design_patterns
• http://en.wikipedia.org/wiki/Design_pattern
• http://en.wikipedia.org/wiki/Interaction_design_pattern
• Imagen principal de Magdalena Roeseler via Flickr