GSP1337
Visão geral
Neste laboratório, você vai aprender a criar protótipos de aplicativos rapidamente no Google AI Studio. Explore aplicativos de IA pré-criados, aprenda a criar seus próprios apps a partir de modelos, use e refine comandos de texto e veja como gerenciar e compartilhar suas criações. Neste laboratório, você vai assumir o papel de desenvolvedor de soluções em uma hackathon. O objetivo é criar e compartilhar rapidamente vários aplicativos de IA de prova de conceito em um tempo determinado.
O que você vai aprender
Neste laboratório, você vai aprender a:
- Explorar os apps pré-criados pelo Google.
- Criar um app a partir de um modelo e modificá-lo com o Assistente de código.
- Criar um app orientado por dados com um único comando de texto.
- Salvar, baixar e visualizar protótipos de apps.
Configuração e requisitos
Antes de clicar no botão Começar o Laboratório
Leia estas instruções. Os laboratórios são cronometrados e não podem ser pausados. O timer é ativado quando você clica em Iniciar laboratório e mostra por quanto tempo os recursos do Google Cloud vão ficar disponíveis.
Este laboratório prático permite que você realize as atividades em um ambiente real de nuvem, e não em uma simulação ou demonstração. Você vai receber novas credenciais temporárias para fazer login e acessar o Google Cloud durante o laboratório.
Confira os requisitos para concluir o laboratório:
- Acesso a um navegador de Internet padrão (recomendamos o Chrome).
Observação: para executar este laboratório, use o modo de navegação anônima (recomendado) ou uma janela anônima do navegador. Isso evita conflitos entre sua conta pessoal e de estudante, o que poderia causar cobranças extras na sua conta pessoal.
- Tempo para concluir o laboratório: não se esqueça que, depois de começar, não será possível pausar o laboratório.
Observação: use apenas a conta de estudante neste laboratório. Se usar outra conta do Google Cloud, você poderá receber cobranças nela.
Abrir o Google AI Studio
-
Clique em Começar laboratório. O painel do laboratório vai mostrar as credenciais temporárias dele.
-
Observação: se for um laboratório pago, você precisará selecionar uma forma de pagamento.
-
Abra o Google AI Studio em uma janela anônima. A página de login do Google vai aparecer.
-
Dica: para facilitar o acesso, organize as guias do laboratório e do AI Studio em janelas separadas, lado a lado.
-
Copie o nome de usuário abaixo e cole no campo E-mail. Depois, clique em Avançar.
{{{user_0.username | "Username"}}}
-
Copie a senha abaixo e cole no campo Digite sua senha. Depois, clique em Avançar.
{{{user_0.password | "Password"}}}
-
Aceite os Termos e Condições na tela para continuar.
Pronto! Você fez login no Google AI Studio com sua conta temporária de estudante.
Tarefa 1: explorar um app pré-criado
Como desenvolvedor da hackathon, sua primeira tarefa é estudar rapidamente o cenário para ver os elementos básicos e os exemplos que estão disponíveis. Você vai começar explorando um app de chatbot pré-criado.
-
No menu de navegação à esquerda, clique em Ativar o salvamento (acima da opção Criar) e escolha seu nome de usuário.
-
Clique em Criar.
-
Clique na guia Galeria > Todos os apps e navegue pela galeria de modelos de aplicativos pré-criados.
-
Encontre o app ChatterBots e clique nele.
Observação: se a mensagem de erro "Não foi possível armazenar o aplicativo recente" aparecer, significa que você não concedeu acesso ao Google Drive. Para resolver isso, ative o acesso ao Drive navegando até a seção Histórico na barra lateral esquerda. Clique em Permitir acesso ao Drive, e uma nova janela pop-up será aberta. Nela, selecione sua conta de estudante (por exemplo, student-XX-YYYY@qwiklabs.net) e conceda as permissões necessárias para continuar.
-
Clique em Permitir para conceder o acesso solicitado ao microfone.
-
O app vai abrir na visualização do ambiente de desenvolvimento integrado (IDE). Vamos dar uma olhada na interface: o Assistente de código fica à esquerda, o editor de código/visualizador de arquivos fica no centro e a Visualização dinâmica do chatbot em execução fica à direita.
-
Confira uma prévia do app, explore as predefinições do ChatterBot e crie seu próprio aplicativo com base nas características que definir.
-
Analise o código gerado. No editor de código, clique no botão Mostrar visualização em árvore dos arquivos para conferir a estrutura do código. Clique em um arquivo como App.tsx para ver o código principal do aplicativo ou em um arquivo na pasta de componentes para saber como um elemento da interface específico é criado.

