Collaborate with Intelligence
TRAE on Campus
TRAE on Campus @厦门大学
Vibe Coding Workshop 4 · 中秋国庆
演讲人 | TRAE中文论坛版主 骆锟宏
Agenda · 今日流程
今日玩什么
60 分钟以内，从装好工具到带着作品和福利回家——零编程基础也能全程跟上。
01
装好工具下载 TraeCode，学生认证即领 2000 积分
GET READY
02
看一场现场演示国庆互动烟花小作品，从一句话提示词到能玩
LIVE DEMO
03
动手 Vibe Coding6 个双节选题 + 完整提示词，复制粘贴即用
HANDS-ON
04
把快乐和奖品都带走小红书电影卡 × 社区京东卡、电脑包、马克杯
REWARDS
< trae.cn >
TRAE on Campus
邀请好友体验 TraeCode，双方各得 500 积分，最高得 3500 积分 立即参与 →
TRAE
智能无限，协作无间
新用户享多重积分好礼，畅用专业 AI 编程生产力
TraeCode：你的专属 AI 开发工程师
TraeWork：全新上线的 AI 办公平台
TraeWork：全新上线的 AI 办公平台
⬇ 下载 TraeCode⬇ 下载 TraeWork
TRAE下载 TRAE
2下载中心安装 TraeCode还能装手机端，远程指挥电脑干活→
3登录并认证学生身份立领 2000 积分；提示词也能直接在 TraeWork 用
Live Demo · 现场演示作品
《盛世华诞 · 烟花许愿》
一个单 HTML 文件：Canvas 烟花 + 满月 + 天安门剪影，零依赖、零配置，浏览器打开就能玩。现场演示从一句话提示词到完整作品的全过程。
完整提示词 · PROMPT（复制即用）
请用原生 HTML + CSS + JavaScript（Canvas）做一个国庆主题互动烟花网页《盛世华诞·烟花许愿》，单 HTML 文件、资源全部内联。场景：深蓝夜空，右上方一轮带光晕的满月与闪烁星星，下方是天安门与城市天际线剪影；页面中部显示「喜迎国庆 77 周年」和副标题「月满中秋 · 家国同庆」。交互：1）点击或触摸夜空任意位置发射烟花，爆炸粒子带重力、拖尾和渐隐，配 Web Audio 合成的轻微燃放声；2）每 8 秒自动绽放一轮，并随机显示祝福词（国庆快乐、花好月圆、山河锦绣、国泰民安）；3）输入名字点「许下心愿」，一束金色专属烟花打出「xxx 祝祖国生日快乐」；4）手机横竖屏都自适应。配色用中国红 + 鎏金 + 月白。
点击夜空放烟花
自动绽放随机祝福
输入名字许下金色心愿
LIVE DEMO
成品已放在活动文件夹：盛世华诞-烟花许愿.html，手机扫码也能玩
#单HTML#Canvas#WebAudio#零依赖#手机适配
Prompt Kit · 灵感库 1 / 2
出行娱乐三件套
官方精选的假期场景，全部单 HTML、手机适配。复制提示词发给 TraeCode，2-3 分钟出作品。
01实用工具
AA 旅行账本
多人出游最怕糊涂账：一键记账，自动给出转账次数最少的结算方案。
完整提示词 · 复制即用
请帮我做一个轻量的多人 AA 记账 H5 页面，适合假期和朋友出游时在手机上快速记账、一键算账，不做复杂应用。核心功能：1）打开即可添加同行成员（姓名即可）；2）记一笔：选付款人、填金额、勾选参与分摊的人，一步完成；3）自动算出每人应收应付，并给出转账次数最少的结算方案（谁转给谁、转多少）；4）首页显示总支出、人均花费和账单列表，可删除记错的记录。要求：手机竖屏单页，viewport 自适应、底部留安全区；数据存 localStorage，无后端、无注册登录；大按钮大输入框，触控区不小于 44px，记账不超过 2 步，操作有轻量反馈；清爽简洁，单 HTML 文件、内联资源，手机浏览器打开即用。
H5 · localStorage官方选题
02生活分享
本地人美食地图
把吃了十几年的私藏老店，做成一张能按分类筛选的城市名片。
完整提示词 · 复制即用
做一个【你的城市】本地人美食推荐 H5 页面。按早餐、午餐、晚餐、宵夜、甜品饮料分类，每家店包含：店名、一句话点评、必点菜品（附价格区间）、地址。页面顶部是城市名和一句 slogan，比如「一个厦门人的私藏吃喝指南」。整体风格温暖有食欲，暖黄 + 米白配色，卡片式布局，每张卡片配一个食物图标，支持按分类筛选，移动端适配。先预填 15-20 家当地代表性店铺，涵盖早餐粉面、本地家常菜、夜市烧烤、海鲜、甜品奶茶，信息按公开评价先填好，我之后再调整。
H5 · 分类筛选官方选题
03打发时间
2048 触屏小游戏
高铁上、酒店里、下雨天，竖屏触屏即开即玩，还能撤销上一步。
完整提示词 · 复制即用
请用原生 HTML + CSS + JavaScript 做一个 2048 小游戏 H5，主打手机竖屏、触屏滑动、即开即玩。玩法：4×4 棋盘，支持触屏上下左右滑动也兼容键盘，滑动判定灵敏、移动与合并动画流畅；实时计分，最高分存 localStorage；达成 2048 提示胜利并可继续，无可移动步数时结束，提供重新开始与撤销上一步。要求：竖屏居中自适应，棋盘一屏完整显示，底部留安全区；数字方块随数值形成和谐色阶，高数值带微光；圆角卡片、柔和质感；单 HTML 文件、内联资源、无后端，手机浏览器打开即玩。
H5 · 触屏游戏官方选题
Prompt Kit · 灵感库 2 / 2
双节定制三件套
中秋国庆氛围拉满，新手零门槛。做出来的作品可直接投稿今日介绍的两个活动。
04节日氛围
双节电子贺卡
选主题、填称呼署名，满月烟花自动生成，截图就能发给亲友。
完整提示词 · 复制即用
做一个中秋国庆双节电子贺卡网页（单 HTML 文件，资源全部内联）。流程：选择主题（中秋月圆 / 国庆盛典）→ 选一套封面风格（3 选 1）→ 填写收件人称呼、祝福正文和你的署名 → 生成贺卡并全屏放映：中秋主题是满月升起、桂花飘落、孔明灯升空；国庆主题是烟花绽放、红旗飘扬、金粉飘落；提供「换一句」随机祝福语，文字可编辑，方便截图分享。配色：中秋用月白 + 鎏金，国庆用中国红 + 金色，典雅衬线字体排版；手机适配，浏览器打开即用。
H5 · 动画贺卡双节定制
05厦大限定 · 中秋传统
中秋博饼小游戏
还原闽南中秋传统：六骰掷碗，自动判状元对堂，多人轮流记成绩。
完整提示词 · 复制即用
用原生 HTML/CSS/JavaScript 做一个中秋博饼小游戏网页（单文件），还原厦门中秋传统玩法。一个红木碗中六颗骰子，点击「掷骰」播放骰子滚动动画后落定；按闽南规则自动判定功名并高亮：状元（四红等）、对堂（1-6 各一个）、三红、四进、二举、一秀；支持输入玩家姓名、多人轮流、记录每人成绩；附完整功名规则表与对应奖品示例（如状元插金花、状元饼）。界面红金喜庆中国风，有灯笼装饰与 Web Audio 合成的骰子声、欢呼声；竖屏适配，手机浏览器打开即玩。
H5 · 多人游戏双节定制
06假期效率
双节打卡清单
出行、团圆、假期、节日四类清单预置好，全部完成触发满屏烟花。
完整提示词 · 复制即用
做一个「双节假期打卡清单」H5（单 HTML 文件）。预置四类清单可勾选，也能自行添加、删除：出行（身份证、车票、行李打包）、团圆（家庭聚餐、拍全家福、吃月饼）、假期（早起、运动、读一本书、看一部电影）、节日（赏月、看升旗、看烟花）。顶部显示假期进度条、完成百分比和今日已完成数；全部打勾触发满屏烟花庆祝；数据存 localStorage，关掉不丢。要求：手机竖屏、大触控区、分组卡片、轻量勾选动画，中国红 + 月白节日配色，单文件、无后端、打开即用。
H5 · localStorage双节定制
福利活动 ① · 小红书十一活动
十一活动同步进行中！
这个十一长假，用 TraeCode 为出行、团聚或宅家时光，做一个专属小工具、网页或游戏 Demo。把你的假期灵感 VibeCoding 出来，就有机会获得 2 张 90 元电影卡！🎬
✨ 不用做复杂产品。解决一个假期里的小问题，或给亲友带来一点快乐，就值得分享。
参与方式 · 3 步发布
1
选择一个假期场景，使用 TraeCode 完成你的作品
2
在小红书发布作品演示和创作过程（图文 / 视频均可）
3
带话题 #VibeCoding假期搭子 #TraeCode，并 @官方账号
🎬
优秀作品：2 张 90 元电影卡
两张 90 元电影卡，假期结束正好约一场
作品征集截至 2026.10.10 · 快把你的假期灵感 Vibe 出来！
查看十一活动原文并立即参与 ↗
福利活动 ② · TRAE 中文论坛
forum.trae.cn/t/topic/182046 ↗
【中秋国庆 VibeCoding】你出题，我来做
方式一 · 话题互动：评论区留下假期愿望 许愿
在活动帖评论区，说出一个你在旅行、聚会或假期生活中遇到的具体问题，或想要的双节小工具 / 应用。越具体，越容易被创作者认领。
我想要一个【工具 / 应用 / 页面】，用来解决【具体场景里的问题】。最好能有【你期待的功能或效果】。
🗺 出行旅游：路线规划 / 行李清单 / 天气PlanB / Citywalk / 旅行预算 / 景点打卡
🏮 团圆聚会：聚餐安排 / 聚会小游戏 / 祝福页 / 电子贺卡 / 合照整理
📅 假期效率：计划表 / 每日提醒 / 读书观影清单 / 运动打卡 / 返程准备
🎆 节日氛围：中秋月亮 / 国庆红旗 / 灯笼 / 烟花 / 城市旅行主题页
方式二 · 创作参与：用 TraeCode 做出来 创作
- 在评论区挑一个感兴趣的需求，回复「这个我来试试」；也可以不认领，直接按自己的灵感创作。
- 到 TRAE 社区「案例与作品」板块发布新帖，并带上活动话题 #中秋国庆 VibeCoding。
- 发帖标题格式：【中秋国庆 VibeCoding】+ 作品名称；题目来自评论区请附上原评论链接，并回到评论下贴出作品。
帖子建议包含：做了什么作品 · 灵感来自哪条评论或真实场景 · 解决了什么假期问题 · 作品截图 / GIF / 体验链接 · 使用 TraeCode 创作的过程截图或关键步骤。
有效作品标准：至少展示一个能运行的页面、工具、应用或 Demo，并附上截图、录屏或体验链接——只发想法或提示词不算完成。
Forum Rewards · 活动奖励
60 份奖品，许愿和创作都能赢
优秀创作奖 · 10 名
综合大奖
×10份
100 元京东卡+电脑包
综合实用性、完成度与展示效果，评出的 10 个优秀作品。
积极创作奖 · 30 名
人手有份的鼓励
×30份
30 元京东卡
完成有效作品，并清楚展示创作过程与运行结果的创作者。
优质评论 · 20 名
会许愿也能中奖
×20份
TRAE 定制马克杯 × 1
场景真实、需求具体、适合被创作者做成作品的评论。
现在就去 forum.trae.cn/t/topic/182046→评论许愿，或认领需求动手实现
Happy Mid-Autumn & National Day
祝大家双节假期快乐
月满华诞 · 家国同庆
愿你在这个长假里，看得见山海，也玩得转创造。
🎬 小红书 #VibeCoding假期搭子 · 10.10 截止
🏮 论坛 #中秋国庆VibeCoding · 10.10 开奖
TRAE on Campus @厦门大学 · The Real AI Engineer · trae.cn
TRAE ON CAMPUS · VIBE CODING WORKSHOP 4中秋国庆 · 2026.10
The Real AI Engineer01 / 10