Claude Design 2.0 Desbloqueado! Diseña TODO por IA (Caso reales)

Alcanzar el primer puesto demuestra capacidad, conservarlo demuestra consistencia. Anthropic está haciendo récord histórico como empresa con modelos y funciones de inteligencia artificial que más tiempo se mantiene en el top, y además en la mayoría de las categorías. Una de sus funciones con las mejores actualizaciones es la nueva plataforma de diseño Claude Design 2.0. Descubriremos de lo que es capaz ahora con 7 casos de uso que te permitirán hacer cosas como generar vídeos profesionales, diseñar reales y hacerlas funcionales, crear diseños de sistemas para crear contenido consistente, o hasta lo desbloquearemos para no tener ningún tipo de límite, entre otros casos de uso. Lo mejor es que Claude, pese a no ser la más barata, optimizaron sus límites y surgió una nueva alternativa que nos permitirá usarlo de una forma gratuita e ilimitada. ¿Suena bien? Pues comencemos por el principio. Cloth Design es la plataforma de diseño de Anthropic. Esta recibió grandes actualizaciones como la posibilidad de usar plantillas y la corrección del mayor error que tuvo: su pequeño límite. Para ver qué podemos hacer ahora, saltemos a Cloth, siendo esta plataforma de aquí, de la que junto con todo te estaré dejando los enlaces abajo en la descripción. Ten en cuenta que desde la plataforma, para poder utilizar este modo diseño en la versión web, te lo vas a encontrar justamente aquí. Pero si lo usas desde esta aplicación de escritorio, lo vas a tener justamente por aquí abajo. Independientemente de cómo lo utilices, realmente la plataforma es exactamente igual. Así que para ello yo voy a volver a la versión web, voy a clicar en este icono de aquí. Una vez aterrizamos a esta plataforma, nos encontraremos este apartado de prompt y una serie de plantillas. Pero para conocerlas de forma ordenada, vamos a saltar al primer caso de uso. Vamos a comenzar creando animaciones, ya que realmente, aunque los modelos de Claude no sean capaces de generar vídeos por inteligencia artificial, lo cierto es que sí lo pueden hacer a código, pudiendo generar animaciones profesionales que estén listas para compartir. Para poder ver esto, me he vuelto directamente por donde nos habíamos quedado y voy a seleccionar esta primera opción de plantilla llamado Animation. Así que le voy a dar un clic y ya con eso lo tendría seleccionado. Ahora, para ponerlo a prueba, yo le voy a poner el siguiente prompt donde le estoy pidiendo básicamente que me genere una experiencia de motion graphics donde nos explique de una forma corta y concisa de qué trata la plataforma de Claude Design. Para ello yo le he añadido algunas especificaciones de cómo quiero que sea esto, así que sin más le voy a dar a enviar. Y mientras se empieza a procesar, te quiero compartir cómo directamente yéndonos al apartado de uso de Claude realmente han eliminado el corto límite que tenemos de Claude Design, ya que ahora se unifica con la sesión que tenemos para todos los modelos. De hecho, por eso la mía acaba de empezar ahora y tenemos consumido ese 1% debido a esta tarea que ya me está haciendo algunas consultas, como por ejemplo la duración que quiero que tenga mi vídeo. Aquí por defecto me deja hasta 90 segundos, pero podría incluso seleccionar más. Yo sin embargo le voy a pedir 40 segundos para que lo podamos ver entero. Desde aquí me pregunta el formato, por el cual selecciono el horizontal. Y también en alguna de estas opciones podemos hacer que decida la IA por nosotros. Aquí además vamos a poder especificar alguna información más, aunque yo lo voy a estar dejando tal y como está. Al clicar en continuar ya lo empezaría a procesar. Y segundos más tarde, y al primer intento, efectivamente me aparece por aquí un timeline de 40 segundos de duración. Y si le doy al play, pues me aparece cómo tendríamos esta animación de Cloud Design. Desde aquí también podemos ver diferentes apartados de prompt, y en definitiva, conforme yo voy avanzando, pues me puedo encontrar diferentes animaciones más. Antes de ver esto al completo y para no verlo de forma repetida, fíjate que si yo clico en el apartado de tweaks, desde aquí nos vamos a encontrar diferentes mejoras o cambios que vamos a poder previsualizar directamente sobre nuestro resultado. En este caso, al ser el formato vídeo, voy a poder quitar la información de movimiento que tenemos aquí abajo para simplemente tener un previsualizador. Yo, sin embargo, lo voy a activar. Y por otro lado, también tengo la opción de tener un vídeo narrado a través de la voz de Gemini, como le especificaba en el prompt, desde donde le he compartido mi clave API. He seleccionado una de las voces, así que para ver el vídeo completo y escuchar esa narración voy a clicar aquí en el apartado de share. Y fíjate cómo esta la vamos a poder descargar en diferentes formatos. En mi caso voy a seleccionar el formato vídeo, voy a seleccionar la calidad original, que sería alta calidad, le doy a exportar y ya esto empezaría a renderizar para que tras unos segundos más tarde nos podamos encontrar con este resultado.

