Ringkasan

Gemini adalah serangkaian model AI generatif yang dirancang untuk kasus penggunaan multimodal. Gemini hadir dalam tiga ukuran: Ultra, Pro, dan Nano. Gemini 1.0 Pro tersedia bagi developer dan perusahaan untuk membangun kasus penggunaannya sendiri. Gemini 1.0 Pro menerima teks sebagai input sekaligus menghasilkan teks sebagai output. Terdapat pula endpoint multimodal Gemini 1.0 Pro Vision khusus yang menerima teks dan gambar sebagai input, lalu menghasilkan teks sebagai output. SDK tersedia untuk membantu Anda membangun aplikasi di Python, Android (Kotlin), Node.js, Swift, dan JavaScript.

Di Google Cloud, Vertex AI Gemini API memberikan antarmuka terpadu untuk berinteraksi dengan model-model Gemini. API ini mendukung perintah multimodal sebagai teks atau kode input dan output. Saat ini ada dua model yang tersedia di Gemini API:

• Model Gemini 1.0 Pro (gemini-pro): Dirancang untuk menangani tugas natural language, teks multiturn dan chat kode, serta pembuatan kode.

• Model Gemini 1.0 Pro Vision (gemini-pro-vision): Mendukung perintah multimodal. Anda dapat menyertakan teks, gambar, dan video dalam permintaan perintah dan mendapatkan respons teks atau kode.

Vertex AI adalah platform machine learning (ML) yang memungkinkan Anda melatih dan men-deploy model ML dan aplikasi AI, serta menyesuaikan model bahasa besar (LLM) untuk digunakan dalam aplikasi yang didukung teknologi AI. Dengan Vertex AI, Gemini dapat disesuaikan menggunakan kontrol data penuh. Selain itu, fitur Google Cloud tambahan juga dapat dimanfaatkan untuk alasan keamanan, keselamatan, privasi, serta tata kelola dan kepatuhan data perusahaan. Untuk mempelajari Vertex AI lebih lanjut, lihat link di bagian Langkah Berikutnya di akhir lab.

Di lab ini, Anda akan menggunakan Vertex AI SDK untuk Python guna memanggil Vertex AI Gemini API.

Tujuan

Di lab ini, Anda akan mempelajari cara melakukan tugas berikut:

• Mengembangkan aplikasi Python menggunakan framework Streamlit.
• Menginstal Vertex AI SDK untuk Python.
• Mengembangkan kode untuk berinteraksi dengan model Gemini 1.0 Pro (gemini-pro) menggunakan Vertex AI Gemini API.
• Mengembangkan kode untuk berinteraksi dengan model Gemini 1.0 Pro Vision (gemini-pro-vision) menggunakan Vertex AI Gemini API.
• Menyimpan aplikasi dalam container, serta men-deploy dan mengujinya pada Cloud Run.

Penyiapan

Untuk setiap lab, Anda akan memperoleh project Google Cloud baru serta serangkaian resource selama jangka waktu tertentu, tanpa biaya.

1. Login ke Qwiklabs menggunakan jendela samaran.

2. Perhatikan waktu akses lab (misalnya, 1:15:00), dan pastikan Anda dapat menyelesaikannya dalam waktu tersebut.
   Tidak ada fitur jeda. Bila perlu, Anda dapat memulai ulang lab, tetapi Anda harus memulai dari awal.

3. Jika sudah siap, klik Start lab.

4. Catat kredensial lab (Nama pengguna dan Sandi) Anda. Anda akan menggunakannya untuk login ke Google Cloud Console.

5. Klik Open Google Console.

6. Klik Use another account, lalu salin/tempel kredensial lab ini ke perintah yang muncul.
   Jika menggunakan kredensial lain, Anda akan menerima pesan error atau dikenai biaya.

7. Setujui ketentuan dan lewati halaman resource pemulihan.

Mengaktifkan Cloud Shell

Cloud Shell adalah mesin virtual dengan beberapa alat pengembangan. Mesin virtual ini menawarkan direktori beranda persisten berkapasitas 5 GB dan berjalan di Google Cloud. Cloud Shell memberikan akses command line ke resource Google Cloud Anda. gcloud adalah alat command line untuk Google Cloud. Fitur ini sudah terinstal di Cloud Shell dan mendukung penyelesaian tab.

1. Di Google Cloud Console, pada panel navigasi, klik Activate Cloud Shell ().

2. Klik Continue.
   Perlu waktu beberapa saat untuk menyediakan dan menghubungkan ke lingkungan. Setelah terhubung, Anda juga diautentikasi, dan project ditetapkan ke PROJECT_ID Anda. Contoh:

