En la 21ª clase del curso de ChatGPT vamos a aprender a crear una app web funcional clonando Asana desde una simple captura de pantalla.
Una de las capacidades más impresionantes de ChatGPT es su habilidad para interpretar imágenes y convertirlas en aplicaciones funcionales. Esto nos abre un mundo de posibilidades increíble: podemos tomar cualquier interfaz que nos guste de una aplicación existente y recrearla completamente desde cero. Es una técnica revolucionaria que nos permite acelerar enormemente el proceso de desarrollo, pasando de la idea visual a la implementación real en cuestión de minutos.
En esta clase veremos cómo subir una captura de pantalla de Asana al Canvas de ChatGPT y conseguir que nos genere una réplica funcional completa. Exploraremos todo el proceso: desde la interpretación inicial de la imagen hasta la creación del código HTML final con todas las funcionalidades básicas implementadas.
Solo para miembros inicia sesión o suscríbete por 15 €/mes para acceder a los vídeos exclusivos, edición de imágenes, prompts avanzados y a nuestros cursos.
Pues ya lo vemos, hemos conseguido crear una aplicación web completamente funcional partiendo únicamente de una captura de pantalla. ChatGPT no solo ha replicado el diseño visual de Asana, sino que ha implementado todas las funcionalidades básicas que esperaríamos encontrar.
Lo más impresionante es cómo la IA ha interpretado automáticamente la estructura de la interfaz: la barra lateral con navegación, la cabecera, el listado central de tareas y el panel derecho de detalles. Incluso ha incluido el modo oscuro y ha reconocido que se trataba de Asana sin que nosotros se lo dijéramos explícitamente.
El resultado final es una aplicación HTML pura que funciona en local, con guardado automático en localStorage, capacidad de crear tareas, marcarlas como completadas, editar responsables y fechas, y navegar entre diferentes secciones. Todo esto generado automáticamente a partir de una simple imagen.
Ahora es tu turno de experimentar. Toma capturas de pantalla de aplicaciones que uses habitualmente – puede ser Notion, Trello, Google Drive, o cualquier otra – y súbelas a ChatGPT para que las replique. Prueba diferentes tipos de interfaces y observa cómo la IA interpreta cada elemento visual y lo convierte en código funcional.
Si tenemos cualquier duda durante el proceso, recordemos que podemos contar con el equipo de soporte. ¡Nos vemos en la siguiente clase!
Deja una respuesta