Gerar interface com anexos de imagem

O Gemini no Android Studio está equipado para ajudar você a transformar sua visão de interface do app Android em realidade, usando o Jetpack Compose e seguindo as práticas recomendadas do Android. Nesta página, descrevemos as etapas gerais para criar uma interface de app com o Gemini. Para mais informações sobre como anexar imagens e outras ideias de uso do recurso, consulte Anexar uma imagem à consulta.

Para gerar uma interface com o Gemini, siga estas etapas gerais:

  1. Crie um modelo da interface do app que você quer. Um wireframe ou design básico é a melhor opção. Você pode exportar um PNG de uma ferramenta de design ou até mesmo usar uma imagem desenhada à mão.

    Wireframe desenhado à mão de uma interface do usuário de app
    Figura 1: um wireframe desenhado à mão de uma interface do usuário de app.
  2. Anexe a imagem à consulta clicando no botão Anexar arquivo de imagem Ícone Anexar Arquivo de Imagem.

  3. No campo de chat, peça ao Gemini para gerar o código da interface, por exemplo, "Gere o código do Jetpack Compose para a imagem fornecida". Quando você envia a consulta e a imagem, o Gemini sugere um código para criar a interface proposta. O Gemini geralmente fornece o código para a prévia do Compose também. Assim, você pode visualizar rapidamente a interface depois de importá-la para o projeto. Se isso não acontecer, peça para gerar as prévias do Compose.

    Interface do Gemini Chat mostrando o código do Jetpack Compose gerado com base em uma imagem.
    Figura 2: o Gemini gerando código do Jetpack Compose com base em uma imagem anexada.
  4. Depois de importar o código e ver a prévia do Compose no painel de prévia, clique diretamente na prévia e peça para o Gemini transformar a interface.

    O Android Studio mostrando uma prévia do Compose com um elemento de interface selecionado e o chat do Gemini.
    Figura 3: uso do Gemini para transformar elementos da interface diretamente da prévia do Compose.