Beyond the demo: Building the WebAI Playbook

Key Concepts

• Web AI: AI experiences running directly on the user's device within the browser, offering zero-cost inference, absolute privacy, and offline capabilities.
• Cloud AI: AI models running on remote servers, providing immense power and state-of-the-art capabilities but incurring per-inference costs and potential privacy trade-offs.
• Hybrid AI: A combination of cloud and client-side AI, allowing tasks to be routed to balance power, reach, efficiency, and privacy.
• Paved Road: A simplified development path for AI features, leveraging high-level built-in AI APIs managed by the browser, designed for speed and ease of use.
• Open Field: A path offering maximum flexibility and control, suitable for deploying custom models or for framework builders to extend the "paved road" through lower-level APIs like WebGPU, WebNN, and WebAssembly.
• Built-in AI: A specific effort within Web AI focused on providing high-level, browser-managed APIs for developers.
• WebGPU, WebNN, WebAssembly: Lower-level APIs that provide access to GPU and NPU hardware for accelerating AI inference, primarily used in the "open field" approach.
• Economic Principle: Shifting from a server-side AI model (pay-per-inference, like arcade machines) to a client-side model where inference is free once the user has the necessary hardware (like bringing the arcade home).
• Artfully Applied AI Principle: Emphasizing the importance of asking "if we should" use AI, not just "if we can," and focusing on subtle, helpful AI integrations that augment existing workflows rather than creating disruptive, demanding experiences.
• AI Feature Trap: The mistake of building loud, separate AI experiences that interrupt the user's primary task, leading to a less effective user experience.
• Web AI Playbook: A living, breathing collection of shared knowledge, case studies, solution guides, and best practices for developing and deploying AI features on the web, built collaboratively by the community.
• Chrome AI Challenge: An event designed to encourage developers to explore and utilize Web AI APIs, offering prizes and a practical way to contribute to the Web AI playbook.

The Web AI Playbook: Addressing the Demo-to-Production Gap

Kenji, a Product Manager on the Chrome team leading Web AI efforts, identified a significant challenge: a disconnect between the promising AI demos and their actual implementation in production. This "playbook vacuum" leads to a loss of signal, resulting in fewer AI features being shipped than anticipated. The mission is to address this by creating a comprehensive playbook.

The Three Worlds of AI on the Web

The presentation outlines three primary environments where AI experiences can exist:

1. Cloud AI:

   • Strengths: Access to immense power and state-of-the-art models, ideal for heavy tasks.
   • Downsides: Per-inference costs, potential privacy trade-offs.

2. Web AI (Client-Side AI):

   • Strengths: Zero-cost inference, runs on the device, absolute privacy (no data sent to servers), nimble offline experience.
   • Focus of the presentation.

3. Hybrid AI:

   • Approach: Routes tasks to balance the power and reach of the cloud with the efficiency and privacy of the client-side.

Navigating the Client-Side AI Landscape: The Paved Road vs. The Open Field

Within the client-side AI world, developers have a choice of starting points along a spectrum:

• The Paved Road:

  • Description: Represents simplicity and speed, designed for developers who want to ship AI features without managing AI infrastructure.
  • Target Audience: Developers working with CMS, simple JavaScript snippets, or popular AI frameworks.
  • Underlying Technology: Backed by high-level built-in AI APIs where the browser manages the entire underlying stack.
  • Benefit: Developers can focus on their product, not AI infrastructure.

• The Open Field:

  • Description: Offers maximum flexibility and control, designed for those needing to deploy custom models or requiring total control over the AI stack.
  • Target Audience:
    • Builders deploying their own custom models.
    • Developers seeking complete control over the AI stack.
    • Framework and tool builders aiming to expand the "paved road" with easier-to-use solutions.
  • Underlying Technology: Utilizes lower-level overlay APIs like WebGPU, WebNN, and WebAssembly to access GPU and NPU hardware for accelerated AI inferencing.
  • Goal: To build the next generation of tools that extend the "paved road," enabling more developers to deploy Web AI features without being AI experts.

The Complete Map: A Unified Platform

By combining the "paved road" and the "open field," a comprehensive map is created, forming a unified platform designed to meet developers at any level of expertise in the Web AI space.

Core Principles for Building Web AI

A strong playbook is built on guiding principles. Two game-changing principles are highlighted:

1. Economic Principle: The Shift from Arcade to Home Console

   • Server-Side Model (Arcade Machine): Dominant for years, powerful but requires payment for each use (per-inference cost). This limits free experimentation and the deployment of always-on, proactive features due to budget constraints.
   • Client-Side Model (Bringing the Arcade Home): Users' increasingly powerful devices can run AI experiences that were once state-of-the-art on servers. Once the user has the hardware, inference is free.
   • Key Unlock: The marginal cost per play going to zero.

2. Artfully Applied AI Principle: Augmenting Workflows, Not Disrupting Them

   • The Temptation: The "AI hammer" mindset, where every problem is seen as a nail, leading to asking "if we can" AI for it without considering "if we should."
   • The AI Feature Trap: Building loud, separate AI experiences that interrupt the user's main quest. This is described as "playing on hard mode."
   • The Better Approach: Be subtle and helpful. The goal is to augment existing workflows so that AI "disappears into the background" and simply makes the product better.
   • Examples:
     • A "show summary" button next to reviews.
     • Proactive highlights or product descriptions based on user interest, inferred from time spent on products and commonalities.
     • Low-friction feedback loops beyond typing (e.g., visual cues).
   • Value Proposition: Finding valuable and durable value by being helpful, not just novel.

Building the Playbook Together: A Collaborative Journey

The development of this playbook is a community effort, requiring collaboration and shared knowledge. The summit track is designed as a journey:

• Introduction (Kenji): Setting the stage and identifying the challenge.
• Framework for Discovery (Janna): Identifying opportunities for AI.
• Real-World Case Studies (Udico): Providing proof with partner examples.
• The "How":
  • Paved Road Guidance (Thomas Steiner): Navigating the simplified path.
  • Open Field Guidance (Thomas Nardat): For enablers and experts.

Contributing to the Web AI Playbook

The playbook is envisioned as a "living, breathing collection of shared knowledge," not a static document. Contributions can take various forms:

• Case studies written and shared online.
• Solution guides for productionizing AI features.
• Documentation of successful UX patterns for AI.
• Talks that raise awareness and inspire development.

Every contribution focused on valuable AI adds a new page and a learning opportunity.

Getting Started: The Chrome AI Challenge

The mission is to fill the "vacuum" together. The Web AI playbook is open for contributions. Developers can start by exploring the technology, such as built-in AI APIs. A direct way to contribute and write the first page is by joining the Chrome AI Challenge, which allows developers to test APIs and compete for prizes.

The call to action is clear: "Let's write this playbook together."