讲稿转乔布斯风竖屏 HTML 演示
将以下提示词粘贴到你的 AI 对话框中:
请根据 https://skillhub.cn/install/skillhub.md,安装 @user_7302e03b/wangyouwei-test3。
技能介绍
要解决什么问题
口头讲稿往往信息密度高、段落冗长,直接贴进幻灯片会变成「堆字屏」。若你还需要竖屏场景(录屏、手机预览、竖版短视频配图),传统 PPT 工具很难在版式上统一约束:横屏习惯、配色花哨、一页塞满要点,都会偏离「一屏一件事」的演示节奏。
这个技能把目标收窄得很明确:不改动你原始讲稿的读取语义,但在生成侧强制执行一套「乔布斯风极简科技感」的竖屏 HTML 流水线,最终交付单个可直接打开的 HTML 文件。
技能如何工作
流程在 SKILL 里被写成必须依次执行的六步,输出顺序也固定为三段:
- 提炼后的讲稿(Markdown)——精简、增强冲击力,适配演示场景。
- 幻灯片结构大纲——按
references/slide-types.md规划页型与顺序。 - 完整 HTML 代码——基于
assets/template.html,并补齐动态光斑、翻页交互与切换动画。
中间还有两道「硬约束」环节:为每章生成 ≤12 字 的章节标题(对比式、问题式、断言式、数字式、比喻式之一),以及按设计规范落版(9:16、#000000 / #0a0a0a 背景、主色 #ffffff、HarmonyOS Sans SC / Inter 等)。交互上要求键盘 ← → 翻页、底部进度条与平滑过渡;技术栈为 TailwindCSS(国内 CDN),复杂页可挂 Vue3(CDN)。
适用边界与注意点
- 默认页数未指定时,技能会自行生成约 8~20 页;风格未指定时默认乔布斯风。
- 严禁密集排版、花哨配色、复杂图表与横屏比例——若你的材料依赖大表、复杂数据可视化,需要先在外部简化再喂给讲稿。
- 详细视觉与页型规则在
references/design-spec.md与references/slide-types.md,生成质量高度依赖讲稿结构与这两份参考是否可被技能正确引用。
使用场景
- 技术分享已写好逐字讲稿,需要按章节生成≤12字标题并输出可键盘翻页的竖屏 HTML 彩排
- 内训材料是长文稿,要提炼成 Markdown 讲稿再落成 9:16 单页 HTML,方便手机竖屏预览给同事
- 录屏讲解产品叙事时,希望深色背景、高留白的一屏一事幻灯片,且禁止横屏与复杂图表
- 路演或发布会提纲已定,要把原文读入后走六步流程,一次性拿到结构大纲与完整 template 填充后的 HTML
适合人员
- 负责技术大会或内部分享、习惯先写完整讲稿再彩排的产品/研发主讲人
- 需要把培训讲义改成竖屏演示稿、并用单 HTML 发给学员预习的企业培训师
- 做竖版短视频或录屏解说、追求乔布斯风极简科技感画面而非传统 PPT 的内容创作者
- 筹备小型路演或发布会 narrative、希望严格遵循设计规范与 slide-types 页型约束的活动策划