No soy diseñador como tal, pero en muchas ocasiones necesito retocar o crear imágenes para los sitios web que realizo.
Para ello utilizo las herramientas Gimp e Inkscape, que son libres y gratuitas.
No se usan para lo mismo, cada una tiene sus ventajas y sus puntos fuertes.
En este artículo te enseño a sacarles el máximo jugo.
Ya sé que estarás pensando que ahora hay herramientas con inteligencia artificial que hacen maravillas.
Y estoy de acuerdo. De hecho, es probable que a estas dos puedas añadirle la IA.
Ahora bien, usa tu creatividad y potencia tu inteligencia natural todo lo que puedas.
Instalación
Para instalarlas te recomiendo que las descargues desde la web oficial de cada uno de ellos.
Si utilizas Linux (lo cual te recomiendo, mucho), puedes instalarlos con la propia gestión de paquetes de tu distribución o a través de flatpak.
Estas son sus respectivas webs oficiales:
Gimp, el editor de imágenes
Gimp es perfecto para la edición imágenes. Es una gran alternativa al conocido Photoshop.
Pero no solo para eso, te permite hacer verdaderas obras de arte.
Tiene capas, máscaras, selecciones de diferentes tipos, ajuste de niveles y un largo etcétera.
Yo lo utilizo sobre todo para la redimensión y recorte de imágenes, para adaptarlas a las necesidades del sitio web que esté construyendo.
Y es que Gimp tiene detalles muy interesantes que han ido mejorando en sus más de 20 años de recorrido:
- Puedes abrir y exportar a muchos tipos de formatos de imagen (jpeg, png, gif, webp, tiff, psd y tga entre otros).
- Múltiples herramientas para la corrección de imágenes y el retoque digital.
- Hay mucha información pública para aprender y resolver dudas.
- Es cómodo de usar con un ratón pero además facilita la conexión con otros dispositivos de entrada como tabletas o MIDI.
- Se integra con diversos lenguajes de programación (C, C++, Python, Perl, Scheme y más).
- El área de trabajo es personalizable.
- Funciona en los principales sistemas operativos de escritorio.
Algo que me resulta cómodo y no conocía, aunque las últimas versiones lo traen de serie, es la ventana única, es decir, que las barras de herramientas estén dentro de la ventana de la propia imagen. Lo activas en el menú Ventana → Modo de ventana única.
Inkscape y los gráficos vectoriales
Inkscape está pensado para que crees imágenes compuestas.
Imágenes que luego puedes cambiar de tamaño sin que pierdan calidad.
Es un equivalente a los conocidos Adobe Illustrator, Corel o similares.
Te ayuda a crear desde dibujos pequeños, como iconos, a gigantes, como vallas publicitarias. Por supuesto, pasando por imágenes para tu web o lo que te haga falta.
Para ello, en vez de utilizar píxeles se utiliza un sistema vectorial llamado SVG.
Dispone de herramientas de creación de polígonos, de dibujo a mano alzada, de trazos caligráficos, creación de textos, alineación y mucho, mucho más.
Comparte algunos beneficios con Gimp, como por ejemplo la cantidad de formatos de archivo con los que es capaz de trabajar, tiene una comunidad grande detrás, funciona en los principales sistemas operativos...
Me ayuda mucho también a la hora de crear código SVG estándar que luego puedo utilizar en web.
Pásate por la web oficial y mira las maravillas que crea la gente.
Aprendiendo a usar Gimp e Inkscape
Hay mucha, muchísima información en la red sobre estas herramientas.
Te recomiendo que empieces por sus webs oficiales.
No dejes de seguir investigando más, porque hay foros, vídeos y un sinfín de recursos que puedes usar y ejemplos a seguir.
Comprimir imágenes
En uno de los eventos organizados por GALPon (Grupo de Amigos de Linux de Pontevedra), pudimos ver de primera mano cómo funcionan estas potentes aplicaciones.
Andrés Bott nos explicó con detalle el uso de ambas herramientas en el taller de Tratamiento digital de imágenes en entornos libres.
Vimos también herramientas para la compresión de las imágenes para la publicación en web.
Miguel Anxo Bouzada nos enseñó que la herramienta Pngnq te permite realizar esta tarea en la línea de comandos y se consiguen resultados similares a sitios web especializados como TinyPNG. Aquí hay un ejemplo de uso:
pngnq imagen.pngDe esta manera obtienes una imagen comprimida llamada imagen-nq8.png. Tiene algunas opciones interesantes, no dudes consultar su manual (man pngnq en el terminal).
También se trataron temas tan interesantes como la resolución que debe tener una imagen.
Cuando hablamos de una imagen para ser impresa en papel tiene sentido hablar de puntos por pulgada, pero para imágenes en pantalla lo que nos importan son las dimensiones de ancho y alto en píxeles.
Pásate por el artículo de optimizar tus imágenes para web si quieres saber más sobre este tema.
Y tú, ¿ya usas estas herramientas? ¿me puedes recomendar alguna otra? ¡Deja tu comentario y apúntate al boletín más abajo para recibir más información interesante!
