arrow_back

Développer une application avec Vertex AI Gemini 1.0 Pro

Se connecter Rejoindre
Testez vos connaissances et partagez-les avec notre communauté
done
Accédez à plus de 700 ateliers pratiques, badges de compétence et cours

Développer une application avec Vertex AI Gemini 1.0 Pro

Atelier 1 heure 30 minutes universal_currency_alt 1 crédit show_chart Débutant
info Cet atelier peut intégrer des outils d'IA pour vous accompagner dans votre apprentissage.
Testez vos connaissances et partagez-les avec notre communauté
done
Accédez à plus de 700 ateliers pratiques, badges de compétence et cours

Présentation

Gemini est une famille de modèles d'IA générative conçus pour une utilisation multimodale. Il existe trois versions : Ultra, Pro et Nano. Gemini 1.0 Pro s'adresse aux développeurs et entreprises souhaitant créer des solutions pour des cas d'utilisation qui leur sont propres. Gemini 1.0 Pro accepte du texte en entrée et génère du texte en sortie. Un point de terminaison multimodal dédié Gemini 1.0 Pro Vision est également disponible. Il accepte du texte et des images en entrée, et génère du texte en sortie. Les SDK vous permettent de créer des applications dans Python, Android (Kotlin), Node.js, Swift et JavaScript.

Sur Google Cloud, l'API Gemini Vertex AI fournit une interface unifiée pour interagir avec les modèles Gemini. L'API accepte les requêtes multimodales en entrée, et peut générer du texte ou du code en sortie. Deux modèles sont actuellement disponibles dans l'API Gemini :

  • Le modèle Gemini 1.0 Pro (gemini-pro), qui est conçu pour gérer les tâches en langage naturel, le chat textuel et de code multitour, ainsi que la génération de code.

  • Le modèle Gemini 1.0 Pro Vision (gemini-pro-vision), compatible avec les requêtes multimodales, qui permet d'inclure du texte, des images et des vidéos dans vos requêtes, et d'obtenir des réponses sous forme de texte ou de code.

Vertex AI est une plate-forme de machine learning (ML) qui vous permet d'entraîner et de déployer des modèles de ML et des applications d'IA, ainsi que de personnaliser des grands modèles de langage (LLM) pour les utiliser dans vos applications optimisées par l'IA. Avec Vertex AI, vous pouvez personnaliser Gemini en gardant un contrôle total sur les données. Vous profitez en outre d'autres fonctionnalités Google Cloud offrant une sécurité, une confidentialité, ainsi qu'une gouvernance et une conformité des données de niveau professionnel. Pour en savoir plus sur Vertex AI, consultez le lien dans la section Étapes suivantes à la fin de l'atelier.

Dans cet atelier, vous allez utiliser le SDK Vertex AI pour Python afin d'appeler l'API Gemini Vertex AI.

Objectifs

Dans cet atelier, vous allez apprendre à effectuer les tâches suivantes :

  • Développer une application Python à l'aide du framework Streamlit
  • Installer le SDK Vertex AI pour Python
  • Développer du code pour interagir avec le modèle Gemini 1.0 Pro (gemini-pro) à l'aide de l'API Gemini Vertex AI
  • Développer du code pour interagir avec le modèle Gemini 1.0 Pro Vision (gemini-pro-vision) à l'aide de l'API Gemini Vertex AI
  • Conteneuriser votre application, la déployer sur Cloud Run et la tester

Préparation

Pour chaque atelier, nous vous attribuons un nouveau projet Google Cloud et un nouvel ensemble de ressources pour une durée déterminée, sans frais.

  1. Connectez-vous à Qwiklabs dans une fenêtre de navigation privée.

  2. Vérifiez le temps imparti pour l'atelier (par exemple : 01:15:00) : vous devez pouvoir le terminer dans ce délai.
    Une fois l'atelier lancé, vous ne pouvez pas le mettre en pause. Si nécessaire, vous pourrez le redémarrer, mais vous devrez tout reprendre depuis le début.

  3. Lorsque vous êtes prêt, cliquez sur Démarrer l'atelier.

  4. Notez vos identifiants pour l'atelier (Nom d'utilisateur et Mot de passe). Ils vous serviront à vous connecter à Google Cloud Console.

  5. Cliquez sur Ouvrir la console Google.

  6. Cliquez sur Utiliser un autre compte, puis copiez-collez les identifiants de cet atelier lorsque vous y êtes invité.
    Si vous utilisez d'autres identifiants, des messages d'erreur s'afficheront ou des frais seront appliqués.

  7. Acceptez les conditions d'utilisation et ignorez la page concernant les ressources de récupération des données.

Activer Cloud Shell

Cloud Shell est une machine virtuelle qui contient des outils pour les développeurs. Elle comprend un répertoire d'accueil persistant de 5 Go et s'exécute sur Google Cloud. Google Cloud Shell vous permet d'accéder via une ligne de commande à vos ressources Google Cloud. gcloud est l'outil de ligne de commande associé à Google Cloud. Il est préinstallé sur Cloud Shell et permet la saisie semi-automatique via la touche Tabulation.

  1. Dans Google Cloud Console, dans le volet de navigation, cliquez sur Activer Cloud Shell (Icône Cloud Shell).

  2. Cliquez sur Continuer.
    Le provisionnement et la connexion à l'environnement prennent quelques instants. Une fois connecté, vous êtes en principe authentifié, et le projet est défini sur votre ID_PROJET. Exemple :

Terminal Cloud Shell

Exemples de commandes

  • Afficher le nom du compte actif :

gcloud auth list

(Résultat)

Credentialed accounts: - <myaccount>@<mydomain>.com (active)

(Exemple de résultat)

Credentialed accounts: - google1623327_student@qwiklabs.net

  • Afficher l'ID du projet :

gcloud config list project

(Résultat)

[core] project = <ID_Projet>

(Exemple de résultat)

[core] project = qwiklabs-gcp-44776a13dea667a6

Tâche 1 : Configurer votre environnement et votre projet

  1. Connectez-vous à la console Google Cloud avec vos identifiants d'atelier et ouvrez la fenêtre du terminal Cloud Shell.

  2. Pour définir les variables d'environnement pour l'ID de votre projet et la région, exécutez les commandes suivantes dans Cloud Shell :

    PROJECT_ID=$(gcloud config get-value project) REGION={{{project_0.default_region|set at lab start}}} echo "PROJECT_ID=${PROJECT_ID}" echo "REGION=${REGION}"

  3. Pour utiliser certains services Google Cloud dans cet atelier, vous devez activer plusieurs API :

    gcloud services enable cloudbuild.googleapis.com cloudfunctions.googleapis.com run.googleapis.com logging.googleapis.com storage-component.googleapis.com aiplatform.googleapis.com

Cliquez sur Vérifier ma progression pour valider l'objectif. Activer les API nécessaires

Tâche 2 : Configurer l'environnement de l'application

Dans cette tâche, vous allez configurer un environnement virtuel Python et installer les dépendances de l'application.

Confirmer que Cloud Shell est autorisé

  1. Pour vérifier si Cloud Shell est autorisé, exécutez la commande suivante dans Cloud Shell :

    gcloud auth list

  2. Si vous êtes invité à autoriser Cloud Shell, cliquez sur Autoriser.

Créer le répertoire de l'application

  1. Pour créer le répertoire de l'application, exécutez la commande suivante :

    mkdir ~/gemini-app

  2. Accédez au répertoire ~/gemini-app :

    cd ~/gemini-app

    Les fichiers de l'application seront créés dans le répertoire ~/gemini-app. Ce répertoire contiendra les fichiers sources de l'application Python, les dépendances, ainsi qu'un fichier Docker que nous utiliserons plus tard dans cet atelier.

Configurer un environnement virtuel Python

