{"id":8425,"date":"2026-03-29T08:01:32","date_gmt":"2026-03-29T12:01:32","guid":{"rendered":"https:\/\/ermdigital.com\/index.php\/2026\/03\/29\/como-crear-una-aplicacion-en-google-ai-studio-gratis-y-de-forma-sencilla\/"},"modified":"2026-03-29T08:01:32","modified_gmt":"2026-03-29T12:01:32","slug":"como-crear-una-aplicacion-en-google-ai-studio-gratis-y-de-forma-sencilla","status":"publish","type":"post","link":"https:\/\/ermdigital.com\/?p=8425","title":{"rendered":"C\u00f3mo crear una aplicaci\u00f3n en Google AI Studio gratis y de forma sencilla"},"content":{"rendered":"<p>\n      <img decoding=\"async\" src=\"https:\/\/i.blogs.es\/5a3563\/crear-web-app\/1024_2000.jpeg\" alt=\"C\u00f3mo crear una aplicaci\u00f3n en Google AI Studio gratis y de forma sencilla \">\n    <\/p>\n<p>Vamos a explicarte <strong>c\u00f3mo crear una aplicaci\u00f3n web sencilla<\/strong> con <a class=\"text-outboundlink\" href=\"https:\/\/www.xataka.com\/basics\/que-google-ai-studio-que-puedes-hacer-esta-herramienta-creacion-inteligencia-artificial\" data-vars-post-title=\"Qu\u00e9 es Google AI Studio y qu\u00e9 puedes hacer con esta herramienta de creaci\u00f3n con inteligencia artificial \" data-vars-post-url=\"https:\/\/www.xataka.com\/basics\/que-google-ai-studio-que-puedes-hacer-esta-herramienta-creacion-inteligencia-artificial\">Google AI Studio<\/a>. Se trata de un programa con el que puedes crear aplicaciones, webs, u otros proyectos escribiendo el c\u00f3digo con <a class=\"text-outboundlink\" href=\"https:\/\/www.xataka.com\/basics\/que-inteligencia-artificial-explicacion-sencilla-completa-para-todo-mundo\" data-vars-post-title=\"Qu\u00e9 es la Inteligencia Artificial: una explicaci\u00f3n sencilla y completa para todo el mundo\" data-vars-post-url=\"https:\/\/www.xataka.com\/basics\/que-inteligencia-artificial-explicacion-sencilla-completa-para-todo-mundo\">inteligencia artificial<\/a>. Vamos, t\u00fa le dices lo que quieres y <a class=\"text-outboundlink\" href=\"https:\/\/www.xataka.com\/basics\/google-gemini-que-como-funciona-diferencias-gpt-cuando-podras-usar-este-modelo-inteligencia-artificial\" data-vars-post-title=\"Google Gemini: qu\u00e9 es, c\u00f3mo funciona, diferencias con GPT y cu\u00e1ndo podr\u00e1s usar este modelo de inteligencia artificial\" data-vars-post-url=\"https:\/\/www.xataka.com\/basics\/google-gemini-que-como-funciona-diferencias-gpt-cuando-podras-usar-este-modelo-inteligencia-artificial\">Gemini<\/a> generar\u00e1 la aplicaci\u00f3n web, mostr\u00e1ndote tambi\u00e9n el c\u00f3digo.<\/p>\n<p><!-- BREAK 1 --><\/p>\n<p>Pero hay algunas cosas que necesitas tener en cuenta, o sea que empezaremos dici\u00e9ndote <strong>los riesgos que supone crear una webapp con IA<\/strong>, sobre todo en cuanto a la privacidad si vas a publicarla. Luego, te diremos paso a paso c\u00f3mo proceder de una manera sencilla.<\/p>\n<h2>Antes de empezar, peligros a tener en cuenta<\/h2>\n<div class=\"article-asset-video article-asset-large article-asset-center\">\n<div class=\"asset-content\">\n<div class=\"base-asset-video\">\n<div class=\"js-dailymotion\"><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/div>\n<p>Antes de ponernos con esto, debes tener en cuenta que <strong>puede no ser una buena idea<\/strong> crear una aplicaci\u00f3n web utilizando inteligencia artificial, sobre todo si tienes pensado publicarla. Todo depende de para qu\u00e9 vayas a utilizarla.<\/p>\n<p><!-- BREAK 2 --><\/p>\n<p>Para empezar, con Google AI Studio solo vas a construir un esqueleto de la p\u00e1gina web o la aplicaci\u00f3n web, puro c\u00f3digo HTML <strong>sin una base de datos segura y privada<\/strong> para cada usuario que accedes.\u00a0<\/p>\n<p>Por eso, sin un sistema de login, <strong>corres el riesgo de que todos los datos queden expuestos<\/strong> en una especie de pizarra p\u00fablica. Por ejemplo, imag\u00ednate que creas una aplicaci\u00f3n web de notas, y que la publicas en Internet. Entonces, <strong>todo lo que vayas escribiendo podr\u00e1 ser le\u00eddo por los dem\u00e1s<\/strong>, e incluso otras personas podr\u00e1n a\u00f1adir elementos.<\/p>\n<p><!-- BREAK 3 --><\/p>\n<p>Esto quiere decir que lo que te permite hacer Google AI Studio son <strong>esqueletos de aplicaciones web<\/strong>, un c\u00f3digo completo que luego tendr\u00e1s que rellenar para a\u00f1adir bases de datos y registros. <strong>Lo m\u00e1s recomendable es no publicarlas<\/strong> tal cual las genera esta herramienta.<\/p>\n<p>Existe la posibilidad de pedirle a la herramienta que genere una aplicaci\u00f3n <strong>con memoria local<\/strong> que se guarde en tu navegador. Esto la har\u00e1 privada al guardar los datos en el cach\u00e9, aunque todo lo que escribas se perder\u00e1 si cambias de navegador o cuando se hagan limpiezas de cach\u00e9.<\/p>\n<p><!-- BREAK 4 --><\/p>\n<p>Y el otro gran problema que tiene crear una aplicaci\u00f3n web con una herramienta de inteligencia artificial es que <strong>puede haber c\u00f3digo err\u00f3neo que no funcione bien<\/strong>, por lo que siempre es recomendable revisar el c\u00f3digo con conocimiento y verificar que todo lo hace como deber\u00eda.<\/p>\n<div class=\"article-asset article-asset-normal article-asset-center\">\n<div class=\"desvio-container\">\n<div class=\"desvio\">\n<div class=\"desvio-figure js-desvio-figure\">\n    <a href=\"https:\/\/www.xataka.com\/basics\/como-usar-google-ai-studio-para-crear-tu-propio-gemini-filtros-definiendo-su-censura\" class=\"pivot-outboundlink\" data-vars-post-title=\"C\u00f3mo usar Google AI Studio para crear tu propio Gemini sin filtros o definiendo su censura \"><br \/>\n     <img loading=\"lazy\" decoding=\"async\" alt=\"C\u00f3mo usar Google AI Studio para crear tu propio Gemini sin filtros o definiendo su censura \" width=\"375\" height=\"142\" src=\"https:\/\/i.blogs.es\/f56c16\/filtros-gemini\/375_142.jpeg\"><br \/>\n    <\/a>\n   <\/div>\n<div class=\"desvio-summary\">\n<div class=\"desvio-taxonomy js-desvio-taxonomy\">\n     <a href=\"https:\/\/www.xataka.com\/basics\/como-usar-google-ai-studio-para-crear-tu-propio-gemini-filtros-definiendo-su-censura\" class=\"desvio-taxonomy-anchor pivot-outboundlink\" data-vars-post-title=\"C\u00f3mo usar Google AI Studio para crear tu propio Gemini sin filtros o definiendo su censura \">En Xataka<\/a>\n    <\/div>\n<p>    <a href=\"https:\/\/www.xataka.com\/basics\/como-usar-google-ai-studio-para-crear-tu-propio-gemini-filtros-definiendo-su-censura\" class=\"desvio-title js-desvio-title pivot-outboundlink\" data-vars-post-title=\"C\u00f3mo usar Google AI Studio para crear tu propio Gemini sin filtros o definiendo su censura \">C\u00f3mo usar Google AI Studio para crear tu propio Gemini sin filtros o definiendo su censura <\/a>\n   <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/div>\n<h2>Usa una IA para dise\u00f1ar el prompt<\/h2>\n<div class=\"article-asset-image article-asset-normal article-asset-center\">\n<div class=\"asset-content\">\n<p>   <img decoding=\"async\" alt=\"Prompt\" class=\"centro_sinmarco\" src=\"https:\/\/i.blogs.es\/fb8299\/captura-de-pantalla-2026-03-18-a-las-17.46.59\/450_1000.png\"><\/p><\/div>\n<\/div>\n<p>Google AI Studio funciona con inteligencia artificial, lo que quiere decir que t\u00fa puedes describir lo que quieres con lenguaje natural, y luego esto lo va a traducir en una aplicaci\u00f3n. Por lo tanto, solo vas a necesitar un prompt.<\/p>\n<p><!-- BREAK 5 --><\/p>\n<p>Sin embargo, <strong>va a ser m\u00e1s efectivo usar una IA para generar el prompt<\/strong>. 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\u00e1s completo y complejo que luego vas a poder repasar.\u00a0<\/p>\n<p>Por ejemplo, yo he utilizado Claude y le he explicado lo que quiero que tenga la aplicaci\u00f3n y las ideas para el dise\u00f1o.\u00a0Al hacer la petici\u00f3n he especificado que lo que quiero es un prompt para hacer una aplicaci\u00f3n web en Google AI Studio.<\/p>\n<p><!-- BREAK 6 --><\/p>\n<div class=\"article-asset-image article-asset-normal article-asset-center\">\n<div class=\"asset-content\">\n<p>   <img decoding=\"async\" alt=\"Prompt\" class=\"centro_sinmarco\" src=\"https:\/\/i.blogs.es\/ef79b6\/captura-de-pantalla-2026-03-18-a-las-17.54.03\/450_1000.png\"><\/p><\/div>\n<\/div>\n<p>Como resultado, Claude me ha creado <strong>un prompt de varios p\u00e1rrafos<\/strong> en ingl\u00e9s, incluyendo tambi\u00e9n el c\u00f3digo de colores que quiero que utilice. Adem\u00e1s, ha pensado en una interfaz para hacerla, y ha dise\u00f1ado el prompt explic\u00e1ndola para que Google AI Studio lo entienda.<\/p>\n<p><!-- BREAK 7 --><\/p>\n<p><strong>Como peque\u00f1a nota<\/strong>, recuerda que esta IA tiene los Artefactos de Claude, que son como aplicaciones internas. Por lo tanto, siempre vas a poder decirle algo como \"crea un artefacto a partir de este prompt\", con lo que vas a poder crear una app interna y verificar su estilo. Este no va a ser el mismo que te de Google AI Studio, pero puedes usarlo como prueba.<\/p>\n<div class=\"article-asset article-asset-normal article-asset-center\">\n<div class=\"desvio-container\">\n<div class=\"desvio\">\n<div class=\"desvio-figure js-desvio-figure\">\n    <a href=\"https:\/\/www.xataka.com\/basics\/que-antigravity-como-funciona-que-puedes-hacer-ide-inteligencia-artificial-google\" class=\"pivot-outboundlink\" data-vars-post-title=\"Qu\u00e9 es Antigravity, c\u00f3mo funciona y qu\u00e9 puedes hacer con la IDE con inteligencia artificial de Google\"><br \/>\n     <img loading=\"lazy\" decoding=\"async\" alt=\"Qu\u00e9 es Antigravity, c\u00f3mo funciona y qu\u00e9 puedes hacer con la IDE con inteligencia artificial de Google\" width=\"375\" height=\"142\" src=\"https:\/\/i.blogs.es\/06de89\/antigravity\/375_142.jpeg\"><br \/>\n    <\/a>\n   <\/div>\n<div class=\"desvio-summary\">\n<div class=\"desvio-taxonomy js-desvio-taxonomy\">\n     <a href=\"https:\/\/www.xataka.com\/basics\/que-antigravity-como-funciona-que-puedes-hacer-ide-inteligencia-artificial-google\" class=\"desvio-taxonomy-anchor pivot-outboundlink\" data-vars-post-title=\"Qu\u00e9 es Antigravity, c\u00f3mo funciona y qu\u00e9 puedes hacer con la IDE con inteligencia artificial de Google\">En Xataka<\/a>\n    <\/div>\n<p>    <a href=\"https:\/\/www.xataka.com\/basics\/que-antigravity-como-funciona-que-puedes-hacer-ide-inteligencia-artificial-google\" class=\"desvio-title js-desvio-title pivot-outboundlink\" data-vars-post-title=\"Qu\u00e9 es Antigravity, c\u00f3mo funciona y qu\u00e9 puedes hacer con la IDE con inteligencia artificial de Google\">Qu\u00e9 es Antigravity, c\u00f3mo funciona y qu\u00e9 puedes hacer con la IDE con inteligencia artificial de Google<\/a>\n   <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/div>\n<h2>Empezamos a crear la aplicaci\u00f3n<\/h2>\n<div class=\"article-asset-image article-asset-normal article-asset-center\">\n<div class=\"asset-content\">\n<p>   <img decoding=\"async\" alt=\"Google AI Studio\" class=\"centro_sinmarco\" src=\"https:\/\/i.blogs.es\/c07812\/captura-de-pantalla-2026-03-18-a-las-17.56.23\/450_1000.png\"><\/p><\/div>\n<\/div>\n<p>Para empezar a crear tu aplicaci\u00f3n, entra en Google AI Studio con la web <a rel=\"noopener, noreferrer\" href=\"https:\/\/aistudio.google.com\/apps\">aistudio.google.com<\/a>. Una vez dentro, <strong>pulsa en la secci\u00f3n <\/strong><strong><em>Build<\/em><\/strong>, que sirve para empezar a crear una aplicaci\u00f3n.<\/p>\n<p><!-- BREAK 8 --><\/p>\n<div class=\"article-asset-image article-asset-normal article-asset-center\">\n<div class=\"asset-content\">\n<p>   <img decoding=\"async\" alt=\"Build\" class=\"centro_sinmarco\" src=\"https:\/\/i.blogs.es\/f814f4\/captura-de-pantalla-2026-03-18-a-las-18.00.39\/450_1000.png\"><\/p><\/div>\n<\/div>\n<p>Ahora copia el prompt que hemos generado antes y p\u00e9galo en el campo de escritura. Te recomiendo que cuando lo hagas <strong>revises el prompt<\/strong> por si hay alguna cosa en \u00e9l que quieras cambiar. Una vez lo tengas, pulsa en el bot\u00f3n <em>Build<\/em> para comenzar el proceso.<\/p>\n<p><!-- BREAK 9 --><\/p>\n<div class=\"article-asset-image article-asset-normal article-asset-center\">\n<div class=\"asset-content\">\n<p>   <img decoding=\"async\" alt=\"Aplicacion construida\" class=\"centro_sinmarco\" src=\"https:\/\/i.blogs.es\/66f677\/captura-de-pantalla-2026-03-25-a-las-18.28.32\/450_1000.png\"><\/p><\/div>\n<\/div>\n<p>Ahora, Google AI Studio generar\u00e1 tu aplicaci\u00f3n. Cuando lo haga ver\u00e1s que la pantalla est\u00e1 dividida en dos. En la izquierda tienes una parte que es como un chat con la IA de la herramienta, y en la derecha la previsualizaci\u00f3n. Una vez termines, podr\u00e1s probar que todo funciona a tu gusto, y <strong>usar el chat de la izquierda para pedir cambios<\/strong> y correcciones.\u00a0<\/p>\n<p><!-- BREAK 10 --><\/p>\n<p>Es muy importante que ahora te tomes tu tiempo en ir a\u00f1adiendo y cambiando elementos en la aplicaci\u00f3n. Ve haci\u00e9ndolo poco a poco, no tengas prisa y ve haciendo prompts cortos con cambios concretos para para ir avanzando progresivamente. Con cada prompt que escribas, Google AI Studio rehar\u00e1 la aplicaci\u00f3n.<\/p>\n<p>Tambi\u00e9n puedes hacerle preguntas a la IA que ha generado la aplicaci\u00f3n, y basarte en las respuestas para pedir que haga cambios. Por ejemplo, puedes pedirle que <strong>se asegure de que los datos se guarden en el localStorage<\/strong>, en la memoria del ordenador, para que no queden expuestos en la red.<\/p>\n<p><!-- BREAK 11 --><\/p>\n<p>Tambi\u00e9n puedes pedirle cosas m\u00e1s complejas, como que te ayude a configurar un sistema para iniciar sesi\u00f3n con tu cuenta de Google y guardar tus datos en Google Drive. En este caso, la IA que tienes en el lateral del proyecto te ir\u00e1 guiando paso a paso por lo que tienes que hacer y d\u00e1ndote las credenciales para hacerlo.<\/p>\n<div class=\"article-asset-image article-asset-normal article-asset-center\">\n<div class=\"asset-content\">\n<p>   <img decoding=\"async\" alt=\"Codigo\" class=\"centro_sinmarco\" src=\"https:\/\/i.blogs.es\/a5dc73\/captura-de-pantalla-2026-03-25-a-las-18.40.57\/450_1000.png\"><\/p><\/div>\n<\/div>\n<p>Por defecto la herramienta te mostrar\u00e1 una previsualizaci\u00f3n de lo que est\u00e1s creando. Pero puedes <strong>pulsar en la pesta\u00f1a <\/strong><strong><em>Code<\/em><\/strong> para previsualizar el c\u00f3digo interno de la aplicaci\u00f3n web. <strong>Tambi\u00e9n tienes un bot\u00f3n de descarga<\/strong> para bajar el c\u00f3digo y luego poder usarlo cuando quieras. Tu aplicaci\u00f3n est\u00e1 completada.<\/p>\n<p><!-- BREAK 12 --><\/p>\n<div class=\"article-asset article-asset-normal article-asset-center\">\n<div class=\"desvio-container\">\n<div class=\"desvio\">\n<div class=\"desvio-figure js-desvio-figure\">\n    <a href=\"https:\/\/www.xataka.com\/basics\/mejores-aplicaciones-para-tener-inteligencia-artificial-local-tu-movil-pc-necesitar-conexion-mayor-privacidad\" class=\"pivot-outboundlink\" data-vars-post-title=\"Las mejores aplicaciones para tener una inteligencia artificial local en tu m\u00f3vil o PC, sin necesitar conexi\u00f3n y con mayor privacidad \"><br \/>\n     <img loading=\"lazy\" decoding=\"async\" alt=\"Las mejores aplicaciones para tener una inteligencia artificial local en tu m\u00f3vil o PC, sin necesitar conexi\u00f3n y con mayor privacidad \" width=\"375\" height=\"142\" src=\"https:\/\/i.blogs.es\/0577b8\/ai-movil\/375_142.jpeg\"><br \/>\n    <\/a>\n   <\/div>\n<div class=\"desvio-summary\">\n<div class=\"desvio-taxonomy js-desvio-taxonomy\">\n     <a href=\"https:\/\/www.xataka.com\/basics\/mejores-aplicaciones-para-tener-inteligencia-artificial-local-tu-movil-pc-necesitar-conexion-mayor-privacidad\" class=\"desvio-taxonomy-anchor pivot-outboundlink\" data-vars-post-title=\"Las mejores aplicaciones para tener una inteligencia artificial local en tu m\u00f3vil o PC, sin necesitar conexi\u00f3n y con mayor privacidad \">En Xataka<\/a>\n    <\/div>\n<p>    <a href=\"https:\/\/www.xataka.com\/basics\/mejores-aplicaciones-para-tener-inteligencia-artificial-local-tu-movil-pc-necesitar-conexion-mayor-privacidad\" class=\"desvio-title js-desvio-title pivot-outboundlink\" data-vars-post-title=\"Las mejores aplicaciones para tener una inteligencia artificial local en tu m\u00f3vil o PC, sin necesitar conexi\u00f3n y con mayor privacidad \">Las mejores aplicaciones para tener una inteligencia artificial local en tu m\u00f3vil o PC, sin necesitar conexi\u00f3n y con mayor privacidad <\/a>\n   <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/div>\n<h2>Google AI Studio te permite publicar la aplicaci\u00f3n web<\/h2>\n<div class=\"article-asset-image article-asset-normal article-asset-center\">\n<div class=\"asset-content\">\n<p>   <img decoding=\"async\" alt=\"Publish\" class=\"centro_sinmarco\" src=\"https:\/\/i.blogs.es\/01b111\/captura-de-pantalla-2026-03-25-a-las-18.44.16\/450_1000.png\"><\/p><\/div>\n<\/div>\n<p>Por \u00faltimo, debes saber que Google AI Studio <strong>tiene una opci\u00f3n para publicar tu aplicaci\u00f3n web<\/strong>. Para ello, en la parte superior derecha del todo tienes que <strong>pulsa en el bot\u00f3n <\/strong><strong><em>Publish<\/em><\/strong>. Esto iniciar\u00e1 el proceso para publicarla de forma autom\u00e1tica.<\/p>\n<p><!-- BREAK 13 --><\/p>\n<div class=\"article-asset-image article-asset-normal article-asset-center\">\n<div class=\"asset-content\">\n<p>   <img decoding=\"async\" alt=\"Proyecto\" class=\"centro_sinmarco\" src=\"https:\/\/i.blogs.es\/14a947\/captura-de-pantalla-2026-03-25-a-las-18.50.17\/450_1000.png\"><\/p><\/div>\n<\/div>\n<p>En el siguiente paso, tendr\u00e1s que elegir un proyecto de Google Cloud para la aplicaci\u00f3n. Puedes crear uno nuevo o a\u00f1adirla a uno existente. <strong>Tambi\u00e9n tendr\u00e1s que configurar tus m\u00e9todos de pago<\/strong> para Google Cloud, porque la posibles llamadas a la API o tu espacio lo vas a pagar. Cuando lo tengas, simplemente pulsa en <em>Publish app<\/em>.<\/p>\n<p><!-- BREAK 14 --><\/p>\n<div class=\"article-asset-image article-asset-normal article-asset-center\">\n<div class=\"asset-content\">\n<p>   <img decoding=\"async\" alt=\"Publicada\" class=\"centro_sinmarco\" src=\"https:\/\/i.blogs.es\/bb21fd\/captura-de-pantalla-2026-03-25-a-las-18.55.14\/450_1000.png\"><\/p><\/div>\n<\/div>\n<p>Y ya est\u00e1. Con esto ya tienes tu aplicaci\u00f3n publicada, y ya puedes empezar a utilizarla. Google AI Studio te generar\u00e1 una URL para acceder a ella, larga y \u00fanica, y ahora ya depende de ti comprar un dominio y linkarlo a esta direcci\u00f3n en el caso de que quieras.<\/p>\n<p><!-- BREAK 15 --><\/p>\n<p>En Xataka Basics | <a class=\"text-outboundlink\" href=\"https:\/\/www.xataka.com\/basics\/como-crear-juego-preguntas-tipo-test-cualquier-pdf-para-estudiar-ayuda-inteligencia-artificial\" data-vars-post-title=\"C\u00f3mo crear un juego con preguntas tipo test sobre cualquier PDF para estudiar con ayuda de la inteligencia artificial \" data-vars-post-url=\"https:\/\/www.xataka.com\/basics\/como-crear-juego-preguntas-tipo-test-cualquier-pdf-para-estudiar-ayuda-inteligencia-artificial\" target=\"_blank\">C\u00f3mo crear un juego con preguntas tipo test sobre cualquier PDF para estudiar con ayuda de la inteligencia artificial<\/a><\/p>\n<p> &#8211; <br \/> La noticia<br \/>\n      <a href=\"https:\/\/www.xataka.com\/basics\/como-crear-aplicacion-google-ai-studio-gratis-forma-sencilla?utm_source=feedburner&amp;utm_medium=feed&amp;utm_campaign=29_Mar_2026\"><br \/>\n       <em> C\u00f3mo crear una aplicaci\u00f3n en Google AI Studio gratis y de forma sencilla  <\/em><br \/>\n      <\/a><br \/>\n      fue publicada originalmente en<br \/>\n      <a href=\"https:\/\/www.xataka.com\/?utm_source=feedburner&amp;utm_medium=feed&amp;utm_campaign=29_Mar_2026\"><br \/>\n       <strong> Xataka <\/strong><br \/>\n      <\/a><br \/>\n             por <a href=\"https:\/\/www.xataka.com\/autor\/yubal?utm_source=feedburner&amp;utm_medium=feed&amp;utm_campaign=29_Mar_2026\"><br \/>\n        Y\u00fabal Fern\u00e1ndez<br \/>\n       <\/a><br \/>\n      . <\/p>\n<p>\u00a0Vamos a explicarte c\u00f3mo crear una aplicaci\u00f3n web sencilla con Google AI Studio. Se trata de un programa con el que puedes crear aplicaciones, webs, u otros proyectos escribiendo el c\u00f3digo con inteligencia artificial. Vamos, t\u00fa le dices lo que quieres y Gemini generar\u00e1 la aplicaci\u00f3n web, mostr\u00e1ndote tambi\u00e9n el c\u00f3digo.<br \/>\nPero hay algunas cosas que necesitas tener en cuenta, o sea que empezaremos dici\u00e9ndote los riesgos que supone crear una webapp con IA, sobre todo en cuanto a la privacidad si vas a publicarla. Luego, te diremos paso a paso c\u00f3mo proceder de una manera sencilla.<br \/>\nAntes de empezar, peligros a tener en cuenta<\/p>\n<p>Antes de ponernos con esto, debes tener en cuenta que puede no ser una buena idea crear una aplicaci\u00f3n web utilizando inteligencia artificial, sobre todo si tienes pensado publicarla. Todo depende de para qu\u00e9 vayas a utilizarla.<br \/>\nPara empezar, con Google AI Studio solo vas a construir un esqueleto de la p\u00e1gina web o la aplicaci\u00f3n web, puro c\u00f3digo HTML sin una base de datos segura y privada para cada usuario que accedes.\u00a0<br \/>\nPor eso, sin un sistema de login, corres el riesgo de que todos los datos queden expuestos en una especie de pizarra p\u00fablica. Por ejemplo, imag\u00ednate que creas una aplicaci\u00f3n web de notas, y que la publicas en Internet. Entonces, todo lo que vayas escribiendo podr\u00e1 ser le\u00eddo por los dem\u00e1s, e incluso otras personas podr\u00e1n a\u00f1adir elementos.<br \/>\nEsto quiere decir que lo que te permite hacer Google AI Studio son esqueletos de aplicaciones web, un c\u00f3digo completo que luego tendr\u00e1s que rellenar para a\u00f1adir bases de datos y registros. Lo m\u00e1s recomendable es no publicarlas tal cual las genera esta herramienta.<br \/>\nExiste la posibilidad de pedirle a la herramienta que genere una aplicaci\u00f3n con memoria local que se guarde en tu navegador. Esto la har\u00e1 privada al guardar los datos en el cach\u00e9, aunque todo lo que escribas se perder\u00e1 si cambias de navegador o cuando se hagan limpiezas de cach\u00e9.<br \/>\nY el otro gran problema que tiene crear una aplicaci\u00f3n web con una herramienta de inteligencia artificial es que puede haber c\u00f3digo err\u00f3neo que no funcione bien, por lo que siempre es recomendable revisar el c\u00f3digo con conocimiento y verificar que todo lo hace como deber\u00eda.<\/p>\n<p>     En Xataka<\/p>\n<p>    C\u00f3mo usar Google AI Studio para crear tu propio Gemini sin filtros o definiendo su censura <\/p>\n<p>Usa una IA para dise\u00f1ar el prompt<\/p>\n<p>Google AI Studio funciona con inteligencia artificial, lo que quiere decir que t\u00fa puedes describir lo que quieres con lenguaje natural, y luego esto lo va a traducir en una aplicaci\u00f3n. Por lo tanto, solo vas a necesitar un prompt.<br \/>\nSin embargo, va a ser m\u00e1s efectivo usar una IA para generar el prompt. 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\u00e1s completo y complejo que luego vas a poder repasar.\u00a0<br \/>\nPor ejemplo, yo he utilizado Claude y le he explicado lo que quiero que tenga la aplicaci\u00f3n y las ideas para el dise\u00f1o.\u00a0Al hacer la petici\u00f3n he especificado que lo que quiero es un prompt para hacer una aplicaci\u00f3n web en Google AI Studio.<\/p>\n<p>Como resultado, Claude me ha creado un prompt de varios p\u00e1rrafos en ingl\u00e9s, incluyendo tambi\u00e9n el c\u00f3digo de colores que quiero que utilice. Adem\u00e1s, ha pensado en una interfaz para hacerla, y ha dise\u00f1ado el prompt explic\u00e1ndola para que Google AI Studio lo entienda.<br \/>\nComo peque\u00f1a nota, recuerda que esta IA tiene los Artefactos de Claude, que son como aplicaciones internas. Por lo tanto, siempre vas a poder decirle algo como \"crea un artefacto a partir de este prompt\", con lo que vas a poder crear una app interna y verificar su estilo. Este no va a ser el mismo que te de Google AI Studio, pero puedes usarlo como prueba.<\/p>\n<p>     En Xataka<\/p>\n<p>    Qu\u00e9 es Antigravity, c\u00f3mo funciona y qu\u00e9 puedes hacer con la IDE con inteligencia artificial de Google<\/p>\n<p>Empezamos a crear la aplicaci\u00f3n<\/p>\n<p>Para empezar a crear tu aplicaci\u00f3n, entra en Google AI Studio con la web aistudio.google.com. Una vez dentro, pulsa en la secci\u00f3n Build, que sirve para empezar a crear una aplicaci\u00f3n.<\/p>\n<p>Ahora copia el prompt que hemos generado antes y p\u00e9galo en el campo de escritura. Te recomiendo que cuando lo hagas revises el prompt por si hay alguna cosa en \u00e9l que quieras cambiar. Una vez lo tengas, pulsa en el bot\u00f3n Build para comenzar el proceso.<\/p>\n<p>Ahora, Google AI Studio generar\u00e1 tu aplicaci\u00f3n. Cuando lo haga ver\u00e1s que la pantalla est\u00e1 dividida en dos. En la izquierda tienes una parte que es como un chat con la IA de la herramienta, y en la derecha la previsualizaci\u00f3n. Una vez termines, podr\u00e1s probar que todo funciona a tu gusto, y usar el chat de la izquierda para pedir cambios y correcciones.\u00a0<br \/>\nEs muy importante que ahora te tomes tu tiempo en ir a\u00f1adiendo y cambiando elementos en la aplicaci\u00f3n. Ve haci\u00e9ndolo poco a poco, no tengas prisa y ve haciendo prompts cortos con cambios concretos para para ir avanzando progresivamente. Con cada prompt que escribas, Google AI Studio rehar\u00e1 la aplicaci\u00f3n.<br \/>\nTambi\u00e9n puedes hacerle preguntas a la IA que ha generado la aplicaci\u00f3n, y basarte en las respuestas para pedir que haga cambios. Por ejemplo, puedes pedirle que se asegure de que los datos se guarden en el localStorage, en la memoria del ordenador, para que no queden expuestos en la red.<br \/>\nTambi\u00e9n puedes pedirle cosas m\u00e1s complejas, como que te ayude a configurar un sistema para iniciar sesi\u00f3n con tu cuenta de Google y guardar tus datos en Google Drive. En este caso, la IA que tienes en el lateral del proyecto te ir\u00e1 guiando paso a paso por lo que tienes que hacer y d\u00e1ndote las credenciales para hacerlo.<\/p>\n<p>Por defecto la herramienta te mostrar\u00e1 una previsualizaci\u00f3n de lo que est\u00e1s creando. Pero puedes pulsar en la pesta\u00f1a Code para previsualizar el c\u00f3digo interno de la aplicaci\u00f3n web. Tambi\u00e9n tienes un bot\u00f3n de descarga para bajar el c\u00f3digo y luego poder usarlo cuando quieras. Tu aplicaci\u00f3n est\u00e1 completada.<\/p>\n<p>     En Xataka<\/p>\n<p>    Las mejores aplicaciones para tener una inteligencia artificial local en tu m\u00f3vil o PC, sin necesitar conexi\u00f3n y con mayor privacidad <\/p>\n<p>Google AI Studio te permite publicar la aplicaci\u00f3n web<\/p>\n<p>Por \u00faltimo, debes saber que Google AI Studio tiene una opci\u00f3n para publicar tu aplicaci\u00f3n web. Para ello, en la parte superior derecha del todo tienes que pulsa en el bot\u00f3n Publish. Esto iniciar\u00e1 el proceso para publicarla de forma autom\u00e1tica.<\/p>\n<p>En el siguiente paso, tendr\u00e1s que elegir un proyecto de Google Cloud para la aplicaci\u00f3n. Puedes crear uno nuevo o a\u00f1adirla a uno existente. Tambi\u00e9n tendr\u00e1s que configurar tus m\u00e9todos de pago para Google Cloud, porque la posibles llamadas a la API o tu espacio lo vas a pagar. Cuando lo tengas, simplemente pulsa en Publish app.<\/p>\n<p>Y ya est\u00e1. Con esto ya tienes tu aplicaci\u00f3n publicada, y ya puedes empezar a utilizarla. Google AI Studio te generar\u00e1 una URL para acceder a ella, larga y \u00fanica, y ahora ya depende de ti comprar un dominio y linkarlo a esta direcci\u00f3n en el caso de que quieras.<\/p>\n<p>En Xataka Basics | C\u00f3mo crear un juego con preguntas tipo test sobre cualquier PDF para estudiar con ayuda de la inteligencia artificial<\/p>\n<p>                 &#8211;  La noticia<\/p>\n<p>        C\u00f3mo crear una aplicaci\u00f3n en Google AI Studio gratis y de forma sencilla  <\/p>\n<p>      fue publicada originalmente en<\/p>\n<p>        Xataka <\/p>\n<p>             por<br \/>\n        Y\u00fabal Fern\u00e1ndez<\/p>\n<p>      .\u00a0\u00a0\u00a0<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Vamos a explicarte c\u00f3mo crear una aplicaci\u00f3n web sencilla con Google AI Studio. Se trata de un programa con el que puedes crear aplicaciones, webs, u otros proyectos escribiendo el c\u00f3digo con inteligencia artificial. Vamos, t\u00fa le dices lo que quieres y Gemini generar\u00e1 la aplicaci\u00f3n web, mostr\u00e1ndote tambi\u00e9n el c\u00f3digo. Pero hay algunas cosas [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":8426,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"amp_status":"","footnotes":""},"categories":[6],"tags":[],"class_list":["post-8425","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ciencia-y-tecnologia"],"_links":{"self":[{"href":"https:\/\/ermdigital.com\/index.php?rest_route=\/wp\/v2\/posts\/8425","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ermdigital.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ermdigital.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ermdigital.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ermdigital.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=8425"}],"version-history":[{"count":0,"href":"https:\/\/ermdigital.com\/index.php?rest_route=\/wp\/v2\/posts\/8425\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ermdigital.com\/index.php?rest_route=\/wp\/v2\/media\/8426"}],"wp:attachment":[{"href":"https:\/\/ermdigital.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=8425"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ermdigital.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=8425"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ermdigital.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=8425"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}