Contoh perintah

• Cantumkan nama akun aktif:

gcloud auth list

(Output)

Akun berkredensial: - <myaccount>@<mydomain>.com (active)

(Contoh output)

Akun berkredensial: - google1623327_student@qwiklabs.net

• Cantumkan ID project:

gcloud config list project

(Output)

[core] project = <project_ID>

(Contoh output)

[core] project = qwiklabs-gcp-44776a13dea667a6

Tugas 1. Mengonfigurasi lingkungan dan project

1. Login ke Konsol Google Cloud dengan kredensial lab Anda, lalu buka jendela terminal Cloud Shell.

2. Untuk menetapkan project ID dan variabel lingkungan region, jalankan perintah berikut di 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. Untuk menggunakan beragam layanan Google Cloud di lab ini, Anda harus mengaktifkan beberapa API:

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

Untuk memverifikasi tujuan, klik Check my progress. Mengaktikan API yang relevan.

Tugas 2. Menyiapkan lingkungan aplikasi

Dalam tugas ini, Anda akan menyiapkan lingkungan virtual Python dan menginstal dependensi aplikasi.

Memastikan bahwa Cloud Shell sudah diotorisasi

1. Untuk memastikan Cloud Shell sudah diotorisasi, jalankan perintah berikut di Cloud Shell:

   gcloud auth list

2. Jika Anda diminta untuk memberikan otorisasi pada Cloud Shell, klik Authorize.

Membuat direktori aplikasi

1. Untuk membuat direktori aplikasi, jalankan perintah berikut:

   mkdir ~/gemini-app

2. Ubah ke direktori ~/gemini-app:

   cd ~/gemini-app

   File aplikasi dibuat di direktori ~/gemini-app. Direktori ini akan berisi file sumber, dependensi, dan file Docker aplikasi Python yang nanti akan kita gunakan dalam lab ini.

Menyiapkan lingkungan virtual Python

Buat lingkungan virtual menggunakan instalasi Python yang sudah ada, sehingga tiap paket yang terinstal di lingkungan ini akan terisolasi dari paket-paket yang ada di lingkungan dasar. Saat digunakan dari dalam lingkungan virtual, alat penginstalan seperti pip akan menginstal paket Python ke dalam lingkungan virtual.

1. Untuk membuat lingkungan virtual Python, dari dalam folder gemini-app, jalankan perintah:

   python3 -m venv gemini-streamlit Modul venv membuat lingkungan virtual ringan, dengan serangkaian paket Python yang independen.

2. Aktifkan lingkungan virtual Python:

   source gemini-streamlit/bin/activate

Menginstal dependensi aplikasi

File requirements Python adalah file teks sederhana yang berisi daftar dependensi yang diperlukan oleh project Anda. Untuk memulai, ada tiga modul yang diperlukan dalam file requirements.

Aplikasi kita ditulis menggunakan Streamlit, yakni library Python open source yang digunakan untuk membuat aplikasi web pada machine learning dan data science. Aplikasi ini menggunakan library Vertex AI SDK untuk Python untuk berinteraksi dengan Gemini API dan model. Cloud Logging digunakan untuk mencatat informasi dari aplikasi kita.

1. Untuk membuat file requirements, jalankan perintah berikut:

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

2. Instal dependensi aplikasi:

   pip install -r requirements.txt

   pip adalah paket penginstal Python.

   Tunggu hingga semua paket terinstal sebelum berlanjut ke tugas berikutnya.

Tugas 3. Mengembangkan aplikasi

Kode sumber aplikasi akan ditulis dalam beberapa file sumber .py. Mari kita mulai dengan titik entri utama di app.py.

Menulis titik entri aplikasi utama

1. Untuk membuat kode titik entri app.py, jalankan perintah berikut:

   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. Lihat konten file app.py:

   cat ~/gemini-app/app.py

   Aplikasi ini menggunakan streamlit untuk membuat sejumlah tab di UI. Pada versi awal aplikasi ini, kita membuat tab pertama berjudul Story (Cerita) yang berisi fungsi untuk membuat cerita, lalu secara bertahap membangun tab lain dalam tugas berikutnya di lab.

   Pertama-tama, aplikasi ini akan melakukan inisialisasi Vertex AI SDK dengan memasukkan nilai variabel lingkungan REGION dan PROJECT_ID.

   Aplikasi kemudian memuat model gemini-pro dan gemini-pro-vision menggunakan class GenerativeModel yang menampilkan model Gemini. Class ini menyertakan metode untuk membantu membuat konten dari teks, gambar, dan video.

   Aplikasi ini membuat 4 tab di UI bernama Story (Cerita), Marketing Campaign (Kampanye Pemasaran), Image Playground (Playground Gambar), dan Video Playground (Playground Video).

   Kemudian, kode aplikasi akan memanggil fungsi render_tab1() untuk membuat UI pada tab Story di UI aplikasi.

