Patrones de diseño para interfaces web
Patrones de Diseño Web
Llevo mucho tiempo desarrollando aplicaciones web, durante todo este tiempo he aprendido mucho sobre usabilidad, interfaces y diseño. Cada proyecto de desarrollo es todo un reto y cada cliente tiene diferentes necesidades y diferente enfoque a como desea ver su aplicación. Lo que no saben y que es parte de la educación y comunicación que debe de mantenerse entre clientes y desarrolladores es que hay subvenciones y patrones que se deben de seguir para lograr una mejor interacción entre la aplicación y los usuarios, esto es lo que se le conoce como patrones de diseño.
Un patrón de diseño o interfaz (creo que así se entiende mejor), es la conexión física y hasta emocional entre dos aparatos, entidades o sistemas (Traduzcamos esto como la capacidad que tiene el usuario de comunicarse con una aplicación).
El desarrollo de interfaces para aplicaciones web esta basado en una serie de reglas que ya han sido definidas, todas o una mayoría adoptadas por la experiencia de muchos desarrolladores, diseñadores y psicológos que han analizado la manera en que las aplicaciones son utilizadas por los usuarios.
Pues resulta que para lograr una buena interfaz se necesita siempre el trabajo coordinado entre diseñadores y programadores (la discusión que nunca termina) y aunque cada uno tiene una percepción mental diferente de lo que puede ser una interfaz, una buena comunicación pueden ayudar a mejorar enormemente una aplicación consiguiendo interfaces atractivas, por eso es bueno que ambas personas aunque trabajan en diferentes partes del desarrollo de una aplicación web tengan similitud de conocimientos en cuanto a lo que es estandar y se necesita tener como base en una aplicación.
No hay que olvidar que los usuarios también han adquirido cierto grado de experiencia en cuanto a la navegación por la web y fácilmente reconocen elementos ubicados en lugares ya definidos por estos patrones, por eso es la importancia de seguir estos estándares de diseño, algunos ejemplos por citar algunos son los siguientes:
Localización de Perfil y Salida de la aplicación
 Definido en la parte superior derecha de la página, es un pequeño cuadro desde el cual podemos tener acceso a nuestro perfil mediante un enlace, ahí mismo se encuentra un enlace que nos lleva a abandonar la aplicación de manera segura. Los estilos y la información contenida en este contenedor varian, pero es normal encontrarse al menos un enlace para ver/modificar el perfil del usuario y otro para salir de la aplicación. |
Resultados de búsqueda
 Los resultados de búsqueda por comodidad y facilidad a encontrar la información de manera rápida, se implementan mediante un cuadro de texto desde el cual se realiza la búsqueda, una vez que la búsqueda se ha realizado, el resultado aparece en forma de cascada donde se muestra información relacionada a la búsqueda. De manera predeterminada sabemos que cada resultado mostrado al hacer click nos debe de mostrar mucho más detalle. |
Filtros de búsqueda
 Al igual que los resultados de búsqueda, los filtros de búsqueda es una agrupación de términos de búsqueda generados a partir de la información más relevante, estos filtros sirven para indexar y obtener una muestra de resultados más específica, muy útiles para agilizar consultas de datos. De igual manera los resultados son mostrados en forma de cascada donde se muestra la información relacionada a la búsqueda. |
Vistas Maestro – detalle
 Las vistas maestro-detalle comunmente utilizada en diferentes tipos de aplicaciones no solamente web’s, definen la vista preliminar de un conjunto de datos, los grids o rejillas de resultados utilizan mucho este tipo de vistas para mostrar información relacionada a la fila que se ha seleccionado. |
Generalmente la simplicidad será la mejor manera de representar una buena interfaz, muchas veces los usuarios no tienen el suficiente tiempo para darse a la búsqueda de un enlace o información específica, por lo que es muy recomendable enfocarse en no hacer perder el tiempo a los usuarios desarrollando interfaces limpia y sencillas. El diseño web y el contenido de este forman una estructura visual que debe de ser atractiva a la vista y gusto de un usuario.
Existe una ley muy clara, básica y aplicable al diseño de las interfaces (Ley de Fitt) que dice que mientras más grande y próximo al puntero del ratón este un objeto, mucho más sencillo será hacer click sobre él.
Adicionalmente al tema de las interfaces es bueno aplicar todos aquellos consejos que nos hacen mejorar nuestras aplicaciones para ofrecer una mejor experiencia de navegación a los usuarios.
Algunos consejos extras escenciales para mejorar la usabilidad
20 consejos de usabilidad esenciales para proyectos web c62550l
Consejos para mejorar la usabilidad de un blog
Fuentes:
http://designinginterfaces.com/
http://www.rosenfeldmedia.com/books/webforms/
