GSP1337

Descripción general

En este lab, aprenderás a crear prototipos de aplicaciones rápidamente en Google AI Studio. Explorarás aplicaciones de IA prediseñadas, aprenderás a crear las tuyas a partir de plantillas, usarás y definirás mejor instrucciones de texto, y descubrirás cómo administrar y compartir tus creaciones. En este lab, asumirás el rol de desarrollador de soluciones en un hackatón, en el que tu objetivo será crear y compartir rápidamente varias aplicaciones de IA de prueba de concepto dentro de un límite de tiempo.

Qué aprenderás

En este lab, aprenderás a realizar las siguientes tareas:

• Explorar las apps prediseñadas por Google
• Crear una app con una plantilla y modificarla con el asistente de código
• Crear una app basada en datos a partir de una sola instrucción de texto
• Guardar, descargar y visualizar prototipos de apps

Configuración y requisitos

Antes de hacer clic en el botón Comenzar lab

Lee estas instrucciones. Los labs cuentan con un temporizador que no se puede pausar. El temporizador, que comienza a funcionar cuando haces clic en Comenzar lab, indica por cuánto tiempo tendrás a tu disposición los recursos de Google Cloud.

Este lab práctico te permitirá realizar las actividades correspondientes en un entorno de nube real, no en uno de simulación o demostración. Para ello, se te proporcionan credenciales temporales nuevas que utilizarás para acceder a Google Cloud durante todo el lab.

Para completar este lab, necesitarás lo siguiente:

• Acceso a un navegador de Internet estándar. Se recomienda el navegador Chrome.

• Tiempo para completar el lab (recuerda que, una vez que comienzas un lab, no puedes pausarlo).

Abre Google AI Studio

1. Haz clic en Comenzar lab. En el panel del lab, se mostrarán las credenciales temporales que necesitarás.

   • Nota: Si se trata de un lab pagado, se te pedirá que selecciones una forma de pago.

2. Abre Google AI Studio en una ventana de incógnito. Aparecerá la página de acceso de Google.

   • Sugerencia: Para facilitar el acceso, organiza las pestañas del lab y de AI Studio en ventanas separadas, una junto a la otra.

3. Copia el Nombre de usuario que se muestra a continuación y pégalo en el campo Correo electrónico. Luego, haz clic en Siguiente.

   {{{user_0.username | "Username"}}}

4. Copia la contraseña que aparece a continuación y pégala en el campo Ingresa tu contraseña; luego, haz clic en Siguiente.

   {{{user_0.password | "Password"}}}

5. Acepta los Términos y Condiciones que aparecen en pantalla para continuar.

Ahora accediste a Google AI Studio con tu cuenta de estudiante temporal.

Tarea 1: Explora una app prediseñada

Como desarrollador en un hackatón, tu primer paso es analizar rápidamente el panorama para ver qué componentes básicos y ejemplos están disponibles. Comenzarás explorando una app de chatbot prediseñada.

1. En el menú de navegación de la izquierda, haz clic en Enable saving (arriba de la opción Compilación) y elige tu nombre de usuario.

2. Haz clic en Compilación.

3. Haz clic en la pestaña Gallery > All apps y desplázate por la galería de plantillas de aplicaciones prediseñadas.

4. Busca la app ChatterBots y haz clic en ella.

5. Haz clic en Allow para otorgar acceso al micrófono.

6. La app se abrirá en la vista del IDE. Tómate un momento para familiarizarte con la interfaz: el asistente de código está a la izquierda, el editor de código o visor de archivos está en el centro y una vista previa en vivo del chatbot en ejecución está a la derecha.

7. Obtén una vista previa de la app, explora los ajustes predeterminados de ChatterBot y crea tu propio ChatterBot en función de las características que definas.

8. Explora el código que se generó. En el editor de código, haz clic en el botón Show file tree view para ver la estructura del código. Haz clic en un archivo como App.tsx para ver el código principal de la aplicación o en un archivo dentro de la carpeta de componentes para ver cómo se compila un elemento de IU específico.

Tarea 2: Genera un prototipo de app a partir de una plantilla y modifícalo

A continuación, decidiste que una utilidad simple de tarjetas sería práctica para tu proyecto de hackatón. Generarás una a partir de una plantilla y, luego, usarás el asistente de código para cambiar rápidamente su apariencia y hacer que coincida con desarrollo de la marca de tu proyecto.

Genera la app

1. Haz clic en Volver al inicio y regresa a la página principal haciendo clic en el logotipo de Google AI Studio en la esquina superior izquierda.

2. En el menú de navegación de la izquierda, haz clic en Compilación > Start.

3. Busca la plantilla Flash UI y haz clic en ella para generar la aplicación.

Modifica la app con el asistente de código

1. En el panel Preview de la derecha, interactúa con las tarjetas predeterminadas para ver cómo funcionan.

2. Escribe Large Language Models en el campo de entrada y haz clic en la flecha para generar un conjunto específico del tema.

