Inspiration

Web-to-Quest turns the everyday web into actionable checklists (“quests”). When you land on a page (docs, tutorials, long forms, etc.), the side panel helps you capture the page context and generate a quick task list so you can do, not just read.

What it does

Side Panel UI where you can enter a goal and capture the current tab’s URL/title.

Optional on-device AI (Gemini Nano via Prompt API for Extensions) to draft or refine a task list. If AI isn’t available, the panel gracefully falls back to non-AI behavior and shows a clear AI status + help link.

Help page in-extension explaining how to enable on-device AI and how to verify readiness.

Release bundle so judges can install the unpacked extension immediately.

Progressive enhancement: All AI-touching buttons are gated with data-ai-only and an availability probe. No AI? No problem — the core flows still work.

How we built it

Chrome Extension (MV3) with a Side Panel UI (sidepanel.html/.js).

Prompt API (Extensions) with lightweight probes + stubs so the UI detects Gemini Nano availability at runtime.

Docs in-panel (extension/help/ai.html) and README instructions.

Automated releases with Release Drafter to ship judge-ready zips.

Challenges we ran into

Feature-detecting the Prompt API in Canary/Dev builds; we added a probe + UI guards to avoid null/undefined errors.

Ensuring the extension is usable without on-device AI enabled.

Accomplishments that we're proud of

Clean, judge-friendly install: unzip → “Load unpacked” → open Side Panel.

Clear AI help + status, so reviewers immediately know what will (and won’t) work on their machine.

What we learned

Designing for optional AI keeps the UX solid while still showcasing Chrome’s built-in AI.

Good repo hygiene (badges, release notes, zipped build) removes friction for judges and other developers.

What's next for Web-to-Quest

emplates for common “quests” (research, bug triage, PR review).

Optional hybrid AI path (Firebase AI Logic / Gemini API) when a server back end adds value.

Built With

  • chrome-side-panel
  • css
  • github-actions-(release-drafter)
  • hrome-extension-(manifest-v3)
  • html
  • javascript
  • prompt-api-(extensions)-/-gemini-nano-(optional)
Share this project:

Updates