Créez un environnement virtuel en plus de l'installation Python existante. Tous les packages installés dans cet environnement seront ainsi isolés de ceux situés dans l'environnement de base. Si vous utilisez les outils d'installation tels que pip dans un environnement virtuel, ils installeront les packages Python dans cet environnement.

  1. Pour créer l'environnement virtuel Python, exécutez la commande suivante depuis le dossier gemini-app :

    python3 -m venv gemini-streamlit Le module venv crée un environnement virtuel léger, avec son propre ensemble de packages Python indépendant.

  2. Activez l'environnement virtuel Python :

    source gemini-streamlit/bin/activate

Installer les dépendances de l'application

Un fichier d'exigences Python est un fichier texte simple qui contient la liste des dépendances nécessaires à votre projet. Pour commencer, nous avons besoin de trois modules dans notre fichier d'exigences.

Nous écrivons notre application à l'aide de Streamlit, une bibliothèque Python Open Source qui permet de créer des applications Web pour le machine learning et la data science. L'application utilise le SDK Vertex AI pour permettre à la bibliothèque Python d'interagir avec les modèles et l'API Gemini. Cloud Logging nous est utile pour consigner les informations concernant notre application.

  1. Pour créer le fichier requirements, exécutez la commande suivante :

    cat > ~/gemini-app/requirements.txt <<EOF streamlit google-cloud-aiplatform==1.38.1 google-cloud-logging==3.6.0 EOF

  2. Installez les dépendances de l'application :

    pip install -r requirements.txt

    pip est le programme d'installation de packages pour Python.

    Attendez que tous les packages soient installés avant de passer à la tâche suivante.

Tâche 3 : Développer l'application

Le code source de l'application sera écrit dans plusieurs fichiers sources .py. Commençons par le principal point d'entrée dans app.py.