Mengembangkan tab1 - Story

1. Untuk menulis kode yang dapat merender tab Story di UI aplikasi, jalankan perintah berikut:

   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. Lihat konten file app_tab1.py:

   cat ~/gemini-app/app_tab1.py

   Fungsi render_story_tab membuat kontrol UI di tab dengan memanggil berbagai fungsi untuk merender kolom input teks, dan opsi lainnya.

   Fungsi generate_prompt membuat perintah teks yang disediakan ke Gemini API. String perintah dibuat dengan menggabungkan nilai yang dimasukkan pengguna di tab UI untuk karakter cerita, dan opsi seperti panjang cerita (pendek, panjang), tingkat kreativitas (rendah, tinggi), dan premis cerita.

   Fungsi ini juga menampilkan nilai temperature berdasarkan tingkat kreativitas cerita yang dipilih. Nilai ini disediakan sebagai parameter konfigurasi temperature ke model, yang akan mengontrol tingkat keacakan prediksi model. Parameter konfigurasi max_output_tokens menentukan jumlah maksimum token output yang akan dibuat per pesan.

   Untuk membuat respons model, sebuah tombol akan dibuat di UI tab. Ketika tombol tersebut diklik, fungsi get_gemini_pro_text_response akan dipanggil. Kodenya akan kita buat pada langkah berikutnya di lab.

Mengembangkan response_utils

File response_utils.py berisi fungsi untuk membuat respons model.

1. Untuk menulis kode yang menghasilkan respons teks model, jalankan perintah berikut:

   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. Lihat konten file response_utils.py:

   cat ~/gemini-app/response_utils.py

   Fungsi get_gemini_pro_text_response menggunakan GenerativeModel dan beberapa class lainnya dari paket vertexai.preview.generative_models di Vertex AI SDK untuk Python. Dari metode class generate_content, respons dibuat menggunakan perintah teks yang diteruskan ke metode.

   Objek safety_settings juga diteruskan ke metode ini untuk mengontrol respons model dengan memblokir konten berbahaya. Kode contoh di lab ini menggunakan nilai setelan keamanan yang menginstruksikan model untuk selalu menampilkan konten terlepas dari aman tidaknya konten tersebut. Anda dapat menilai konten yang dibuat, lalu menyesuaikan setelannya jika aplikasi Anda memerlukan konfigurasi yang lebih ketat. Untuk mempelajari lebih lanjut, baca dokumentasi setelan keamanan.

Tugas 4. Menjalankan dan menguji aplikasi secara lokal

Dalam tugas ini, Anda akan menjalankan aplikasi secara lokal menggunakan streamlit, dan menguji fungsi aplikasi.

Menjalankan aplikasi

1. Untuk menjalankan aplikasi secara lokal di Cloud Shell, jalankan perintah:

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

   Aplikasi akan dimulai dan URL akan diberikan untuk mengakses aplikasi.

2. Untuk meluncurkan halaman beranda aplikasi di browser, klik web preview di panel menu Cloud Shell, lalu klik Preview on port 8080.

   

   Anda juga dapat menyalin dan menempel URL aplikasi di tab browser terpisah untuk mengakses aplikasi.

Menguji aplikasi - Tab Story

Buat cerita dengan memberikan input, melihat perintah, dan menampilkan respons yang dihasilkan oleh model Gemini 1.0 Pro.

1. Untuk membuat cerita, di tab Story, tetap gunakan setelan default, lalu klik Generate my story.

2. Tunggu hingga respons dibuat, lalu klik tab Story response.

3. Untuk melihat perintah yang digunakan untuk membuat respons, klik tab Prompt.

4. Di jendela Cloud Shell, akhiri aplikasi dan kembali ke command prompt dengan menekan control-c.

Untuk memverifikasi tujuan, klik Check my progress. Aplikasi dikembangkan dengan tab Story.

Tugas 5. Membuat kampanye pemasaran

Dalam tugas ini, Anda akan menggunakan model teks Gemini 1.0 Pro untuk membuat kampanye pemasaran bagi perusahaan. Anda akan mengembangkan kode untuk membuat tab kedua di aplikasi.

Mengembangkan tab2 - Marketing Campaign (Kampanye Pemasaran)

1. Untuk menulis kode yang dapat merender tab Marketing Campaign di UI aplikasi, jalankan perintah berikut:

   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

Mengubah titik entri aplikasi utama

