How to get started on Opal

Key Concepts

• Opal: A no-code mini app builder for automating workflows and creating mini apps.
• Visual Editor: The interface where the logic and steps of an Opal app are designed.
• User Input Blocks: Elements in the visual editor that collect information from the user.
• Generate Blocks: Elements that utilize generative AI models (like Gemini 2.5 Flash) to produce content.
• AI Models: Various AI models available within the Google ecosystem that can be selected for use in Opal apps.
• Prompt Expansion: The process where Opal automatically elaborates on a user's initial prompt for more detailed AI generation.
• Console: A section to view the interim processes and details of an app's execution.
• Theme: Customization options for the app's appearance, including cover images.
• Preview Tab: A view to see how the app will look and function.
• App Toggle: An option for a more immersive app viewing experience.
• Share Output: Functionality to share the generated output of an app.
• Share App (Publish Link): Functionality to make an Opal app accessible to others via a link.
• Natural Language Input: The ability to add user input fields by simply describing them in plain text.
• Manual Block Addition: The option to add and configure individual blocks in the visual editor from scratch.
• Image Generation Models: AI models specifically designed for creating images (e.g., Image in4, Nano Banana).
• Version History: A feature to track and revert to previous versions of an Opal app.
• Assets: External files or data (images, documents, videos) that can be uploaded or linked to an Opal app to influence its generation.
• Output Formats: The ability to save generated content in various Google Workspace formats (Google Doc, Slide, Sheet).

Opal: A No-Code Mini App Builder Tutorial

This tutorial provides a comprehensive overview of Opal, a no-code mini app builder designed to automate workflows and create personalized mini applications. Megan, a product manager on the Google Labs team, demonstrates Opal's capabilities through a practical example of building a weekly meal planner.

1. Getting Started with Opal

• Initial Interface: The top section of Opal typically displays existing "Opals" (apps). For new users, the Gallery serves as a starting point for inspiration and examples.
• Creating a New Opal: Users can initiate app creation by clicking "Create New" and providing an idea.

2. Building a Weekly Meal Planner App

• App Idea: The example app aims to generate a weekly meal plan based on the number of people and desired cooking frequency. This is highlighted as a repeatable and valuable personal workflow.
• Visual Editor: This is the core interface for designing the app's logic. It uses a visual, block-based system.
  • User Input Blocks (Yellow): These blocks collect information from the user. In the meal planner example, these include prompts for "number of people" and "cooking frequency." Users can add these blocks manually or have them generated automatically.
  • Generate Blocks: These blocks leverage generative AI models. The tutorial showcases Gemini 2.5 Flash as the default, but users can select other AI models from the Google ecosystem.
  • Prompt Expansion: When a user provides an initial prompt, Opal automatically expands it to create a more detailed and effective prompt for the AI model.
  • Final Output Block: This block displays the generated result of the app.

3. Running and Previewing the App

• Start Button: Initiates the app's execution.
• Preview Mode: Allows users to test the app with sample inputs. For the meal planner, inputs like "two people" and "four times this week" are used.
• Console: Provides a detailed view of the app's internal processes, including AI model calls and intermediate data. This is useful for debugging or understanding the execution flow.
• Theme Customization: Users can customize the app's appearance, including generating or uploading a cover image. The "randomize" option can provide relevant thematic images.

4. Output and Sharing

• Generated Content: The app produces a meal plan based on the user's inputs. The output is presented in a user-friendly format, often as a web page.
• Sharing Output: The "Share Output" button allows users to share the specific generated content.
• Sharing the App (Publishing):
  • Clicking "Share App" and then "Publish" makes the Opal accessible to anyone with the generated link.
  • A Publish Link is generated, which can be shared for others to run the app themselves.
  • Alternatively, a Share Output URL can be copied to directly share the generated results.

5. Editing and Enhancing the App

• Natural Language Editing: Users can easily add new user input fields by describing them in natural language (e.g., "ask me what leftovers I have").
• Manual Block Addition: Users can manually add and configure any block type (e.g., adding a new "generate" step) to extend the app's functionality.
• Adding New Steps: The tutorial demonstrates adding a step to generate images to accompany the meal plans.
  • This involves selecting an image generation model (e.g., Nano Banana) and configuring the new "generate" block.
  • The visual editor automatically updates to include the new step and its connections.
• Output Updates: The final output automatically accounts for the new generated images, displaying recipes, meal plans, and accompanying visuals.

6. Hidden Features and Advanced Options

• Version History: Allows users to view and revert to previous versions of their Opal app.
• Title and Description Editing: Users can customize the app's title and description, which appear below the cover image.
• Undo/Redo Controls: Standard editing tools for reverting or re-applying changes.
• Zoom and Center Controls: Tools for navigating the visual editor canvas.
• Adding Assets:
  • Users can upload images, link to Google Drive files, or use YouTube videos as "assets."
  • These assets can be referenced in prompts to guide the AI model's generation, ensuring a specific style or format (e.g., generating a comic strip in a particular artistic style by referencing an example image).
  • This feature can be applied to documents for format replication or videos/images for mimicry.
• Changing Output Format:
  • Opal allows users to save generated content in various Google Workspace formats.
  • Instead of a web page, output can be saved to Google Docs, Slides, or Sheets.
  • For example, a generated report on viral social media trends can be saved directly to a Google Doc.
  • Subsequent runs of the same Opal will append content to the existing document.

Synthesis/Conclusion

Opal empowers users to build custom mini applications and automate workflows without requiring coding expertise. Its intuitive visual editor, integration with powerful AI models like Gemini, and flexible features for input, generation, output customization, and asset integration make it a versatile tool. The ability to easily share both the app itself and its generated outputs, along with the option to save results in various Google Workspace formats, further enhances its practical utility for personal productivity and collaboration.