Explorar um app pré-criado
Tarefa 2: gerar um protótipo de app com base em um modelo e modificá-lo
Você decide que um utilitário simples de cartões de estudo seria útil para seu projeto da hackathon. Para isso, você vai gerar um modelo e usar o Assistente de código para mudar rapidamente a aparência dele para combinar com o branding do seu projeto.
Gerar o app
-
Clique em Voltar ao início e retorne à página inicial clicando no logotipo do Google AI Studio no canto superior esquerdo.
-
No menu de navegação à esquerda, clique em Criar > Iniciar.
-
Encontre e clique no modelo Interface do cartão para gerar o aplicativo.
Modifique o app com o Assistente de código
-
No painel Visualização à direita, interaja com os cartões padrão para ver como eles funcionam.
-
Digite Large Language Models no campo de entrada e clique na seta para gerar um conjunto de um tema específico.
-
Agora olhe para campo de entrada Assistente de código na parte de baixo à esquerda. Digite o comando a seguir para mudar o estilo e a lógica do app:
Altere a cor do plano de fundo dos cartões de estudo para verde-claro e mude a lógica dos cartões para que apenas um seja virado de cada vez.
- Clique em Enviar comando. Veja como o assistente modifica o código do aplicativo no editor.
Observação: se o botão "Remix" aparecer, clique nele, depois em "Aplicar" e confirme.
-
Depois que o código for atualizado, teste as duas mudanças no painel Visualização. Confirme se os cartões estão verde-claros e se é possível virar apenas um de cada vez.
-
Em seguida, você vai adicionar outro recurso. No campo de entrada do Assistente de código, digite o comando a seguir:
Crie um botão "adicionar mais 5" para gerar mais cinco cartões de estudo diferentes, sem que haja repetições.
-
Clique em Enviar comando e veja o assistente adicionar um novo botão à interface e modificar o código para incluir a nova lógica.
-
Por fim, teste o novo recurso no painel Visualização. Clique no novo botão Me surpreenda > Adicionar mais 5 e confirme se mais cinco cartões diferentes foram adicionados ao conjunto.
-
Clique no ícone de lápis ao lado do nome do app Interface do cartão, renomeie-o para Criador de cartões de estudo, deixe a descrição como padrão e clique em Salvar.
Clique em Verificar meu progresso para conferir o objetivo.
Gerar um protótipo de app com base em um modelo e modificá-lo
Tarefa 3: criar um app usando comando de texto
Agora o evento principal da hackathon: criar seu recurso principal do zero. Você vai criar um planejador de roteiros de viagem usando uma descrição em linguagem simples. Peça especificamente ao modelo para criar uma interface que possa mostrar dados estruturados de forma organizada.
-
Volte para a galeria da página Criar.
-
Na barra principal de comando de texto na parte de cima da página, insira a seguinte solicitação detalhada:
Crie um app que gere o roteiro de uma viagem de três dias para uma cidade. O app precisa ter um campo de entrada para o nome da cidade. A resposta precisa ser um plano estruturado com dias, horários e atividades, exibido em um formato simples.
-
Clique em Criar e aguarde o Assistente de código gerar o aplicativo completo.
-
Quando o app aparecer, teste a funcionalidade dele no painel Visualização. No campo de entrada da cidade, digite Rome e pressione ENTER.
-
Observe o resultado. O app vai mostrar um roteiro estruturado de três dias para Roma, demonstrando que a IA criou uma interface orientada por dados com base no seu comando de texto.
-
Clique no ícone de lápis na parte de cima do painel ao lado do nome do app, renomeie o aplicativo para Gerador de roteiros de viagem com IA, deixe a descrição como padrão e clique em Salvar.
-
(Opcional) Use o Assistente de código para modificar qualquer parte do aplicativo que quiser.
Clique em Verificar meu progresso para conferir o objetivo.
criar um app usando comando de texto
Tarefa 4: salvar, baixar e acessar seus apps
Seu protótipo de planejador de viagens está funcionando! A etapa final da hackathon é baixar o progresso e compartilhar o projeto com a equipe.
Ele agora está salvo na seção "Seus apps" da página Criar.
-
Clique no ícone Download na mesma barra de ferramentas. Será baixado um arquivo ZIP com o código-fonte completo do aplicativo no seu computador.
-
Observação: você pode usar esse código para continuar o desenvolvimento localmente no seu próprio editor.
-
Confira o caminho para ativar seu app. Clique no botão Implantar app na mesma barra de ferramentas.
-
Observação: não vamos concluir todo o processo de implantação neste laboratório, mas esta etapa mostra o caminho integrado para publicar seu aplicativo no Google Cloud.
Veja os protótipos de aplicativos
-
Navegue até a página inicial e clique no logotipo do Google AI Studio no canto superior esquerdo.
-
No menu de navegação à esquerda, clique em Criar.
-
Clique na guia Seus apps > Criados por você para ver os protótipos que você modificou e criou. Dois aplicativos devem aparecer: Criador de cartões de estudo e Gerador de roteiros de viagem com IA.

Parabéns!
Parabéns! Você usou o Google AI Studio para explorar, adaptar e criar rapidamente protótipos de aplicativos funcionais do zero. Você aprendeu como utilizar modelos pré-criados, modificar código com linguagem natural e gerar um aplicativo completo orientado por dados com um único comando de texto. Agora você já pode tirar suas ideias do papel com tecnologia de IA.
Treinamento e certificação do Google Cloud
Esses treinamentos ajudam você a aproveitar as tecnologias do Google Cloud ao máximo. Nossas aulas incluem habilidades técnicas e práticas recomendadas para ajudar você a alcançar rapidamente o nível esperado e continuar sua jornada de aprendizado. Oferecemos treinamentos que vão do nível básico ao avançado, com opções de aulas virtuais, sob demanda e por meio de transmissões ao vivo para que você possa encaixá-las na correria do seu dia a dia. As certificações validam sua experiência e comprovam suas habilidades com as tecnologias do Google Cloud.
Manual atualizado em 12 de março de 2026
Laboratório testado em 12 de março de 2026
Copyright 2026 Google LLC. Todos os direitos reservados. Google e o logotipo do Google são marcas registradas da Google LLC. Todos os outros nomes de produtos e empresas podem ser marcas registradas das respectivas empresas a que estão associados.