1. Introduction
Imaginez transformer une simple description textuelle en une image détaillée et éclatante en quelques secondes. C'est la puissance des médias génératifs, un domaine en évolution rapide qui transforme la façon dont vous créez des contenus visuels et interagissez avec eux. Des modèles comme Imagen 3 de Google sur Vertex AI offrent des fonctionnalités d'IA générative de pointe aux développeurs d'applications.
Imagen 3 est le modèle texte-vers-image de Google le plus performant à ce jour. Il est capable de créer des images avec un niveau de détail étonnant. Les développeurs ont ainsi plus de contrôle lorsqu'ils créent des produits d'IA nouvelle génération qui transforment leur imagination en éléments visuels de haute qualité. En savoir plus sur Imagen sur Vertex AI.
Cet atelier de programmation vous guidera dans l'utilisation de la puissance d'Imagen à l'aide du SDK Gen AI de Google. Vous découvrirez non seulement comment générer des images époustouflantes à partir de requêtes textuelles, mais aussi comment intégrer cette fonctionnalité dans une application Web à l'aide de Mesop, un framework d'interface utilisateur Python.
Prérequis
- Un projet Google Cloud dans lequel la facturation et l'API Vertex AI sont activées. En savoir plus sur la configuration d'un projet et d'un environnement de développement.
Points abordés
- Comment utiliser le SDK Gen AI de Google pour Python afin d'interagir avec Imagen 3
- Comment générer des images à partir de requêtes textuelles
- Comment créer une application Mesop et l'exécuter à partir de Cloud Shell
Ce dont vous avez besoin
- Connaissances de base sur Python
- Expérience d'exécution de commandes dans un terminal Cloud Shell
- Un ordinateur ayant accès à Cloud Shell
2. Configurer l'environnement et installer les dépendances
- Ouvrez l'éditeur Cloud Shell.
- Cliquez sur le bouton "Ouvrir le terminal" en haut à droite.
- Créez un dossier en saisissant la commande suivante dans le terminal :
mkdir my-imagen-app
- Accédez à votre nouveau dossier :
cd my-imagen-app
- Créez un environnement virtuel dans Python 3 :
python3 -m venv myenv
- Activez l'environnement virtuel :
source myenv/bin/activate
- Installez Mesop :
pip3 install mesop
- Installez le SDK Gen AI de Google pour Python :
pip install google-genai
- Créez un fichier Python :
touch main.py
3. Configuration des applications
Tout le code nécessaire à l'exécution de l'application Mesop se trouvera dans main.py. À chacune des étapes suivantes, copiez-le et collez-le séquentiellement dans ce fichier de l'éditeur Cloud Shell.
Importer des bibliothèques
import base64
import mesop as me
from google import genai
from google.genai import types
Définir les informations du projet Google Cloud et créer un client
- Définissez votre ID de projet :
PROJECT_ID = "[your-project-id]"
Remplacez [your-project-id] par le nom de votre projet Google Cloud lorsque vous copiez cette ligne de code.
- Créez le client :
client = genai.Client(vertexai=True, project=PROJECT_ID, location="us-central1")
Charger le modèle de génération d'images
imagen_model = "imagen-3.0-generate-002"
Gestion de l'état
La définition de la gestion de l'état vous permet de stocker des informations tout au long du parcours utilisateur.
@me.stateclass
class State:
input: str = ""
enhanced_prompt: str = ""
img_data: str = "https://storage.googleapis.com/cloud-samples-data/generative-ai/image/flowers.png"
input: entrée fournie par l'utilisateur qui sera utilisée pour la génération d'images.enhanced_prompt: le modèleimagen-3.0-generate-002offre la possibilité d'améliorer la requête fournie. Une nouvelle requête détaillée sera créée à partir de la requête d'origine pour générer des images de meilleure qualité et sera renvoyée dans cette variable.img_data: emplacement Cloud Storage ou octets d'image d'une image générée avec Imagen 3.
4. Définir des fonctions d'assistance
Fonction de chargement
Ce code sera exécuté lors du chargement de l'application. Il définit le mode de l'application sur les couleurs du système.
def load(e: me.LoadEvent):
me.set_theme_mode("system")
Fonction de flou
Cette fonction enregistre l'entrée utilisateur dans votre variable d'état.
def on_blur(e: me.InputBlurEvent):
state = me.state(State)
state.input = e.value
5. Générer une image avec Imagen
Cette fonction est appelée lorsqu'un utilisateur clique sur un bouton pour envoyer une requête textuelle afin de générer une image.
def generate_image(e: me.ClickEvent):
state = me.state(State)
image = client.models.generate_images(
model=imagen_model,
prompt=state.input,
config=types.GenerateImagesConfig(
number_of_images=1,
aspect_ratio="1:1",
enhance_prompt=True,
safety_filter_level="BLOCK_MEDIUM_AND_ABOVE",
person_generation="DONT_ALLOW",
)
)
img = image.generated_images[0].image.image_bytes
# Encode image in Base64 to display in web app
img64 = base64.b64encode(img).decode('utf-8')
state.enhanced_prompt = image.generated_images[0].enhanced_prompt
state.img_data = f"data:image/png;base64,{img64}"
Vous pouvez configurer les paramètres situés dans GenerateImagesConfig :
number_of_images: 1, 2, 3, 4aspect_ratio: 1:1, 9:16, 16:9, 3:4, 4:3safety_filter_level: BLOCK_LOW_AND_ABOVE, BLOCK_MEDIUM_AND_ABOVE, BLOCK_ONLY_HIGH, BLOCK_NONEperson_generation: DONT_ALLOW, ALLOW_ADULT, ALLOW_ALL
Remarque : La seule option qui fonctionne sans liste d'autorisation supplémentaire est DONT_ALLOW.
6. Structurer la mise en page de l'application
@me.page(
on_load=load,
path="/",
title="Imagen 3",
)
def app():
s = me.state(State)
with me.box(
style=me.Style(
display="grid",
width="100%",
place_items="center",
margin=me.Margin(top=100),
)
):
me.text(text="Imagen 3: Image Generation", type="headline-3", style=me.Style(font_family="Google Sans"))
with me.box(
style=me.Style(
border_radius=16,
padding=me.Padding.all(8),
display="flex",
)
):
with me.box(
style=me.Style(flex_grow=1)
):
me.native_textarea(
autosize=True,
on_blur=on_blur,
min_rows=8,
placeholder="Enter your image prompt",
style=me.Style(
padding=me.Padding(top=16, left=16),
width="700px",
border_radius=16,
outline="none",
overflow_y="auto",
border=me.Border.all(
me.BorderSide(style="none"),
),
font_family="Google Sans",
),
)
with me.content_button(
type="icon",
on_click=generate_image,
):
me.icon("send")
with me.box(style=me.Style(margin=me.Margin.all(8),
width="700px",
display="flex",
align_items="center")
):
me.image(
src=s.img_data,
style=me.Style(width="350px", padding=me.Padding.all(16), border_radius=36)
)
with me.box(
style=me.Style(
padding=me.Padding.all(8),
background="white",
height="400px",
width="400px",
border_radius=16,
)
):
me.text(text="Enhanced Prompt:", style=me.Style(font_family="Google Sans", font_weight="bold"))
me.text(text=s.enhanced_prompt, style=me.Style(padding=me.Padding.all(10), font_family="Google Sans"),
)
Ce code crée une application à une seule page qui comprend les composants suivants :
- Titre
- Zone de texte pour saisir une requête d'image
- Bouton "Envoyer" qui appelle la fonction
generate_image - Image générée par Imagen
- Requête améliorée renvoyée avec l'image
7. Exécuter l'application dans Cloud Shell
- Une fois que vous avez copié tous les extraits de code dans
main.py, vous pouvez exécuter l'application Mesop à partir de votre terminal Cloud Shell.mesop main.py - Cliquez ensuite sur le bouton "Aperçu sur le Web" en haut à droite, puis sur "Modifier le port". Saisissez 32123 dans la zone "Numéro de port", puis cliquez sur "Modifier et prévisualiser". Une nouvelle fenêtre doit s'ouvrir pour vous permettre d'afficher l'application chargée. Elle doit ressembler à ceci :

