Mostrando entradas con la etiqueta autoGIMP. Mostrar todas las entradas
Mostrando entradas con la etiqueta autoGIMP. Mostrar todas las entradas

miércoles, 18 de abril de 2007

Genración automática de botones

GIMP puede diseñar botones para páginas web de forma rápida, gracias a un guión. Hay dos guiones que crean su modelo de botón respectivo a partir de unos pocos parámetros, como texto, tamaño y colores.
  • Botón redondo: este guión crea un botón con forma de rectángulo con sus bordes redondeados. Al usarlo, puede sorprender que aparezcan tres imágenes en pantalla, pero no es ni más ni menos, que el mismo botón dibujado para tres estados: normal, con el ratón por encima y pulsado. Luego, en la página web se programa todo, y se crea el efecto de pulsar el botón con un javascript.
    En las opciones del guión se puede modificar los colores, tipografía, tamaño de letra, el redondeo, tamaño del bisel...Aquí se puede ver abajo el botón cuando tendría el ratón por encima, en el medio, el estado normal, y arriba, el aspecto mientras se encuentra pulsado.
  • Botón simple biselado: este guión crea un botón con aspecto 3D, con un bisel (remate en la arista) y relleno con un degradado, como se ven en la imagen.
    Estos botones tienen el ancho que de de si el texto, por lo tanto, son más adecuados para crear botones dispuestos en horizontal. El relleno (padding) es la distancia entre el borde del texto y el borde del botón. La opción pulsado permite dibujar el mismo botón, pero con apariencia de estar pulsado, esto permite crear el efecto típico de las páginas web, que cuando se pulsa en un botón, este se hunde. El efecto que se produce al pasar el ratón por encima, puede ser logrado fácilmente alterando ligéramente los colores del degradado. Antes de guardarlos, hay que aplanar la imagen, opción que aparece en el menú imagen.
Una vez con la imagen creada, llega el momento de guardarla. Yo, personalmente recomiendo guardarlos en formato PNG, que es el más adecuado en este caso. El formato JPEG mataría en exceso los colores y contornos, sin lograr a cambio una gran compresión. El procedimiento sería convertir la imagen en indexado (Imagen-->modo-->indexado), usar una paleta óptima, poner ninguno en difuminado y finalmente, guardar en formato PNG. Esto genera ficheros de tamaños muy reducidos.
También se puede probar a poner un número máximo de colores inferior a 256, pero si el número es muy bajo, puede perderse calidad, noramalmente 63 para imágenes con alguna transparencia y 64 para imágenes sin ningún área transparente, suelen ir bien. Este último detalle, es prescindible, aunque puede reducir el tamaño de fichero.

NOTA IMPORTANTE: si en tu página web vas a poner un enlace como un botón, no olvides poner un texto alternativo (etiqueta alt o bien la opción del editor HTML). Este texto alternativo, debería contener lo que pone en el botón, y es de gran ayuda a las personas que no puedan ver el botón, ya sea porque sean ciegas, porque su navegador no visualice imágenes o si símplemente, la carga del botón falló. Este último caso, es bastante frecuente.

martes, 17 de abril de 2007

Generación de patrones automática

Hay un menú poco conocido, que se oculta en la ventana principal y puede pasar algo desapercibido.

Este menú está en Exts-->Script-Fu y crea imágenes desde cero automáticamente. En este artículo hablaré solo de los guiones que generan patrones automáticamente.

En general, estos guiones por si solos trabajan bastante bien, y normalmente, el único parámetro que se suele usar, son las medidas, de todas formas, nunca está de más probar a jugar un poco con los parámetros del guión. es emtretenido, y se observa el mejor resultado.

  • Aplanar (flatland): el nivel de detalle produce eso, más detalles (lagos, penínsulas...) en la imagen final.
  • Camuflaje: similar a la pintura de camuflaje. Permite usar los colores que se quieran en lugar de los que vienen, y también alterar la granularidad (más valor, produce manchas más pequeñas), también hay una opción que difumina la imágen.
    Conviene guardarlo en PNG si no se aplica la opción suave, ya que JPEG degradaría mucho su calidad, y además, ocuparía más espacio, ya que JPEG no está adaptado a imágenes así.
  • Embaldosado de remolinos: parecido a una borrasca. Se puede cambiar la orientación de la luz (al crear el efecto, se simula como si una superficie rugosa fuera iluminada), la rugosidad y la "fuerza del remolino" y color de fondo.
  • Remolino: se puede controlar el grado de retorcimiento.
  • Renderizar mapa: Parece como si fuera un mapa. Hay que destacar, que se pude usar cualquier degradado, para obtener efectos parecidos. Al guardar, si se hace en JPEG, conviene desactivar una opción llamada submuestreo esta opción aparece en opciones avanzadas, y para desactivarla se introduce 1×1,1×1,1×1. Esto hace que los colores pierdan mucho menos, aunque la foto ocupa algo más.
  • Tierra: parece como si fuera un continente.
  • Truchet: este patrón consiste en que no queden nunca extremos sueltos.
  • Truchet 3D: como el anterior, pero en 3D.

Patrones de difracción

Con esta entrada, abro una nueva sección: autoGIMP. ¿A que me refiero con autoGIMP? Muy sencillo, es cuando Willber se pone a pintar solo, y nos dibuja algo. ¿Cual es la utilidad de esto? Pues que nos ahorra un esfuerzo.

El primer filtro del que hablaré, será de patrones de difracción, estos patrones se forman cuando dos ondas chocan entre si. Este filtro imita patrones de difracción, para ello parte de varios parámetros.