• Untuk menambahkan tab2 ke aplikasi, jalankan perintah berikut:

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

Menguji aplikasi - Tab Marketing campaign

Buat kampanye pemasaran dengan memberikan input, melihat perintah, dan menampilkan respons yang dihasilkan oleh model Gemini 1.0 Pro.

1. Untuk menjalankan aplikasi secara lokal di Cloud Shell, jalankan perintah:

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

   Aplikasi akan dimulai dan URL akan diberikan untuk mengakses aplikasi.

2. Untuk meluncurkan halaman beranda aplikasi di browser, klik web preview di panel menu Cloud Shell, lalu klik Preview on port 8080.

3. Untuk membuat kampanye pemasaran, di tab Marketing campaign, tetap gunakan setelan default, lalu klik Generate campaign.

4. Tunggu hingga respons dibuat, lalu klik tab Campaign response.

5. Untuk melihat perintah yang digunakan untuk membuat respons, klik tab Prompt.

6. Ulangi langkah-langkah di atas untuk membuat kampanye pemasaran dengan nilai parameter yang berbeda, seperti kategori produk, target audiens, lokasi, dan sasaran kampanye.

7. Di jendela Cloud Shell, akhiri aplikasi dan kembali ke command prompt dengan menekan control+c.

Untuk memverifikasi tujuan, klik Check my progress. Tab kampanye pemasaran aplikasi telah dikembangkan.

Tugas 6. Membuat playground gambar

Dalam tugas ini, Anda akan menggunakan model Gemini 1.0 Pro Vision untuk memproses gambar dan menerima rekomendasi serta informasi dari gambar yang disediakan ke model.

Mengembangkan tab3 - Image Playground (Playground Gambar)

Dalam subtugas ini, Anda akan menerapkan kode untuk tab Image Playground, dan kode untuk berinteraksi dengan model guna membuat rekomendasi dari sebuah gambar.

1. Untuk menulis kode yang dapat merender tab Image Playground di UI aplikasi, jalankan perintah berikut:

   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. Lihat konten file app_tab3.py:

   cat ~/gemini-app/app_tab3.py

   Fungsi render_image_playground_tab membangun UI yang memungkinkan pengguna aplikasi untuk berinteraksi dengan model Gemini 1.0 Pro Vision. Fungsi ini membuat serangkaian tab: "Furniture recommendation" (Rekomendasi furnitur), "Oven instructions" (Petunjuk pemakaian oven), "ER diagrams" (Diagram ER), "Math reasoning" (Penalaran matematika) di UI. Anda akan menulis kode untuk tab yang tersisa dalam tugas berikutnya di lab ini.

   Di tab Furniture recommendation, suasana ruang tamu diperlihatkan agar konsep visualnya dapat dipahami. Beserta serangkaian gambar kursi tambahan, kode tersebut memanggil endpoint API multimodal Gemini 1.0 Pro Vision untuk mendapatkan rekomendasi kursi yang dapat melengkapi suasana ruang tamu.

   

   Kode ini menggunakan lebih dari satu perintah teks, gambar ruang tamu, dan kursi, lalu menyediakannya dalam bentuk daftar ke model. Class Part digunakan untuk mendapatkan gambar dari URI konten multi-bagian yang di-host dalam bucket Cloud Storage. Perintah ini juga menentukan format tabel output model, sekaligus alasan rekomendasinya.

Mengupdate response_utils

File response_utils.py berisi fungsi untuk membuat respons model.

• Update file untuk menambahkan kode yang membuat respons multimodal model.

  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

Mengubah titik entri aplikasi utama

• Untuk menambahkan tab3 ke aplikasi, jalankan perintah berikut:

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

Menguji aplikasi - Tab Image Playground

1. Jalankan aplikasi menggunakan perintah yang disediakan di langkah-langkah sebelumnya di lab.

2. Untuk meluncurkan halaman beranda aplikasi di browser, klik web preview di panel menu Cloud Shell, lalu klik Preview on port 8080.

3. Klik Image Playground, lalu klik Furniture recommendation.

   Tab menampilkan gambar ruang tamu, dan kursi.

4. Klik Generate recommendation.

   Jika error ini terjadi: FailedPrecondition: 400 We are preparing necessary resources. Please wait few minutes and retry., tunggu beberapa menit, lalu klik Generate recommendation lagi.

5. Lihat respons dari model Gemini 1.0 Pro Vision.

   Respons ada dalam format tabel seperti yang diminta dalam perintah. Model ini merekomendasikan dua dari empat kursi, dan memberikan alasan untuk rekomendasi tersebut.

6. Di jendela Cloud Shell, akhiri aplikasi dan kembali ke command prompt dengan menekan control+c.

