本教程将带你从零开始，
一步步掌握这款“文件即软件”的下一代演示文稿工具。
你不需要安装任何程序或注册账号，
只需一个现代浏览器和一份.bento.html文件即可。
第一部分：认识Bento —— 一个文件就是一个世界
在开始之前，请先理解它的核心哲学：你的演示文稿、编辑器、播放器，全部打包在一个独立的 .bento.html 文件中。这意味着：
- 无需安装：双击文件，在浏览器中打开即用。
- 真正属于你：内容以纯文本（JSON）格式嵌入文件，可备份、可版本控制，永不因平台停运而丢失。
- 离线可用：除了需要网络播放的在线视频链接外，所有内容离线完整可用。
💡 快速开始：获取一个
.bento.html文件后，用浏览器打开它。你会直接进入编辑界面。试着点击、拖动、双击文字，感受它如同本地软件般的流畅。
第二部分：核心工作流 —— 像操作软件一样操作文档
1. 界面速览
- 顶部工具栏：添加内容（文字、形状、图片、表格等）到当前幻灯片。
- 左侧面板：管理所有幻灯片（缩略图列表）。
- 右侧面板：调整选中元素的详细属性（位置、颜色、字体、动画等）。
- 底部控制栏：播放演示（▶）、缩放、保存等。
2. 基本操作
- 选择与移动：点击选中画布上的元素，拖拽移动。
- 调整大小：选中元素后，拖动其边框上的控制手柄。
- 编辑文字：双击文本框，直接输入或编辑。支持 粗体、斜体、
代码和项目符号，格式会实时生效。 - 保存：⌘S (Mac) / Ctrl+S (Windows) 将修改直接写回原文件。同时，文件也会自动保存你的工作进度。
3. 添加内容
点击顶部工具栏的按钮，为当前幻灯片添加各种元素：
第三部分：让演示“活”起来 —— 动画与动效
Bento最吸引人的是它平滑、电影级的动效。
所有动效设置都在选中元素后的右侧面板 → “Presenting”（演示）部分。
1. 形态变换 (Morph) —— Bento的标志性功能
这是实现专业、流畅过渡效果的核心。
- 原理：在两个连续的幻灯片上，给同一个元素（例如一张图片、一个标题）设置相同的名称（ID），并将后一张幻灯片的过渡效果设为 “Morph”。
- 效果：播放时，该元素会从第一张幻灯片的位置、大小、颜色，平滑地“流动”到第二张幻灯片的状态。
- 快捷操作：复制一张幻灯片，然后移动、缩放或重新着色其中的元素。因为复制品共享相同的ID，它们会自动实现形态过渡。
2. 基础动效 (Motion)
- 图片的“肯·伯恩斯”效果 (Ken Burns)：为图片添加缓慢的推拉摇移效果，让全屏背景图“呼吸”起来。在右侧面板选择 Ambient（环境）→ Ken Burns，可调整漂移风格、变焦幅度和时长。
- 元素的入场动画 (Entrances)：为元素设置进入动画（淡入、上浮、滑入等）。可以调整 Order（顺序） 来实现错落有致的“逐级出现”，调整 Enter secs（时长） 控制动画速度。
- 数字滚动 (Count-up)：选中包含数字的文本框，开启 Count up，演示时数字会从0滚动到设定值。
💡 提示：形态变换（Morph）和入场动画（Entrances）的区别在于：
Morph是跨幻灯片的持续变换，而Entrances是单张幻灯片内元素的出现方式。
第四部分：数据可视化与交互
1. 表格与图表的联动
- 从工具栏添加一个 表格 (▤)，输入数据。
- 在表格的专属面板中，点击 “转换为图表”。
- 此时，表格和生成的图表会保持实时链接。当你修改表格中的数字时，图表会自动更新。非常适合数据与趋势图并排展示的页面。
2. 交互式元素
- 链接到其他幻灯片：选中任意元素（如一个按钮），在右侧面板为其设置链接到另一张幻灯片。还可以创建“状态页”（State Slide），这是一种隐藏页，只能通过点击链接跳转，按方向键会跳过它，适合制作“点击展开详情”的效果。
- 悬停显示 (Hover Reveal)：设置当鼠标悬停在某个元素上时，替换显示另一组内容。
- 循环动画 (Loops)：为元素绘制运动路径，或创建“行军”虚线，制造持续运动效果。
第五部分：演示与协作
1. 演示模式
- 点击左下角的 圆形 ▶ 按钮 进入全屏演示，或点击旁边的按钮在浏览器标签页内演示（适合屏幕共享）。
- 快捷键：F 切换全屏，Esc 结束演示，←/→ 翻页。
- 演讲者视图：按 S 键，会打开一个新窗口显示当前页、下一页、演讲者备注和计时器。
2. 实时协作 (Live)
点击界面中的 “Live” 按钮开始一个协作会话。
- 分享即邀请：你只需将你的
.bento.html文件发送给协作者，他们打开后即可加入同一编辑房间。 - 端到端加密：加密密钥存储在你的文件内，服务端无法读取内容。
- 合并编辑：所有人的编辑会实时合并，即使离线修改，再次连线后也会自动同步。
第六部分：保存、版本与AI赋能
1. 版本控制与安全
- 版本历史：通过 保存 (⌘S) → 版本历史，可以查看并恢复之前的本地快照。
- 密码保护：在保存菜单中可为文件设置密码。
- 分享只读/仅演示版：在分享菜单中生成限制权限的副本，适合分发。
2. 🤖 AI原生工作流 —— 最重要的进阶技能
因为 .bento.html 本质是结构化的JSON文件，任何AI都可以直接读取和编辑它！
- 方法一：直接放入AI聊天。将你的
.bento.html文件上传到支持文件分析的AI（如ChatGPT、Claude、Gemini等），然后用自然语言指令修改：“把第三页的标题改成红色”、“在第五页后插入一张新的图表”。 - 方法二（更强大）：安装Bento Slides技能。这能让AI助手（如Claude Code）自动掌握Bento的所有功能，并直接生成、修改完整的演示文稿文件。具体安装指令请参考官方帮助页面的第11节。
快捷键速查表（Windows）
特别申明
本教程基于Bento.page官方帮助文档，
由自留地君用 DeepSeek生成。
结语
你已经掌握了Bento.page的核心用法。
它最大的魅力在于，当你熟练后，你会忘记“工具”的存在——你的内容、你的设计、你的演示逻辑，都统一在这个轻巧却强大的文件中。
开始创作你的第一个“会呼吸”的演示文稿吧！
Bento.page