用途:在 HyperFrames 合成中制作幼儿园、托儿所教师发送给家长的 16:9 幻灯片,适用于家长通知、玩耍记录、项目活动分享、下次玩耍预告等场景,也用于呈现教师拍摄的教室或户外玩耍照片与观察语句。
视觉风格:淡黄格纹背景(#FBE987 系)、白色雏菊与小蜜蜂、奶油色云朵/扇贝面板、橙色标签、深蓝色大标题;主色为深蓝 #006FB4、橙 #FDB515、奶油 #FFF7CE 与白色面板。字体优先 Paperlogy,标题 800-900,正文 700 以上,强调韩文可读性。装饰用 CSS/SVG 制作,每页 2-5 个,禁止随机放置。
版面类型:bee-cover(封面:曲线标题+大云朵面板+期间标签+花田装饰)、notice-story(玩耍的开始:中央白色虚线面板+大正文+2-3 张圆形照片)、hex-gallery(细节活动整理:左侧说明列表+右侧六边形照片簇)、teacher-note(长观察记录:顶部照片条+两段正文+下划线强调)、next-play(下次玩耍预告:三列卡片,每卡含标签、照片与教师支持计划)。
实现要点:每个场景为 1920×1080,包含 clip 与 timing 属性;.scene 使用 64px 白色格纹背景;面板用虚线边框与大圆角;六边形照片使用 clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0 50%);花朵与蜜蜂用 .daisy、.bee 公共类并加 aria-hidden="true"。入场动画通过 GSAP timeline 实现(标题、面板、照片、正文依次进入),并写入 window.__timelines["main"]。
编写原则:单页正文 4-8 行;数字列表简短;单页照片不超过 4 张且形状统一;底部花田装饰固定在 bottom: -8px 附近,不遮挡正文;用观察记录口吻(如“孩子们……”“表现出了兴趣”)。
验证命令: npx hyperframes lint topics/<주제> bash .codex/skills/hyperframes-overview/serve.sh topics/<주제> 8765
制作 overview.html 时必须包含 hyperframes-overview-edit 的 Edit 按钮功能。先把 overview.html 的 URL 提供给用户,视频渲染仅在用户确认概览并明确要求后执行。