Cómo he rediseñado el blog trabajando mano a mano con una Inteligencia Artificial
Trabajando codo con codo con la tecnología.
¡Hola a todos! Si estáis leyendo esto, seguramente ya os habréis dado cuenta del lavado de cara que le he pegado al blog. Llevaba un tiempo dándole vueltas a la idea de actualizar el diseño para que reflejara mejor exactamente lo que engloba este rincón: mis apuntes técnicos sobre el pildorado de semillas, la tecnología, historias de Igualada y, en definitiva, cualquier curiosidad que se me pase por la cabeza.
Como apasionado de la tecnología, decidí que la mejor forma de darle un aire nuevo era trastear directamente con una Inteligencia Artificial. Y os aseguro que el proceso ha sido toda una aventura de prueba y error. Aquí os desgrano cómo ha sido el "detrás de las cámaras" de este rediseño.
1. La Cabecera: Uniendo mecánica, botánica e Igualada
Lo primero que necesitaba era una imagen principal que representara visualmente "Lo que germina en mi cabeza". La IA y yo empezamos a iterar hasta dar con un concepto central: un árbol mecánico, estructurado a base de engranajes, microchips y paneles solares, del que brotan hojas verdes reales.
Pero le faltaba el contexto. Le pedimos al sistema que de fondo generara un perfil urbano que evocara a Igualada, y que coronara la imagen con un cartel de madera donde el nombre del blog se leyera a la perfección y a gran tamaño.
El apunte técnico: Nos peleamos bastante con las resoluciones. Empezamos con imágenes estándar, pero para evitar que se quedara pequeña en los monitores actuales, tuvimos que forzar el redimensionado hasta los 2560 píxeles de ancho (calidad 4K). Ahora no hay pantalla que se le resista.
2. El Favicon: El diablo está en los detalles
¿Os habéis fijado en el iconito enano que sale arriba, en la pestaña del navegador? Pues también está hecho a medida. Diseñamos un microchip azul del que sale un brote verde brillante. La odisea aquí no fue el diseño en sí, sino las restricciones técnicas. Blogger es muy estricto y no admite imágenes pesadas para esto. Tuvimos que pasar por varias fases de optimización, recortando y convirtiendo la imagen a una paleta indexada de 256 colores para hundir su peso hasta unos ridículos 11 KB. Solo así el servidor de Google lo aceptó sin rechistar.
3. Las tripas del blog: Código, CSS y lectura móvil
De nada sirve una cabecera espectacular si luego entras desde el smartphone y los textos se salen de la pantalla. Gran parte del trabajo "invisible" se lo ha llevado la reprogramación del código de la plantilla.
Ajustamos los márgenes y le dimos instrucciones al código para que las imágenes multimedia no rompieran la estructura en los móviles. Además, creamos un sistema visual mediante CSS para organizar los temas. Si os fijáis en las etiquetas de los artículos, ahora tienen un color asignado para que sepáis de un vistazo de qué hablo:
- Verde para todo lo relacionado con Semillas.
- Azul pizarra oscuro para los temas de Tecnología.
- Naranja para las cosas de Igualada.
- Morado para las Curiosidades varias.
Ha sido un proceso muy entretenido donde la precisión técnica de ajustar píxeles y anchos de banda se ha mezclado con dejar volar un poco la imaginación visual.
Espero que os guste el nuevo diseño, que os resulte mucho más cómodo de leer, y que sigamos compartiendo ideas por aquí durante mucho tiempo. ¡Nos leemos en el próximo post!
