这是参与以下活动的提交作品:Hacktoberfest 开源 AI 挑战赛第 1 周:Touch Grass
我构建了什么
户外悖论
每位家长、教育工作者和自然爱好者都熟悉这一幕:你带孩子到户外去触摸草地,但不到十分钟,他们就落在后面盯着自己的鞋子。然而递给他们一部装满现代数字游戏的智能手机,就等于用通知、连续打卡和闪烁像素组成的成瘾老虎机取代了真实的树木。传统的纸质寻宝游戏又走向了另一个极端:它们是静态的,很快就会玩腻,而且无法告诉孩子那块粗糙的树皮是否真的是线索所要求的。
Sidequest 用一条激进的产品原则解决了这个悖论:
屏幕应该是散步中最短的部分。
Sidequest 并不使用人工智能把眼睛粘在玻璃屏幕上。它使用一个开源权重视觉语言模型在浏览器内运行,充当安静、客观的步道裁判:
- 一次一条诗意线索:手机呈现一条日光下可读的自然学家线索(例如,“找到某种比你在这里存在更久的粗糙之物”)。
- 手机放进口袋:孩子用自己的眼睛在步道上奔跑,观察树干、苔藓斑块和河石。屏幕完全变暗。
- 拍摄证据:当找到候选证据时,孩子点击相机按钮拍一张照片。
- Blaze 步道标记:仅需43 毫秒,一个设备端量化视觉模型就会评估图像是否真正匹配线索,并与竞争性干扰项进行对比。标志性的Blaze以鲜艳的苔藓绿色从 0% 到 100% 垂直填充。
- 教育性野外笔记:发现已确认!出现一条教育性自然学家笔记(解释树皮结构、维管植物叶脉或石头侵蚀)。
- 好奇心优先的家长覆盖:如果棘手的步道阴影造成歧义,或者年幼的弟妹找到了非常规的匹配,家长可以点击“算它过关!”——因为真正的户外探索在于培养好奇心,而不是严格的机器精度。
- 野外自然学家纪念日志当全部 5 个站点完成后,Sidequest 会生成一份可打印的插图式野外日志,记录孩子的真实发现、时间戳和自然学家等级——100% 保存在私密的浏览器本地存储中。
演示
- 🎬YouTube 一分钟演示:https://youtu.be/yaYatrm8VzI (1080p 60fps,配有清晰的 AI 配音解说)
- 🚀在线托管应用:https://sidequest-three-lake.vercel.app (100% 客户端 Web 应用;可在 iPhone、Android、iPad 和桌面端运行)
- 🌲100% 离线 PWA:可作为渐进式 Web 应用安装。在偏远国家公园中途打开飞行模式,推理依然无缝执行。
一分钟演示展示了什么:
- 阶段 1(触摸草地哲学):零广告、零社交信息流,日光可读的野外笔记本美学,配有高对比度户外模式。
- 阶段 2(离线就绪验证):实时模型缓存校验,并带有安全规则(“绝不触碰不认识的蘑菇”,“保持在视线范围内”)。
- 阶段 3(标志性火焰):相机取景框对准粗糙的橡树树皮;43ms 的即时推理验证,同时火焰填充至 100%(+0.469 对比度余量)。
- 阶段 4(干扰项拒绝与家长覆盖):上传沥青路面会触发温和的“继续寻找”引导;家长可点击“算它一个!”让冒险继续推进。
- 阶段 5(野外自然学家纪念日志):5 个已验证标本、时间戳、徽章,以及可打印的档案式排版,零云数据库依赖。
- 阶段 6(开放 AI 架构):WebAssembly ONNX 执行,0 服务器成本,完全隐私。
代码
整个代码库以 Apache-2.0 许可证开源:
Sidequest 🧭🌿
“手机给出线索。世界给出答案。”
一款由开源权重端侧 AI 驱动的户外自然寻宝伙伴。
为触摸草地开源 AI 黑客松而打造。
🌐 快速链接与在线部署
- 🚀在线托管应用:https://sidequest-three-lake.vercel.app (部署于 Vercel)
- 🎬1:18 视频演示:
sidequest-demo.mp4(神经 AI 配音与完整功能演示) - 💻GitHub 仓库:https://github.com/Shreyansh00987/Sidequest
🌿 叙事:Sidequest 为何存在
孩子们不需要又一个争夺他们注意力的应用。他们需要一个去观察周围世界的理由。
当父母带孩子去户外散步时,一种熟悉的紧张感就会出现:孩子们往往会在途中感到无聊,但给他们一个数字游戏,就等于用闪烁像素、通知和游戏化注意力陷阱的老虎机取代了物理世界。另一方面,传统的纸质寻宝游戏是静态的,无法验证孩子是否真的找到了线索所……
- GitHub 仓库:https://github.com/Shreyansh00987/Sidequest
-
技术栈:React 19、TypeScript、Tailwind CSS v4、
@huggingface/transformers、ONNX Runtime Web(WASM / WebGPU)、IndexedDB(idb)、Vite PWA。
架构概览
[ Real World Trail Discovery ]
│
▼
[ Phone Camera Snap (Zero Upload) ]
│
▼
┌────────────────────────────────────────────────────────┐
│ On-Device Vision Pipeline (Web Worker) │
│ - Engine: ONNX Runtime Web (WASM / SIMD / WebGPU) │
│ - Open-Weight Model: Xenova/clip-vit-base-patch32 │
│ - Quantization: ONNX Q8 (~85 MB cached once) │
│ - Latency: 43 ms per photo │
└──────────────────────────┬─────────────────────────────┘
│
▼
┌────────────────────────────────────────────────────────┐
│ Contrastive Decision Engine │
│ - Target Hypotheses (e.g., "rough tree bark ridges") │
│ - Distractor Hypotheses (e.g., "smooth asphalt road") │
│ - Margin: Δ = TargetScore - MaxDistractorScore │
│ - Verified Match if Δ >= +0.25 (Blaze Fills 100%) │
└──────────────────────────┬─────────────────────────────┘
│
┌────────────────┴────────────────┐
▼ ▼
[ MATCH: The Blaze Fills ] [ AMBIGUOUS / DISTRACTOR ]
[ Field Note Unlocked ] [ Gentle Retry Guidance ]
│ │
│ [ Parent "Count it!" ]
│ │
└────────────────┬────────────────┘
│
▼
┌────────────────────────────────────────────────────────┐
│ Local Archival Storage (IndexedDB) │
│ - 100% Private (No photos ever leave device) │
│ - Field Naturalist Keepsake Journal │
│ - Printable SVG & Print-CSS Layout │
└────────────────────────────────────────────────────────┘
我是如何构建它的
1. 浏览器中的开源权重视觉 AI
Sidequest 直接围绕开源CLIP ViT-B/32模型(Xenova/clip-vit-base-patch32)构建,该模型来自 Hugging Face,通过@huggingface/transformers和ONNX Runtime Web 运行:
- 量化:8 位量化权重(Q8)将总包体减小到约 85 MB。
-
非阻塞 Web Worker:模型加载、张量准备和推理都在专用的后台 Web Worker(
aiWorker.ts)中运行,防止相机交互期间出现任何 UI 卡顿或掉帧。 - 持久化 CacheStorage:模型权重一次性存储在浏览器的 Cache API 中。首次下载后,Sidequest 可在飞行模式下加载,传输字节数为零。
2. 对比证据:为什么 The Blaze 不会产生幻觉
与将阴影误认为动物的朴素单类图像标注器不同,Sidequest 将验证表述为一场对比式目标对干扰项竞赛:
- 对于每条线索,任务包会定义:
- 目标描述:详细的感官特征(例如,“户外带有深沟壑的粗糙树皮的近景照片”)。
- 干扰项描述:小径上常见的误报(例如,“光滑的灰色混凝土或沥青路面”、“人的鞋子或靴子”、“机动车”)。
- 模型会计算两组之间的余弦相似度。
- The对比边际$\Delta = S_{\text{target}} - \max(S_{\text{distractor}})$ 决定The Blaze:
- $\Delta \ge +0.25$:确认清晰发现(Blaze 填充至 100%,翠绿色苔藓光晕)。
- $-0.10 \le \Delta < +0.25$:不确定匹配(温和提示靠近或调整角度)。
- $\Delta < -0.10$:确定干扰项(友好的重试卡片,解释为什么沥青或鞋子与线索不匹配)。
3. 人在回路:好奇心优先于僵化算法
大自然杂乱无章。秋天的光线变化迅速,树种千差万别,而一个 6 岁的孩子可能在提示要求找一片绿色叶子时,找到一片卷曲的棕色桦树叶。
Sidequest 包含一个成人覆盖按钮(“算它对!”)以及一个成人诊断抽屉:
- 家长可以查看原始模型 logits、对比边际和推理速度(例如,
+0.452 margin in 43ms)。 - 如果孩子发现了模型训练分布未曾预料到的巧妙事物,家长只需轻点一下即可覆盖机器。技术服务于家庭,而不是反过来。
为什么开放创新很重要?
Sidequest 在伦理上或实践上都不可能作为封闭的云 API 封装存在。开源 AI 是整个体验的基础支柱:
1. 儿童照片的绝对隐私
根据 COPPA 和 GDPR-K,将儿童拍摄的照片通过互联网传输到第三方商业 API(如 OpenAI 或 Google Cloud)会带来深远的法律和伦理风险。借助在 WebAssembly 中本地执行的开放权重模型:
- 零字节的摄影数据离开用户手机。
- 所有标本快照和野外笔记仅保存在家庭的本地
IndexedDB。 - 家长可以完全放心地让孩子记录小径。
2. 在州立公园和深林中的真正独立性
人们最需要亲近自然的地方——偏远的林地小径、国家公园、野生动物保护区——恰恰是 5G 蜂窝连接降为零的地方。专有的云智能体在距登山口一英里处就变得毫无用处。
由于 Sidequest 直接在浏览器内存中运行开放权重模型,它在偏远地区二十英里处与在郊区后院一样可靠。
3. 零每次推理边际成本(0 美元服务器账单)
云视觉 API 按交易收费(每次调用 0.005 至 0.02 美元)。如果一所公立学校或童子军带 150 名儿童进行 5 站寻宝活动,成本会迅速攀升。
开放创新彻底颠覆了这一经济账:
- 托管成本:0.00 美元(通过免费层 Vercel 或 GitHub Pages 提供的静态资源)。
- 推理成本:0.00 美元(在用户芯片上客户端计算)。
- 自然教育对全球的非营利组织和家庭永久免费且可持续。
4. 无需模型重训练的社区任务可扩展性
由于开放视觉语言模型将任意文本和图像投影到共享嵌入空间,教育工作者和公园护林员可以为当地动植物编写自定义 JSON 任务包,而无需收集训练数据集、标注边界框或支付云端微调费用。
我的智能体会话
该项目通过与 Google Antigravity / Gemini 智能体工作流结对编程开发,在整个构建过程中保持持续的端到端验证、浏览器自动化测试和离线遥测基准测试。
-
智能体会话记录:已记录并归档在仓库中的
BUILD_LOG.md和ARCHITECTURE.md。
奖项类别
- 主类别:Hacktoberfest 开源 AI 挑战赛:第 1 周 — 触摸草地
- 主题契合度:让家庭远离屏幕、走进自然世界;将屏幕强制为步行中最短的部分;100% 由开源权重端侧 AI 驱动。
感谢 DEV Community、GitHub 和 Hugging Face 组织本次挑战赛!穿上你的靴子,把手机放进口袋,去触摸草地吧。🌿🧭