Untuk memverifikasi tujuan, klik Check my progress. Image playground aplikasi dengan tab rekomendasi furnitur telah dikembangkan.

Tugas 7. Menganalisis tata letak gambar

Dalam tugas ini, Anda akan menggunakan model Gemini 1.0 Pro Vision untuk mengekstrak informasi dari gambar setelah menganalisis tata letak ikon dan teksnya.

Mengupdate tab Image Playground - Oven instructions (Petunjuk pemakaian oven)

Gemini yang dilengkapi dengan kemampuan untuk mengekstrak informasi elemen visual pada layar, dapat menganalisis screenshot, ikon, dan tata letak untuk memberikan pemahaman menyeluruh tentang suasana yang digambarkan. Dalam tugas ini, Anda akan menyediakan gambar panel kontrol oven dapur ke model, lalu memerintahkan model tersebut membuat petunjuk untuk fungsi tertentu.

• Untuk menerapkan kode pada tab Oven instructions di tab Image Playground di UI aplikasi, jalankan perintah berikut:

  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

  Kode di atas membangun UI tab Oven instructions. Gambar panel kontrol oven dapur digunakan bersama dengan teks untuk memerintahkan model membuat petunjuk fungsi tertentu yang tersedia pada panel, yakni, mereset jam.

  

Menguji aplikasi - Image Playground - Tab Oven instructions

1. Jalankan aplikasi menggunakan perintah yang disediakan di langkah-langkah sebelumnya di lab.

2. Untuk meluncurkan halaman beranda aplikasi di browser, klik web preview di panel menu Cloud Shell, lalu klik Preview on port 8080.

3. Klik Image Playground, lalu klik Oven instructions.

   Tab menampilkan gambar panel kontrol oven.

4. Klik Generate instructions.

5. Lihat respons dari model Gemini 1.0 Pro Vision.

   Respons akan berisi langkah-langkah yang dapat digunakan untuk mereset jam pada panel kontrol oven. Hal ini termasuk petunjuk yang memberitahukan letak tombol pada panel dan menampilkan kemampuan model untuk menganalisis tata letak panel dalam gambar.

6. Di jendela Cloud Shell, akhiri aplikasi dan kembali ke command prompt dengan menekan control+c.

Untuk memverifikasi tujuan, klik Check my progress. Playground gambar dengan tab petunjuk oven telah dikembangkan.

Tugas 8. Menganalisis Diagram ER

Dengan kemampuan multimodal, Gemini dapat memahami diagram dan mengambil langkah-langkah yang dapat ditindaklanjuti, seperti pembuatan dokumen atau kode. Dalam tugas ini, Anda akan menggunakan model Gemini 1.0 Pro Vision untuk menganalisis diagram Hubungan Entity (ER) serta membuat dokumentasi tentang entity dan hubungannya dalam diagram.

Mengupdate tab Image Playground - ER diagrams (Diagram ER)

Dalam tugas ini, Anda akan menyediakan gambar diagram ER pada model, lalu memerintah model untuk membuat dokumentasi.

• Untuk menerapkan kode pada tab ER diagrams di tab Image Playground di UI aplikasi, jalankan perintah berikut:

  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

  Kode di atas membangun UI tab ER diagrams. Gambar diagram ER digunakan bersama dengan teks untuk memerintahkan model membuat dokumentasi tentang entity dan hubungannya dalam diagram.

  

Menguji aplikasi - Image playground - Tab ER diagrams

1. Jalankan aplikasi menggunakan perintah yang disediakan di langkah-langkah sebelumnya di lab.

2. Untuk meluncurkan halaman beranda aplikasi di browser, klik web preview di panel menu Cloud Shell, lalu klik Preview on port 8080.

3. Klik Image Playground, lalu klik ER diagrams.

   Tab menampilkan gambar diagram ER.

4. Klik Generate documentation.

5. Lihat respons dari model Gemini 1.0 Pro Vision.

   Respons akan berisi daftar entity dan hubungannya dalam diagram.

6. Di jendela Cloud Shell, akhiri aplikasi dan kembali ke command prompt dengan menekan control+c.

Untuk memverifikasi tujuan, klik Check my progress. Playground gambar dengan tab diagram ER telah dikembangkan.

Tugas 9. Penalaran matematika

Gemini 1.0 Pro Vision juga dapat memahami rumus dan persamaan matematika serta mengekstrak informasi spesifik. Kemampuan ini sangat berguna untuk membuat penjelasan masalah matematika.

Mengupdate tab Image Playground - Math reasoning (Penalaran matematika)