3. Ahora, dirige tu atención al campo de entrada del Code assistant que se encuentra en la parte inferior izquierda. Escribe el siguiente comando para cambiar el diseño y la lógica de la app:

4. Haz clic en Send prompt. Observa cómo el asistente modifica el código de la aplicación en el editor.

5. Una vez que se actualice el código, prueba ambos cambios en el panel Preview. Confirma que las tarjetas sean de color verde claro y que solo puedas dar vuelta una sola a la vez.

6. A continuación, agregarás otro atributo. En el campo de entrada Code assistant, escribe el siguiente comando nuevo:

7. Haz clic en Send prompt y observa cómo el asistente agrega un botón nuevo a la IU y modifica el código para incluir la nueva lógica.

8. Por último, prueba la nueva función en el panel Preview. Haz clic en el nuevo botón Surprise Me > add 5 more y confirma que se hayan agregado cinco tarjetas adicionales únicas a tu conjunto.

9. Haz clic en el ícono de lápiz junto al nombre de la app Flash UI, cambia el nombre de la aplicación a Flashcard Maker, deja la descripción predeterminada y haz clic en Guardar.

Haz clic en Revisar mi progreso para verificar el objetivo.

Tarea 3: Crea una app con una instrucción de texto

Ahora, llegó el momento del evento principal del hackatón: crear tu función principal desde cero. Crearás un planificador de itinerarios de viaje describiéndolo en lenguaje simple. Específicamente, le pedirás al modelo que cree una IU que pueda mostrar datos estructurados de forma clara.

1. Vuelve a la galería de la página Compilación.

2. En la barra de instrucciones de texto principal que se encuentra en la parte superior de la página, ingresa la siguiente solicitud detallada:

3. Haz clic en Compilación y espera a que el asistente de código genere la aplicación completa.

4. Una vez que aparezca la app, prueba su funcionalidad en el panel Preview. En el campo de entrada de la ciudad, escribe Rome y presiona INTRO.

5. Observa el resultado. La app debe mostrar un itinerario estructurado de 3 días para Roma, lo que demostrará que la IA creó correctamente una IU basada en datos a partir de tu instrucción de texto.

6. Haz clic en el ícono de lápiz que se encuentra en la parte superior del panel, junto al nombre de la app, cambia el nombre de la aplicación a AI Travel Itinerary Generator, deja la descripción predeterminada y haz clic en Guardar.

7. Usa el asistente de código para modificar cualquier parte de la aplicación que se te ocurra (opcional).

Haz clic en Revisar mi progreso para verificar el objetivo.

Tarea 4: Guarda, descarga y visualiza tus apps

Tu prototipo del planificador de viajes funciona. El último paso del hackatón es descargar tu progreso y compartir el proyecto con tu equipo.

Ahora, tu app se guardó en la sección "Your apps" de la página Compilación.

1. Haz clic en el ícono de descarga de la misma barra de herramientas. Se descargará en tu computadora un archivo ZIP que contiene el código fuente completo de tu aplicación.

   • Nota: Puedes usar este código para continuar el desarrollo de forma local en tu propio editor.

2. Explora la ruta para publicar tu app. Haz clic en el botón Implementar app de la misma barra de herramientas.

   • Nota: En este lab, no completaremos el proceso de implementación en su totalidad, pero este paso te muestra la ruta integrada para publicar tu aplicación en Google Cloud.

Visualiza los prototipos de tu aplicación

1. Ve a la página principal y haz clic en el logotipo de Google AI Studio en la esquina superior izquierda.

2. En el menú de navegación de la izquierda, haz clic en Compilación.

3. Haz clic en la pestaña Your apps > Created by you para ver los prototipos que modificaste y creaste. Deberías ver las dos aplicaciones: Flashcard Maker y AI Travel Itinerary Generator.

¡Felicitaciones!

¡Felicitaciones! Usaste correctamente Google AI Studio para explorar, adaptar y crear rápidamente prototipos de aplicaciones funcionales desde cero. Aprendiste a aprovechar las plantillas prediseñadas, modificar el código con lenguaje natural y generar una aplicación completa basada en datos a partir de una sola instrucción de texto. Ahora tienes los conocimientos necesarios para hacer realidad tus ideas impulsadas por IA.

Capacitación y certificación de Google Cloud

Recibe la formación que necesitas para aprovechar al máximo las tecnologías de Google Cloud. Nuestras clases incluyen habilidades técnicas y recomendaciones para ayudarte a avanzar rápidamente y a seguir aprendiendo. Para que puedas realizar nuestros cursos cuando más te convenga, ofrecemos distintos tipos de capacitación de nivel básico a avanzado: a pedido, presenciales y virtuales. Las certificaciones te ayudan a validar y demostrar tus habilidades y tu conocimiento técnico respecto a las tecnologías de Google Cloud.

Última actualización del manual: 12 de marzo de 2026

Prueba más reciente del lab: 12 de marzo de 2026

Copyright 2026 Google LLC. All rights reserved. Google y el logotipo de Google son marcas de Google LLC. Los demás nombres de productos y empresas pueden ser marcas de las respectivas empresas a las que estén asociados.