Todo camino siempre empieza con una idea. Escribes lo que imaginas, en tus palabras, como una presentación para tu app. Y el diseño empieza a tomar forma, bloque a bloque, como si fuera magia. Cada palabra se convierte en una decisión visual en muy poco tiempo. Slides, documentos, interfaces, composiciones... Además, puedes coger, ajustar, mover y y afinar el detalle. Añade cambios globales como otros estilos simples. De la idea al resultado, ese es Cloud Design.

Y es que fíjate, con esto vamos a poder crear cualquier tipo de animación, ya sea para generar el vídeo listo para compartir, como incluso poder generar recursos para editar vídeos que, por ejemplo, tengamos que aparecer nosotros u otros materiales que queramos añadir. Además, ten en cuenta que desde esta funcionalidad de animaciones, si yo vuelvo al inicio con la plantilla de animaciones, fíjate que también vamos poder adjuntar desde aquí diferentes archivos. Yo aquí, a modo de ejemplo, voy a adjuntar esta variante de logo que tengo. Y al seleccionarlo, si le pido que me cree una animación sorprendente de aparición para este logotipo, al clicar en enviar y respondiendo a estas preguntas que aparece por aquí, como por ejemplo añadir nuevamente el logotipo desde aquí y subiéndolo, y seleccionando algunas opciones como horizontal, 6 segundos, y que es para un intro de YouTube y quiero que sea sutil y elegante, al clicar en continuar nos podríamos encontrar con una animación como esta de aquí, donde podemos ver que aparecen diferentes partículas, luego las líneas, y poco a poco se estaría escribiendo ese logotipo de Academia Artificial. Y ya con eso lo tendríamos finalizado. Fíjate además que sobre el apartado de tweaks, desde aquí voy a tener también diferentes ajustes. Por ejemplo, aquí me pone partículas ambientales, que son justamente las que nos aparecen por aquí, y todo esto lo voy a poder quitar a golpe de un clic. Y en definitiva, ya no hablamos de generar animaciones sin más, sino que realmente vamos a poder animar profesionalmente logotipos cualquier otro tipo de activo que nosotros tengamos y la IA se encargará de hacerlo en automático. Con esto realmente es muy fácil visualizar cualquier concepto, pero lo más importante del resultado no es la herramienta, sino también elegir el modelo adecuado para cada tarea. Y como cada modelo es ideal dependiendo del tipo de tarea, te quiero presentar a Mammoth AI, una plataforma que reúne muchos de los mejores modelos de inteligencia artificial en un único lugar. Desde aquí puedes acceder a modelos como Claude, OpenAI, Gemini, Mistral, Grok, DeepSeek o Perplexity sin tener que estar saltando entre servicios diferentes. Además, también tiene modelos en otros formatos. Puede generar imágenes, vídeos, investigar con inteligencia artificial, trabajar con modelos de razonamiento u opciones más ligeras cuando necesitas respuestas más rápidas. Y como ves por aquí, también contamos con un nuevo modo agente. Este combina en automático modelos de lenguaje, de investigación y ligero. Solo eliges el objetivo que quieres conseguir, le das a enviar y Mamut se encargará del resto, obteniendo así un resultado como este informe, que es justo el que le he pedido antes. Así puedes centralizar gran parte de tu flujo desde un único lugar, y todo desde una suscripción sin permanencia desde 10€ al mes. Y gracias a que Mamut son los patrocinadores de este vídeo, me han dejado un enlace que te dejaré abajo en la descripción para que puedas probarlo por ti mismo. Y una vez sabemos esto, saltemos con el segundo caso de uso. En este segundo caso de uso estaremos poniendo a prueba sus capacidades de modelos en 3D. 3D. Para ello, volviéndome directamente a la plataforma, fíjate que desde aquí abajo tenemos la opción de objetos en 3D. Pero ten en cuenta que si el prompt requiere de utilizar algún tipo de estas plantillas, realmente Claude lo va a poder seleccionar por nosotros. De hecho, en este ejemplo yo no voy a utilizar ninguna de las plantillas y la que habría que escribir, este prompt de aquí un poco más complejo, donde le pido que me genere un piano en 3D pero con ciertas peculiaridades. Y para ver qué peculiaridades, le voy a dar a enviar y unos minutos más tarde me puedo encontrar con este piano de aquí, que además, como puedes de ver sería totalmente en 3D y además tiene esas pequeñas peculiaridades que le he pedido. Por un lado, ten en cuenta que yo podría hacer zoom para ver todos estos detalles, pero para poder verlo de una mejor forma, fíjate que por aquí me estaría diciendo cada uno de los apartados con una breve descripción abajo a la izquierda. Además, podría ver qué hay en el interior del piano. Simplemente tendría primero que abrir la tapa, de esa forma se abriría por aquí. Fíjate cómo tenemos un montón de detalle y además, si yo clico en vista interior, pues me va a hacer un mayor zoom como el que acabas de ver. Adicionalmente a esto, si yo quito zoom interior, fíjate que si yo clico en el apartado de vista explosionada me estaría diferenciando cada uno de los componentes de este piano para poder ver realmente cómo serían cada una de estas piezas. Pero realmente lo que podría ser un poco más complejo es ver si tiene un funcionamiento real y cada tecla funciona, ya que si quitamos estas dos opciones, fíjate por aquí, bueno, de hecho voy a dejar la tapa abierta, fíjate que aquí tenemos unas 88 teclas, cosa que la verdad que en anteriores pianos que he hecho por inteligencia artificial ninguno me consiguió hacer tantas teclas y con esta calidad. Así que ahora voy a cambiar al modo tocar y en teoría si toco alguna de las teclas se debería escuchar. Vamos a probarlo. Efectivamente, esto se estaría escuchando. Y de igual forma, si cambio a otra, pues también se escucharía. Si toco esta aquí negra, también cambia la nota. Y por tocar algunas distintas, también se escucharía. Fíjate además también que tenemos por aquí un pedal, que además si yo lo clico en pedal, pues directamente se marcaría esto y en teoría se debería escuchar las notas manteniéndose un poco más. Vamos a ver la diferencia. Y realmente pues sería totalmente funcional. Además, para poder ver todo esto de una mejor forma, voy a clicar en escuchar una demo. Y con esto ya no hablamos de crear algo básico, sino que además de tener un modelo en 3D con todo detalle de un instrumento musical, también contamos con todo el detalle de las notas musicales que tendría cada una de estas teclas del piano. Además, fíjate en todos los detalles que hay, porque si yo aquí acabo de darme cuenta que si le hago bastante zoom, fíjate que al tocar una tecla concreta, tanto la cuerdecita que aparece por aquí abajo como por aquí arriba se movería exactamente dependiendo de la tecla que haya seleccionado. Voy a tocar esta, fíjate cómo estaría vibrando una en concreto, pero si toco la de al lado pasaría a esta. Fíjate que ha saltado una por medio y es porque tenemos aquí esta tecla negra, que si la toco pues justamente estaría vibrando esa de ahí. Y además, si lo coloco desde esta zona, pues lo podemos ver aún mejor. Siguiendo con este bloque de simulaciones 3D, vamos a ver cómo también lo podemos relacionar en el ámbito más profesional. Para ello, desde el inicio le voy a poner el siguiente prompt, donde básicamente le pido que me cree una página web sencilla con una representación 3D sencilla de un coche inventado, para que tengamos una interacción dependiendo de cómo hagamos el scroll por la web. Así que desde aquí, antes de darle a enviar, fíjate que le podemos cambiar el modelo. Yo en este caso voy a seleccionar el de 5 para probarlo. En este caso uso, le doy a enviar, y unos minutos más tarde nos podremos encontrar con este resultado aquí, que fíjate cómo interactúa dependiendo de cómo va el ratón. Además, si yo hago scroll hacia abajo, pues también este modelo 3D estará interactuando acorde a cada una de las informaciones que van apareciendo. De hecho, fíjate que también me muestra que puedo cambiar el color de rojo, por ejemplo, al blanco o al negro, y también aparecería todos esos cambios directamente aplicados en ese coche. Nada más por aquí, terminaríamos con este último formulario para rellenar nuestros datos. Y lo cierto es que realmente es sorprendente, porque ya no hablamos de crear simplemente objetos 3D para pasar un buen rato, sino que estos los podemos incorporar en páginas web animadas e interactivas para que tengan más personalidad. Además, fíjate que si vuelvo arriba del todo, una de las cosas que le había pedido es que me añadiese el sonido del motor. Esto se lo ha tenido que inventar porque es un coche futurista, pero vamos a ver qué tal se escucha. Así que voy a darle un clic aquí. Y fíjate, ya no hablamos de crear una web sin más, sino que estamos teniendo un montón de pequeños detalles que realmente hacen que luzca distinta. Aquí hemos trabajado con un modelo en 3D que realmente ha creado la propia plataforma, pero podríamos subir un coche real para poder tener esa navegación inmersiva que antes era imposible hacerlo de una forma tan rápida. Ten en cuenta también que antes sobre un chat le he pedido lo mismo utilizando el modelo de Fable 5. Y aquí, si lo agrando un poco, pues realmente también nos podemos encontrar con un resultado que no está nada mal. Aquí también nos podemos encontrar como todo esto sería totalmente interactivo, también podría cambiar de color e incluso interactuar con el coche. Pero hay una diferencia clara de utilizar Cloth Design cuando queremos trabajar todo este apartado de diseños, y es que fíjate que si yo aquí quisiera hacer algún cambio, ya tendría que entrar al apartado de Prompt. Sin embargo, desde Cloth Design yo siempre voy a poder clicar en el apartado de Editar y de esa forma voy a poder ver todo el desglose que me aparece, tanto de los colores, los diferentes componentes, el fondo gradiente que se está utilizando, cómo son las alineaciones. Y además, yo manteniendo el apartado de selección, yo voy a poder clicar en cualquier parte, por ejemplo esta de aquí, y voy a poder modificarlo. Imagina que yo quisiese que pusiera R2, pues simplemente lo escribo y ya estaría por aquí aplicado de una forma muy rápida. Igualmente a esto, recuerda que tenemos el apartado de tweak desde donde vamos a poder hacer diferentes modificaciones. Y además, si salgo del modo edición, esto también lo voy a poder seguir previsualizando. En este tercer caso le daremos un enfoque aún más profesional, ya que realmente para sacarle mucho partido a esta nueva función sería trabajar con diseños de sistema. Para ver esto, fíjate que dentro del apartado de prompt tenemos aquí una opción llamada Design System. Si yo le doy un clic, desde aquí nos van a aparecer diferentes temas que vamos a poder utilizar, en concreto unas 6 opciones. Pero lo más interesante es que nosotros podemos clicar en este botón de más y desde aquí le podríamos decir que lo vamos a crear. Al seleccionar esto, nosotros vamos a poder escribir en qué consiste nuestra marca. Yo en este sentido me voy a apoyar a través de mi academia, que por cierto hemos abierto plazas en el programa intensivo inteligencia artificial, así que también te lo voy a dejar abajo en la descripción. Y para ello, desde el apartado nombre le voy a poner simplemente el nombre de Academia Artificial. Desde aquí, como no tengo repositorio GitHub, lo voy a dejar vacío. Y desde el apartado de subir logos y archivos le voy a dar un clic y voy a subir tanto estos logos como algunos otros que tengo por otras carpetas, por lo que le doy a abrir. Ya se empiezan por aquí a cargar. Y desde el apartado de notas le habría escrito simplemente que somos una academia de formación de IA generativa. Le voy a poner además la URL de Academia Artificial para que investigue más información. Y ya teniendo todo esto, si le doy a continuar para generar, después de unos 7 minutos más tarde tendríamos todo esto de aquí donde nos aparece el diseño del sistema con una pequeña descripción, las fuentes donde ha sacado toda la información. Fíjate que además ha extraído un montón de información directamente desde la URL que le he compartido. Además de esto, vamos a poder ver aspectos como la parte de color y demás. Y conforme voy bajando, nos podemos encontrar diferentes componentes que nos ha maquetado a la perfección, como son los logotipos para las aplicaciones, cuáles son los diferentes conceptos que trabajamos, logotipos de marca, otras variantes en formato horizontal. Y también ha creado cosas que no tenía, como por ejemplo el hecho de colores que podemos utilizar en los botones, colores neutrales, los primarios, semánticos, cuáles serían los pilares principales que deberíamos de tener en cuenta, información de feedback. Por ejemplo, si yo clico en abrir diálogo, pues me aparecería cómo tendría que ser la maquetación si lo utilizara en un sitio web, así como otras opciones más. Y en definitiva, pues me puedo encontrar un sinfín de información como formulario, navegación e incluso diferentes variantes de páginas que podría estar utilizando. Y realmente un montón de información de valor que podría tanto utilizar desde ya como realmente poder compartirlo a alguna agencia o equipo con el que trabaje para que esté al tanto de todo el detalle de la imagen de marca. Y todo esto en menos de 10 minutos. Yo recuerdo, por ejemplo, cuando se desarrolló la marca de Academia Artificial, que realmente estuvo como mes y medio, 2 meses para poder llegar a esas conclusiones. Y realmente aquí, a golpe de un clic, la inteligencia artificial empieza a hacer todo y me da un documento con un montón de detalle que realmente es suficientemente útil como para empezar a trabajar en el proyecto. Ahora, lo mejor de esto es que si yo vuelvo al inicio y selecciono ese diseño de sistema que acabamos de crear, da igual lo que le pidamos, que siempre va a seguir ese estilo de forma profesional. De hecho, para poder ver un ejemplo rápido, voy a seleccionar que quiero crear, por ejemplo, una app móvil, que ahora mismo no tenemos ninguna. Le voy a poner para ello este prompt de aquí, donde básicamente le que quiero una app móvil de academiartificial.com para que incluya una página principal con el progreso del alumno, la próxima clase en directo, cursos disponibles, últimas lecciones y acceso a la comunidad. Voy a darle a enviar y minutos más tarde fíjate lo que tenemos por aquí. Por un lado me aparecería un estudiante llamado Marta, que esto también lo voy a poder modificar desde aquí, sin embargo lo vamos a dejar así, de donde podemos ver que sigue toda la imagen de marca en este mockup de iPhone. Aquí tenemos el progreso tal y como se lo hemos pedido, las próximas clases en directo y las últimas lecciones, que yo también voy a poder navegar desde aquí. La verdad que está muy pero que muy bien hecho. También me aparece un apartado de cursos donde podría ver el alumno todo el detalle de los cursos que está haciendo. Ese apartado de comunidad que aparecen datos clave y podría entrar en el grupo para poder interactuar. También nos encontramos un área de perfil nuevamente siguiendo al completo esa imagen de marca que tenemos en el sitio web, que si saltas a él vas a poder ver que lo ha clavado. Y en definitiva, por aquí podemos ver diferentes opciones, certificados, y en concreto pues la verdad es que me quedo bastante sorprendido con lo bien que trabaja, sobre todo cuando le damos información información adicional, como es un diseño de sistema. Volviendo al inicio, también te quiero mostrar que si partes desde cero, desde aquí vas a poder desarrollar toda la imagen de marca y lluvia de ideas en un tiempo récord. Fíjate, de hecho, que si yo desde aquí les pongo todo ese prompt para que me genere una identidad completa para una marca llamada Aion, que sería una empresa ficticia que desarrolla robots domésticos inteligentes, yo desde aquí pidiéndole el logo, paletas de colores, tipografía, aspectos para redes sociales, para la web, email marketing y demás, al clicar en enviar y tras esperar algunos minutos y responder algunas preguntas. Fíjate por aquí el primer intento, cómo me estaría dando un montón de variaciones de logotipo, las diferentes paletas de colores que podríamos utilizar, las fuentes, las escalas de los espacios, botones, y en definitiva un montón de detalle que realmente nos estaría detallando por completo un montón de información. Incluso aquí nos ha hecho una presentación tipo. También podemos ver cómo serían esos documentos para este proyecto, los emails promocionales, las branding que podríamos utilizar en los sitios web y creatividades para las redes sociales. Además, lo mejor de todo es que vamos a poder hacer lluvia de ideas con el apartado de aquí que conocemos de tweaks, ya que yo en lugar de utilizar un color naranja, si quisiera tirar más por un color verde, al darle un clic automáticamente se estaría cambiando todo a tiempo real. Junto a esto también puedo cambiar la fuente, un tono más editorial o técnico, y también podría cambiar las esquinas, por ejemplo, a algo más cuadrado o incluso redondeado. Todo esto nuevamente a tiempo real se estaría aplicando. Y esto realmente nos demuestra que ya no solamente es algo enfocado para proyectos que tienen cierta base, sino que realmente desde cero nos puede ayudar por completo para poder trabajar en las primeras fases. Saltando con el quinto caso de uso, te quiero mostrar uno de los que más me ha sorprendido a mí. Y mira que los anteriores casos de uso no se quedaban atrás. Y es que en este vamos a ver cómo realmente es capaz de desarrollar el diseño de algo muy específico, como podría ser una aplicación que sea muy concreta. Para ver esto me he vuelto a la plataforma, pero vamos a hacer el proceso completo de desarrollo de una aplicación. Aquí en concreto voy a intentar crear una herramienta como la de WhisperFlow, una herramienta de inteligencia artificial que te va a permitir transcribir cualquier audio que tú estás haciendo a tiempo real para que te olvides de escribir en el teclado. Para ello yo desde aquí le voy a poner un prompt, que este me lo voy a reservar, ya que como verás luego es un proyecto que he estado bastante tiempo. Y si clico en enviar, pues me puedo encontrar con este resultado, que es justamente lo que quería: una ventana flotante estilo WhisperFlow, que cuando la persona hable, al clicar en parar de hablar, pues la herramienta lo transcriba y directamente pues lo puedo utilizar en diferentes plataformas, como por ejemplo email, como hemos visto en este caso. Y fíjate realmente con este ejemplo, porque realmente no se trata de una página web o algo que se suele hacer mucho, sino que es un diseño muy específico con unas animaciones muy concretas, y que realmente incluso nosotros podemos interactuar, como por ejemplo por aquí para parar, y que nos aparezca cómo sería toda esa animación. Lo mejor de todo esto es que nosotros directamente desde Claude Design vamos a poder enviar toda esta información a Claude Code para poder hacerlo real. Para ello simplemente tenemos que clicar en el apartado de Share, le damos a Claude Code, y desde aquí simplemente tenemos que copiar este prompt. Y dentro de Claude Code simplemente le tendríamos que clicar en pegar. Ahora, antes de enviar, ten en cuenta que la plataforma de Claude Code requiere una versión de pago, pero por este vídeo aquí hablaba de cómo se podía utilizar de forma gratuita e ilimitada. Adicionalmente a esto, Claude design también realmente en teoría requiere una versión de pago, pero en el siguiente caso de uso veremos cómo podemos desbloquearla para no tener que contar con ella y poder utilizar estas funciones. Antes de ver eso, ten en cuenta que yo por aquí acabo de saltar a un chat en donde realmente he hecho muchísimas pruebas e iteraciones para ir mejorando esta aplicación, que de hecho ya tengo por aquí el instalador listo para funcionar. De hecho, le voy a dar un doble clic para que puedas ver cómo funciona, y de esa forma pues puedes ver cómo se puede replicar exactamente ese diseño tan bueno en algo que sea funcional. Aquí nos está diciendo onboarding. Así que le voy a dar a empezar, le doy acceso al micrófono directamente desde aquí, podría dar acceso a accesibilidad, continúo, le he dado acceso a mi API de OpenAI para que pueda hacer las transcripciones, continúo. Y dándole a abrir Scribe, ya directamente desde aquí tenemos esa animación, que de hecho tenemos aquí tanto el apartado de ajustes con inteligencia artificial como incluso desde aquí podríamos empezar esa transcripción. Como puedes ver, me estaría recogiendo justamente en tiempo real esas animaciones conforme yo estoy hablando, y al doy en parar, pues directamente empezaría a hacer esa transcripción. De hecho, ya me pone insertado. Y con esto, pues fíjate lo que pude construir, que era una aplicación nativa para macOS, Windows e incluso dispositivos móviles que me permitiera transcribir por inteligencia artificial con una interfaz muy bien trabajada. Y esto lo hice en ratos libres siendo yo solo, que ni siquiera soy programador. Y en definitiva, la verdad es que todo este tipo de herramientas nos abre un sinfín de Por si tienes curiosidad, este proyecto lo descarté finalmente cuando ya estaba a punto de publicarlo debido a una herramienta que hablaba por aquí que te permitía hacer esa funcionalidad de forma gratuita e ilimitada. Vamos a saltar ahora al penúltimo caso de uso, y aquí se va a poner las cosas serias, sobre todo para aquellos que no tengáis una suscripción de pago de Claude, ya que ahora veremos cómo realmente vamos a poder utilizar utilizar todo este tipo de funcionalidades de forma gratuita e ilimitada. Y es que existe una nueva plataforma de código abierto llamada Open Design que abre y delimita por completo lo que acabamos de ver. Para descubrir esto acabo de saltar a Open Design, que sería esta herramienta de aquí. Y por cierto, está en un repositorio de GitHub que ya recoge más de 80.000 estrellas y básicamente hace exactamente lo mismo que Cloud Design pero en código abierto. De hecho, fíjate que desde aquí a día de hoy también tienen planes de precio, ya que nos lo dejan utilizar en la nube, pero tenemos en cuenta que si lo instalamos en local sería ilimitado. Además, esto también lo podemos utilizar con diferentes APIs gratuitas y ni siquiera necesitaríamos un ordenador con recursos. Además, si nos vamos a su página antigua, que sería esta de aquí, antes de que sacaran esos planes de pago, podemos ver cómo realmente ponen en valor el hecho de poder utilizarlo ilimitadamente de forma gratuita. Pero ahora lo bueno de la nueva página es que además de tener un estilo mucho más limpio, tenemos un instalador mucho más sencillo. Simplemente tenemos que dar un clic a descargar. Esto ten en cuenta que está disponible tanto tanto en Mac, Linux y Windows. Y una vez tengamos la aplicación abierta, nos encontraríamos con esta interfaz que quizás te suene, ya que realmente sería un clon de lo que acabamos de ver a lo largo del vídeo. Ten en cuenta también que nada más iniciar la aplicación te va a pedir que conectes un modelo de inteligencia artificial. Desde aquí lo más fácil sería iniciar sesión con Open Design, ya que realmente gratuitamente le vas a poder dar un uso sin necesidad de correr modelos en local, aunque también hay otros métodos. De hecho, para ello voy a clicar arriba a la derecha y ahora justamente abajo del todo en el apartado ajustes para que puedas ver cómo desde aquí podemos conectar prácticamente cualquier tipo de proveedor, desde la API de Google, que tiene límites gratuitos. También podemos conectar Olamacloud, que es otra API que podemos utilizar gratuitamente con algún límite. Y en definitiva, todas, como OpenRouter, Grog y demás herramientas gratuitas con APIs de las que ya hablaba en todo detalle por este vídeo de aquí. Sin embargo, yo le quiero conectar el mejor modelo que tenemos en la actualidad para hacer diseños web. Pero para descubrir esto, veamos el último caso de uso. En este último caso de uso estaremos conectando la aplicación de Open Design con el mejor modelo actual para hacer diseños. Y sí, incluso por delante de Fable 5. Este sería el modelo de Kimi K3, y algunos rankings como el de Arena AI lo posicionan en el top número 1 con diferencia para todo el apartado de diseño frontend. No es la única, ya que Design Arena también lo en el número 1, y esta misma empresa también lo posiciona con diferencia en el mejor modelo para hacer diseños 3D. A nivel general también va subiendo posiciones y algunas empresas lo posicionan en el top 1, aunque no en todos los rankings pasa esto, ya que realmente Arena AI en algunas categorías como el apartado de agent estaría entre las 4 primeras posiciones, pero realmente este es un modelo que como mínimo suele estar entre las 3 o 4 primeras posiciones. Aunque en el apartado de diseño, que es el que estamos trabajando ahora indiscutiblemente a día de hoy está en el top número 1 con diferencia. El problema de esta plataforma es que han muerto de éxito, es decir, tienen ahora tanta demanda que ni siquiera podemos suscribirnos a los planes de pago aunque queramos utilizarlo con mayores límites. Pero una de las mejores soluciones sería directamente utilizar la API. Yo para ello he entrado a la plataforma oficial, que también te voy a dejar abajo en la descripción, le he añadido unos $20 y ya me he gastado algunos, ya que realmente he hecho un par de casos de uso que te voy a mostrar ahora, y por cierto, súper sorprendentes. Vamos a empezar por el primero, y para ello volviendo a la herramienta, te quiero mostrar esta de aquí de Web Clone, desde donde el apartado prompt lo único que hice fue decirle que me clone la URL y le puse la página de Apple. De hecho, si la abro, fíjate que tendría esta visualización de aquí, que la verdad es que luce muy bien. Y si volvemos a esta página de Open Design con el modelo que le he conectado de Kimi K3, pues como puedes ver por aquí, esto no es una previsualización, sino que realmente ha hecho a código exactamente la misma página. De hecho, para poder verlo de una mejor forma, le voy a dar a descargar.