Dalam tugas ini, Anda akan menggunakan model Gemini 1.0 Pro Vision untuk mengekstrak dan menafsirkan rumus matematika dari sebuah gambar.

• Untuk menerapkan kode pada tab Math reasoning di tab Image Playground di UI aplikasi, jalankan perintah berikut:

  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

  Kode di atas membangun UI tab Math reasoning. Gambar persamaan matematika digunakan bersama dengan teks untuk memerintahkan model membuat jawaban dan karakteristik lain tentang persamaan tersebut.

  

Menguji aplikasi - Image playground - Tab Math reasoning

1. Jalankan aplikasi menggunakan perintah yang disediakan di langkah-langkah sebelumnya di lab.

2. Untuk meluncurkan halaman beranda aplikasi di browser, klik web preview di panel menu Cloud Shell, lalu klik Preview on port 8080.

3. Klik Image Playground, lalu klik Math reasoning.

   Tab menampilkan gambar berisi persamaan matematika.

4. Klik Generate answers.

5. Lihat respons dari model Gemini 1.0 Pro Vision.

   Respons berisi jawaban atas pertanyaan yang diberikan dalam perintah pada model.

6. Di jendela Cloud Shell, akhiri aplikasi dan kembali ke command prompt dengan menekan control+c.

Untuk memverifikasi tujuan, klik Check my progress. Playground gambar dengan tab penalaran matematika telah dikembangkan.

Tugas 10. Membuat playground video

Dalam tugas ini, Anda akan menggunakan model Gemini 1.0 Pro Vision untuk memproses video dan membuat tag serta informasi dari video yang disediakan ke model.

Mengembangkan tab4 - Video Playground (Playground Video)

Model Gemini 1.0 Pro Vision juga dapat membuat deskripsi tentang apa yang sedang terjadi dalam video. Dalam subtugas ini, Anda akan menerapkan kode untuk tab Video Playground, dan kode untuk berinteraksi dengan model guna membuat deskripsi video.

1. Untuk menulis kode yang dapat merender tab Video Playground di UI aplikasi, jalankan perintah berikut:

   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. Lihat konten file app_tab4.py:

   cat ~/gemini-app/app_tab4.py

   Fungsi render_video_playground_tab membangun UI yang memungkinkan pengguna aplikasi untuk berinteraksi dengan model Gemini 1.0 Pro Vision. Fungsi ini membuat serangkaian tab: "Video description" (Deskripsi video), "Video tags" (Tag video), "Video highlights" (Sorotan video), "Video geolocation" (Geolokasi video) di UI. Anda akan menulis kode untuk tab yang tersisa dalam tugas berikutnya di lab ini.

   Tab Video description menggunakan perintah bersama dengan video untuk membuat deskripsi video, serta untuk mengidentifikasi tempat lain yang terlihat mirip dengan yang ada dalam video.

Mengubah titik entri aplikasi utama

• Untuk menambahkan tab4 ke aplikasi, jalankan perintah berikut:

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

Menguji aplikasi - Tab Video Playground

1. Jalankan aplikasi menggunakan perintah yang disediakan di langkah-langkah sebelumnya di lab.

2. Untuk meluncurkan halaman beranda aplikasi di browser, klik web preview di panel menu Cloud Shell, lalu klik Preview on port 8080.

3. Klik Video Playground, lalu klik Video description.

4. Tab menampilkan video suatu tempat. Klik untuk memutar video.

5. Klik Generate video description.

6. Lihat respons dari model Gemini 1.0 Pro Vision.

   Respons akan berisi deskripsi tempat, dan 5 tempat lainnya yang terlihat mirip.

7. Di jendela Cloud Shell, akhiri aplikasi dan kembali ke command prompt dengan menekan control+c.

Untuk memverifikasi tujuan, klik Check my progress. Playground video aplikasi dengan tab deskripsi video telah dikembangkan.

Tugas 11. Membuat tag video

Dalam tugas ini, Anda akan menggunakan model Gemini 1.0 Pro Vision untuk membuat tag video.

Mengupdate tab Video Playground - Video tags (Tag video)

• Untuk menerapkan kode pada tab Video tags di tab Video Playground di UI aplikasi, jalankan perintah berikut:

  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

  Kode di atas membangun UI tab Video tags. Video digunakan bersama dengan teks untuk memerintahkan model membuat tag dan menjawab pertanyaan tentang adegan dalam video.

Menguji aplikasi - Video playground - Tab Video tags

1. Jalankan aplikasi menggunakan perintah yang disediakan di langkah-langkah sebelumnya di lab.

2. Untuk meluncurkan halaman beranda aplikasi di browser, klik web preview di panel menu Cloud Shell, lalu klik Preview on port 8080.

