Cinco herramientas gratuitas para trabajar con imágenes en desarrollo web

Esta selección te garantiza cubrir todas las necesidades en lo que respecta al trabajo con imágenes para el desarrollo web. Desde manipular fotografías y vectores hasta la maquetación de aplicaciones.

Es una herramienta de diseño web perteneciente a la canadiense Corel, lo cual te garantiza que no son unos improvisados en el tema. Posee versiones de escritorio para macOS, Windows, Linux, Chrome OS y además es accesible via web lo cual te permite trabajar prácticamente desde cualquier entorno.

Ofrece las herramientas clásicas de los editores de vectores: pluma, líneas, texto, formas predefinidas y todas estas son intuitivas lo cual es una ventaja sobre InkScape. Ofrece ciertas herramientas básicas para imágenes de mapa de bits como máscaras, filtros, recortes y canales alfas. Si necesitas acciones más complejas de ese tipo deberás acudir a GIMP.

Posee una biblioteca de iconos SVG que pueden serte de utilidad para usarlos directamente o como base para adaptarlos a tus proyectos.

Admite formatos PNG32, PNG24, JPG y EPS, tanto para importar como para exportar.

Es excelente para maquetar y posee plantillas con los formatos de pantalla de los dispositivos más comunes. Además, por su sencillez y versatilidad es muy útil para los recursos visuales a usar en redes sociales.

Aparece como la competencia directa a Sketch, el popular editor de vectores holandés enfocado en diseño web. Atacando la exclusividad de Sketch para el entorno de Apple, Figma es una aplicación web basada en la nube. Puedes trabajar con ella siendo usuario de Linux, Windows, macOS o incluso desde una Chromebook. Solo necesitas un navegador web y conexión a internet para trabajar en tus proyectos, puedes acceder desde cualquier lugar y ordenador con acceso a internet. Ofrece además una app para macOS y Windows por si necesitas trabajar offline. Una ventaja para usuarios con conexiones de baja velocidad o acceso limitado a internet.

Figma ofrece colaboración en tiempo real, aspecto en el cual aventaja a Sketch, si bien en la versión gratuita solamente permite dos editores y tres proyectos en paralelo. Además te permite acceder a tu historial de cambios y versiones de los últimos 30 días, (historial ilimitado en la versión de pago). Permite compartir los progresos con clientes y colaboradores en todo momento. Al estar basado en la web solo necesitas compartir un enlace para que cualquiera pueda inspeccionarlo, (disponible también en modo de solo vista si no deseas que lo modifiquen).

En el campo del diseño web adaptativo Figma nos facilita el desarrollo web por medio de restricciones que podemos aplicar a nuestros proyectos para simular como cambiaría el entorno según el dispositivo del cual se accede. Además su editor de vectores es muy práctico e intuitivo, para los que no se sienten a gusto en Inkscape, CorelDraw o Illustrator, tal vez esta sea la luz al final del túnel. Finalmente un punto muy positivo de Figma es la posibilidad de exportar el código de nuestros proyectos en CSS, iOS (Swift), y Android (XML). Lo cual facilita enormemente la comunicación entre diseñadores y programadores.

Es muy útil para el trabajo colaborativo, la maquetación de aplicaciones y el diseño de logotipos.

Esta herramienta y GIMP son los estandartes de los programas para diseño gráfico de código abierto y gratuitos. Es un editor de vectores que no tiene nada que envidiarle a Illustrator y trabaja de forma nativa con ficheros SVG con posibilidades de exportar a PNG, PDG, JPG, OpenDocument, PostScript entre otros. Existen versiones para Windows, macOS y Linux. Además, puedes instalarlo en español y hay un buen soporte para la comunidad hispana.

Ofrece herramientas para trabajar con texto usando las fuentes instaladas en tu sistema, puedes pasar de texto a trazos y ajustar el interlineado y el kerning. Te facilita la manipulación y creación de objetos, la clonación y realizar operaciones de trazado. Es un programa muy completo con el cual puedes realizar proyectos muy complejos pero que requiere mayor tiempo de adaptación y aprendizaje. Generalmente, un desarrollador web puede alcanzar sus objetivos con Figma o Gravit Designer, aunque en ocasiones encontrarás determinados obstáculos donde Inkscape entrará a suplir las carencias de estos programas.

GIMP es la alternativa de código abierto a Photoshop y lleva años en producción. Su equipo de desarrolladores lanzó en 2018 una actualización mayor que incluye una nueva interfaz oscura y un paquete de iconos compatibles con pantallas de alta resolución. Además, cuenta con soporte para multithreading, uso del GPU para sus procesos y nuevos paquetes de pinceles y herramientas.

Esta es una herramienta que requiere un poco de configuración y aprendizaje pero una vez tengas todo en la forma que más se adapte a tus necesidades te servirá para retocar todas las imágenes rasterizadas que necesites para tus proyectos de la web.

Al igual que Inkscape es un software maduro con una comunidad de usuarios hispanos muy amplia y dispuesta a ayudar a los usuarios menos avanzados o que llegan de Photoshop. Su biblioteca de Plug-ins es muy amplia. Si te encuentras realizando una tarea repetitiva que se roba tu tiempo vale la pena que gastes unos minutos en chequear si existe un plug-in para eso, probablemente alguien ya se vio en esa situación y contribuyó a la comunidad.

Si bien la compresión de imágenes es una herramienta disponible en casi todos los editores de fotos, Squoosh destaca por su sencillez y rapidez. Esta herramienta, desarrollada por los laboratorios de Google, (pero de código abierto), toma una imagen suministrada por el usuario y la convierte a PNG, JPG o WebP con distintas opciones de compresión: porcentaje de calidad, reducción de colores en la paleta, escalado, entre otras.

Todo esto en una interfaz sencilla y conveniente que te permite tener una vista previa del resultado en tiempo real por medio de una barra deslizante y con un solo clic para descargar.

Una vez que la aplicación ha cargado localmente puedes desconectarte de internet y esta seguirá operativa en tu navegador. Algo que esperamos le añadan más adelante es la posibilidad de subir grupos de imágenes para la compresión y no estar limitados a una sola cada vez.