8. Tester Imagen 3
Vous pouvez maintenant essayer Imagen avec vos propres requêtes textuelles. Vous pouvez générer des images dans différents styles, allant du photoréalisme à l'animation, en passant par différents styles artistiques. Vous pouvez également spécifier des angles de caméra, des objectifs, etc. Votre requête textuelle d'origine sera également réécrite à l'aide d'une fonctionnalité basée sur un LLM, conçue pour produire des images de meilleure qualité qui reflètent mieux l'intention de la requête d'origine.
Remarque : La génération d'images de personnes nécessite un accès supplémentaire. En attendant, vous recevrez une erreur si votre requête inclut la génération de personnes ou de visages.
Voici quelques exemples de requêtes que vous pouvez essayer :
- Une casquette de baseball beige avec l'inscription "good vibes" en blanc, en lettres cousues et arrondies, soulignées en vert néon.
- Une confiserie fantaisiste.
- Une carte postale de Las Vegas avec le nom de la ville écrit et un timbre-poste dans le coin droit.
- Un chiot et un chaton qui jouent avec une pelote de laine.
9. Nettoyage
Arrêter l'application
Revenez au terminal où vous avez lancé l'application et quittez-la en appuyant sur Ctrl+C.
Désactiver l'environnement virtuel
Dans le même terminal, saisissez la commande suivante :
deactivate
10. Conclusion
Félicitations ! Vous avez terminé cet atelier de programmation en créant une application avec Imagen et en générant des images.
Enquête
Faites-nous part de ce que vous avez pensé de cet atelier de programmation en répondant à cette courte enquête.