Tornant a casa

Motiu del disseny

Tot això va començar ja fa mesos, quan Miquel Torres em va demanar una web de notícies pel colectiu de Castelló de la Plana. Com sóc un dessastre en això del disseny, vaig demanar alguna cosa sobre la que treballar als meus amics dissenyadors, i per variar, tot el món es va “oblidar” d’ajudar-me. La web es va fer amb un disseny horrible utilitzant la imatge corporativa del bloc.

Poc desprès de presentar la web, Jordi Aura va opinar que era horrible, i va demanar a la seua germana un disseny per fer una de nova. I de pas que es poguera reutilitzar per la resta de webs de notícies dels colectius locals de la comarca. I van passar mesos, i quasi m’havia oblidat ja de tot, quan em va arribar el disseny de la seua germana (que li diuen Amparo Aura).

Disseny original d'Amparo Aura

I com pareix que era urgent, em vaig ficar a treballar amb eixe disseny, per fer el nou tema. La veritat, mai m’ha agradat el roig del bloc, però la imatge és la que és.

M’agrada molt fer mockups en paper abans de començar qualsevol interfície d’usuari. I això mateix vaig fer. Pareix que estava inspirat quan vaig fer els dibuixos, ja que en ells està practicament tot el que finalment vaig ficar al tema. Normalment els meus mockups i la interfície final no es pareixen en res.

Detall dels moc-ups en paper

Amb el mockup a la mà, vaig buscar (i trobar) un disseny lliure de wordpress que fora “paregut”. No m’agrada res re-inventar la roda, i si ja es pot començar amb mitja faena feta… El disseny escollit va ser Blocks, de mg12. Amb dues columnes i les entrades separades, era paregut al que buscava.

Disseny damunt del qual vaig començar

Vaig seccionar el disseny original d’Amparo, vaig fer-lo transparent i vaig ficar un poquet per ací, un poquet per allà, possar els colors del bloc… fins que vaig arribar a una primera aproximació que més o menys m’agradava. Pràcticament ja és igual al disseny final.

Primera prova del disseny

I arribem a la part més complicada de tot: fer que funcione correctament en Internet Explorer 6. Pareix una xorrada, però us puc assegurar que és el dolor al cul més gran que et pots trobar. Està ple de bugs grossos que produixen resultats de lo més frustrant, inesperats i exasperants. Vaig estat tota una nit només per solucionar el problema amb les imatges transparents.

També vaig tindre problemes amb la versió 7 d’internet explorer, ja que encara no implementa el border-radius (part de css3). Vaig solventar aquest problema utilitzant VML (que déu sap que també es horrible).

I no res més, vam arribar al disseny final. Salut!.

Disseny final del tema, amb el contingut de la web del colectiu local de Castelló de la Plana