LK SizeForge – Cómo creamos una app para redimensionar imágenes con IA

josejotxe
29 oct
4 Min. de lectura

La inteligencia artificial no solo sirve para generar texto o imágenes: también puede ayudarte a crear tus propias herramientas.

En Lozkorp hemos diseñado una aplicación sencilla y potente para redimensionar y recortar imágenes, totalmente hecha en local y asistida por IA. En este caso hemos usado ChatGPT, pero podriamos haber usado otras disponibles en el mercado.

Hoy te contamos cómo funciona LK SizeForge, cómo la hemos construido paso a paso, y lo fácil que es empezar a crear tus propias utilidades personalizadas con IA.

LK SizeForge, La forja para redimensionar tus imágenes con precisión — LK SizeForge

🚀 ¿Qué es LK SizeForge?

LK SizeForge es una pequeña aplicación web que te permite:

📂 Cargar cualquier imagen desde tu ordenador.
🔍 Ver su tamaño, tipo y dimensiones.
✂️ Definir un marco de recorte con la proporción que quieras (16:9, 1:1, personalizado…).
🔄 Girar, voltear y ajustar la imagen.
📏 Redimensionar la imagen en porcentaje con estimación del tamaño resultante.
💾 Descargar la imagen en diferentes versiones:
- Original
- Recortada
- Redimensionada

Y todo esto sin instalar nada: basta con abrir el archivo index.html en tu navegador.

🖥️ ¿Cómo se usa?

Selecciona tu imagen con el botón de carga.
LK SizeForge - Cargar archivo de imagen
Revisa la información básica que aparece (nombre, tipo, tamaño, dimensiones).
1. Esta información se puede ver en un cuadro de texto que aparece bajo el botón de elegir archivo.
  LK SizeForge - información de la imagen cargada
Si quieres recortar:
1. Seleccionas el ratio que deseas para la imagen. (Hay varios predefinidos como 16:9, 3:4, pero puedes personalizarlo). Esto es útil si necesitas modificar el ratio de una imagen para una publicación (por ejemplo, 16:9 para un tweet, 4:3 para una presentacion en pantalla no panorámica,...)
2. Indicas el tamaño del marco de recorte.
3. Ajustas el marco de recorte al área que quieras recortar.
  LK SizeForge - recortar imagen
Usa los controles para rotar o voltear si lo necesitas.
LK SizeForge: botones girar y voltear la imagen
Redimensiona indicando un porcentaje (por ejemplo, 50% reducirá la imagen a la mitad).
1. Indicas el porcentaje al que quieres escalar la imagen (por ejemplo, 50% reducirá la imagen a la mitad)
2. Te muestra las dimensiones de la original, las dimensiones que tendría la imagen redimensionada.
3. También indica el tamaño de la imagen original y el tamaño aproximado que ocuparía la imagen redimensionada.
  LK SizeForge - Redimensionar imagen
Descarga el resultado con un clic.

El programa genera los archivos con nombres claros, añadiendo al nombre de la imagen original el texto "_recorte" o "_redimensionada"

Tweet_20250907_Wf_GeminiStorybook_recorte.jpg
Tweet_20250907_Wf_GeminiStorybook_redimensionada.jpg

⚙️ ¿Cómo se hizo?

Aquí viene lo interesante: no hemos escrito todo el código a mano, sino que hemos usado ChatGPT como copiloto de desarrollo.

👉 Empezamos con un prompt sencillo:

Vamos a hacer juntos una aplicación en HTML, CSS y JS que nos permita cargar una imagen, mostrar su información de tamaño y dimensiones, y nos permita recortarla en función de un ratio y dimensiones que le indiquemos

Con eso obtuvimos nuestra primera versión de archivos HTML, CSS y JS.

Después poco a poco fuimos refinando el código, y añadiendo funcionalidades.

👉 algunas prompt más de ejemplo que usamos:

Añade en la parte de arriba de la página web un banner que muestre el logotipo de la aplicación y su nombre

Modifica el archivo CSS para cambiar el estilo a un estilo con botones de color azul cobalto y otros de color negro

Vamos a añadir ahora la funcionalidad de poder voltear y girar la imagen. Para ello pon un botón de girar 90º la imagen a un lado, otro para girar al otro lado, otro para resetear la rotación, y además vamos a poner un botón para flip vertical y otro para flip horizontal de la imagen

Vamos a añadir la funcionalidad de redimensionar la imagen. Para ello añadiremos un campo que nos deje poner un valor entre 0 y 100, y luego una etiqueta que nos muestre el tamaño de la imagen original y las dimensiones que tendría la imagen una vez aplicado el escalado

Así, poco a poco, interaccionando con el ChatGPT le fuimos dando forma a nuestra aplicación de acuerdo a nuestros requerimientos.

Usamos chatGPT incluso para la generación del logo de la aplicación, usando un prompt en el que le pedíamos que usara una imagen sencilla de un yunque y un martillo, y que luego poco a poco fuimos retocando usando el chat y también un programa de dibujo.

De esta manera, en pocas horas teníamos una aplicación lista para usar y compartir.

Nuestra aplicación finalmente consta de 4 archivos:

LK_SizeForge_index.html (archivo HTML, donde se construye la estructura de la aplicación web)
script.js (archivo que contiene las acciones de la aplicación y que es llamado desde el archivo HTML)
style.css (archivo que define los estilos de la aplicación web: colores, tamaños,.... y que es llamado desde el archivo HTML)
Logo_LK.png: logo creado para la aplicación.

🌍 ¿Por qué es importante?

Porque demuestra algo clave: con IA puedes crear tus propias herramientas personalizadas, no necesitas ser un programador experto para desarrollar utilidades que resuelvan tus problemas diarios.

Un visor de imágenes, una calculadora de ratios, un planificador en PDF… lo que necesites. Con unos pocos prompts y algo de prueba-error, la IA te ayuda a construirlo.

Además, LK SizeForge funciona 100% en local: no subes nada a servidores externos, lo que garantiza la privacidad de tus imágenes.

📥 Descarga LK SizeForge

Puedes probar la aplicación descargando la carpeta completa (HTML + JS + CSS + logo) desde este enlace:

👉 Descargar LK SizeForge

Solo necesitas descomprimir el archivo, abrir LK_SizeForge_index.html en tu navegador, ¡y listo!

Siéntete libre de modificar los archivos para adaptarla a tus necesidades y

ACTUALIZACIÓN

Para que te sea más fácil ver como funciona, hemos colgado la aplicación web en un servidor web en la nube.

👉 LK SizeForge - LOZKORP

✨ Extra: siéntete libre de modificar la aplicación según tus necesidades.

Y si creas tu propia versión o mejoras, ¡nos encantaría que lo compartieras con nosotros! 💙

💡 Conclusión

LK SizeForge es un ejemplo de cómo la creatividad + la inteligencia artificial pueden transformar una idea en una herramienta útil en cuestión de horas.

Si alguna vez has pensado “me gustaría tener una app que hiciera esto…”, ahora sabes que es posible crearla con IA. La forja está abierta: ¿qué vas a crear tú? ⚒️