Écrire le principal point d'entrée de l'application

  1. Pour créer le code du point d'entrée dans app.py, exécutez la commande suivante :

    cat > ~/gemini-app/app.py <<EOF import os import streamlit as st from app_tab1 import render_story_tab from vertexai.preview.generative_models import GenerativeModel import vertexai import logging from google.cloud import logging as cloud_logging # configure logging logging.basicConfig(level=logging.INFO) # attach a Cloud Logging handler to the root logger log_client = cloud_logging.Client() log_client.setup_logging() PROJECT_ID = os.environ.get('PROJECT_ID') # Your Qwiklabs Google Cloud Project ID LOCATION = os.environ.get('REGION') # Your Qwiklabs Google Cloud Project Region vertexai.init(project=PROJECT_ID, location=LOCATION) @st.cache_resource def load_models(): text_model_pro = GenerativeModel("gemini-pro") multimodal_model_pro = GenerativeModel("gemini-pro-vision") return text_model_pro, multimodal_model_pro st.header("Vertex AI Gemini API", divider="rainbow") text_model_pro, multimodal_model_pro = load_models() tab1, tab2, tab3, tab4 = st.tabs(["Story", "Marketing Campaign", "Image Playground", "Video Playground"]) with tab1: render_story_tab(text_model_pro) EOF

  2. Affichez le contenu du fichier app.py avec la commande suivante :

    cat ~/gemini-app/app.py

    L'application utilise streamlit pour créer plusieurs onglets dans l'interface utilisateur. Dans cette version initiale de l'application, nous créons le premier onglet, Story, qui contient la fonctionnalité permettant de générer une histoire. Nous créerons ensuite de manière incrémentielle les autres onglets dans les tâches suivantes de l'atelier.

    L'application initialise d'abord le SDK Vertex AI, en transférant les valeurs des variables d'environnement "PROJECT_ID" et "REGION".

    Après cela, elle charge les modèles gemini-pro et gemini-pro-vision à l'aide de la classe GenerativeModel qui représente un modèle Gemini. Cette classe inclut les méthodes permettant de générer du contenu à partir de texte, d'images et de vidéos.

    L'application crée 4 onglets dans l'UI : Story (Histoire), Marketing Campaign (Campagne marketing), Image Playground (Explorateur d'images) et Video Playground (Explorateur de vidéos).

    Le code de l'application appelle ensuite la fonction render_tab1() pour créer l'UI de l'onglet Story dans l'UI de l'application.

Développer tab1 : onglet "Story"

  1. Pour écrire le code qui affiche l'onglet Story dans l'UI de l'application, exécutez la commande suivante :

    cat > ~/gemini-app/app_tab1.py <<EOF import streamlit as st from vertexai.preview.generative_models import GenerativeModel from response_utils import * import logging # create the model prompt based on user input. def generate_prompt(): # Story character input character_name = st.text_input("Enter character name: \n\n",key="character_name",value="Mittens") character_type = st.text_input("What type of character is it? \n\n",key="character_type",value="Cat") character_persona = st.text_input("What personality does the character have? \n\n", key="character_persona",value="Mitten is a very friendly cat.") character_location = st.text_input("Where does the character live? \n\n",key="character_location",value="Andromeda Galaxy") # Story length and premise length_of_story = st.radio("Select the length of the story: \n\n",["Short","Long"],key="length_of_story",horizontal=True) story_premise = st.multiselect("What is the story premise? (can select multiple) \n\n",["Love","Adventure","Mystery","Horror","Comedy","Sci-Fi","Fantasy","Thriller"],key="story_premise",default=["Love","Adventure"]) creative_control = st.radio("Select the creativity level: \n\n",["Low","High"],key="creative_control",horizontal=True) if creative_control == "Low": temperature = 0.30 else: temperature = 0.95 prompt = f"""Write a {length_of_story} story based on the following premise: \n character_name: {character_name} \n character_type: {character_type} \n character_persona: {character_persona} \n character_location: {character_location} \n story_premise: {",".join(story_premise)} \n If the story is "short", then make sure to have 5 chapters or else if it is "long" then 10 chapters. Important point is that each chapter should be generated based on the premise given above. First start by giving the book introduction, chapter introductions and then each chapter. It should also have a proper ending. The book should have a prologue and an epilogue. """ return temperature, prompt # function to render the story tab, and call the model, and display the model prompt and response. def render_story_tab (text_model_pro: GenerativeModel): st.write("Using Gemini 1.0 Pro - Text only model") st.subheader("Generate a story") temperature, prompt = generate_prompt() config = { "temperature": temperature, "max_output_tokens": 2048, } generate_t2t = st.button("Generate my story", key="generate_t2t") if generate_t2t and prompt: # st.write(prompt) with st.spinner("Generating your story using Gemini..."): first_tab1, first_tab2 = st.tabs(["Story response", "Prompt"]) with first_tab1: response = get_gemini_pro_text_response(text_model_pro, prompt, generation_config=config) if response: st.write("Your story:") st.write(response) logging.info(response) with first_tab2: st.text(prompt) EOF

  2. Affichez le contenu du fichier app_tab1.py avec la commande suivante :

    cat ~/gemini-app/app_tab1.py

    La fonction render_story_tab génère les commandes d'interface utilisateur dans l'onglet en appelant les fonctions permettant d'afficher les champs de saisie de texte, ainsi que d'autres options.

    La fonction generate_prompt génère la requête textuelle qui est fournie à l'API Gemini. La chaîne de requête est créée par concaténation des valeurs saisies par l'utilisateur dans l'UI de l'onglet pour le personnage de l'histoire, ainsi que pour les options comme la longueur du récit (courte, longue), le niveau de créativité (faible, élevé) et la prémisse de l'histoire.

    La fonction renvoie également une valeur temperature (température) basée sur le niveau de créativité sélectionné pour l'histoire. Cette valeur est fournie au modèle en tant que paramètre de configuration temperature, lequel contrôle le caractère aléatoire des prédictions du modèle. Le paramètre de configuration max_output_tokens spécifie le nombre maximal de jetons de sortie à générer par message.

    Un bouton est créé dans l'UI de l'onglet pour permettre de générer la réponse du modèle. Lorsque le bouton est activé, la fonction get_gemini_pro_text_response est appelée. Nous verrons comment coder cela dans la prochaine étape de l'atelier.

Développer response_utils

Le fichier response_utils.py contient les fonctions permettant de générer les réponses du modèle.

  1. Pour écrire le code qui génère la réponse textuelle du modèle, exécutez la commande suivante :

    cat > ~/gemini-app/response_utils.py <<EOF from vertexai.preview.generative_models import (Content, GenerationConfig, GenerativeModel, GenerationResponse, Image, HarmCategory, HarmBlockThreshold, Part) def get_gemini_pro_text_response( model: GenerativeModel, prompt: str, generation_config: GenerationConfig, stream=True): safety_settings={ HarmCategory.HARM_CATEGORY_HARASSMENT: HarmBlockThreshold.BLOCK_NONE, HarmCategory.HARM_CATEGORY_HATE_SPEECH: HarmBlockThreshold.BLOCK_NONE, HarmCategory.HARM_CATEGORY_SEXUALLY_EXPLICIT: HarmBlockThreshold.BLOCK_NONE, HarmCategory.HARM_CATEGORY_DANGEROUS_CONTENT: HarmBlockThreshold.BLOCK_NONE, } responses = model.generate_content(prompt, generation_config = generation_config, safety_settings = safety_settings, stream=True) final_response = [] for response in responses: try: final_response.append(response.text) except IndexError: final_response.append("") continue return " ".join(final_response) EOF

  2. Affichez le contenu du fichier response_utils.py avec la commande suivante :

    cat ~/gemini-app/response_utils.py

    La fonction get_gemini_pro_text_response utilise la classe GenerativeModel et d'autres classes issues du package vertexai.preview.generative_models disponible dans le SDK Vertex AI pour Python. La méthode generate_content de la classe permet de générer une réponse basée sur la requête textuelle qui lui est transmise.

    Un objet safety_settings est également transmis à cette méthode. Il permet de contrôler la réponse du modèle en bloquant le contenu non sécurisé. L'exemple de code de cet atelier utilise des valeurs de paramètres de sécurité qui imposent au modèle de toujours renvoyer le contenu indépendamment de la probabilité qu'il soit sécurisé ou non. Vous pouvez évaluer le contenu généré, puis ajuster ces paramètres si votre application requiert une configuration plus restrictive. Pour en savoir plus, consultez la documentation sur les paramètres de sécurité.

Tâche 4 : Exécuter et tester l'application localement

Dans cette tâche, vous allez exécuter l'application localement à l'aide de streamlit et tester son fonctionnement.

Exécuter l'application

  1. Pour exécuter l'application localement, lancez la commande suivante dans Cloud Shell :

    streamlit run app.py \ --browser.serverAddress=localhost \ --server.enableCORS=false \ --server.enableXsrfProtection=false \ --server.port 8080

    L'application démarre et une URL vous permettant d'y accéder est fourni

  2. Pour lancer la page d'accueil de l'application dans votre navigateur, cliquez sur Aperçu sur le Web dans la barre de menu de Cloud Shell, puis sur Prévisualiser sur le port 8080.

    Aperçu sur le Web sur le port 8080

    Pour accéder à l'application, vous pouvez également copier son URL et la coller dans un nouvel onglet du navigateur.

Tester l'application : onglet "Story"

Générez une histoire en fournissant une entrée, affichez la requête, puis consultez la réponse générée par le modèle Gemini 1.0 Pro.

  1. Pour générer une histoire, dans l'onglet Story, conservez les paramètres par défaut et cliquez sur Generate my story (Générer mon histoire).

  2. Attendez que la réponse soit générée, puis cliquez sur l'onglet Story response (Histoire générée).

  3. Pour afficher la requête qui a été utilisée pour générer la réponse, cliquez sur l'onglet Prompt (Requête).

  4. Dans la fenêtre Cloud Shell, arrêtez l'application et revenez à l'invite de commande en appuyant sur Ctrl+C.

Cliquez sur Vérifier ma progression pour valider l'objectif. L'application est développée avec l'onglet "Story".

Tâche 5 : Générer une campagne marketing

Dans cette tâche, vous allez exploiter le modèle de texte Gemini 1.0 Pro afin de générer une campagne marketing pour une entreprise. Vous développerez le code qui génère un deuxième onglet dans votre application.

Développer tab2 : onglet "Marketing Campaign"

  1. Pour écrire le code qui affiche l'onglet Marketing Campaign dans l'UI de l'application, exécutez la commande suivante :

    cat > ~/gemini-app/app_tab2.py <<EOF import streamlit as st from vertexai.preview.generative_models import GenerativeModel from response_utils import * import logging # create the model prompt based on user input. def generate_prompt(): st.write("Using Gemini 1.0 Pro - Text only model") st.subheader("Generate your marketing campaign") product_name = st.text_input("What is the name of the product? \n\n",key="product_name",value="ZomZoo") product_category = st.radio("Select your product category: \n\n",["Clothing","Electronics","Food","Health & Beauty","Home & Garden"],key="product_category",horizontal=True) st.write("Select your target audience: ") target_audience_age = st.radio("Target age: \n\n",["18-24","25-34","35-44","45-54","55-64","65+"],key="target_audience_age",horizontal=True) # target_audience_gender = st.radio("Target gender: \n\n",["male","female","trans","non-binary","others"],key="target_audience_gender",horizontal=True) target_audience_location = st.radio("Target location: \n\n",["Urban", "Suburban","Rural"],key="target_audience_location",horizontal=True) st.write("Select your marketing campaign goal: ") campaign_goal = st.multiselect("Select your marketing campaign goal: \n\n",["Increase brand awareness","Generate leads","Drive sales","Improve brand sentiment"],key="campaign_goal",default=["Increase brand awareness","Generate leads"]) if campaign_goal is None: campaign_goal = ["Increase brand awareness","Generate leads"] brand_voice = st.radio("Select your brand voice: \n\n",["Formal","Informal","Serious","Humorous"],key="brand_voice",horizontal=True) estimated_budget = st.radio("Select your estimated budget ($): \n\n",["1,000-5,000","5,000-10,000","10,000-20,000","20,000+"],key="estimated_budget",horizontal=True) prompt = f"""Generate a marketing campaign for {product_name}, a {product_category} designed for the age group: {target_audience_age}. The target location is this: {target_audience_location}. Aim to primarily achieve {campaign_goal}. Emphasize the product's unique selling proposition while using a {brand_voice} tone of voice. Allocate the total budget of {estimated_budget}. With these inputs, make sure to follow following guidelines and generate the marketing campaign with proper headlines: \n - Briefly describe the company, its values, mission, and target audience. - Highlight any relevant brand guidelines or messaging frameworks. - Provide a concise overview of the campaign's objectives and goals. - Briefly explain the product or service being promoted. - Define your ideal customer with clear demographics, psychographics, and behavioral insights. - Understand their needs, wants, motivations, and pain points. - Clearly articulate the desired outcomes for the campaign. - Use SMART goals (Specific, Measurable, Achievable, Relevant, and Time-bound) for clarity. - Define key performance indicators (KPIs) to track progress and success. - Specify the primary and secondary goals of the campaign. - Examples include brand awareness, lead generation, sales growth, or website traffic. - Clearly define what differentiates your product or service from competitors. - Emphasize the value proposition and unique benefits offered to the target audience. - Define the desired tone and personality of the campaign messaging. - Identify the specific channels you will use to reach your target audience. - Clearly state the desired action you want the audience to take. - Make it specific, compelling, and easy to understand. - Identify and analyze your key competitors in the market. - Understand their strengths and weaknesses, target audience, and marketing strategies. - Develop a differentiation strategy to stand out from the competition. - Define how you will track the success of the campaign. - Use relevant KPIs to measure performance and return on investment (ROI). Provide bullet points and headlines for the marketing campaign. Do not produce any empty lines. Be very succinct and to the point. """ return prompt # function to render the story tab, and call the model, and display the model prompt and response. def render_mktg_campaign_tab (text_model_pro: GenerativeModel): st.write("Using Gemini 1.0 Pro - Text only model") st.subheader("Generate a marketing campaign") prompt = generate_prompt() config = { "temperature": 0.8, "max_output_tokens": 2048, } generate_t2m = st.button("Generate campaign", key="generate_t2m") if generate_t2m and prompt: # st.write(prompt) with st.spinner("Generating a marketing campaign using Gemini..."): first_tab1, first_tab2 = st.tabs(["Campaign response", "Prompt"]) with first_tab1: response = get_gemini_pro_text_response(text_model_pro, prompt, generation_config=config) if response: st.write("Marketing campaign:") st.write(response) logging.info(response) with first_tab2: st.text(prompt) EOF

Modifier le point d'entrée principal de l'application

  • Pour ajouter tab2 à l'application, exécutez la commande suivante :

    cat >> ~/gemini-app/app.py <<EOF from app_tab2 import render_mktg_campaign_tab with tab2: render_mktg_campaign_tab(text_model_pro) EOF

Tester l'application : onglet "Marketing campaign"

Générez une campagne marketing en fournissant une entrée, affichez la requête et visualisez la réponse générée par le modèle Gemini 1.0 Pro.

  1. Pour exécuter l'application localement, lancez la commande suivante dans Cloud Shell :

    streamlit run app.py \ --browser.serverAddress=localhost \ --server.enableCORS=false \ --server.enableXsrfProtection=false \ --server.port 8080

    L'application démarre et une URL vous permettant d'y accéder est fournie.

  2. Pour lancer la page d'accueil de l'application dans votre navigateur, cliquez sur Aperçu sur le Web dans la barre de menu de Cloud Shell, puis sur Prévisualiser sur le port 8080.

  3. Pour générer une campagne marketing, dans l'onglet Marketing campaign, conservez les paramètres par défaut et cliquez sur Generate campaign (Générer une campagne).

  4. Attendez que la réponse soit générée, puis cliquez sur l'onglet Campaign response (Campagne générée).

  5. Pour afficher la requête qui a été utilisée pour générer la réponse, cliquez sur l'onglet Prompt (Requête).

  6. Répétez les étapes ci-dessus pour générer plusieurs campagnes marketing avec différentes valeurs pour les paramètres tels que la catégorie de produits, l'audience cible, la zone géographique et les objectifs de la campagne.

  7. Dans la fenêtre Cloud Shell, arrêtez l'application et revenez à l'invite de commande en appuyant sur Ctrl+C.

Cliquez sur Vérifier ma progression pour valider l'objectif. L'onglet "Marketing campaign" de l'application est développé.

Tâche 6 : Générer l'onglet "Image Playground"

Dans cette tâche, vous allez exploiter le modèle Gemini 1.0 Pro Vision pour traiter des images, et recevoir des recommandations et des informations générées à partir des images fournies au modèle.

Développer tab3 : onglet "Image Playground"

Dans cette sous-tâche, vous allez implémenter le code pour l'onglet Image Playground et le code permettant d'interagir avec le modèle pour générer des recommandations à partir d'une image.

  1. Pour écrire le code qui affiche l'onglet Image Playground dans l'UI de l'application, exécutez la commande suivante :

    cat > ~/gemini-app/app_tab3.py <<EOF import streamlit as st from vertexai.preview.generative_models import GenerativeModel, Part from response_utils import * import logging # render the Image Playground tab with multiple child tabs def render_image_playground_tab(multimodal_model_pro: GenerativeModel): st.write("Using Gemini 1.0 Pro Vision - Multimodal model") recommendations, screens, diagrams, equations = st.tabs(["Furniture recommendation", "Oven instructions", "ER diagrams", "Math reasoning"]) with recommendations: room_image_uri = "gs://cloud-training/OCBL447/gemini-app/images/living_room.jpeg" chair_1_image_uri = "gs://cloud-training/OCBL447/gemini-app/images/chair1.jpeg" chair_2_image_uri = "gs://cloud-training/OCBL447/gemini-app/images/chair2.jpeg" chair_3_image_uri = "gs://cloud-training/OCBL447/gemini-app/images/chair3.jpeg" chair_4_image_uri = "gs://cloud-training/OCBL447/gemini-app/images/chair4.jpeg" room_image_url = "https://storage.googleapis.com/"+room_image_uri.split("gs://")[1] chair_1_image_url = "https://storage.googleapis.com/"+chair_1_image_uri.split("gs://")[1] chair_2_image_url = "https://storage.googleapis.com/"+chair_2_image_uri.split("gs://")[1] chair_3_image_url = "https://storage.googleapis.com/"+chair_3_image_uri.split("gs://")[1] chair_4_image_url = "https://storage.googleapis.com/"+chair_4_image_uri.split("gs://")[1] room_image = Part.from_uri(room_image_uri, mime_type="image/jpeg") chair_1_image = Part.from_uri(chair_1_image_uri,mime_type="image/jpeg") chair_2_image = Part.from_uri(chair_2_image_uri,mime_type="image/jpeg") chair_3_image = Part.from_uri(chair_3_image_uri,mime_type="image/jpeg") chair_4_image = Part.from_uri(chair_4_image_uri,mime_type="image/jpeg") st.image(room_image_url,width=350, caption="Image of a living room") st.image([chair_1_image_url,chair_2_image_url,chair_3_image_url,chair_4_image_url],width=200, caption=["Chair 1","Chair 2","Chair 3","Chair 4"]) st.write("Our expectation: Recommend a chair that would complement the given image of a living room.") prompt_list = ["Consider the following chairs:", "chair 1:", chair_1_image, "chair 2:", chair_2_image, "chair 3:", chair_3_image, "and", "chair 4:", chair_4_image, "\n" "For each chair, explain why it would be suitable or not suitable for the following room:", room_image, "Only recommend for the room provided and not other rooms. Provide your recommendation in a table format with chair name and reason as columns.", ] tab1, tab2 = st.tabs(["Response", "Prompt"]) generate_image_description = st.button("Generate recommendation", key="generate_image_description") with tab1: if generate_image_description and prompt_list: with st.spinner("Generating recommendation using Gemini..."): response = get_gemini_pro_vision_response(multimodal_model_pro, prompt_list) st.markdown(response) logging.info(response) with tab2: st.write("Prompt used:") st.text(prompt_list) EOF

  2. Affichez le contenu du fichier app_tab3.py avec la commande suivante :

    cat ~/gemini-app/app_tab3.py

    La fonction render_image_playground_tab génère l'UI qui permet à l'utilisateur de l'application d'interagir avec le modèle Gemini 1.0 Pro Vision. Elle crée un ensemble d'onglets dans l'UI : "Furniture recommendation" (Recommandations de meubles), "Oven instructions" (Instructions du four), "ER diagrams" (Diagramme de relations d'entités) et "Math reasoning" (Raisonnement mathématique). Vous écrirez le code pour les onglets restants dans les tâches suivantes de cet atelier.

    Dans l'onglet Furniture recommendation, une analyse visuelle est effectuée à partir de l'image d'un salon. Plusieurs images de fauteuils sont également utilisées. Le code appelle le point de terminaison multimodal de l'API Gemini 1.0 Pro Vision afin d'obtenir une recommandation pour un fauteuil qui s'intègre bien au salon.

    Image d&#39;un salon

    Le code utilise plusieurs requêtes textuelles, ainsi que les images du salon et des fauteuils, et fournit le tout au modèle sous forme de liste. La classe Part permet d'obtenir l'image à partir de l'URI du contenu en plusieurs parties qui est hébergé dans un bucket Cloud Storage. La requête spécifie également qu'un format tabulaire doit être utilisé pour la sortie du modèle, et que l'explication de la recommandation doit être incluse.

Mettre à jour response_utils

Le fichier response_utils.py contient les fonctions permettant de générer les réponses du modèle.

  • Mettez à jour le fichier pour ajouter le code qui génère la réponse multimodale du modèle :

    cat >> ~/gemini-app/response_utils.py <<EOF def get_gemini_pro_vision_response(model: GenerativeModel, prompt_list, generation_config={}, stream=True): generation_config = {'temperature': 0.1, 'max_output_tokens': 2048 } responses = model.generate_content(prompt_list, generation_config = generation_config, stream=True) final_response = [] for response in responses: try: final_response.append(response.text) except IndexError: final_response.append("") continue return(" ".join(final_response)) EOF

Modifier le point d'entrée principal de l'application

  • Pour ajouter tab3 à l'application, exécutez la commande suivante :

    cat >> ~/gemini-app/app.py <<EOF from app_tab3 import render_image_playground_tab with tab3: render_image_playground_tab(multimodal_model_pro) EOF

Tester l'application : onglet "Image Playground"

  1. Exécutez l'application en utilisant la commande fournie lors des étapes précédentes de l'atelier.

  2. Pour lancer la page d'accueil de l'application dans votre navigateur, cliquez sur Aperçu sur le Web dans la barre de menu de Cloud Shell, puis sur Prévisualiser sur le port 8080.

  3. Cliquez sur Image Playground, puis sur Furniture recommendation.

    L'onglet présente les images du salon et des fauteuils.

  4. Cliquez sur Generate recommendation.

    Si vous recevez le message d'erreur suivant : FailedPrecondition: 400 We are preparing necessary resources. Please wait few minutes and retry, patientez quelques minutes et cliquez de nouveau sur Generate recommendation.

  5. Affichez la réponse du modèle Gemini 1.0 Pro Vision.

    La réponse est au format tabulaire comme demandé dans la requête. Le modèle recommande deux des quatre fauteuils et fournit l'explication de la recommandation.

  6. Dans la fenêtre Cloud Shell, arrêtez l'application et revenez à l'invite de commande en appuyant sur Ctrl+C.

Cliquez sur Vérifier ma progression pour valider l'objectif. L'onglet "Image playground" avec l'onglet "Furniture recommendation" est développé.

Tâche 7 : Analyser la mise en page des images

Dans cette tâche, vous allez utiliser le modèle Gemini 1.0 Pro Vision pour extraire les informations d'une image après avoir analysé l'organisation des icônes et du texte sur cette image.

Intégrer les informations de l'onglet "Oven Instructions" à l'onglet "Image Playground"

Grâce à sa capacité d'extraction d'informations à partir d'éléments visuels sur des écrans, Gemini peut analyser des captures d'écran, des icônes et des mises en page pour offrir une compréhension globale de ce qui est représenté. Dans cette tâche, vous allez fournir au modèle l'image du panneau de commande d'un four ménager, et lui demander de générer des instructions concernant une fonction spécifique.

  • Pour implémenter le code de l'onglet Oven instructions dans l'onglet Image Playground de l'UI de l'application, exécutez la commande suivante :

    cat >> ~/gemini-app/app_tab3.py <<EOF with screens: oven_screen_uri = "gs://cloud-training/OCBL447/gemini-app/images/oven.jpg" oven_screen_url = "https://storage.googleapis.com/"+oven_screen_uri.split("gs://")[1] oven_screen_img = Part.from_uri(oven_screen_uri, mime_type="image/jpeg") st.image(oven_screen_url, width=350, caption="Image of an oven control panel") st.write("Provide instructions for resetting the clock on this appliance in English") prompt = """How can I reset the clock on this appliance? Provide the instructions in English. If instructions include buttons, also explain where those buttons are physically located. """ tab1, tab2 = st.tabs(["Response", "Prompt"]) generate_instructions_description = st.button("Generate instructions", key="generate_instructions_description") with tab1: if generate_instructions_description and prompt: with st.spinner("Generating instructions using Gemini..."): response = get_gemini_pro_vision_response(multimodal_model_pro, [oven_screen_img, prompt]) st.markdown(response) logging.info(response) with tab2: st.write("Prompt used:") st.text(prompt+"\n"+"input_image") EOF

    Le code ci-dessus crée l'UI de l'onglet Oven instructions. L'image du panneau de commande d'un four ménager est associée à un texte demandant au modèle de générer les instructions d'une fonction spécifique disponible sur le panneau, dans le cas présent, la réinitialisation de l'horloge.

    Panneau de commande du four de cuisson

Tester l'application : onglets "Image playground" et "Oven instructions"

  1. Exécutez l'application en utilisant la commande fournie lors des étapes précédentes de l'atelier.

  2. Pour lancer la page d'accueil de l'application dans votre navigateur, cliquez sur Aperçu sur le Web dans la barre de menu de Cloud Shell, puis sur Prévisualiser sur le port 8080.

  3. Cliquez sur Image Playground, puis sur Oven instructions.

    L'onglet affiche l'image d'un panneau de commande de four.

  4. Cliquez sur Generate instructions (Générer des instructions).

  5. Affichez la réponse du modèle Gemini 1.0 Pro Vision.

    Elle contient les étapes permettant de réinitialiser l'horloge sur le panneau de commande du four. Elle indique également où trouver le bouton sur le panneau, ce qui démontre la capacité du modèle à analyser l'organisation du panneau dans l'image.

  6. Dans la fenêtre Cloud Shell, arrêtez l'application et revenez à l'invite de commande en appuyant sur Ctrl+C.

Cliquez sur Vérifier ma progression pour valider l'objectif. L'onglet "Image playground" avec l'onglet "Oven instructions" est développé.

Tâche 8 : Analyser des diagrammes de relations d'entités

Grâce à ses fonctionnalités multimodales, Gemini peut comprendre des diagrammes et exécuter des actions concrètes, comme générer des documents ou du code. Dans cette tâche, vous allez exploiter le modèle Gemini 1.0 Pro Vision pour analyser un diagramme de relations d'entités, et générer la documentation sur les entités et les relations identifiées dans le diagramme.

Intégrer les informations de l'onglet "ER diagrams" à l'onglet "Image Playground"

Dans cette tâche, vous allez fournir au modèle l'image d'un diagramme de relations d'entités. Vous lui enverrez ensuite une requête pour générer la documentation associée.

  • Pour implémenter le code de l'onglet ER diagrams dans l'onglet Image Playground de l'UI de l'application, exécutez la commande suivante :

    cat >> ~/gemini-app/app_tab3.py <<EOF with diagrams: er_diag_uri = "gs://cloud-training/OCBL447/gemini-app/images/er.png" er_diag_url = "https://storage.googleapis.com/"+er_diag_uri.split("gs://")[1] er_diag_img = Part.from_uri(er_diag_uri,mime_type="image/png") st.image(er_diag_url, width=350, caption="Image of an ER diagram") st.write("Document the entities and relationships in this ER diagram.") prompt = """Document the entities and relationships in this ER diagram.""" tab1, tab2 = st.tabs(["Response", "Prompt"]) er_diag_img_description = st.button("Generate documentation", key="er_diag_img_description") with tab1: if er_diag_img_description and prompt: with st.spinner("Generating..."): response = get_gemini_pro_vision_response(multimodal_model_pro,[er_diag_img,prompt]) st.markdown(response) logging.info(response) with tab2: st.write("Prompt used:") st.text(prompt+"\n"+"input_image") EOF

    Le code ci-dessus crée l'UI de l'onglet ER diagrams. L'image d'un diagramme de relations d'entités est associée à un texte demandant au modèle de générer la documentation sur les entités et les relations identifiées dans le diagramme.

    Diagramme de relations d&#39;entités

Tester l'application : onglets "Image Playground" et "ER diagrams"

  1. Exécutez l'application en utilisant la commande fournie lors des étapes précédentes de l'atelier.

  2. Pour lancer la page d'accueil de l'application dans votre navigateur, cliquez sur Aperçu sur le Web dans la barre de menu de Cloud Shell, puis sur Prévisualiser sur le port 8080.

  3. Cliquez sur Image Playground, puis sur ER diagrams.

    L'onglet affiche l'image du diagramme de relations d'entités.

  4. Cliquez sur Generate documentation (Génération la documentation).

  5. Affichez la réponse du modèle Gemini 1.0 Pro Vision.

    Celle-ci contient la liste des entités et leurs relations identifiées dans le diagramme.

  6. Dans la fenêtre Cloud Shell, arrêtez l'application et revenez à l'invite de commande en appuyant sur Ctrl+C.

Cliquez sur Vérifier ma progression pour valider l'objectif. L'onglet "Image playground" avec l'onglet "ER diagrams" est développé.

Tâche 9 : Raisonnement mathématique

Gemini 1.0 Pro Vision peut également reconnaître des équations et des formules mathématiques, et en extraire des informations spécifiques. Cette capacité est particulièrement utile pour générer des explications de problèmes mathématiques.

Intégrer les informations de l'onglet "Math reasoning" à l'onglet "Image Playground"

Dans cette tâche, vous allez exploiter le modèle Gemini 1.0 Pro Vision pour extraire et interpréter une formule mathématique à partir d'une image.

  • Pour implémenter le code de l'onglet Math reasoning dans l'onglet Image Playground de l'UI de l'application, exécutez la commande suivante :

    cat >> ~/gemini-app/app_tab3.py <<EOF with equations: math_image_uri = "gs://cloud-training/OCBL447/gemini-app/images/math_eqn.jpg" math_image_url = "https://storage.googleapis.com/"+math_image_uri.split("gs://")[1] math_image_img = Part.from_uri(math_image_uri,mime_type="image/jpeg") st.image(math_image_url,width=350, caption="Image of a math equation") st.markdown(f""" Ask questions about the math equation as follows: - Extract the formula. - What is the symbol right before Pi? What does it mean? - Is this a famous formula? Does it have a name? """) prompt = """Follow the instructions. Surround math expressions with $. Use a table with a row for each instruction and its result. INSTRUCTIONS: - Extract the formula. - What is the symbol right before Pi? What does it mean? - Is this a famous formula? Does it have a name? """ tab1, tab2 = st.tabs(["Response", "Prompt"]) math_image_description = st.button("Generate answers", key="math_image_description") with tab1: if math_image_description and prompt: with st.spinner("Generating answers for formula using Gemini..."): response = get_gemini_pro_vision_response(multimodal_model_pro, [math_image_img, prompt]) st.markdown(response) logging.info(response) with tab2: st.write("Prompt used:") st.text(prompt) EOF

    Le code ci-dessus crée l'UI de l'onglet Math reasoning. L'image d'une équation mathématique est associée à un texte demandant au modèle de générer des réponses et d'autres caractéristiques sur l'équation.

    Équation mathématique

Tester l'application : onglets "Image Playground" et "Math reasoning"

  1. Exécutez l'application en utilisant la commande fournie lors des étapes précédentes de l'atelier.

  2. Pour lancer la page d'accueil de l'application dans votre navigateur, cliquez sur Aperçu sur le Web dans la barre de menu de Cloud Shell, puis sur Prévisualiser sur le port 8080.

  3. Cliquez sur Image Playground, puis sur Math reasoning.

    L'onglet affiche l'image contenant l'équation mathématique.

  4. Cliquez sur Generate answers (Générate les réponses).

  5. Affichez la réponse du modèle Gemini 1.0 Pro Vision.

    Celle-ci contient les réponses aux questions posées dans la requête envoyée au modèle.

  6. Dans la fenêtre Cloud Shell, arrêtez l'application et revenez à l'invite de commande en appuyant sur Ctrl+C.

Cliquez sur Vérifier ma progression pour valider l'objectif. L'onglet "Image playground" avec l'onglet "Math reasoning" est développé.

Tâche 10 : Générer l'onglet "Video playground"

Dans cette tâche, vous allez exploiter le modèle Gemini 1.0 Pro Vision pour traiter des vidéos. Vous générerez des tags et des informations à partir des vidéos fournies au modèle.

Développer tab4 : "Video Playground"

Le modèle Gemini 1.0 Pro Vision peut également fournir la description de ce qu'il se passe dans une vidéo. Dans cette sous-tâche, vous allez implémenter le code pour l'onglet Video Playground et le code permettant d'interagir avec le modèle pour générer la description d'une vidéo.

  1. Pour écrire le code qui affiche l'onglet Video Playground dans l'UI de l'application, exécutez la commande suivante :

    cat > ~/gemini-app/app_tab4.py <<EOF import streamlit as st from vertexai.preview.generative_models import GenerativeModel, Part from response_utils import * import logging # render the Video Playground tab with multiple child tabs def render_video_playground_tab(multimodal_model_pro: GenerativeModel): st.write("Using Gemini 1.0 Pro Vision - Multimodal model") video_desc, video_tags, video_highlights, video_geoloc = st.tabs(["Video description", "Video tags", "Video highlights", "Video geolocation"]) with video_desc: video_desc_uri = "gs://cloud-training/OCBL447/gemini-app/videos/mediterraneansea.mp4" video_desc_url = "https://storage.googleapis.com/"+video_desc_uri.split("gs://")[1] video_desc_vid = Part.from_uri(video_desc_uri, mime_type="video/mp4") st.video(video_desc_url) st.write("Generate a description of the video.") prompt = """Describe what is happening in the video and answer the following questions: \n - What am I looking at? - Where should I go to see it? - What are other top 5 places in the world that look like this? """ tab1, tab2 = st.tabs(["Response", "Prompt"]) video_desc_description = st.button("Generate video description", key="video_desc_description") with tab1: if video_desc_description and prompt: with st.spinner("Generating video description"): response = get_gemini_pro_vision_response(multimodal_model_pro, [prompt, video_desc_vid]) st.markdown(response) logging.info(response) with tab2: st.write("Prompt used:") st.write(prompt,"\n","{video_data}") EOF

  2. Affichez le contenu du fichier app_tab4.py avec la commande suivante :

    cat ~/gemini-app/app_tab4.py

    La fonction render_video_playground_tab génère l'UI qui permet à l'utilisateur de l'application d'interagir avec le modèle Gemini 1.0 Pro Vision. Elle crée un ensemble d'onglets dans l'UI : "Video description" (Description de la vidéo), "Video tags" (Tags de la vidéo), "Video highlights" (Éléments importants de la vidéo) et "Video geolocation" (Géolocalisation de la vidéo). Vous écrirez le code pour les onglets restants dans les tâches suivantes de cet atelier.

    L'onglet Video description permet d'associer une requête à la vidéo pour générer une description de la vidéo et identifier d'autres endroits ressemblant au lieu où se déroule celle-ci.

Modifier le point d'entrée principal de l'application

  • Pour ajouter tab4 à l'application, exécutez la commande suivante :

    cat >> ~/gemini-app/app.py <<EOF from app_tab4 import render_video_playground_tab with tab4: render_video_playground_tab(multimodal_model_pro) EOF

Tester l'application : onglet "Video Playground"

  1. Exécutez l'application en utilisant la commande fournie lors des étapes précédentes de l'atelier.

  2. Pour lancer la page d'accueil de l'application dans votre navigateur, cliquez sur Aperçu sur le Web dans la barre de menu de Cloud Shell, puis sur Prévisualiser sur le port 8080.

  3. Cliquez sur Video Playground, puis sur Video description.

  4. L'onglet présente la vidéo d'un lieu. Cliquez sur la vidéo pour la lancer.

  5. Cliquez sur Generate video description (Générer une description de la vidéo).

  6. Affichez la réponse du modèle Gemini 1.0 Pro Vision.

    La réponse contient une description du lieu, et indique cinq autres endroits similaires.

  7. Dans la fenêtre Cloud Shell, arrêtez l'application et revenez à l'invite de commande en appuyant sur Ctrl+C.

Cliquez sur Vérifier ma progression pour valider l'objectif. L'onglet "Video playground" de l'application avec l'onglet "Video description" est développé.

Tâche 11 : Générer des tags de vidéo

Dans cette tâche, vous allez exploiter le modèle Gemini 1.0 Pro Vision pour générer des tags à partir d'une vidéo.

Intégrer les informations de l'onglet "Video tags" à l'onglet "Video Playground"

  • Pour implémenter le code de l'onglet Video tags dans l'onglet Video Playground de l'UI de l'application, exécutez la commande suivante :

    cat >> ~/gemini-app/app_tab4.py <<EOF with video_tags: video_tags_uri = "gs://cloud-training/OCBL447/gemini-app/videos/photography.mp4" video_tags_url = "https://storage.googleapis.com/"+video_tags_uri.split("gs://")[1] video_tags_vid = Part.from_uri(video_tags_uri, mime_type="video/mp4") st.video(video_tags_url) st.write("Generate tags for the video.") prompt = """Answer the following questions using the video only: 1. What is in the video? 2. What objects are in the video? 3. What is the action in the video? 4. Provide 5 best tags for this video? Write the answer in table format with the questions and answers in columns. """ tab1, tab2 = st.tabs(["Response", "Prompt"]) video_tags_desc = st.button("Generate video tags", key="video_tags_desc") with tab1: if video_tags_desc and prompt: with st.spinner("Generating video tags"): response = get_gemini_pro_vision_response(multimodal_model_pro, [prompt, video_tags_vid]) st.markdown(response) logging.info(response) with tab2: st.write("Prompt used:") st.write(prompt,"\n","{video_data}") EOF

    Le code ci-dessus crée l'UI de l'onglet Video tags. Une vidéo est associée à un texte demandant au modèle de générer des tags et de répondre aux questions sur les scènes de la vidéo.

Tester l'application : onglets "Video Playground" et "Video tags"

  1. Exécutez l'application en utilisant la commande fournie lors des étapes précédentes de l'atelier.

  2. Pour lancer la page d'accueil de l'application dans votre navigateur, cliquez sur Aperçu sur le Web dans la barre de menu de Cloud Shell, puis sur Prévisualiser sur le port 8080.

  3. Cliquez sur Video Playground, puis sur Video tags.

  4. L'onglet affiche la vidéo qui sera utilisée pour la requête envoyée au modèle. Cliquez sur la vidéo pour la lancer.

  5. Cliquez sur Generate video tags (Générer des tags pour la vidéo)

  6. Affichez la réponse du modèle Gemini 1.0 Pro Vision.

    Elle contient les réponses aux questions posées dans la requête envoyée au modèle. Les questions et les réponses sont renvoyées sous un format tabulaire et incluent cinq tags, comme demandé.

  7. Dans la fenêtre Cloud Shell, arrêtez l'application et revenez à l'invite de commande en appuyant sur Ctrl+C.

Cliquez sur Vérifier ma progression pour valider l'objectif. L'onglet "Video playground" avec l'onglet "Video tags" est développé.

Tâche 12 : Générer les éléments importants d'une vidéo

Dans cette tâche, vous allez exploiter le modèle Gemini 1.0 Pro Vision pour générer les points importants d'une vidéo, y compris des informations sur les objets et les personnes apparaissant dans la vidéo, ainsi que des éléments de contexte.

Intégrer les informations de l'onglet "Video highlights" à l'onglet "Video Playground"

  • Pour implémenter le code de l'onglet Video highlights dans l'onglet Video Playground de l'UI de l'application, exécutez la commande suivante :

    cat >> ~/gemini-app/app_tab4.py <<EOF with video_highlights: video_highlights_uri = "gs://cloud-training/OCBL447/gemini-app/videos/pixel8.mp4" video_highlights_url = "https://storage.googleapis.com/"+video_highlights_uri.split("gs://")[1] video_highlights_vid = Part.from_uri(video_highlights_uri, mime_type="video/mp4") st.video(video_highlights_url) st.write("Generate highlights for the video.") prompt = """Answer the following questions using the video only: What is the profession of the girl in this video? Which features of the phone are highlighted here? Summarize the video in one paragraph. Write these questions and their answers in table format. """ tab1, tab2 = st.tabs(["Response", "Prompt"]) video_highlights_description = st.button("Generate video highlights", key="video_highlights_description") with tab1: if video_highlights_description and prompt: with st.spinner("Generating video highlights"): response = get_gemini_pro_vision_response(multimodal_model_pro, [prompt, video_highlights_vid]) st.markdown(response) logging.info(response) with tab2: st.write("Prompt used:") st.write(prompt,"\n","{video_data}") EOF

    Le code ci-dessus crée l'UI de l'onglet Video highlights. Une vidéo est associée à un texte demandant au modèle de générer les points importants à partir de la vidéo.

Tester l'application : onglets "Video Playground" et "Video highlights"

  1. Exécutez l'application en utilisant la commande fournie lors des étapes précédentes de l'atelier.

  2. Pour lancer la page d'accueil de l'application dans votre navigateur, cliquez sur Aperçu sur le Web dans la barre de menu de Cloud Shell, puis sur Prévisualiser sur le port 8080.

  3. Cliquez sur Video Playground, puis sur Video highlights.

  4. L'onglet affiche la vidéo qui sera utilisée pour la requête envoyée au modèle. Cliquez sur la vidéo pour la lancer.

  5. Cliquez sur Generate video highlights (Générer des éléments importants de la vidéo).

  6. Affichez la réponse du modèle Gemini 1.0 Pro Vision.

    Elle contient les réponses aux questions posées dans la requête envoyée au modèle. Les questions et les réponses sont renvoyées sous un format tabulaire. Elles présentent une liste de caractéristiques de la vidéo, telles que la profession de la fille, ou encore les fonctionnalités du téléphone qui sont utilisées. La réponse contient également une description succincte des scènes de la vidéo.

  7. Dans la fenêtre Cloud Shell, arrêtez l'application et revenez à l'invite de commande en appuyant sur Ctrl+C.

Cliquez sur Vérifier ma progression pour valider l'objectif. L'onglet "Video playground" avec l'onglet "Video highlights" est développé.

Tâche 13 : Générer la géolocalisation d'une vidéo

Dans cette tâche, vous allez exploiter le modèle Gemini 1.0 Pro Vision pour déterminer où se déroule la scène montrée dans la vidéo.

Intégrer les informations de l'onglet "Video geolocation" à l'onglet "Video Playground"

  • Pour implémenter le code de l'onglet Video geolocation dans l'onglet Video Playground de l'UI de l'application, exécutez la commande suivante :

    cat >> ~/gemini-app/app_tab4.py <<EOF with video_geoloc: video_geolocation_uri = "gs://cloud-training/OCBL447/gemini-app/videos/bus.mp4" video_geolocation_url = "https://storage.googleapis.com/"+video_geolocation_uri.split("gs://")[1] video_geolocation_vid = Part.from_uri(video_geolocation_uri, mime_type="video/mp4") st.video(video_geolocation_url) st.markdown("""Answer the following questions from the video: - What is this video about? - How do you know which city it is? - What street is this? - What is the nearest intersection? """) prompt = """Answer the following questions using the video only: What is this video about? How do you know which city it is? What street is this? What is the nearest intersection? Answer the following questions using a table format with the questions and answers as columns. """ tab1, tab2 = st.tabs(["Response", "Prompt"]) video_geolocation_description = st.button("Generate", key="video_geolocation_description") with tab1: if video_geolocation_description and prompt: with st.spinner("Generating location information"): response = get_gemini_pro_vision_response(multimodal_model_pro, [prompt, video_geolocation_vid]) st.markdown(response) logging.info(response) with tab2: st.write("Prompt used:") st.write(prompt,"\n","{video_data}") EOF

    Le code ci-dessus crée l'UI de l'onglet Video geolocation. Une vidéo est associée à un texte demandant au modèle de répondre à des questions sur la vidéo. Celui-ci devra, entre autres, fournir des informations sur la localisation des entités apparaissant dans la vidéo.

Tester l'application : onglets "Video Playground" et "Video geolocation"

  1. Exécutez l'application en utilisant la commande fournie lors des étapes précédentes de l'atelier.

  2. Pour lancer la page d'accueil de l'application dans votre navigateur, cliquez sur Aperçu sur le Web dans la barre de menu de Cloud Shell, puis sur Prévisualiser sur le port 8080.

  3. Cliquez sur Video Playground, puis sur Video geolocation.

  4. L'onglet affiche la vidéo qui sera utilisée pour la requête envoyée au modèle. Cliquez sur la vidéo pour la lancer.

  5. Cliquez sur Générer.

  6. Affichez la réponse du modèle Gemini 1.0 Pro Vision.

    Elle contient les réponses aux questions posées dans la requête envoyée au modèle. Les questions et les réponses sont renvoyées sous un format tabulaire et contiennent les informations de localisation, comme demandé.

  7. Dans la fenêtre Cloud Shell, arrêtez l'application et revenez à l'invite de commande en appuyant sur Ctrl+C.

Cliquez sur Vérifier ma progression pour valider l'objectif. L'onglet "Video playground" avec l'onglet "Video geolocation" est développé.

Tâche 14 : Déployer l'application sur Cloud Run

Maintenant que vous avez testé l'application localement, vous pouvez la mettre à la disposition d'autres utilisateurs en la déployant dans Cloud Run sur Google Cloud. Cloud Run est une plate-forme de calcul gérée qui vous permet d'exécuter des applications conteneurisées sur l'infrastructure évolutive de Google.

Configurer l'environnement

  1. Vérifiez que vous êtes bien dans le répertoire app :

    cd ~/gemini-app

  2. Assurez-vous que les variables d'environnement "PROJECT_ID" et "REGION" sont définies :

    echo "PROJECT_ID=${PROJECT_ID}" echo "REGION=${REGION}"

  3. Si ce n'est pas le cas, exécutez la commande suivante pour les définir :

    PROJECT_ID=$(gcloud config get-value project) REGION={{{project_0.default_region|set at lab start}}} echo "PROJECT_ID=${PROJECT_ID}" echo "REGION=${REGION}"

  4. Définissez des variables d'environnement pour votre service et votre dépôt d'artefacts :

    SERVICE_NAME='gemini-app-playground' # Name of your Cloud Run service. AR_REPO='gemini-app-repo' # Name of your repository in Artifact Registry that stores your application container image. echo "SERVICE_NAME=${SERVICE_NAME}" echo "AR_REPO=${AR_REPO}"

Créer le dépôt Docker

  1. Pour créer le dépôt dans Artifact Registry, exécutez la commande suivante :

    gcloud artifacts repositories create "$AR_REPO" --location="$REGION" --repository-format=Docker Artifact Registry ia a Google Cloud service that provides a single location for storing and managing your software packages and Docker container images.

  2. Configurez l'authentification auprès du dépôt avec la commande ci-dessous :

    gcloud auth configure-docker "$REGION-docker.pkg.dev"

Créer l'image de conteneur

Nous allons utiliser un Dockerfile afin de créer l'image de conteneur pour notre application. Un Dockerfile est un document texte contenant toutes les commandes qu'un utilisateur peut appeler sur la ligne de commande pour assembler une image de conteneur. Il est utilisé avec Docker, une plate-forme de conteneurs qui permet de créer et d'exécuter des images de conteneurs.

  1. Pour créer un Dockerfile, exécutez la commande suivante :

    cat > ~/gemini-app/Dockerfile <<EOF FROM python:3.8 EXPOSE 8080 WORKDIR /app COPY . ./ RUN pip install -r requirements.txt ENTRYPOINT ["streamlit", "run", "app.py", "--server.port=8080", "--server.address=0.0.0.0"] EOF

  2. Pour créer l'image de conteneur de votre application, exécutez la commande ci-dessous :

    gcloud builds submit --tag "$REGION-docker.pkg.dev/$PROJECT_ID/$AR_REPO/$SERVICE_NAME" La commande gcloud builds submit permet de générer un build à l'aide de Cloud Build. Lorsque la commande contient l'option tag, Cloud Build utilise un Dockerfile pour créer une image de conteneur à partir des fichiers d'application présents dans votre répertoire source.

    Cloud Build est un service qui exécute les compilations conformément aux spécifications que vous avez définies sur Google Cloud, et qui produit des artefacts tels que des conteneurs Docker ou des archives Java.

    Patientez jusqu'à l'exécution complète de la commande avant de passer à l'étape suivante.

Déployer votre application sur Cloud Run et la tester

La dernière étape consiste à déployer le service sur Cloud Run à l'aide de l'image qui a été créée et transférée au dépôt dans Artifact Registry.

  1. Pour déployer votre application sur Cloud Run, exécutez la commande suivante :

    gcloud run deploy "$SERVICE_NAME" \ --port=8080 \ --image="$REGION-docker.pkg.dev/$PROJECT_ID/$AR_REPO/$SERVICE_NAME" \ --allow-unauthenticated \ --region=$REGION \ --platform=managed \ --project=$PROJECT_ID \ --set-env-vars=PROJECT_ID=$PROJECT_ID,REGION=$REGION

  2. Une fois le service déployé, une URL de service est générée et renvoyée dans le résultat de la commande précédente. Pour tester votre application sur Cloud Run, accédez à cette URL dans une fenêtre ou un onglet de navigateur distinct.

  3. Choisissez la fonctionnalité de l'application que vous souhaitez tester. L'application demandera à l'API Gemini Vertex AI de générer et d'afficher les réponses.

Cliquez sur Vérifier ma progression pour valider l'objectif. L'application est déployée dans Cloud Run.

Terminer l'atelier

Une fois l'atelier terminé, cliquez sur End Lab (Terminer l'atelier). Qwiklabs supprime les ressources que vous avez utilisées, puis efface le compte.

Si vous le souhaitez, vous pouvez noter l'atelier. Sélectionnez le nombre d'étoiles correspondant à votre note, saisissez un commentaire, puis cliquez sur Submit (Envoyer).

Le nombre d'étoiles que vous pouvez attribuer à un atelier correspond à votre degré de satisfaction :

  • 1 étoile = très mécontent(e)
  • 2 étoiles = insatisfait(e)
  • 3 étoiles = ni insatisfait(e), ni satisfait(e)
  • 4 étoiles = satisfait(e)
  • 5 étoiles = très satisfait(e)

Si vous ne souhaitez pas donner votre avis, vous pouvez fermer la boîte de dialogue.

Pour soumettre des commentaires, suggestions ou corrections, veuillez utiliser l'onglet Support (Assistance).

Félicitations !

Au cours de cet atelier, vous avez :

  • développé une application Python à l'aide du framework Streamlit ;
  • installé le SDK Vertex AI pour Python ;
  • développé du code pour interagir avec le modèle Gemini 1.0 Pro (gemini-pro) à l'aide de l'API Gemini Vertex AI ;
  • utilisé des requêtes textuelles avec le modèle pour générer une histoire et une campagne marketing ;
  • développé du code pour interagir avec le modèle Gemini 1.0 Pro Vision (gemini-pro-vision) à l'aide de l'API Gemini Vertex AI ;
  • traité du texte, des images et des vidéos avec le modèle et extrait des informations à partir d'images et de vidéos ;
  • déployé et testé l'application sur Cloud Run.

Étapes suivantes et informations supplémentaires

Copyright 2023 Google LLC Tous droits réservés. Google et le logo Google sont des marques de Google LLC. Tous les autres noms de société et de produit peuvent être des marques des sociétés auxquelles ils sont associés.

Ce contenu n'est pas disponible pour le moment

We will notify you via email when it becomes available

Parfait !

We will contact you via email if it becomes available