这是参与以下活动的提交作品:Hacktoberfest 开源 AI 挑战赛第 1 周:Touch Grass


我构建了什么

户外悖论

每位家长、教育工作者和自然爱好者都熟悉这一幕:你带孩子到户外去触摸草地,但不到十分钟,他们就落在后面盯着自己的鞋子。然而递给他们一部装满现代数字游戏的智能手机,就等于用通知、连续打卡和闪烁像素组成的成瘾老虎机取代了真实的树木。传统的纸质寻宝游戏又走向了另一个极端:它们是静态的,很快就会玩腻,而且无法告诉孩子那块粗糙的树皮是否真的是线索所要求的。

Sidequest 用一条激进的产品原则解决了这个悖论:

屏幕应该是散步中最短的部分。

Sidequest 并不使用人工智能把眼睛粘在玻璃屏幕上。它使用一个开源权重视觉语言模型在浏览器内运行,充当安静、客观的步道裁判:

  1. 一次一条诗意线索:手机呈现一条日光下可读的自然学家线索(例如,“找到某种比你在这里存在更久的粗糙之物”)。
  2. 手机放进口袋:孩子用自己的眼睛在步道上奔跑,观察树干、苔藓斑块和河石。屏幕完全变暗。
  3. 拍摄证据:当找到候选证据时,孩子点击相机按钮拍一张照片。
  4. Blaze 步道标记:仅需43 毫秒,一个设备端量化视觉模型就会评估图像是否真正匹配线索,并与竞争性干扰项进行对比。标志性的Blaze以鲜艳的苔藓绿色从 0% 到 100% 垂直填充。
  5. 教育性野外笔记:发现已确认!出现一条教育性自然学家笔记(解释树皮结构、维管植物叶脉或石头侵蚀)。
  6. 好奇心优先的家长覆盖:如果棘手的步道阴影造成歧义,或者年幼的弟妹找到了非常规的匹配,家长可以点击“算它过关!”——因为真正的户外探索在于培养好奇心,而不是严格的机器精度。
  7. 野外自然学家纪念日志当全部 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 黑客松而打造。


🌐 快速链接与在线部署


Live Demo Demo Video GitHub License AI Model Runtime


🌿 叙事:Sidequest 为何存在

孩子们不需要又一个争夺他们注意力的应用。他们需要一个去观察周围世界的理由。

当父母带孩子去户外散步时,一种熟悉的紧张感就会出现:孩子们往往会在途中感到无聊,但给他们一个数字游戏,就等于用闪烁像素、通知和游戏化注意力陷阱的老虎机取代了物理世界。另一方面,传统的纸质寻宝游戏是静态的,无法验证孩子是否真的找到了线索所……

架构概览

[ 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 智能体工作流结对编程开发,在整个构建过程中保持持续的端到端验证、浏览器自动化测试和离线遥测基准测试。


奖项类别

  • 主类别:Hacktoberfest 开源 AI 挑战赛:第 1 周 — 触摸草地
  • 主题契合度:让家庭远离屏幕、走进自然世界;将屏幕强制为步行中最短的部分;100% 由开源权重端侧 AI 驱动。

感谢 DEV Community、GitHub 和 Hugging Face 组织本次挑战赛!穿上你的靴子,把手机放进口袋,去触摸草地吧。🌿🧭