【生活娱乐】冰箱活化——拍照识图，AI 智能管理储物

赤野萌想 · 2026 年6 月 26 日 09:47

【生活娱乐】冰箱活化——拍照识图，AI 智能管理储物

标签： 生活娱乐 AI识图 智能储物 食谱推荐

【正文】 至少包含以下 4 个部分，可以增加额外的部分（比如自我介绍、经验总结、踩坑复盘等）

0. 先和大家打个招呼吧

你是谁： 全职测试工程师；
你是怎么用 TRAE 把 Demo 做出来的：

实际上在参加这个比赛之前，我就已经用了很久时间的trae及solo相关产品了，算是老用户，然后也算半个软件行业从业者，因此做这个比较熟能生巧。我觉得要分享的是AI是个好东西，它让你真的能让你成为神笔马良，做到好多以前不敢想象的事情，如果你也想，就快来尝试吧，从下载trae开始

1. Demo 简介

是什么：冰箱活化是一款 AI 智能冰箱管理 Web 应用，打开浏览器拍一张冰箱照片，AI 帮你记住一切、提醒一切、推荐一切。；
面向谁：独居青年（一人食常过期）、合租白领（冰箱混乱搞不清归属）、家庭主厨（关注营养搭配和食物浪费）、健康关注者（在意饮料摄入与运动联动）。
主要功能：视频：
拍照识物入库：对准冰箱拍一张，AI 自动识别食材/饮料/调料/冷冻品，自动判断存放位置和保质期，智能检测重复物品提示合并

image3420×1902 230 KB
全链路保质期追踪：食材临期预警、冻肉品质下降提醒、调料开封超期追踪，不只报问题更推荐解决方案（“鸡蛋明天到期，今晚做个滑蛋虾仁吧！”）
image1920×1068 156 KB
AI 食谱智能推荐：结合冰箱现有食材、家庭成员运动数据、临期消耗需求，推荐最适合今晚做的菜，支持烹饪模式逐步引导

核心场景

场景	痛点	解决方式
拍照识物入库	手动记录太麻烦，食材入库全靠记忆	拍照→AI 识别→自动填充名称、分类、保质期
保质期追踪	忘记食材放了多久，过期才发现	进度条可视化 + 到期推送提醒
健康提醒	饮料过多、冻肉存放太久品质下降	智能分析囤积情况 + 品质预警
下班前智能推送	下班不知道吃什么，冰箱里有食材却想不到做法	结合运动数据 + 冰箱库存 → 推送适配食谱
聚会菜单	朋友聚会不知道做什么，容易采购过多	输入人数偏好 → 生成菜单 + 采购清单
家庭食谱	家里每个人的口味不同，众口难调	根据就餐成员推荐适配所有人的食谱
家庭协作空间	食材信息不共享，重复采购、遗漏提醒	家庭成员共享冰箱清单 + 授权运动数据

2. Demo 创作思路

为什么做冰箱活化？

1927 年，第一台家用冰箱问世。在此之前，人类与食物的关系是「即时获取、即时消耗」——冰箱的发明，第一次让食物可以跨时间保存，它赋予人类对抗时间的能力，也深刻改变了家庭的生活方式：一周采购一次、批量囤货、随时取用……冰箱成为现代家庭不可或缺的"食物保险箱"。

近一百年后的今天，冰箱变得更先进了——双开门、对开门、零度保鲜、变温区……但人类和食物的关系，反而出了问题。

食物前所未有地充足，却被前所未有地浪费。

我们忙于工作，没时间做饭，冰箱里塞满了冲动采购的食材；我们忘记角落里的那袋蔬菜，直到它腐烂才扔掉；我们囤了过多的饮料，却不记得什么时候买的；冷冻层那块肉放了大半年，品质早已下降却浑然不知。据统计，中国家庭每年浪费的食物约 3500 万吨，其中相当一部分就发生在冰箱里——不是没有食物，而是我们没有时间和精力去管理它们。

冰箱解决了"保存"的问题，却带来了"遗忘"的问题。

冰箱本该是食物的保险箱，却变成了食物的遗忘之地。我们把食材放进去的那一刻，就启动了一场倒计时——而我们几乎从不记得这倒计时的终点在哪里。

冰箱活化，就是为了解决这个问题而生的。

它不改变冰箱的硬件，而是在冰箱和用户之间架起一层智能管理：拍照即可入库，AI 自动识别食材与保质期；到期主动提醒，不再让食物在角落里沉默过期；结合运动数据和家庭成员，推送合适的食谱，让冰箱里的食材真正被享用而不是被浪费。

让冰箱从"被遗忘的储物柜"，变回"被看见的食物管家"——这就是冰箱活化的初心。

3. Demo 体验地址（交互式可体验的HTML格式文件）

冰箱活化.zip (206.5 KB)

使用方法：
压缩包内容：包含源码、构建产物、配置文件，不含 node_modules（收到后需 npm install）npm版本需要最好为22.0.0以上

fridge-app-v1.0.zip
├── src/                    # 源代码（React + TypeScript）
├── dist/                   # 已构建的生产版本（可直接打开 index.html）
├── package.json            # 依赖配置
├── vite.config.ts          # Vite 构建配置
├── tsconfig*.json          # TypeScript 配置
├── README.md               # 使用说明
└── ...其他配置文件

方式一（最简单）： 解压后直接双击 dist/index.html 打开（无摄像头）

方式二（推荐）： 解压后在文件夹内执行 npx serve .，访问 http://localhost:3000

4. TRAE 实践过程

1，首先根据我报名demo进行思考，然后手写简单的创意和想法道md文档中，将文档和需求告诉trae，让它进行修改和创意设计，这里用到了新tab“Design”

3323190063938292:2f9a61c99ef71c9034dbc4bfc677c348_6a3cd95dcaaf8857ca223bc0.6a3cdeeccaaf8857ca223cb1.6a3cdeeccaaf8857ca223caf:TRAE Work CN.0.1.23.no_sid.no_ppe.T(2026/6/25 15:55:24)

这里上传下我的需求文档吧：

2，因为这只是交互文档不是开发文档，因此直接给code智能体开发会有问题，因此需要在需求文档的基础上生成产品开发文档，于是我把设计图和文档给它

3323190063938292:0de38bac16cc781b7bb63751cc66e2ae_6a3cdc35caaf8857ca223c68.6a3cdc35caaf8857ca223c6b.6a3cdc35caaf8857ca223c69:TRAE Work CN.0.1.23.no_sid.no_ppe.T(2026/6/25 15:43:49)

3，最后就可以进行开发了：

3323190063938292:488e666673fe5c55fec4c70b360b58ca_6a3cdc35caaf8857ca223c68.6a3ce214caaf8857ca223d5f.6a3ce214caaf8857ca223d5d:TRAE Work CN.0.1.23.no_sid.no_ppe.T(2026/6/25 16:08:52)

4，开发完了就需要做测试，测试不完善及有bug的地方，这里就是我的专场了

3323190063938292:9d6c24057a8044d1830eb58981218d66_6a3cdc35caaf8857ca223c68.6a3cea44caaf8857ca223f79.6a3cea44caaf8857ca223f77:TRAE Work CN.0.1.23.no_sid.no_ppe.T(2026/6/25 16:43:48)

3323190063938292:332ca0810e7bba1fefa369418940fd96_6a3cdc35caaf8857ca223c68.6a3d02f9ab50535cfe8745ca.6a3d02f9ab50535cfe8745c8:TRAE Work CN.0.1.23.no_sid.no_ppe.T(2026/6/25 18:29:13)