Siguiendo con el tema de los afiches, aquí les dejo algunos que hice para Bareto, a quienes hace un par de años les diseñé también el arte de su disco; pero como se dice en las películas de Conan, "eso es parte de otra historia" así que será motivo para otro post.
 |  |  |
Como diseñador, hacerme cargo de la parte visual de Presidente Morsa es quizá una de las labores que más he disfrutado y que más me han ayudado a encontrar mi estilo; y es que, ¿a cuantos de nosotros no nos gustaría tener siempre plena libertad creativa para proponer lo que mejor nos parece? ¿a cuantos clientes hemos terminado odiando cuando nos damos cuenta de que nada les va hacer olvidar su idea preconcebida y ya estamos con la yuca?. Felizmente este no es el caso y, para bien o para mal, esta recopilación de afiches es una muestra de lo que sucede cuando me dicen "chato, tu mismo eres" o cuando me siguen la corriente.
 |  |  |  |  |
 |  |  |  |  |
 |  |  |  |  |
 |  |  |  |  |
Cuando me dispuse hacer este blog una de las cosas que mas me preocupaban era el hecho de poder darle mi toque personal, y no sólo hablo de cambiar un color por aquí y otro por allá - porque eso es relativamente sencillo con las herramientas que el mismo blogger te proporciona - sino mas bien, a profundizar un poco mas en el tema y ver hasta donde podría llegar o que tanto se podía hacer; porque digamos que lo que menos quería era que mi plantilla sea la misma que usan otros muchos blogs. Pues bien, si me siguen hasta aquí es porque a lo mejor se encuentran en el mismo dilema gráfico existencial, así que sin más, empezamos pues con esta guía apológica al arte del pichicateo (ya ven que hasta para eso hay que tener estilo) esperando demostrar tanto en éste como en mis siguientes posts, que a veces "mas vale maña que fuerza"... en fin, cosas de la chatez.
Primero lo primero.
Nuestro objetivo es diferenciarnos, así que deberemos prescindir de utilizar las plantillas clásicas del Blogger. Sitios de plantillas hay por montones en la red, pero lo que si, debemos asegurarnos de que estas plantillas soporten XML, que es con lo que trabaja el Blogger actualmente. Un buen sitio para sumergirnos en nuestra búsqueda de la plantilla ideal es BTemplates, dudo mucho que después quieran visitar otro.
Por lo general, lo que descargaremos será un .zip con un archivo XML; algunas plantillas descargán además ficheros con archivos .js, .css que son los que hacen posible el funcionamiento de algunas características especiales del blog. Por lo pronto, lo único que nos interesa es tener a la mano el archivo XML.
Cargando la plantilla
Lo siguiente es reemplazar la plantilla antigua por la nueva, para ello deberemos entrar a la opción "Edición de HTML" dentro de "Diseño" del panel de control de nuestro blog. A continuación debemos subir el archivo XML que descargamos en "Carga una plantilla desde un archivo de tu disco duro", le damos "Subir" y guardamos la plantilla; con esto ya habremos completado la primera parte.
Empezaron los problemas
Si hasta aquí ya les gusta y están contentos con el resultado pues no hay más que hacer, pero algo me dice que no pues todavía los veo por aquí. Muy bien, algo muy recomendable ya en este punto, es ser precavidos y recordar siempre hacer una copia de seguridad antes de aplicar cualquier cambio, me lo van a agradecer.
Para lo siguiente ya se hace necesario conocimientos básicos de CSS, de programas como Photoshop, Fireworks y Dreamweaver... o al menos tener muchas ganas de amanecerse y a cocachos aprender.
Pirateando tu propio blog
Si queremos modificar la plantilla a un nivel mas avanzado necesitamos ver como es que esta hecha y tener control sobre los estilos CSS y las imágenes. Quizá para una persona mas curtida de estos temas sea tan sencillo como revisar el código fuente para darse cuenta del asunto, pero para el resto de los mortales aquello nos sigue resultando un tanto alienígena.
Bien, no hay porque tirar la toalla, lo que único que necesitamos es una referencia visual que nos muestre de una manera práctica como nuestros cambios van afectando a nuestra plantilla, así que lo que haremos es guardar una copia html en nuestra máquina, y con ella, todos los archivos necesarios que hacen que se muestre como se ve. ¿Cómo? ¡Sencillo!, abrimos un navegador, entramos a nuestro blog y le damos "Archivo/Guardar como..." (Firefox) ó "Página/Guardar cómo..." (IExplorer).
Así de fácil habremos obtenido el html, los CSS y las imágenes de un porrazo y sin mucho esfuerzo.
Optimizando
Usualmente las plantillas trabajan con un CSS vinculado externamente, pero también hay casos en que los encontrarán los CSS incluidos dentro del código fuente, así que como consejo les recomendaría que lo separen y vinculen para poder trabajar con mayos comodidad e independencia. Otro asunto que podríamos aprovechar ya que estamos ahí, es verificar que en efecto estén todas las imágenes que necesitamos dándole un vistazo a los estilos, una manera rápida de darse cuenta de cuales faltan es fijándose en la URL: si están con ruta local sí, si con ruta absoluta no.
Editando los estilos
A partir de ahora Dreamweaver es nuestro amigo. Modificamos y probamos; ojo, sólo modificamos estilos y mas bien, teniendo como referencia el html podemos ubicar rápidamente el estilo que esta aplicado sobre la zona en cuestión que seleccionamos. De que ayuda, ayuda.
El problema de las imágenes
Si, es casi seguro de que al modificar algún estilo nos demos con la sorpresa de que gran parte de lo que modificábamos debe su apariencia al uso de alguna imagen. Bueno, seguro ya se olían que la cosa no iba a ser fácil, así que este es el momento preciso para la cafeína o del estimulante que les haga mayor efecto.
Lo que haremos es tomarle un "pantallazo" al blog con el popular botón de "Print Screen" y creamos un nuevo documento en Photoshop (si es que tienen la imagen en memoria no va a ser necesario preocuparse por las dimensiones ni resolución, aparecen automáticamente) y pegamos.
La solución que se me ocurrió fue rehacer toda la plantilla en Photoshop para lo cual necesitaba tener esta imágen como referencia para respetar las dimensiones y las formas (ya que sino serían modificaciones más difíciles de manejar) para luego sobre una archivo 100% editable ver que cambios le podía hacer en el diseño.
Con paciencia, nos dedicamos a "parchar" las partes que necesitamos; el éxito del resultado dependerá de la paciencia/meticulosidad/pericia de cada uno.
Una vez terminado el proceso, debemos ser cuidadosos de exportar las imágenes con los nombres que les corresponden y a no ser que sepamos como editar los estilos, también respetar los tamaños. Algo que me sirvió de ayuda para esto último es jalar las imágenes originales al archivo de Photoshop y colocarlas encima para poder definir los límites de corte.
¡Listo Calixto!
Ahora lo único que nos quedaría por hacer subir nuestras imágenes y estilos a un servidor y entrar en el panel de control del blog/Diseño/Edición de Html para borrar los estilos antiguos (si es que hubieran) y añadir la línea de código que vincula el nuevo archivo CSS que utilizamos.
Este espacio blogeril nace con la finalidad de poder mostrar parte de mi trabajo y compartir con ustedes conocimientos y experiencias sobre temas de diseño, ilustración, animación y cualquier otro tema del género fantástico marsupial.
Así pues, siendo esta mi primera entrada sin Loren Ipsum el asunto queda oficialmente inaugurado, hasta pronto!
César Saenz
(alias el Chato Saenz / el Chato)