2025年6月27日，在KK魔法学院的构成课结课毕业啦~在毕业季14,4班同学组织起了合绘，合绘的餐厅主题一下子就想到了赛博点单，请看：

网页链接：https://ssdsbakery.github.io/

项目地址：https://github.com/SSDSBakery/SSDSBakery.github.io

开发日志

2025.7.2

命名：SSDSBakery——十四点四烘焙房

策划书

搭建了新的github page

2025.7.3

技术栈预测

1. HTML5/CSS3
   • 基础布局和样式
   • CSS动画（关键帧动画、过渡效果）
   • 3D变换（用于桌牌翻转效果）
   • Flexbox/Grid 布局
   • 媒体查询（响应式设计）
2. JavaScript (ES6+)
   • DOM操作
   • 事件处理（点击、滑动等）
   • 状态管理（跟踪菜品状态、视角位置等）
3. 动画库
   • **GSAP (GreenSock)**：专业级动画库，适合复杂动画序列（开门动画、镜头移动、菜单弹出）
   • Anime.js：轻量级替代方案
4. 交互增强库
   • Hammer.js：处理手势操作（名片滑动）
   • Tilt.js：实现微妙的3D倾斜效果（可选）
5. 前端框架
   • Vue + VueUse：组合式API简化交互逻辑
   • Svelte：编译时优化，适合高性能动画

必需图片资源清单

1. 场景图：
   • 关闭的门（带”推开门”提示）
   • 打开的门（动画中间帧可选）
   • 完整的桌子场景（包含菜单、桌牌、名片盒位置）
2. UI元素：
   • 关闭的菜单（放在桌上的状态）
   • 打开的菜单（多页设计）
   • 关闭按钮（”×”图标）
   • 桌牌正面（餐厅介绍）
   • 桌牌背面（地址信息）
   • 名片盒/名片堆叠初始状态
3. 菜品图（每种菜品需要）：
   • 菜单中的小图标（带状态标签）
   • 桌上展示的大图（带透明背景）
   • 菜品介绍卡片背景
4. 名片系列：
   • 5-10张不同设计的名片（统一尺寸）
   • 名片堆叠结束状态图
5. 装饰元素（可选）：
   • 二次元风格餐具装饰
   • 背景纹理
   • 光影效果覆盖层