3. Klik Video Playground, lalu klik Video tags.

4. Tab menampilkan video yang akan digunakan untuk membuat perintah model. Klik untuk memutar video.

5. Klik Generate video tags.

6. Lihat respons dari model Gemini 1.0 Pro Vision.

   Respons akan berisi jawaban atas pertanyaan yang diberikan dalam perintah pada model. Pertanyaan dan jawaban ditampilkan dalam format tabel dan menyertakan 5 tag seperti yang diminta.

7. Di jendela Cloud Shell, akhiri aplikasi dan kembali ke command prompt dengan menekan control+c.

Untuk memverifikasi tujuan, klik Check my progress. Playground video dengan tab tag video telah dikembangkan.

Tugas 12. Membuat sorotan video

Dalam tugas ini, Anda akan menggunakan model Gemini 1.0 Pro Vision untuk membuat sorotan video yang menyertakan informasi tentang objek, orang, dan konteks yang ditampilkan dalam video.

Mengupdate tab Video Playground - Video highlights (Sorotan video)

• Untuk menerapkan kode pada tab Video highlights di tab Video Playground di UI aplikasi, jalankan perintah berikut:

  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

  Kode di atas membangun UI tab Video highlights. Video digunakan bersama dengan teks untuk memerintahkan model membuat sorotan dari video.

Menguji aplikasi - Video playground - Tab Video highlights

1. Jalankan aplikasi menggunakan perintah yang disediakan di langkah-langkah sebelumnya di lab.

2. Untuk meluncurkan halaman beranda aplikasi di browser, klik web preview di panel menu Cloud Shell, lalu klik Preview on port 8080.

3. Klik Video Playground, lalu klik Video highlights.

4. Tab menampilkan video yang akan digunakan untuk membuat perintah model. Klik untuk memutar video.

5. Klik Generate video highlights.

6. Lihat respons dari model Gemini 1.0 Pro Vision.

   Respons akan berisi jawaban atas pertanyaan yang diberikan dalam perintah pada model. Pertanyaan dan jawaban ditampilkan dalam format tabel dan mencantumkan fitur dari video seperti profesi perempuan, fitur ponsel yang digunakan. Respons juga berisi deskripsi ringkasan adegan dalam video.

7. Di jendela Cloud Shell, akhiri aplikasi dan kembali ke command prompt dengan menekan control+c.

Untuk memverifikasi tujuan, klik Check my progress. Playground video dengan tab sorotan video telah dikembangkan.

Tugas 13. Membuat lokasi video

Dalam tugas ini, Anda akan menggunakan model Gemini 1.0 Pro Vision untuk menentukan lokasi tempat adegan dalam video berlangsung.

Mengupdate tab Image Playground - Video geolocation (Geolokasi video)

• Untuk menerapkan kode pada tab Video geolocation di tab Video Playground di UI aplikasi, jalankan perintah berikut:

  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

  Kode di atas membangun UI tab Video geolocation. Video digunakan bersama dengan teks untuk memerintahkan model menjawab pertanyaan tentang video yang mencakup informasi lokasi terkait hal yang terlihat dalam video.

Menguji aplikasi - Video playground - Tab Video geolocation

1. Jalankan aplikasi menggunakan perintah yang disediakan di langkah-langkah sebelumnya di lab.

2. Untuk meluncurkan halaman beranda aplikasi di browser, klik web preview di panel menu Cloud Shell, lalu klik Preview on port 8080.

3. Klik Video Playground, lalu klik Video geolocation.

4. Tab menampilkan video yang akan digunakan untuk membuat perintah model. Klik untuk memutar video.

5. Klik Generate.

6. Lihat respons dari model Gemini 1.0 Pro Vision.

   Respons akan berisi jawaban atas pertanyaan yang diberikan dalam perintah pada model. Pertanyaan dan jawaban ditampilkan dalam format tabel dan menyertakan informasi lokasi seperti yang diminta.

7. Di jendela Cloud Shell, akhiri aplikasi dan kembali ke command prompt dengan menekan control+c.

Untuk memverifikasi tujuan, klik Check my progress. Playground video dengan tab geolokasi video telah dikembangkan.

Tugas 14. Men-deploy aplikasi ke Cloud Run

Setelah menguji aplikasi secara lokal, Anda dapat membuatnya tersedia untuk orang lain dengan men-deploy aplikasi ke Cloud Run di Google Cloud. Cloud Run adalah platform komputasi terkelola yang memungkinkan Anda menjalankan container aplikasi langsung di infrastruktur Google yang skalabel.

Menyiapkan lingkungan

1. Pastikan Anda berada di direktori app:

   cd ~/gemini-app

