01 enero, 2010

6 años evolucionando un diseño

Estrenamos año y, como cada 1 de enero, solemos echar la mirada atrás (y también adelante). Y como podéis comprobar en la leyenda que hay debajo de nuestro logotipo, llevamos 6 años evolucionando esta página web. Vamos a ir viendo el paso del tiempo con el diseño de las diferentes secciones.

El diseño original de 2004 era (o al menos pretendía ser) simple, directo, limpio. Esa siempre ha sido nuestra premisa. Constaba de frames arriba y abajo y a ambos lados, con otro frame central donde debía estar el contenido de la web.
Tenía un menú muy legible en formato texto en el marco superior y una réplica de éste en iconos en el marco inferior (más que nada, para darle un poco de color a la vida).
Todas las secciones tenían un encabezado con su leyenda y una imagen que la acompañaba.
La sección de reseñas discográficas mostraba la portada del CD con los datos más relevantes y, a ser posible, alguna muestra de audio. Ya estaba habilitada la opción de comentarios (a través del foro). La reseña mostraba un aspecto periodístico a dos columnas y finalizaba con la firma en un color más tenue.


Las versiones v.2 y v.3 de la web fueron una evolución de la v.1. Todos los detalles, para los que nunca lo han curioseado aunque siempre han estado a la vista, se pueden ver aquí.
La versión v.4 fue el primer cambio de imagen radical, con un diseño claramente isnpirado en un blog. La diferencia principal es que cada sección mostraba una imagen propia que ocupaba todo el ancho de la página. Se mantenía el menú superior y, en líneas generales, la estructura era básicamente similar, pero mucho "más limpia". La portada de los CDs se había rediseñado, mostrando la caja y una sombra, y se mejoró la imagen de las tipografías. En la v.4 se comenzó a utilizar la programación con css.


La versión v.5 es una revisión de la v.4. Se mejora fundamentalmente el aspecto visual y se retoca la plantilla css.


Y finalmente llegamos a la versión v.6. Surge un poco por aburrimiento de la v.5 y porque ésta se retocó tanto que acabó siendo otra cosa menos lo que debía ser.
Buscando por Internet diseños que se ajustasen a mis criterios, me encontré con la web de SKiN Analysis Clinic, que llamó inmediatamente mi atención. Una vez analizada su estructura y estudiado el grado de dificultad para la migración, me lancé a ello, con los cambios pertinentes, hasta el resultado actual.


Comparemos otras secciones a lo largo del tiempo:




El diseño original de la versión v.5.


Y su evolución:


Versión v.6:


Más ejemplos del diseño v.5:




Los podcast en la v.5 y en la v.6:



La página de inicio de la versión v.6:


Y, finalmente, como curiosidad, los podcast en 2009 y en 2010.