GCP200VIBECODING

Vibe Coding for Instant Deployable Apps

Vibe coding is a generative AI-driven approach to application development that leverages conversational prompting in tools such as Gemini Canvas and Google AI Studio to rapidly translate ideas into functional code. This method allows people to go from a low-fidelity UI sketch or high-level requirements to a responsive, data-ingesting application with live Gemini API integration and state persistence, bypassing traditional development bottlenecks. This course is a fast-paced, 90% hands-on and demo session, structured around a set of practical use cases called "Plays." You will apply iterative vibe coding techniques independently to an original problem and learn to make an informed choice about which AI coding tool best fits a given use case.

Google Cloud
✓ Official training Google CloudLevel Intermediate⏱️ 0.5 day (4h)

What you will learn

  • Generate responsive user interfaces from hand-drawn screen mockups.
  • Add data ingestion, dynamic calculations, charts, and interactive alerts to dashboards.
  • Build apps with live Gemini API integration.
  • Generate slide deck presentations using AI prompts using Gemini Canvas.
  • Vibe code a React tablet application with localStorage persistence using Google AI Studio.

Prerequisites

  • A basic understanding of generative AI and Gemini.

Target audience

  • Those who want to learn to use Gemini, the Canvas tool, and Google AI Studio to vibe code apps and leverage the Canvas tool for dynamic generative AI use cases.

Training Program

5 modules to master the fundamentals

Objectives
  • Convert low-fidelity visual sketches into structured HTML and CSS layouts
  • Construct functional frontend prototypes from screen mockups using Gemini Canvas
  • Optimize generated interface styling and responsiveness through conversational refinement
Topics covered
  • →Translate a low-fidelity UI sketch into a structured web layout
  • →Prompt Gemini Canvas to generate functional HTML, CSS, and JavaScript from an image
  • →Refine and iterate on a generated interface through focused prompting
Objectives
  • Implement client-side CSV parsing and data ingestion inside Canvas applications
  • Construct complex application logic incrementally using sequential prompting
  • Develop interactive user input components to drive dynamic calculations and KPIs
Topics covered
  • →Ingest and parse data (CSV) into a Canvas application
  • →Prompt incrementally to solve logic problems one step at a time (grid, then basic KPIs, then conditional components)
  • →Add data input functionality
  • →Transform static mockups into interactive, user-driven applications
Objectives
  • Incorporate live Gemini API calls inside standalone Canvas web applications
  • Construct parameterized AI prompts dynamically based on application state
  • Generate and export interactive executive presentations to Google Slides and PDF
Topics covered
  • →Integrate live Gemini API calls directly into a Canvas web application
  • →Build structured, data-driven AI prompts programmatically from user input
  • →Use Canvas to generate an interactive slide presentation
  • →Export a Canvas presentation to Google Slides or download it as a PDF
Objectives
  • Develop multi-file React web applications within Google AI Studio
  • Implement client-side state persistence utilizing browser localStorage
  • Evaluate structured multi-file generation against single-file Canvas workflows
Topics covered
  • →Use Google AI Studio to build a multi-file React application
  • →Compare AI Studio’s structured code output with the Canvas single-file approach
  • →Add state persistence to a web app using browser localStorage
  • →Extend an existing application with new features through conversational prompting
Objectives
  • Formulate comprehensive application specifications prior to prompt initiation
  • Execute an independent iterative vibe coding workflow for a custom business tool
  • Select the optimal AI development environment based on project scope and architecture
Topics covered
  • →Gather and structure application requirements before writing a single prompt
  • →Translate a personal or professional need into a clear app specification
  • →Apply iterative vibe coding techniques independently to an original problem
  • →Make an informed choice about which AI coding tool best fits a given use case

Related Trainings

Google Cloud

Gemini Enterprise Tools Workshop

The Gemini Enterprise Tools Workshop is designed to equip you with the advanced skills necessary to maximize the full suite of Gemini's built-in tools. Using a realistic case study, participants will learn how to seamlessly integrate web search, manage contextual files, and conduct comprehensive deep research. This course is a fast-paced, 90% hands-on and demo session, structured around a set of practical use cases called "Plays." You will learn how to use advanced prompt engineering techniques and built-in Gemini tools to synthesize complex information and drive data-backed decisions.

0.5 d
Intermediate
Google Cloud

Gemini for Image, Video, and Audio Analysis

Gemini Enterprise empowers you to unlock insights from unstructured multimedia data and rapidly generate high-quality creative assets. Participants will master techniques such as analyzing video, generating targeted marketing materials (e.g., infographics), and creating promotional video clips with custom audio. This course is a fast-paced, 90% hands-on and demo session, structured around a set of practical use cases called "Plays." You will learn to transform high-level concepts into polished, deployable multimedia content.

0.5 d
Intermediate
Google Cloud

Gemini Enterprise Promptathon: Capstone

The Gemini Enterprise Promptathon is an intensive, hands-on workshop where you will apply your skills from the Explore AI for Activation courses to a real-world challenge. Working in teams, you will tackle a use case of your choosing, progressing from an initial idea to a functional prototype. This capstone hands-on event emphasizes collaboration, rapid prototyping, and creative problem-solving using the full suite of Gemini Enterprise tools. At the end of the session, your team will present your solution, showcasing your ability to deliver tangible business value with generative AI.

0.5 d
Advanced

Upcoming sessions

No date suits you?

We regularly organize new sessions. Contact us to find out about upcoming dates or to schedule a session at a date of your choice.

Register for a custom date

Quality Process

SFEIR Institute's commitment: an excellence approach to ensure the quality and success of all our training programs. Learn more about our quality approach

Teaching Methods Used
  • Technical Demonstration (Demos) — The instructor performs a task or procedure while students observe.
  • Guided Labs — Guided practical exercises on software, hardware, or technical environments.
  • Troubleshooting / Problem Solving — Diagnosing and fixing a breakdown, bug, or malfunction.
Evaluation and Monitoring System

The achievement of training objectives is evaluated at multiple levels to ensure quality:

  • Continuous Knowledge Assessment : Verification of knowledge throughout the training via participatory methods (quizzes, practical exercises, case studies) under instructor supervision.
  • Progress Measurement : Comparative self-assessment system including an initial diagnostic to determine the starting level, followed by a final evaluation to validate skills development.
  • Quality Evaluation : End-of-session satisfaction questionnaire to measure the relevance and effectiveness of the training as perceived by participants.

Frequently Asked Questions

Those who want to use Gemini, the Canvas tool and Google AI Studio to vibe code apps, and to exploit Canvas for dynamic generative AI use cases.
It is a generative AI approach to building applications through conversational prompting: you describe intent and iterate, instead of writing the code line by line. Here you go from a low-fidelity sketch or high-level requirements to a working, data-ingesting app.
You will be able to generate responsive interfaces from hand-drawn mockups, add data ingestion, dynamic calculations, charts and interactive alerts to a dashboard, build apps calling the Gemini API live, and vibe code a React tablet app with localStorage persistence in Google AI Studio.
No, but you will be more comfortable if you can read code. The workshop is about steering the generation and checking the result, not about writing everything yourself.
Four hours, instructor-led by SFEIR Institute, run as hands-on plays and closing with an app for a use case of your own.
Yes. This is an official Google Cloud course delivered by SFEIR Institute, a certified Google Cloud Training Partner and Google Cloud Training Partner of the Year 2025.
Our training organizations SFEIR SAS and SFEIR-Est are Qualiopi certified for training activities. Contact us for a quote.

790€ excl. VAT

per learner