Sazerac, Metodología Para Agilizar El Desarrollo De Proyectos Web

Sazerac, metodología para agilizar el desarrollo de proyectos web

Morcuende, Alfonso

Resumen: Se presenta Sazerac, una colección de documentos y ficheros con los que desarrollar rápidamente un proyecto web. Sazerac contiene documentos que ayudan a desarrollar las partes iniciales de cualquier proyecto; análisis, diseño de aplicación y prototipado. Además, esta información puede ser traspasada a la fase de diseño web mediante plantillas predefinidas. Finalmente, Sazerac incluye una colección de estilos CSS con los que transformar los diseños web en una robusta maquetación multidispositivo.

Introducción

El diseño profesional de proyectos web es un trabajo multidisciplinar que implica la participación de distintos departamentos y perfiles profesionales. Un esquema bastante común es el que divide el trabajo en tres equipos o áreas: diseño de interacción, diseño visual y maquetación. Aunque cada uno de los equipos desarrolle su trabajo de forma profesional, puede darse el problema de que una vez finalizado emerjan malentendidos o decepciones respecto al trabajo de los demás. Esto se suele deber a la existencia de desajustes entre lo que un equipo planeó y el otro ejecutó, es decir, a un problema a la hora de documentar y compartir información. Una de las causas puede ser, por ejemplo, la utilización de retículas (grids) no exactamente iguales entre los diferentes profesionales involucrados.

Sobre estas premisas se presenta Sazerac (www.sazerac.es), una metodología orientada a que todos los elementos comunes de un proyecto estén documentados de forma unitaria, ayudando a eliminar duplicidades y malentendidos entre equipos, y agilizando así el desarrollo del proyecto.

Sazerac surge de la necesidad de una metodología global para las áreas de diseño de interacción, visual y maquetación; pero también de que esta metodología pueda adaptarse a proyectos de muy diversa tipología. Por ello Sazerac se ha pensado como un boilerplate (fórmula con la intención de ser copiada y modificada), y no como un framework (estructura encapsulada y cerrada).

A continuación se describen los diferentes elementos que forman Sazerac.

Sazerac Design Book

Se trata de un documento para la toma de requisitos. Contiene tres apartados: análisis, diseño de aplicación y prototipado. En el análisis se proponen trece preguntas mediante las que profundizar en el conocimiento del producto o servicio, y de los diferentes tipos de usuarios y sus características.

Sobre esta información se define el diseño de aplicación. En esta parte del libro hay disponibles plantillas para definir "personas" - usuarios arquetípicos - (Costa; 2011), "scenarios" - descripciones de situaciones de uso - (Wechsler; 2010); y "task flows" - pasos en los que se subdividen estos "scenarios" - (Unger, Chandler; 2009).

Figura 1. Sazerac Design Book

Sazerac Templates

Tras definir el producto, el sistema de plantillas de Sazerac permite a los diseñadores visuales plasmar sus diseños. Estas plantillas se basan en el mismo sistema de retículas de las páginas de Sketching: 16 columnas para desktops y tablets y cuatro columnas para smartphones.

Figura 2. Sazerac Templates

Sazerac Boilerplate CSS

Una vez finaliza el diseño del producto y su aspecto visual, se procede a su maquetación. Los estilos CSS ofrecidos por Sazerac permiten empezar a dar formato a al HTML. Las retículas de los prototipos y los diseños visuales realizados con sus plantillas vuelven a aparecer aquí. Además, Sazerac permite que el código pueda ser visualizado perfectamente en distintos dispositivos, mediante el uso de "responsive design"

...