We will be undergoing planned maintenance on Oct 7th 6:00AM UTC / Oct 7th 2:00AM ET

Taboo-webmcp-game

Taboo makes WebMCP fun and reveals its disruptive promise: personal agents that act across the web, converse by voice, visualize insights, and bridge AI, AR, and the web.

Comment

Inspiration

My name is Oscar, and I am a Senior Product Manager at RavenPack. I lead the Programmatic Experience squad for Bigdata.com, which I helped scale from zero to 2,000+ daily active users.

My journey started with programmable building blocks: an SDK, docs.bigdata.com, and a REST API. From there, I worked on a remote MCP server, plugins, and skills. Recently, I began exploring what I believe is the next inevitable milestone: personal agents that can complete tasks across applications, websites, and server APIs.

In the near future, people will have at least one personal agent and communicate with it naturally, mainly by voice. The agent will interact with applications on their behalf and present results through an interface designed for the specific task. This will help users assimilate information, discover insights, consider next steps, and make better decisions.

While experimenting with OpenClaw and NemoClaw, I could create artifacts that continuously brought information to the user. However, I was missing something essential: the agent's ability to interact directly with the web application.

I considered exposing JavaScript functions that would let an agent navigate pages, expand cards, and perform actions. Then I saw the WebMCP announcement in the OpenAI community, and a tear fell from my eyes; this is what I have been looking for.

What it does

Taboo Game is a playful demonstration of WebMCP's potential.

The user plays Taboo with a personal agent. The agent privately receives a secret word and five forbidden words, then describes the secret word without revealing it or using any forbidden clues. The user guesses naturally through the chat.

The application exposes five WebMCP tools:

  • read_instructions teaches the agent how to play.
  • set_player_nickname creates or restores the player's identity.
  • get_next_word privately provides the secret and forbidden words.
  • get_remaining_time lets the agent check the countdown.
  • report_guess sends the user's exact guess to the backend for authoritative validation.

The web interface reacts to the conversation in real time. It displays the countdown, tool activity, guesses, scores, solved words, confetti, and a persistent leaderboard.

A correct answer earns points based on the remaining time:

$$ \text{score} = \max(10,\ 10 \times \text{seconds remaining}) $$

Each round starts with 180 seconds, so the maximum score is 1,800 points.

How I built it

The frontend uses React, while a Node.js and Express backend manages the game logic and REST API.

The application is deployed on Fly.io, and Neon PostgreSQL stores players, scores, nickname restrictions, and a catalog of 50 Taboo cards. Development and production use separate Neon database branches.

Active rounds remain temporarily in server memory because guesses do not need to be permanently stored. Only the leaderboard information is persisted.

Players receive cryptographically random UUIDs, which are stored in browser local storage. Returning players can continue playing without re-entering their nickname.

The backend validates guesses, accepts singular and plural variants, calculates scores, and updates the leaderboard. Database operations use parameterized SQL queries to prevent injection attacks.

I also created a Postman collection with separate local and production environments to test every REST endpoint independently.

Challenges we ran into

The first challenge was understanding why my ChatGPT Enterprise account could not see the WebMCP tools used in the examples. I enabled the experimental Chrome feature flag and successfully accessed the tools in Chrome, but they were still unavailable in the ChatGPT in-app browser.

Later, I learned from the documentation that site tools aren't currently supported on Enterprise or Edu plans. To continue testing, I used a personal laptop with a free ChatGPT account while continuing to build the application with my Enterprise subscription on my work laptop.

I also wanted to make the game voice-first by using ChatGPT Voice. Ironically, I encountered the opposite problem: Voice was available through my Enterprise subscription but not through the free personal account I was using to test WebMCP. I upgraded my personal ChatGPT plan, but I still cannot access it. I hope Voice becomes available on the Go plan soon. 😄

Apart from these account and feature-availability challenges, the development process was surprisingly smooth. Codex did an incredible job understanding my requirements and turning them into a working application through many iterations.

It used the Fly.io CLI and Neon skills to configure the database, separate the development and production environments, secure the backend, and deploy the application. This allowed me to focus on the product experience while Codex handled much of the implementation and infrastructure workflow.

Accomplishments that we're proud of

I am proud of building an intuitive, entertaining game that lets people play Taboo without needing to understand the magic behind the WebMCP tools.

The page has only one traditional interactive button, which copies the prompt. From there, users can follow the game naturally through conversation without the experience feeling unfamiliar or awkward. The complexity remains hidden, and the interaction feels simple.

This project demonstrates a new type of user interface that I believe will become common in future web applications. Users will communicate naturally with personal assistants, while those assistants interact directly with web applications on their behalf. The web application becomes a visual canvas where the agent can display the charts, tables, alerts, timelines, and insights that help the user understand information and make decisions.

Although the application is intentionally simple, it is also well-rounded. I considered several security and safety risks, including:

  • Prompt-injection attempts through malicious leaderboard nicknames.
  • SQL-injection attacks against the PostgreSQL database.
  • Offensive, discriminatory, or inappropriate player names.
  • Predictable player identifiers that could affect another user's score.
  • Accidental exposure of database credentials.
  • Separation between development and production data.

The application uses parameterized SQL queries, cryptographically random player IDs, server-side nickname moderation, a database-backed blacklist, untrusted-content hints for agents, and separate Neon branches for development and production.

All I need now is a pair of AR glasses to test the complete end-to-end experience. Wearable glasses will soon replace mobile devices, and I want Bigdata.com ready for that transition.

WebMCP provides a missing link between AI assistants, web applications, and future augmented-reality experiences. Taboo Game is a small but complete example of what that future could feel like.

What I learned

The WebMCP works; it's ready. We only need to fine-tune the delays.

What's next for Taboo-webmcp-game

My next step is to bring what I learned from this project to app.bigdata.com by adding WebMCP tools to the Bigdata App.

I also want to create skills that can generate custom user interfaces with WebMCP support. These experiences will allow professional financial investors to work with a personal agent that can monitor their portfolios and watchlists, identify relevant developments, and display insights in the format best suited to each situation.

The agent could communicate naturally with the investor, take action across the platform, and turn complex financial information into focused visual experiences. Instead of presenting every insight as text, it could select the most appropriate combination of charts, tables, timelines, alerts, and interactive components.

The goal is to help investors assimilate information faster, understand why an event matters, evaluate possible next steps, and make better-informed decisions.

Built With

Share this project:

Updates

Submission history