Desde aquí lo voy a descargar como un formato zip.

Y antes de abrirlo, fíjate que si clico en el apartado de código fuente, pues podemos ver cómo toda esta página realmente estaría hecha código. Aquí de hecho ya tengo todos los archivos descomprimidos, así que voy a clicar en el index.html. Y fíjate por aquí cómo tendría esa página estilo Mac, pero fíjate en la URL, que realmente sería un código que tengo en local. Aquí además todo esto me lo ha hecho hasta el final, y no solamente ha hecho eso, sino que ha hipervinculado todos los enlaces para ir directamente a donde nos llevaría la página oficial. Es decir, clico, por ejemplo, en esta parte de tienda, pues me redirigiría a la tienda oficial de Apple. Con esto ya no hablamos de crear un diseño que se pueda escapar algo, sino que realmente todos esos modelos y funcionalidades avanzadas de diseño nos permiten llegar a un nivel muy alto. Imagina la cantidad de personas que habrá detrás de la página web de Apple, y aquí yo, en cuestión de unos 40 minutos, que ha sido lo que ha tardado aproximadamente Química 3, pues realmente lo ha podido replicar a la perfección. Y yo realmente, sobre esta página que tengo código, me podría basar para otro proyecto que sea de un nicho totalmente distinto, pero con una estructura y lenguaje visual muy bien trabajados en el cual me podría inspirar. Me he vuelto a Open Design y aquí te quiero mostrar el otro caso de uso, que es el que yo creo más, más sorprendido de todo el vídeo, que sería esta aplicación llamada Scapabi. Aquí básicamente yo le puse un prompt y al primer intento me ha hecho una aplicación después de aproximadamente unos 50 minutos donde le dije que tuviera unos gráficos 3D sencillos como si estuviera dentro de una tienda similar a la de IKEA, donde tuviera que buscar diferentes objetos con el objetivo de escapar, una especie de escape room. Y aquí, para poder verlo de una mejor forma, nuevamente me lo voy a descargar. Ya lo tendría por aquí. Y lo más sorprendente es que es un único archivo HTML, y vas a ver lo que ha conseguido hacer en este único formato. Vamos a darle un doble clic. Aquí se me acabaría de cargar. Y si le doy a entrar a la tienda, en teoría me debería hacer una pequeña intro. Vamos a verlo. Fíjate los efectos de sonido que se escuchan también. Vale, ahora tendría que darle un clic, así que le voy a dar un clic aquí. Y ya con el ratón pues tendría esta habitación en 3D. Aquí yo con la W podría andar hacia delante. Fíjate, de hecho, cómo puedo andar por aquí. Y con el Shift puedo correr también. Aquí me puedo encontrar el área de cocinas. Además, por este apartado aquí me puedo encontrar otras zonas adicionales.

Y sección en reordenamiento. Disculpen las molestias.

Fíjate que también tenemos hasta volumen. Me dice que la F sería para la linterna, cosa que me va a venir genial. Y en teoría debería de buscar por aquí un objeto para poder escapar, que creo que va a estar justamente por aquí arriba. Aquí me dice que con la E lo voy a poder coger.

Atención, pasillos en reordenamiento.

Y ya una vez tengo esto, vamos a buscar la salida. Vale, parece que está por aquí, así que me parece que me lo voy a pasar muy rápido, aunque Parece que esta no funciona. Aquí, de hecho, fíjate cómo tendríamos todas las cajas. También podría apagar la luz de la linterna. Y por aquí veo que hay otra especie de atajo. Vamos a intentar entrar, pero parece que realmente tendría que buscar otro objeto. Pero lo cierto es que es sorprendente, para no perdernos mucho en este juego, el cómo ha podido conseguir hacer todo esto al primer intento y está en un único archivo HTML. Lo cierto es que con todas estas plataformas podemos empezar a moldear lo que empieza siendo como una idea, ideas que ya no es solo que pensar, porque ahora las podrás visualizar.