Ciencia y Tecnología

Cómo crear una aplicación en Google AI Studio gratis y de forma sencilla

Published

on

<p>&NewLine; <img src&equals;"https&colon;&sol;&sol;i&period;blogs&period;es&sol;5a3563&sol;crear-web-app&sol;1024&lowbar;2000&period;jpeg" alt&equals;"Cómo crear una aplicación en Google AI Studio gratis y de forma sencilla ">&NewLine; <&sol;p>&NewLine;<p>Vamos a explicarte <strong>cómo crear una aplicación web sencilla<&sol;strong> con <a class&equals;"text-outboundlink" href&equals;"https&colon;&sol;&sol;www&period;xataka&period;com&sol;basics&sol;que-google-ai-studio-que-puedes-hacer-esta-herramienta-creacion-inteligencia-artificial" data-vars-post-title&equals;"Qué es Google AI Studio y qué puedes hacer con esta herramienta de creación con inteligencia artificial " data-vars-post-url&equals;"https&colon;&sol;&sol;www&period;xataka&period;com&sol;basics&sol;que-google-ai-studio-que-puedes-hacer-esta-herramienta-creacion-inteligencia-artificial">Google AI Studio<&sol;a>&period; Se trata de un programa con el que puedes crear aplicaciones&comma; webs&comma; u otros proyectos escribiendo el código con <a class&equals;"text-outboundlink" href&equals;"https&colon;&sol;&sol;www&period;xataka&period;com&sol;basics&sol;que-inteligencia-artificial-explicacion-sencilla-completa-para-todo-mundo" data-vars-post-title&equals;"Qué es la Inteligencia Artificial&colon; una explicación sencilla y completa para todo el mundo" data-vars-post-url&equals;"https&colon;&sol;&sol;www&period;xataka&period;com&sol;basics&sol;que-inteligencia-artificial-explicacion-sencilla-completa-para-todo-mundo">inteligencia artificial<&sol;a>&period; Vamos&comma; tú le dices lo que quieres y <a class&equals;"text-outboundlink" href&equals;"https&colon;&sol;&sol;www&period;xataka&period;com&sol;basics&sol;google-gemini-que-como-funciona-diferencias-gpt-cuando-podras-usar-este-modelo-inteligencia-artificial" data-vars-post-title&equals;"Google Gemini&colon; qué es&comma; cómo funciona&comma; diferencias con GPT y cuándo podrás usar este modelo de inteligencia artificial" data-vars-post-url&equals;"https&colon;&sol;&sol;www&period;xataka&period;com&sol;basics&sol;google-gemini-que-como-funciona-diferencias-gpt-cuando-podras-usar-este-modelo-inteligencia-artificial">Gemini<&sol;a> generará la aplicación web&comma; mostrándote también el código&period;<&sol;p>&NewLine;<p><&excl;-- BREAK 1 --><&sol;p>&NewLine;<p>Pero hay algunas cosas que necesitas tener en cuenta&comma; o sea que empezaremos diciéndote <strong>los riesgos que supone crear una webapp con IA<&sol;strong>&comma; sobre todo en cuanto a la privacidad si vas a publicarla&period; Luego&comma; te diremos paso a paso cómo proceder de una manera sencilla&period;<&sol;p>&NewLine;<h2>Antes de empezar&comma; peligros a tener en cuenta<&sol;h2>&NewLine;<div class&equals;"article-asset-video article-asset-large article-asset-center">&NewLine;<div class&equals;"asset-content">&NewLine;<div class&equals;"base-asset-video">&NewLine;<div class&equals;"js-dailymotion"><&sol;div>&NewLine;<&sol;p><&sol;div>&NewLine;<&sol;p><&sol;div>&NewLine;<&sol;div>&NewLine;<p>Antes de ponernos con esto&comma; debes tener en cuenta que <strong>puede no ser una buena idea<&sol;strong> crear una aplicación web utilizando inteligencia artificial&comma; sobre todo si tienes pensado publicarla&period; Todo depende de para qué vayas a utilizarla&period;<&sol;p>&NewLine;<p><&excl;-- BREAK 2 --><&sol;p>&NewLine;<p>Para empezar&comma; con Google AI Studio solo vas a construir un esqueleto de la página web o la aplicación web&comma; puro código HTML <strong>sin una base de datos segura y privada<&sol;strong> para cada usuario que accedes&period; <&sol;p>&NewLine;<p>Por eso&comma; sin un sistema de login&comma; <strong>corres el riesgo de que todos los datos queden expuestos<&sol;strong> en una especie de pizarra pública&period; Por ejemplo&comma; imagínate que creas una aplicación web de notas&comma; y que la publicas en Internet&period; Entonces&comma; <strong>todo lo que vayas escribiendo podrá ser leído por los demás<&sol;strong>&comma; e incluso otras personas podrán añadir elementos&period;<&sol;p>&NewLine;<p><&excl;-- BREAK 3 --><&sol;p>&NewLine;<p>Esto quiere decir que lo que te permite hacer Google AI Studio son <strong>esqueletos de aplicaciones web<&sol;strong>&comma; un código completo que luego tendrás que rellenar para añadir bases de datos y registros&period; <strong>Lo más recomendable es no publicarlas<&sol;strong> tal cual las genera esta herramienta&period;<&sol;p>&NewLine;<p>Existe la posibilidad de pedirle a la herramienta que genere una aplicación <strong>con memoria local<&sol;strong> que se guarde en tu navegador&period; Esto la hará privada al guardar los datos en el caché&comma; aunque todo lo que escribas se perderá si cambias de navegador o cuando se hagan limpiezas de caché&period;<&sol;p>&NewLine;<p><&excl;-- BREAK 4 --><&sol;p>&NewLine;<p>Y el otro gran problema que tiene crear una aplicación web con una herramienta de inteligencia artificial es que <strong>puede haber código erróneo que no funcione bien<&sol;strong>&comma; por lo que siempre es recomendable revisar el código con conocimiento y verificar que todo lo hace como debería&period;<&sol;p>&NewLine;<div class&equals;"article-asset article-asset-normal article-asset-center">&NewLine;<div class&equals;"desvio-container">&NewLine;<div class&equals;"desvio">&NewLine;<div class&equals;"desvio-figure js-desvio-figure">&NewLine; <a href&equals;"https&colon;&sol;&sol;www&period;xataka&period;com&sol;basics&sol;como-usar-google-ai-studio-para-crear-tu-propio-gemini-filtros-definiendo-su-censura" class&equals;"pivot-outboundlink" data-vars-post-title&equals;"Cómo usar Google AI Studio para crear tu propio Gemini sin filtros o definiendo su censura "><br &sol;>&NewLine; <img alt&equals;"Cómo usar Google AI Studio para crear tu propio Gemini sin filtros o definiendo su censura " width&equals;"375" height&equals;"142" src&equals;"https&colon;&sol;&sol;i&period;blogs&period;es&sol;f56c16&sol;filtros-gemini&sol;375&lowbar;142&period;jpeg"><br &sol;>&NewLine; <&sol;a>&NewLine; <&sol;div>&NewLine;<div class&equals;"desvio-summary">&NewLine;<div class&equals;"desvio-taxonomy js-desvio-taxonomy">&NewLine; <a href&equals;"https&colon;&sol;&sol;www&period;xataka&period;com&sol;basics&sol;como-usar-google-ai-studio-para-crear-tu-propio-gemini-filtros-definiendo-su-censura" class&equals;"desvio-taxonomy-anchor pivot-outboundlink" data-vars-post-title&equals;"Cómo usar Google AI Studio para crear tu propio Gemini sin filtros o definiendo su censura ">En Xataka<&sol;a>&NewLine; <&sol;div>&NewLine;<p> <a href&equals;"https&colon;&sol;&sol;www&period;xataka&period;com&sol;basics&sol;como-usar-google-ai-studio-para-crear-tu-propio-gemini-filtros-definiendo-su-censura" class&equals;"desvio-title js-desvio-title pivot-outboundlink" data-vars-post-title&equals;"Cómo usar Google AI Studio para crear tu propio Gemini sin filtros o definiendo su censura ">Cómo usar Google AI Studio para crear tu propio Gemini sin filtros o definiendo su censura <&sol;a>&NewLine; <&sol;div>&NewLine;<&sol;p><&sol;div>&NewLine;<&sol;p><&sol;div>&NewLine;<&sol;div>&NewLine;<h2>Usa una IA para diseñar el prompt<&sol;h2>&NewLine;<div class&equals;"article-asset-image article-asset-normal article-asset-center">&NewLine;<div class&equals;"asset-content">&NewLine;<p> <img alt&equals;"Prompt" class&equals;"centro&lowbar;sinmarco" src&equals;"https&colon;&sol;&sol;i&period;blogs&period;es&sol;fb8299&sol;captura-de-pantalla-2026-03-18-a-las-17&period;46&period;59&sol;450&lowbar;1000&period;png"><&sol;p><&sol;div>&NewLine;<&sol;div>&NewLine;<p>Google AI Studio funciona con inteligencia artificial&comma; lo que quiere decir que tú puedes describir lo que quieres con lenguaje natural&comma; y luego esto lo va a traducir en una aplicación&period; Por lo tanto&comma; solo vas a necesitar un prompt&period;<&sol;p>&NewLine;<p><&excl;-- BREAK 5 --><&sol;p>&NewLine;<p>Sin embargo&comma; <strong>va a ser más efectivo usar una IA para generar el prompt<&sol;strong>&period; Viene a ser como usar una IA como traductor para que la idea que tengas en la cabeza quede reflejada en un prompt mucho más completo y complejo que luego vas a poder repasar&period; <&sol;p>&NewLine;<p>Por ejemplo&comma; yo he utilizado Claude y le he explicado lo que quiero que tenga la aplicación y las ideas para el diseño&period; Al hacer la petición he especificado que lo que quiero es un prompt para hacer una aplicación web en Google AI Studio&period;<&sol;p>&NewLine;<p><&excl;-- BREAK 6 --><&sol;p>&NewLine;<div class&equals;"article-asset-image article-asset-normal article-asset-center">&NewLine;<div class&equals;"asset-content">&NewLine;<p> <img alt&equals;"Prompt" class&equals;"centro&lowbar;sinmarco" src&equals;"https&colon;&sol;&sol;i&period;blogs&period;es&sol;ef79b6&sol;captura-de-pantalla-2026-03-18-a-las-17&period;54&period;03&sol;450&lowbar;1000&period;png"><&sol;p><&sol;div>&NewLine;<&sol;div>&NewLine;<p>Como resultado&comma; Claude me ha creado <strong>un prompt de varios párrafos<&sol;strong> en inglés&comma; incluyendo también el código de colores que quiero que utilice&period; Además&comma; ha pensado en una interfaz para hacerla&comma; y ha diseñado el prompt explicándola para que Google AI Studio lo entienda&period;<&sol;p>&NewLine;<p><&excl;-- BREAK 7 --><&sol;p>&NewLine;<p><strong>Como pequeña nota<&sol;strong>&comma; recuerda que esta IA tiene los Artefactos de Claude&comma; que son como aplicaciones internas&period; Por lo tanto&comma; siempre vas a poder decirle algo como "crea un artefacto a partir de este prompt"&comma; con lo que vas a poder crear una app interna y verificar su estilo&period; Este no va a ser el mismo que te de Google AI Studio&comma; pero puedes usarlo como prueba&period;<&sol;p>&NewLine;<div class&equals;"article-asset article-asset-normal article-asset-center">&NewLine;<div class&equals;"desvio-container">&NewLine;<div class&equals;"desvio">&NewLine;<div class&equals;"desvio-figure js-desvio-figure">&NewLine; <a href&equals;"https&colon;&sol;&sol;www&period;xataka&period;com&sol;basics&sol;que-antigravity-como-funciona-que-puedes-hacer-ide-inteligencia-artificial-google" class&equals;"pivot-outboundlink" data-vars-post-title&equals;"Qué es Antigravity&comma; cómo funciona y qué puedes hacer con la IDE con inteligencia artificial de Google"><br &sol;>&NewLine; <img alt&equals;"Qué es Antigravity&comma; cómo funciona y qué puedes hacer con la IDE con inteligencia artificial de Google" width&equals;"375" height&equals;"142" src&equals;"https&colon;&sol;&sol;i&period;blogs&period;es&sol;06de89&sol;antigravity&sol;375&lowbar;142&period;jpeg"><br &sol;>&NewLine; <&sol;a>&NewLine; <&sol;div>&NewLine;<div class&equals;"desvio-summary">&NewLine;<div class&equals;"desvio-taxonomy js-desvio-taxonomy">&NewLine; <a href&equals;"https&colon;&sol;&sol;www&period;xataka&period;com&sol;basics&sol;que-antigravity-como-funciona-que-puedes-hacer-ide-inteligencia-artificial-google" class&equals;"desvio-taxonomy-anchor pivot-outboundlink" data-vars-post-title&equals;"Qué es Antigravity&comma; cómo funciona y qué puedes hacer con la IDE con inteligencia artificial de Google">En Xataka<&sol;a>&NewLine; <&sol;div>&NewLine;<p> <a href&equals;"https&colon;&sol;&sol;www&period;xataka&period;com&sol;basics&sol;que-antigravity-como-funciona-que-puedes-hacer-ide-inteligencia-artificial-google" class&equals;"desvio-title js-desvio-title pivot-outboundlink" data-vars-post-title&equals;"Qué es Antigravity&comma; cómo funciona y qué puedes hacer con la IDE con inteligencia artificial de Google">Qué es Antigravity&comma; cómo funciona y qué puedes hacer con la IDE con inteligencia artificial de Google<&sol;a>&NewLine; <&sol;div>&NewLine;<&sol;p><&sol;div>&NewLine;<&sol;p><&sol;div>&NewLine;<&sol;div>&NewLine;<h2>Empezamos a crear la aplicación<&sol;h2>&NewLine;<div class&equals;"article-asset-image article-asset-normal article-asset-center">&NewLine;<div class&equals;"asset-content">&NewLine;<p> <img alt&equals;"Google AI Studio" class&equals;"centro&lowbar;sinmarco" src&equals;"https&colon;&sol;&sol;i&period;blogs&period;es&sol;c07812&sol;captura-de-pantalla-2026-03-18-a-las-17&period;56&period;23&sol;450&lowbar;1000&period;png"><&sol;p><&sol;div>&NewLine;<&sol;div>&NewLine;<p>Para empezar a crear tu aplicación&comma; entra en Google AI Studio con la web <a rel&equals;"noopener&comma; noreferrer" href&equals;"https&colon;&sol;&sol;aistudio&period;google&period;com&sol;apps">aistudio&period;google&period;com<&sol;a>&period; Una vez dentro&comma; <strong>pulsa en la sección <&sol;strong><strong><em>Build<&sol;em><&sol;strong>&comma; que sirve para empezar a crear una aplicación&period;<&sol;p>&NewLine;<p><&excl;-- BREAK 8 --><&sol;p>&NewLine;<div class&equals;"article-asset-image article-asset-normal article-asset-center">&NewLine;<div class&equals;"asset-content">&NewLine;<p> <img alt&equals;"Build" class&equals;"centro&lowbar;sinmarco" src&equals;"https&colon;&sol;&sol;i&period;blogs&period;es&sol;f814f4&sol;captura-de-pantalla-2026-03-18-a-las-18&period;00&period;39&sol;450&lowbar;1000&period;png"><&sol;p><&sol;div>&NewLine;<&sol;div>&NewLine;<p>Ahora copia el prompt que hemos generado antes y pégalo en el campo de escritura&period; Te recomiendo que cuando lo hagas <strong>revises el prompt<&sol;strong> por si hay alguna cosa en él que quieras cambiar&period; Una vez lo tengas&comma; pulsa en el botón <em>Build<&sol;em> para comenzar el proceso&period;<&sol;p>&NewLine;<p><&excl;-- BREAK 9 --><&sol;p>&NewLine;<div class&equals;"article-asset-image article-asset-normal article-asset-center">&NewLine;<div class&equals;"asset-content">&NewLine;<p> <img alt&equals;"Aplicacion construida" class&equals;"centro&lowbar;sinmarco" src&equals;"https&colon;&sol;&sol;i&period;blogs&period;es&sol;66f677&sol;captura-de-pantalla-2026-03-25-a-las-18&period;28&period;32&sol;450&lowbar;1000&period;png"><&sol;p><&sol;div>&NewLine;<&sol;div>&NewLine;<p>Ahora&comma; Google AI Studio generará tu aplicación&period; Cuando lo haga verás que la pantalla está dividida en dos&period; En la izquierda tienes una parte que es como un chat con la IA de la herramienta&comma; y en la derecha la previsualización&period; Una vez termines&comma; podrás probar que todo funciona a tu gusto&comma; y <strong>usar el chat de la izquierda para pedir cambios<&sol;strong> y correcciones&period; <&sol;p>&NewLine;<p><&excl;-- BREAK 10 --><&sol;p>&NewLine;<p>Es muy importante que ahora te tomes tu tiempo en ir añadiendo y cambiando elementos en la aplicación&period; Ve haciéndolo poco a poco&comma; no tengas prisa y ve haciendo prompts cortos con cambios concretos para para ir avanzando progresivamente&period; Con cada prompt que escribas&comma; Google AI Studio rehará la aplicación&period;<&sol;p>&NewLine;<p>También puedes hacerle preguntas a la IA que ha generado la aplicación&comma; y basarte en las respuestas para pedir que haga cambios&period; Por ejemplo&comma; puedes pedirle que <strong>se asegure de que los datos se guarden en el localStorage<&sol;strong>&comma; en la memoria del ordenador&comma; para que no queden expuestos en la red&period;<&sol;p>&NewLine;<p><&excl;-- BREAK 11 --><&sol;p>&NewLine;<p>También puedes pedirle cosas más complejas&comma; como que te ayude a configurar un sistema para iniciar sesión con tu cuenta de Google y guardar tus datos en Google Drive&period; En este caso&comma; la IA que tienes en el lateral del proyecto te irá guiando paso a paso por lo que tienes que hacer y dándote las credenciales para hacerlo&period;<&sol;p>&NewLine;<div class&equals;"article-asset-image article-asset-normal article-asset-center">&NewLine;<div class&equals;"asset-content">&NewLine;<p> <img alt&equals;"Codigo" class&equals;"centro&lowbar;sinmarco" src&equals;"https&colon;&sol;&sol;i&period;blogs&period;es&sol;a5dc73&sol;captura-de-pantalla-2026-03-25-a-las-18&period;40&period;57&sol;450&lowbar;1000&period;png"><&sol;p><&sol;div>&NewLine;<&sol;div>&NewLine;<p>Por defecto la herramienta te mostrará una previsualización de lo que estás creando&period; Pero puedes <strong>pulsar en la pestaña <&sol;strong><strong><em>Code<&sol;em><&sol;strong> para previsualizar el código interno de la aplicación web&period; <strong>También tienes un botón de descarga<&sol;strong> para bajar el código y luego poder usarlo cuando quieras&period; Tu aplicación está completada&period;<&sol;p>&NewLine;<p><&excl;-- BREAK 12 --><&sol;p>&NewLine;<div class&equals;"article-asset article-asset-normal article-asset-center">&NewLine;<div class&equals;"desvio-container">&NewLine;<div class&equals;"desvio">&NewLine;<div class&equals;"desvio-figure js-desvio-figure">&NewLine; <a href&equals;"https&colon;&sol;&sol;www&period;xataka&period;com&sol;basics&sol;mejores-aplicaciones-para-tener-inteligencia-artificial-local-tu-movil-pc-necesitar-conexion-mayor-privacidad" class&equals;"pivot-outboundlink" data-vars-post-title&equals;"Las mejores aplicaciones para tener una inteligencia artificial local en tu móvil o PC&comma; sin necesitar conexión y con mayor privacidad "><br &sol;>&NewLine; <img alt&equals;"Las mejores aplicaciones para tener una inteligencia artificial local en tu móvil o PC&comma; sin necesitar conexión y con mayor privacidad " width&equals;"375" height&equals;"142" src&equals;"https&colon;&sol;&sol;i&period;blogs&period;es&sol;0577b8&sol;ai-movil&sol;375&lowbar;142&period;jpeg"><br &sol;>&NewLine; <&sol;a>&NewLine; <&sol;div>&NewLine;<div class&equals;"desvio-summary">&NewLine;<div class&equals;"desvio-taxonomy js-desvio-taxonomy">&NewLine; <a href&equals;"https&colon;&sol;&sol;www&period;xataka&period;com&sol;basics&sol;mejores-aplicaciones-para-tener-inteligencia-artificial-local-tu-movil-pc-necesitar-conexion-mayor-privacidad" class&equals;"desvio-taxonomy-anchor pivot-outboundlink" data-vars-post-title&equals;"Las mejores aplicaciones para tener una inteligencia artificial local en tu móvil o PC&comma; sin necesitar conexión y con mayor privacidad ">En Xataka<&sol;a>&NewLine; <&sol;div>&NewLine;<p> <a href&equals;"https&colon;&sol;&sol;www&period;xataka&period;com&sol;basics&sol;mejores-aplicaciones-para-tener-inteligencia-artificial-local-tu-movil-pc-necesitar-conexion-mayor-privacidad" class&equals;"desvio-title js-desvio-title pivot-outboundlink" data-vars-post-title&equals;"Las mejores aplicaciones para tener una inteligencia artificial local en tu móvil o PC&comma; sin necesitar conexión y con mayor privacidad ">Las mejores aplicaciones para tener una inteligencia artificial local en tu móvil o PC&comma; sin necesitar conexión y con mayor privacidad <&sol;a>&NewLine; <&sol;div>&NewLine;<&sol;p><&sol;div>&NewLine;<&sol;p><&sol;div>&NewLine;<&sol;div>&NewLine;<h2>Google AI Studio te permite publicar la aplicación web<&sol;h2>&NewLine;<div class&equals;"article-asset-image article-asset-normal article-asset-center">&NewLine;<div class&equals;"asset-content">&NewLine;<p> <img alt&equals;"Publish" class&equals;"centro&lowbar;sinmarco" src&equals;"https&colon;&sol;&sol;i&period;blogs&period;es&sol;01b111&sol;captura-de-pantalla-2026-03-25-a-las-18&period;44&period;16&sol;450&lowbar;1000&period;png"><&sol;p><&sol;div>&NewLine;<&sol;div>&NewLine;<p>Por último&comma; debes saber que Google AI Studio <strong>tiene una opción para publicar tu aplicación web<&sol;strong>&period; Para ello&comma; en la parte superior derecha del todo tienes que <strong>pulsa en el botón <&sol;strong><strong><em>Publish<&sol;em><&sol;strong>&period; Esto iniciará el proceso para publicarla de forma automática&period;<&sol;p>&NewLine;<p><&excl;-- BREAK 13 --><&sol;p>&NewLine;<div class&equals;"article-asset-image article-asset-normal article-asset-center">&NewLine;<div class&equals;"asset-content">&NewLine;<p> <img alt&equals;"Proyecto" class&equals;"centro&lowbar;sinmarco" src&equals;"https&colon;&sol;&sol;i&period;blogs&period;es&sol;14a947&sol;captura-de-pantalla-2026-03-25-a-las-18&period;50&period;17&sol;450&lowbar;1000&period;png"><&sol;p><&sol;div>&NewLine;<&sol;div>&NewLine;<p>En el siguiente paso&comma; tendrás que elegir un proyecto de Google Cloud para la aplicación&period; Puedes crear uno nuevo o añadirla a uno existente&period; <strong>También tendrás que configurar tus métodos de pago<&sol;strong> para Google Cloud&comma; porque la posibles llamadas a la API o tu espacio lo vas a pagar&period; Cuando lo tengas&comma; simplemente pulsa en <em>Publish app<&sol;em>&period;<&sol;p>&NewLine;<p><&excl;-- BREAK 14 --><&sol;p>&NewLine;<div class&equals;"article-asset-image article-asset-normal article-asset-center">&NewLine;<div class&equals;"asset-content">&NewLine;<p> <img alt&equals;"Publicada" class&equals;"centro&lowbar;sinmarco" src&equals;"https&colon;&sol;&sol;i&period;blogs&period;es&sol;bb21fd&sol;captura-de-pantalla-2026-03-25-a-las-18&period;55&period;14&sol;450&lowbar;1000&period;png"><&sol;p><&sol;div>&NewLine;<&sol;div>&NewLine;<p>Y ya está&period; Con esto ya tienes tu aplicación publicada&comma; y ya puedes empezar a utilizarla&period; Google AI Studio te generará una URL para acceder a ella&comma; larga y única&comma; y ahora ya depende de ti comprar un dominio y linkarlo a esta dirección en el caso de que quieras&period;<&sol;p>&NewLine;<p><&excl;-- BREAK 15 --><&sol;p>&NewLine;<p>En Xataka Basics &vert; <a class&equals;"text-outboundlink" href&equals;"https&colon;&sol;&sol;www&period;xataka&period;com&sol;basics&sol;como-crear-juego-preguntas-tipo-test-cualquier-pdf-para-estudiar-ayuda-inteligencia-artificial" data-vars-post-title&equals;"Cómo crear un juego con preguntas tipo test sobre cualquier PDF para estudiar con ayuda de la inteligencia artificial " data-vars-post-url&equals;"https&colon;&sol;&sol;www&period;xataka&period;com&sol;basics&sol;como-crear-juego-preguntas-tipo-test-cualquier-pdf-para-estudiar-ayuda-inteligencia-artificial" target&equals;"&lowbar;blank">Cómo crear un juego con preguntas tipo test sobre cualquier PDF para estudiar con ayuda de la inteligencia artificial<&sol;a><&sol;p>&NewLine;<p> &&num;8211&semi; <br &sol;> La noticia<br &sol;>&NewLine; <a href&equals;"https&colon;&sol;&sol;www&period;xataka&period;com&sol;basics&sol;como-crear-aplicacion-google-ai-studio-gratis-forma-sencilla&quest;utm&lowbar;source&equals;feedburner&amp&semi;utm&lowbar;medium&equals;feed&amp&semi;utm&lowbar;campaign&equals;29&lowbar;Mar&lowbar;2026"><br &sol;>&NewLine; <em> Cómo crear una aplicación en Google AI Studio gratis y de forma sencilla <&sol;em><br &sol;>&NewLine; <&sol;a><br &sol;>&NewLine; fue publicada originalmente en<br &sol;>&NewLine; <a href&equals;"https&colon;&sol;&sol;www&period;xataka&period;com&sol;&quest;utm&lowbar;source&equals;feedburner&amp&semi;utm&lowbar;medium&equals;feed&amp&semi;utm&lowbar;campaign&equals;29&lowbar;Mar&lowbar;2026"><br &sol;>&NewLine; <strong> Xataka <&sol;strong><br &sol;>&NewLine; <&sol;a><br &sol;>&NewLine; por <a href&equals;"https&colon;&sol;&sol;www&period;xataka&period;com&sol;autor&sol;yubal&quest;utm&lowbar;source&equals;feedburner&amp&semi;utm&lowbar;medium&equals;feed&amp&semi;utm&lowbar;campaign&equals;29&lowbar;Mar&lowbar;2026"><br &sol;>&NewLine; Yúbal Fernández<br &sol;>&NewLine; <&sol;a><br &sol;>&NewLine; &period; <&sol;p>&NewLine;<p> Vamos a explicarte cómo crear una aplicación web sencilla con Google AI Studio&period; Se trata de un programa con el que puedes crear aplicaciones&comma; webs&comma; u otros proyectos escribiendo el código con inteligencia artificial&period; Vamos&comma; tú le dices lo que quieres y Gemini generará la aplicación web&comma; mostrándote también el código&period;<br &sol;>&NewLine;Pero hay algunas cosas que necesitas tener en cuenta&comma; o sea que empezaremos diciéndote los riesgos que supone crear una webapp con IA&comma; sobre todo en cuanto a la privacidad si vas a publicarla&period; Luego&comma; te diremos paso a paso cómo proceder de una manera sencilla&period;<br &sol;>&NewLine;Antes de empezar&comma; peligros a tener en cuenta<&sol;p>&NewLine;<p>Antes de ponernos con esto&comma; debes tener en cuenta que puede no ser una buena idea crear una aplicación web utilizando inteligencia artificial&comma; sobre todo si tienes pensado publicarla&period; Todo depende de para qué vayas a utilizarla&period;<br &sol;>&NewLine;Para empezar&comma; con Google AI Studio solo vas a construir un esqueleto de la página web o la aplicación web&comma; puro código HTML sin una base de datos segura y privada para cada usuario que accedes&period; <br &sol;>&NewLine;Por eso&comma; sin un sistema de login&comma; corres el riesgo de que todos los datos queden expuestos en una especie de pizarra pública&period; Por ejemplo&comma; imagínate que creas una aplicación web de notas&comma; y que la publicas en Internet&period; Entonces&comma; todo lo que vayas escribiendo podrá ser leído por los demás&comma; e incluso otras personas podrán añadir elementos&period;<br &sol;>&NewLine;Esto quiere decir que lo que te permite hacer Google AI Studio son esqueletos de aplicaciones web&comma; un código completo que luego tendrás que rellenar para añadir bases de datos y registros&period; Lo más recomendable es no publicarlas tal cual las genera esta herramienta&period;<br &sol;>&NewLine;Existe la posibilidad de pedirle a la herramienta que genere una aplicación con memoria local que se guarde en tu navegador&period; Esto la hará privada al guardar los datos en el caché&comma; aunque todo lo que escribas se perderá si cambias de navegador o cuando se hagan limpiezas de caché&period;<br &sol;>&NewLine;Y el otro gran problema que tiene crear una aplicación web con una herramienta de inteligencia artificial es que puede haber código erróneo que no funcione bien&comma; por lo que siempre es recomendable revisar el código con conocimiento y verificar que todo lo hace como debería&period;<&sol;p>&NewLine;<p> En Xataka<&sol;p>&NewLine;<p> Cómo usar Google AI Studio para crear tu propio Gemini sin filtros o definiendo su censura <&sol;p>&NewLine;<p>Usa una IA para diseñar el prompt<&sol;p>&NewLine;<p>Google AI Studio funciona con inteligencia artificial&comma; lo que quiere decir que tú puedes describir lo que quieres con lenguaje natural&comma; y luego esto lo va a traducir en una aplicación&period; Por lo tanto&comma; solo vas a necesitar un prompt&period;<br &sol;>&NewLine;Sin embargo&comma; va a ser más efectivo usar una IA para generar el prompt&period; Viene a ser como usar una IA como traductor para que la idea que tengas en la cabeza quede reflejada en un prompt mucho más completo y complejo que luego vas a poder repasar&period; <br &sol;>&NewLine;Por ejemplo&comma; yo he utilizado Claude y le he explicado lo que quiero que tenga la aplicación y las ideas para el diseño&period; Al hacer la petición he especificado que lo que quiero es un prompt para hacer una aplicación web en Google AI Studio&period;<&sol;p>&NewLine;<p>Como resultado&comma; Claude me ha creado un prompt de varios párrafos en inglés&comma; incluyendo también el código de colores que quiero que utilice&period; Además&comma; ha pensado en una interfaz para hacerla&comma; y ha diseñado el prompt explicándola para que Google AI Studio lo entienda&period;<br &sol;>&NewLine;Como pequeña nota&comma; recuerda que esta IA tiene los Artefactos de Claude&comma; que son como aplicaciones internas&period; Por lo tanto&comma; siempre vas a poder decirle algo como "crea un artefacto a partir de este prompt"&comma; con lo que vas a poder crear una app interna y verificar su estilo&period; Este no va a ser el mismo que te de Google AI Studio&comma; pero puedes usarlo como prueba&period;<&sol;p>&NewLine;<p> En Xataka<&sol;p>&NewLine;<p> Qué es Antigravity&comma; cómo funciona y qué puedes hacer con la IDE con inteligencia artificial de Google<&sol;p>&NewLine;<p>Empezamos a crear la aplicación<&sol;p>&NewLine;<p>Para empezar a crear tu aplicación&comma; entra en Google AI Studio con la web aistudio&period;google&period;com&period; Una vez dentro&comma; pulsa en la sección Build&comma; que sirve para empezar a crear una aplicación&period;<&sol;p>&NewLine;<p>Ahora copia el prompt que hemos generado antes y pégalo en el campo de escritura&period; Te recomiendo que cuando lo hagas revises el prompt por si hay alguna cosa en él que quieras cambiar&period; Una vez lo tengas&comma; pulsa en el botón Build para comenzar el proceso&period;<&sol;p>&NewLine;<p>Ahora&comma; Google AI Studio generará tu aplicación&period; Cuando lo haga verás que la pantalla está dividida en dos&period; En la izquierda tienes una parte que es como un chat con la IA de la herramienta&comma; y en la derecha la previsualización&period; Una vez termines&comma; podrás probar que todo funciona a tu gusto&comma; y usar el chat de la izquierda para pedir cambios y correcciones&period; <br &sol;>&NewLine;Es muy importante que ahora te tomes tu tiempo en ir añadiendo y cambiando elementos en la aplicación&period; Ve haciéndolo poco a poco&comma; no tengas prisa y ve haciendo prompts cortos con cambios concretos para para ir avanzando progresivamente&period; Con cada prompt que escribas&comma; Google AI Studio rehará la aplicación&period;<br &sol;>&NewLine;También puedes hacerle preguntas a la IA que ha generado la aplicación&comma; y basarte en las respuestas para pedir que haga cambios&period; Por ejemplo&comma; puedes pedirle que se asegure de que los datos se guarden en el localStorage&comma; en la memoria del ordenador&comma; para que no queden expuestos en la red&period;<br &sol;>&NewLine;También puedes pedirle cosas más complejas&comma; como que te ayude a configurar un sistema para iniciar sesión con tu cuenta de Google y guardar tus datos en Google Drive&period; En este caso&comma; la IA que tienes en el lateral del proyecto te irá guiando paso a paso por lo que tienes que hacer y dándote las credenciales para hacerlo&period;<&sol;p>&NewLine;<p>Por defecto la herramienta te mostrará una previsualización de lo que estás creando&period; Pero puedes pulsar en la pestaña Code para previsualizar el código interno de la aplicación web&period; También tienes un botón de descarga para bajar el código y luego poder usarlo cuando quieras&period; Tu aplicación está completada&period;<&sol;p>&NewLine;<p> En Xataka<&sol;p>&NewLine;<p> Las mejores aplicaciones para tener una inteligencia artificial local en tu móvil o PC&comma; sin necesitar conexión y con mayor privacidad <&sol;p>&NewLine;<p>Google AI Studio te permite publicar la aplicación web<&sol;p>&NewLine;<p>Por último&comma; debes saber que Google AI Studio tiene una opción para publicar tu aplicación web&period; Para ello&comma; en la parte superior derecha del todo tienes que pulsa en el botón Publish&period; Esto iniciará el proceso para publicarla de forma automática&period;<&sol;p>&NewLine;<p>En el siguiente paso&comma; tendrás que elegir un proyecto de Google Cloud para la aplicación&period; Puedes crear uno nuevo o añadirla a uno existente&period; También tendrás que configurar tus métodos de pago para Google Cloud&comma; porque la posibles llamadas a la API o tu espacio lo vas a pagar&period; Cuando lo tengas&comma; simplemente pulsa en Publish app&period;<&sol;p>&NewLine;<p>Y ya está&period; Con esto ya tienes tu aplicación publicada&comma; y ya puedes empezar a utilizarla&period; Google AI Studio te generará una URL para acceder a ella&comma; larga y única&comma; y ahora ya depende de ti comprar un dominio y linkarlo a esta dirección en el caso de que quieras&period;<&sol;p>&NewLine;<p>En Xataka Basics &vert; Cómo crear un juego con preguntas tipo test sobre cualquier PDF para estudiar con ayuda de la inteligencia artificial<&sol;p>&NewLine;<p> &&num;8211&semi; La noticia<&sol;p>&NewLine;<p> Cómo crear una aplicación en Google AI Studio gratis y de forma sencilla <&sol;p>&NewLine;<p> fue publicada originalmente en<&sol;p>&NewLine;<p> Xataka <&sol;p>&NewLine;<p> por<br &sol;>&NewLine; Yúbal Fernández<&sol;p>&NewLine;<p> &period;   <&sol;p>&NewLine;

Leave a Reply

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Trending

Copyright 2025 ERM Digital. Todos los derechos reservados.