2. Pastikan variabel lingkungan PROJECT_ID, dan REGION telah ditetapkan:

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

3. Jika variabel lingkungan ini belum ditetapkan, jalankan perintah untuk menetapkannya:

   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. Tetapkan variabel lingkungan untuk layanan dan repositori artefak Anda:

   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}"

Membuat repositori Docker

1. Untuk membuat repositori di Artifact Registry, jalankan perintah:

   gcloud artifacts repositories create "$AR_REPO" --location="$REGION" --repository-format=Docker Artifact Registry adalah layanan Google Cloud yang menyediakan lokasi tunggal untuk menyimpan dan mengelola paket software serta image container Docker Anda.

2. Siapkan autentikasi ke repositori:

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

Membangun image container

Kita akan menggunakan Dockerfile untuk membangun image container aplikasi kita. Dockerfile adalah dokumen teks yang berisi semua perintah yang dapat dipanggil oleh pengguna di command line untuk menyusun image container. Layanan ini biasanya digunakan dengan Docker, yakni sebuah platform container untuk membangun dan menjalankan image container.

1. Untuk membuat Dockerfile, jalankan perintah:

   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. Untuk membangun image container pada aplikasi, jalankan perintah:

   gcloud builds submit --tag "$REGION-docker.pkg.dev/$PROJECT_ID/$AR_REPO/$SERVICE_NAME" Perintah gcloud builds submit akan mengirimkan build menggunakan Cloud Build. Cloud Build menggunakan Dockerfile untuk membangun image container dari file aplikasi di direktori sumber saat digunakan dengan flag tag.

   Cloud Build adalah layanan yang menjalankan build berdasarkan spesifikasi Anda di Google Cloud, dan menghasilkan artefak seperti container Docker atau arsip Java.

   Tunggu hingga perintah selesai sebelum berlanjut ke langkah berikutnya.

Men-deploy dan menguji aplikasi di Cloud Run

Tugas terakhir adalah men-deploy layanan ke Cloud Run dengan image yang telah dibuat dan didorong ke repositori di Artifact Registry.

1. Untuk men-deploy aplikasi ke Cloud Run, jalankan perintah:

   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. Setelah layanan di-deploy, URL ke layanan akan dibuat pada output perintah sebelumnya. Untuk menguji aplikasi Anda di Cloud Run, buka URL tersebut di jendela atau tab browser terpisah.

3. Pilih fungsi aplikasi yang ingin diuji. Aplikasi akan memerintahkan Vertex AI Gemini API untuk membuat dan menampilkan respons.

Untuk memverifikasi tujuan, klik Check my progress. Aplikasi di-deploy ke Cloud Run.

Mengakhiri lab Anda

Setelah Anda menyelesaikan lab, klik Akhiri Lab. Qwiklabs menghapus resource yang telah Anda gunakan dan menghapus akun.

Anda akan diberi kesempatan untuk menilai pengalaman menggunakan lab. Pilih jumlah bintang yang sesuai, ketik komentar, lalu klik Submit.

Makna jumlah bintang:

• 1 bintang = Sangat tidak puas
• 2 bintang = Tidak puas
• 3 bintang = Netral
• 4 bintang = Puas
• 5 bintang = Sangat puas

Anda dapat menutup kotak dialog jika tidak ingin memberikan masukan.

Untuk masukan, saran, atau koreksi, gunakan tab Dukungan.

Selamat!

Di lab ini, Anda telah:

• Mengembangkan aplikasi Python menggunakan framework Streamlit.
• Menginstal Vertex AI SDK untuk Python.
• Mengembangkan kode untuk berinteraksi dengan model Gemini 1.0 Pro (gemini-pro) menggunakan Vertex AI Gemini API.
• Menggunakan perintah teks dengan model untuk membuat cerita dan kampanye pemasaran.
• Mengembangkan kode untuk berinteraksi dengan model Gemini 1.0 Pro Vision (gemini-pro-vision) menggunakan Vertex AI Gemini API.
• Menggunakan teks, gambar, dan video dengan model untuk memproses dan mengekstrak informasi dari gambar dan video.
• Men-deploy dan menguji aplikasi di Cloud Run.

Langkah Berikutnya/Pelajari Lebih Lanjut

• Vertex AI
• Gemini
• Referensi Model Generatif Vertex AI SDK
• Artifact Registry
• Cloud Build
• Cloud Run

Hak cipta 2023 Google LLC. Semua hak dilindungi undang-undang. Google dan logo Google adalah merek dagang dari Google LLC. Semua nama perusahaan dan produk lain mungkin adalah merek dagang masing-masing perusahaan yang bersangkutan.