⚡️ Crear tu armario digital al estilo Clueless
El clóset que se ordena solo y te arma los outfits.
Hay una escena de Clueless que a estas alturas ya es un meme: Cher abre una app, gira las prendas de su clóset en pantalla y arma el outfit del día antes de vestirse.
En 1995, eso era ciencia ficción de película para adolescentes. Hoy lo puedes montar en una tarde.
Te vamos a llevar por el proceso completo: agarrar las fotos que ya tienes, convertir cada prenda en una foto limpia de catálogo, cargarlas en una app que corre en tu computadora y generar combinaciones renderizadas sobre tu propio cuerpo.
No necesitas saber programar. Necesitas seguir seis pasos.
Vamos.
Lo que necesitas antes de empezar
Un plan pago de ChatGPT, porque la generación de imágenes de Codex no viene en el plan gratuito. Entre 20 y 40 fotos tuyas donde aparezca ropa variada, en una carpeta normal. Y una foto tuya de referencia en PNG: cuerpo completo, de frente, ropa neutra, fondo limpio y luz pareja.
Esa última es la que decide si los renders se parecen a ti o a un primo lejano. Tómala a propósito en vez de rescatar una vieja.
Paso 1: instalar Codex.
Codex es el agente de OpenAI que corre en tu terminal, lee carpetas y ejecuta tareas. Es la pieza que hace posible todo esto, porque puede mirar tus fotos y generar imágenes sin que tú toques un solo archivo.
Abre la terminal y corre:
npm install -g @openai/codex codex login
El login abre el navegador y te autentica con tu cuenta de ChatGPT. Cuidado con el nombre del paquete: codex a secas es otro proyecto sin relación con OpenAI.
🧠 Tip: si codex no responde después de instalar, el problema casi siempre es el PATH de npm y no la instalación. Configura un directorio global propio con npm config set prefix ‘~/.npm-global’ y añádelo a tu PATH.
Paso 2: montar el proyecto.
Este bloque va en tu terminal, no en Codex. Son cinco comandos que copias y pegas uno por uno en la carpeta donde quieras trabajar:
git clone https://github.com/tandpfun/wardrobe.git cd wardrobe npm install cp .env.example .env npm run dev
Abre localhost:5173 y vas a ver la galería vacía. Esa es tu app.
Vas a leer en el README que el importador queda deshabilitado hasta que agregues una OPENAI_API_KEY. Eso aplica al botón de importar dentro de la app. Nosotros vamos a importar desde Codex, que usa la generación de imágenes de tu suscripción, así que puedes saltarte la API key por completo.
✍️ Nota: deja el servidor corriendo en una pestaña de terminal y trabaja con Codex en otra. El servidor no termina nunca por diseño, así que si lo lanzas desde Codex te bloqueas la sesión. Levántalo tú y refresca la galería después de cada importación para ver cómo se va llenando.
Paso 3: preparar las fotos.
Junta tus fotos en una carpeta simple, algo como ~/Pictures/outfits.
Coloca tu foto de referencia como data/model-reference.png dentro del proyecto.
💡 Tip: revisa que en el conjunto haya variedad real de prendas. Veinte fotos con la misma chaqueta te devuelven un armario de una prenda. Y descarta las fotos donde la ropa esté muy tapada o muy oscura, porque esas son las que producen recortes inventados.
Con eso listo, en tu segunda pestaña de terminal entra a la carpeta del proyecto y escribe codex.
🌱 Nota: La primera vez te pregunta si confías en el contenido del directorio. Aquí la respuesta es sí, porque es el repo que acabas de clonar a propósito. Esa pregunta existe para que no le des ese permiso a cualquier carpeta descargada sin mirar.
Ya estás dentro del agente, y ahí es donde van los pasos que siguen.
Paso 4: importar la ropa.
Abre la carpeta del proyecto en Codex y escribe esto:
$import-clothes Importa la ropa de ~/Pictures/outfits, crea las fotos modeladas y agrégalas a este wardrobe.
A partir de ahí, Codex trabaja solo. Arma hojas de contacto para revisar todas tus fotos, inventaría cada prenda que estés usando deliberadamente, genera un recorte por pieza sobre fondo croma, remueve ese fondo para dejar el PNG transparente, verifica cada resultado contra la foto original y escribe todo en la base de datos local del proyecto.
Codex te va a pedir permiso antes de ejecutar cada tipo de comando nuevo, y el de limpiar el fondo verde lo corre una vez por prenda. Elige la opción de aprobar esa familia de comandos y no volver a preguntar, o pasas la tarde dando Enter.
Paso 5: generar los outfits.
Con el armario ya cargado, en la misma sesión de Codex:
$generate-outfits Crea 6 ideas de outfit modeladas a partir de mi armario.
Codex lee tu base de prendas, arma combinaciones que tengan sentido cromático y de silueta, y genera una foto cuadrada por cada look usando tu foto de referencia como ancla de identidad. Después compara cada resultado contra las referencias y regenera lo que no pase.
Las reglas que aplica son bastante estrictas: una prenda superior y una inferior por outfit, capas opcionales y prohibición explícita de inventar cierres, botones o aberturas que la prenda real no tenga.
Tip: si le pides una cantidad que tu armario no puede sostener con combinaciones distintas, te dice cuál es el máximo útil y te pregunta antes de seguir. Empieza con seis, esa corrida tomó menos de veinte minutos y salieron los seis a la primera, sin regenerar ninguno.
Paso 6: la vista que falta.
La app no trae la pantalla de outfits, así que se la pides. Codex tiene el código delante y sabe exactamente qué falta.
Agrega una vista de outfits a la aplicación. Necesito tres cosas. Un endpoint que sirva el contenido de data/outfits.json y las imágenes de data/outfit-images. Una pestaña nueva junto a ALL, TOPS, JACKETS, BOTTOMS, ACCESSORIES y SHOES que se llame OUTFITS. Y dentro de esa vista, una grilla que muestre cada outfit con su imagen modelada, su nombre y la lista de prendas que lo componen. Respeta el estilo visual, la tipografía y los colores de la galería actual. Cuando termines, dime qué archivos modificaste.
El servidor recarga solo, así que en cuanto termine, refrescas el navegador y ahí está la pestaña nueva con tus looks.
✍️ Nota: cada vez que Codex te pida iniciar el servidor para verificar algo, dile que use el que ya tienes corriendo. Ese comando no termina nunca, así que si lo lanza él se queda esperando y te bloquea la sesión.
A partir de aquí el ciclo es corto. Para pedir combinaciones nuevas abres la terminal, escribes codex, lanzas el comando de outfits con la ocasión que necesites y refrescas. Ya no hay que instalar ni configurar nada otra vez.
Y ahí lo tienes. El clóset de Clueless, pero corriendo en localhost.
🎓 Lleva Codex más lejos
Si Codex pudo tomar una carpeta de fotos, organizarla, generar imágenes y modificar una app completa, ya viste una buena parte de lo que lo hace tan útil.
En Codex de Básico a Avanzado recorremos sus principales capacidades para que entiendas qué puedes delegarle en tu trabajo.
Puede trabajar con tus archivos, organizar información, conectarse con otras plataformas, programar tareas y construir proyectos completos siguiendo instrucciones en lenguaje natural.
Y esta semana también estrenamos:
Crea Contenido Faceless con IA.
Optimiza el Rendimiento en Meta Ads con Claude.
Domina el Ecosistema de Claude Desde Cero.
Son cursos cortos, prácticos y pensados para que puedas aplicar lo aprendido desde la primera clase.
Entra a Weplash Academia y empieza por el que más te sirva hoy.
Nos vemos en el siguiente build ⚡
