FrameSeq Studio#

FrameSeq Studio 把写一场讲演的整个循环放进一个窗口：缩略图形式的全部幻灯片、带 TypeScript 支持的源码编辑器、实时预览，以及一份列出这份演示所有问题的清单。除了 FrameSeq 包本身，它什么都不需要：不用另装编辑器、扩展或单独的程序。

这一页逐一介绍窗口的每个部分。想一步一步做出第一份演示，请从 Studio 快速上手 开始。

装好 FrameSeq 应用 后，从开始菜单、“应用程序”或应用菜单里打开 FrameSeq Studio。在终端里，用下面的命令也能在一个文件上打开同一个 Studio：

frameseq studio talk.fsq

这条命令会启动开发服务器并打开 Studio。如果装了 Chrome、Edge、Chromium 或 Brave，Studio 会以一个独立的应用窗口打开，没有标签页也没有地址栏；否则在默认浏览器里打开。用 npm create frameseq 生成的项目可以用 npm run studio 做同样的事。

不带文件运行、而且启动时所在的文件夹里没有 slides.ts 时，frameseq studio 会打开它的启动页：在那里新建演示、打开已有的演示，或者接着编辑最近用过的。想像其他程序一样打开 Studio、而不必经过终端，就添加一个快捷方式：

frameseq shortcut

源码仍然是这场讲演唯一的描述。Studio 里的每个操作，无论是打字、在预览里拖拽，还是在左侧栏里调整页面顺序，最终都是对 talk.fsq 的一次编辑，编辑器自己的撤销就能把它撤回。

窗口布局#

拖动分隔条可以调整各区域大小，双击分隔条恢复默认值。Ctrl+B（macOS 上为 ⌘B）隐藏左侧幻灯片栏，Ctrl+J 显示或隐藏底部面板，Ctrl+` 打开终端。底部面板一开始是折叠的，因为状态栏会统计问题数量，编辑器也会在问题处画波浪线；点状态栏上的计数也能打开它，出现构建错误时它会自动打开。这些尺寸会被浏览器记住。

想不看代码、只编辑幻灯片时，点顶栏的 代码 或按 Ctrl+E：编辑器收起，预览占满它的位置，直接在上面拖动、修改文字、插入和删除对象，Ctrl+Z 照样可以撤销。光标会一直跟着你选中的对象走，所以代码再打开时停在你最后动过的对象上；转到这一页的源码、点问题列表里的一项、按住 Alt 点对象这类与代码有关的命令，会自动把代码打开。

菜单栏#

所有命令都在顶部的菜单栏里，旁边标着各自的快捷键：

按 Alt 或 F10 可以用键盘进入菜单栏；按 Alt 加菜单名后括号里的字母则直接打开那个菜单，比如 Alt+F 打开 文件。方向键在菜单和命令之间移动，Esc 关闭菜单。视图 › 主题 可以跟随系统，也可以固定为浅色或深色。幻灯片本身仍然使用演示文稿自己的主题。

右键菜单#

在一个东西上单击右键，或者按 Shift+F10 或菜单键，就会弹出适用于它的命令，和 PowerPoint 一样：

右键单击一个对象会单独选中它；如果它本来就已选中，选区保持不变。右键单击幻灯片的空白处会清除选区。叠放次序就是源码行的顺序：置于顶层 会把对象的源码行移到旁边其他用坐标定位的对象之后，于是它画在它们上面；在文档流里，同样的命令会让它在相邻对象之间移动。编辑文字 会像双击一样，在幻灯片上原地修改这个对象的文字；公式或图片则会在当前页里打开它的设置，并选中它的文字；设置格式… 则打开到它那一行。每条命令都是编辑器历史里的一步。

复制 会记下写出这些对象的源码行（连同上方的注释），并把它们作为文本放进剪贴板，所以也能粘贴到代码里。粘贴 会像 插入 一样，把它们写到预览里那一页、选中对象的后面。那一页已经有的名字会换成新名字，比如 box 变成 box2，粘贴的代码里引用它的地方也跟着改。粘贴回原来那一页时，用坐标定位的对象每次向右下方移动 24，副本不会挡住原来的对象。在预览里，Ctrl+C、Ctrl+X、Ctrl+V 和 Ctrl+D 分别是复制、剪切、粘贴和创建副本。写在另一条命令里面的对象要在代码里复制。

在代码里，右键单击选区之外的地方会先把光标移过去，菜单里的命令就作用在那里。粘贴 在浏览器允许读取剪贴板时直接粘贴，否则会提示按 Ctrl+V。

窗口里的其他地方右键单击什么也不弹出；输入框、链接、选中的文字和终端除外，它们保留浏览器自己的菜单。按住 Shift 右键单击，在哪里都会打开浏览器的菜单。

在 FrameSeq 应用里#

FrameSeq 应用给 Studio 一个自己的窗口;在 Windows 上,它的菜单栏就是标题栏:拖动空白处移动窗口,双击最大化,右端是最小化、最大化和关闭按钮。在 macOS 上,红绿灯按钮在菜单栏的左端。放映让这个窗口本身全屏显示幻灯片,有第二块屏幕时显示在那块屏幕上,这块屏幕则显示演讲者视图;放映 › 在新窗口中打开演讲者视图 会在单独的窗口里打开演讲者视图,帮助 › 文档 这样的链接会在默认浏览器里打开。关闭窗口时,和打开另一份演示一样,会先询问未保存的修改,然后停止 Studio。

语言#

Studio 有英文和中文两种界面。它一开始使用浏览器的语言，用 视图 › 语言 或启动页上的切换按钮可以改。窗口会用新的语言重新载入，未保存的文本会保留下来。中文界面下，TypeScript 自己的错误信息也是中文，新建的演示也会用中文占位文字。这个选择会被浏览器记住。

更新#

FrameSeq 应用和用 npm 安装的 FrameSeq 每天检查一次有没有更新的 FrameSeq。只改动 FrameSeq 本身的版本，应用会自己安装，Studio 会提示它在下次打开 Studio 时生效；需要新应用的版本，提示里的 下载 会打开附带安装包的发布页。npm 安装则显示用来更新的命令。跳过这个版本 之后不再提这个版本，直到更新的版本出来。帮助 › 检查更新… 立即检查，应用能自己安装时会提供 更新 按钮；帮助 › 自动更新 关闭每天的检查，应用也就不再自己更新，和设置 FRAMESEQ_NO_UPDATE_CHECK=1 一样。应用向 npm 仓库和 GitHub 查询，npm 安装向 npm 仓库查询；除了 FrameSeq 的版本号，都不发送任何内容。仓库的检出目录不做检查；用 --no-open 启动的 Studio（脚本和测试就是这样启动的）只在被要求时才检查。

演示文稿#

文件 菜单里有 新建演示…、打开…（Ctrl+O）、最近打开过的演示，以及 在文件夹中显示；点顶栏中间的文件名也会打开同样的列表。启动页同样提供这些操作，并列出最近的演示，每一项都有一个按钮可以把它从列表里移除。

• 新建演示 会询问标题、模板和文件夹，按标题给文件命名，比如标题 Quarterly review 对应 quarterly-review.fsq，并把模板写进去，标题已经填好。同名的文件永远不会被覆盖；对话框会改为提供打开它。文件夹默认是上次用过的那个，否则是“文档”文件夹。
• 模板以它们真实的封面展示，渲染方式和演示本身一样。每个内置主题各有一个模板：空白，一页封面和第一页内容；午夜，深色的产品和技术分享；纸张，讲故事用的衬线字体页面；学术报告，用 minimal-academic 主题的研究报告；Beamer、Beamer Madrid 和 Beamer CambridgeUS，同一份讲义分别用三个 Beamer 风格的主题；以及 学术海报，三栏的 A0 会议海报。每个模板原样就能通过布局检查。双击模板会立即创建演示；下次打开对话框时，会选中上次用过的模板。
• 下面的 我的模板 是你自己的模板：用 文件 › 另存为模板… 存下的演示，母版和主题都在里面。右键点你的模板，可以编辑、在文件夹中显示或删除；右键点内置模板，可以在你的模板里存一份副本再修改。模板下方的一行写着模板文件夹的位置，旁边的按钮可以打开它，或者把它换到别处；见母版与模板。
• 打开 会显示这台电脑自己的打开对话框。没有这种对话框时，比如 Linux 上既没有 zenity 也没有 kdialog，Studio 会改为让你输入文件路径；设置 FRAMESEQ_NO_DIALOGS=1 则总是让你输入。
• 当前文档有未保存的修改时，Studio 会先问是否保存。选 取消 则留在当前文档。

演示文件的后缀是 FrameSeq 自己的 .fsq。文件内容就是 TypeScript，和 .slides.ts 文件里写的完全一样，Studio 两种都能打开：把文件从一种后缀改成另一种，别的什么都不用变。如果演示属于一个用 tsc 做检查的 TypeScript 项目，就继续用 .slides.ts，因为 tsc 只读 .ts 文件；编辑器里的情况见 VS Code。

双击 .fsq 文件就能在 Studio 里打开它：Windows 上要先装 FrameSeq 应用或者运行过 frameseq shortcut，macOS 上用 FrameSeq 应用，Linux 上要运行过 frameseq shortcut（应用的 install.sh 会运行它）。同一份演示不会在两个 Studio 里同时打开：已经有 Studio 打开了它，就把那个 Studio 的窗口切到前面。还停在启动页的 Studio 会直接打开它；否则它在自己的新窗口里打开，并以文件所在的文件夹为工作目录。在 macOS 上，应用只保留一个窗口，它像 打开… 一样打开这份演示，有未保存的修改时会先询问。

随后另一份演示会在同一个窗口里打开，从此 Studio 以它所在的文件夹为工作目录：它的导出会写在它旁边，即它自己的 output/ 和 dist/。最近的演示记录在 FrameSeq 的设置文件夹里：Windows 上是 %APPDATA%\FrameSeq，macOS 上是 ~/Library/Application Support/FrameSeq，Linux 上是 ~/.config/frameseq；设置了 FRAMESEQ_CONFIG_DIR 时则用它。用 --no-open 启动的 Studio（脚本和测试就是这样启动的）不会改动这份列表。只有运行 Studio 的那台电脑能打开文件、显示对话框，即使加了 --host 也是如此。

快捷方式#

frameseq shortcut

这条命令会把带 FrameSeq 图标的 FrameSeq Studio 加到 Windows 的开始菜单和桌面、macOS 的 ~/Applications，或 Linux 的应用程序菜单里。快捷方式打开的是启动页。它运行的是 frameseq studio --background：不经过终端启动 Studio，并在它的窗口关闭后停止；服务器的输出写到设置文件夹里的 studio.log。--background 也可以和文件一起用：frameseq studio talk.fsq --background。在 Windows 和 Linux 上，这个快捷方式还会让双击 .fsq 文件时在 Studio 里打开它，并给它换上 FrameSeq 的图标；--remove 也会把这些一并撤掉。在 macOS 上由 FrameSeq 应用来打开它们，指向 npm 安装的快捷方式做不到这一点。

快捷方式运行的是创建它的那份 FrameSeq，通常是全局安装的那份，所以移动或重新安装 FrameSeq 之后，要再运行一次 frameseq shortcut。frameseq shortcut --remove 会把它删掉。

当前页检查器#

幻灯片栏下方的 当前页 列出预览当前页上的所有对象，按写出它们的区域分组：主区域、左栏和右栏、网格的各格，或者命名区域。每一行显示对象里的文字，或者它是什么，旁边的标签写着它的种类或文字样式，比如“导语”“说明文字”；鼠标停在行上可以看到写出它的行号。

选中一个对象（点它所在的行、在预览里点它，或者把编辑器光标放进它的命令），它的设置就会在这一行下面展开，就像绘图软件的格式面板；再点一下这一行可以把设置折叠起来，再点一次又会展开：

• 内容：文本对象的文字、列表的各个条目、公式的 Typst、LaTeX 或 TeX 源码、图片的文件、形状的种类和文字。写在模板里的多行源码显示时去掉了它在代码里的缩进，写回时原样补上。较长的公式和文字会在框里自动换行，拖动框的右下角可以把它拉高。改完按 Enter，或者点到别处；多行的文字里 Enter 是换行，用 Ctrl+Enter 确认。文字里的公式带反斜杠时（比如 $\frac{1}{2}$），会写成 text`...`，反斜杠按输入的原样保留。
• 文字：样式（正文、标题、导语、说明文字、引用等）、字号、加粗、颜色和对齐。
• 外观：背景、填充、轮廓、圆角和不透明度；形状的配色点一下颜色就行。
• 大小和位置：宽度和高度，在自由画布上还有 X 和 Y。
• 更多设置可以添加没有显示的设置，比如行高、旋转；转到代码把光标放到它的命令上；复制一份（或者在选中的行上按 Ctrl+D）会在对象后面写一份副本，有名字的会换一个不重复的名字，按坐标放置的会稍微错开，好让两个都看得见；删除（或者在选中的行上按 Delete 键）删除一个独占一条语句的对象，规则和在预览里删除一样：写在上方的注释和连到它的连接线一起删除；如果别的对象按名字相对它定位，就不会删除。

输入框里显示代码里写的值；没写的显示“自动”或“默认”。输入一个值，会改写已经写出的那个，或者在对象最后一个方法后面加上这个方法，比如 text("Hi").lead() 变成 text("Hi").lead().color("#f97316")；清空输入框则把这次调用删掉。数字可以用 ↑、↓ 加减，按住 Shift 一次 10，按住 Alt 一次 0.1，也可以左右拖动它的名称，预览会跟着每一步变化。由代码算出来的值（比如 width(size * 2)）会以代码形式显示，不会被覆盖，点一下就跳到那里。

每次修改都在编辑器的历史里占一步，所以 Ctrl+Z 能撤回。如果这一页是用循环或辅助函数生成的，面板会显示循环或辅助函数里只写了一次的那些对象，并加以说明。

封面信息#

有些封面由主题根据演示信息自动生成，比如 minimal-academic 和各个 Beamer 主题里的 slide().cover()；海报的页眉也是这样。上面的文字并不是这一页的哪一行代码写的，而是 presentation({ … }) 里的标题、副标题、作者、单位和日期。在这样的页面上，当前页 最上方会显示 封面（或 海报页眉），列出这五项；在某一项里输入，会写进 presentation()，如果选项是分行写的，就新起一行；清空某一项则会把它删掉。封面上的文字在幻灯片上也像对象一样操作：单击选中，代码里对应的选项和这里对应的那一行也会选中；双击可以原地修改；按住 Alt 单击则转到它的代码。由代码算出的信息会以代码形式显示。

信息下方和封面的右键菜单里都有 转为可编辑封面，它会把封面上的文字写成这一页的文本：text("…").hero()、.subtitle()、.author()，单位和日期写成图注。之后它们就像其他文字一样移动、设置格式和修改，封面母版里的占位符决定它们放在哪里。这些信息仍然保留在 presentation() 里，页脚、PDF 属性和其他导出格式会用到它们。

拖动 当前页 上方的分隔条，可以调整它和缩略图各占多少空间；也可以点标题旁的箭头把它折叠起来。

演讲者备注#

预览下方的 备注 显示预览当前页的演讲者备注，和演讲者视图、PowerPoint 里看到的一样。点进去直接输入：Studio 会改写存放备注的那个字符串，所以 slide("Results").notes("…") 或 note("…") 会随着输入改变，引号保持原来的写法，写成缩进块的备注也保留缩进。还没有备注的页面，在输入第一个字时会给它的 slide() 调用加上 .notes("…")；把备注清空，这个调用又会被去掉。每次修改都是一次普通的编辑，在代码里按 Ctrl+Z 就能撤回。

如果备注不是由一个字符串写出的，这里只显示、不能编辑：一页里有好几个 note() 调用、备注由代码算出，或者这一页是用循环或辅助函数生成的。标题栏会说明原因，旁边的 </> 按钮会转到写出它们的代码。拖动 备注 上方的分隔条可以给它更多空间；点标题旁的箭头或选 视图 › 备注 可以把它折叠起来。

编辑与保存#

文件 › 自动保存 默认开启：停止打字片刻后 Studio 就会保存，预览随即按保存后的文件重绘。自动保存只写入能够解析的文本。一行还没写完、或者括号不配对时，保存状态显示 未保存：有语法错误，预览继续显示上一个能运行的版本，而不是在每次按键之间闪出构建错误。Ctrl+S 则总会保存，不管文本是什么样子。

关掉自动保存后，只有按 Ctrl+S 才保存；预览显示的是最后一次保存的文件。

编辑器像普通编辑器一样从最近的 tsconfig.json 读取项目，所以它的补全和错误与 VS Code、tsc 一致。开始输入一条命令，或在命令后输入 .，就会出现补全；把鼠标停在名字上可以看到文档；打开一个调用的括号会显示它的参数。不在任何 TypeScript 项目里的演示文件也能得到 FrameSeq 的全局函数类型。

每个 slide() 调用开始的那一行旁边都有页码标记，点击它就会显示那一页。源码旁的一条竖带标出预览当前正在显示的那一页。

名字#

文档用 .as() 和 at() 起的名字，在 TypeScript 看来只是字符串，所以 Studio 自己来读它们：

• 在 ref()、group()、连线的 .from() 或 .to()、以及 .rightOf() 这类摆放方法的字符串里，补全会列出这一页上的名字；输入 "encoder. 之后列出锚点方位。在 at() 里，补全列出这一页的区域：main，分栏页上的 left 和 right，网格的各个单元格，以及已经访问过的路径。
• 在名字上按 F12 会跳到起这个名字的地方：给对象命名的 .as()，或者第一次创建这个区域的 at()。在路径里，以光标所在的那一段为准，所以 "cell0/now" 里的 cell0 会跳到 cell0 区域。
• F2 一步把一个名字在本页上全部改掉：起这个名字的 .as() 或 at()、每一处引用，以及被改名区域里各个子区域的路径。
• 鼠标停在名字上，会说明它是什么、在哪里起的名，以及这一页引用了它几次。
• 指向这一页上不存在的东西的名字会画上波浪线，附上它最可能想写的那个名字，并列在问题列表的 名字 下。两个对象起了同一个名字、在没有分栏的页上写 at("left")，也同样会被标出。在运行时拼出名字、或调用了可能会这样做的辅助函数的页面不做检查，而不是去猜。

编辑器与预览互相跟随#

打开 跟随光标 后，移动光标会显示光标所在的那一页，并框出这一行写出的对象。光标停留在同一页里时，预览会保留当前的逐步显示进度。

预览里的对象像在 PowerPoint 里一样直接操作，不用先打开什么模式：

• 单击对象选中它，然后拖动：用 position({ x, y }) 定位的对象会跟着移动。只有数字会改变，而且是通过编辑器改的，所以 Ctrl+Z 能把对象放回原处。焦点在预览里时这些快捷键同样有效：Ctrl+Z 和 Ctrl+Y 在编辑器里撤销和重做，Ctrl+S 保存。
• 在幻灯片的空白处拖出一个框：完全落在框里的对象都会被选中；按住 Ctrl 或 Shift 则加到已选的对象里。
• 选中对象四边和四角上的手柄从所在的一侧调整大小：右边和下边的手柄改写代码里的 width() 和 height()，左边和上边的手柄还会同时改 x 和 y，让对边保持不动。按住 Shift 拖角上的手柄会保持比例。只有代码写明了要改的数字时，那一侧才有手柄。
• 用坐标定位的对象上方有一个圆形手柄，拖动它让对象绕中心旋转，写成 .rotate(30)，已经写了角度的则改写那个数字；按住 Shift 每次转 15°。
• 拖动处在文档流里的对象，可以改变它在相邻对象之间的位置；它的源码行会连同注释一起移动。这种拖动要比移动多拖出一段距离才开始，所以手抖一下的单击不会打乱这一页的顺序。
• 代码算出来的值，比如 position({ x: left + 40, y: 120 })、width(size * 2)，或 .rightOf("box") 这样的相对定位，拖动绝不会覆盖它。选中这样的对象时，旁边会说明是什么决定了它的位置，角上的手柄是灰色的；真去拖它时，对象留在原处，并说明原因，附带 转到代码。
• 预览控制栏里的锁形按钮，或幻灯片右键菜单里的 锁定布局，可以锁住布局：对象仍然可以选中、设置格式、修改文字，但在解锁之前不能拖动、缩放，也不能用方向键微移。
• 按住 Alt 点击对象，光标会移到画出它的那条命令上。
• 点选一个对象，或按住 Ctrl 点选几个，再按 Delete 或 Backspace 删除它们：它们的源码行会从源码里删掉，写在上方的注释也一起删掉，连到它们上面的连接线也会一起删除。如果别的对象按名字相对它定位、它写在另一条命令里面，或者它是一个区域，就不会删除，预览会说明原因。按一次 Ctrl+Z 就能全部恢复。
• 按住 Ctrl 点选几个前后相连写下的对象，再选 Bind region，就会把它们的源码行包进一个命名的 at("…").column() 区域，之后可以整体定位或锚定。
• 右键单击对象，可以剪切、复制、粘贴、创建副本、调整叠放次序，或使用它右键菜单里的其他命令。

拖拽可以改写哪些数字，规则见 Visual Studio Code 扩展。

在幻灯片上输入文字#

在预览里双击对象的文字，就能像在 PowerPoint 里一样原地修改：文字、列表的一项、表格的一个单元格、卡片的标题或正文、指标、形状或方框上的标签，以及写进 presentation() 的封面信息。文字按幻灯片上的样子显示，加粗、斜体和彩色的字也一样，行内公式显示为 $...$；光标落在你双击的位置。

• 按 Enter、Tab 或单击别处，文字会写回存放它的那个字符串，沿用原来的引号，作为编辑器历史里的一步；按 Esc 则恢复原样。
• Shift+Enter 换行。代码本身是多行的，所以在代码里 Enter 换行，Ctrl+Enter 结束。
• 选中几个字，按 Ctrl+B 加粗、按 Ctrl+I 变成斜体，或者用文字上方的工具条，它还能把文字设成主题强调色或某个色调，以及去掉单独设置的颜色。写回代码时用的是部分文字的格式的标记，比如 **grew** 和 [42%]{red}；当作文字输入的星号和方括号仍然是文字。代码按纯文本输入。
• 表格单元格里的数字，只要输入的仍是数字，就仍写成数字。没写标签的形状，比如 rect()，会接收输入的文字，写成 rect("Cache")。
• 右键单击表格的单元格，表格 菜单可以在它上方或下方插入一行、在它左侧或右侧插入一列，空单元格按其他单元格的写法写出，原来一行占一行代码的仍然如此；也可以删除它所在的行或列。新插入的行或列会直接进入编辑。
• 右键菜单里的 编辑文字 也这样原地修改，并选中全部文字。
• 带公式的文字，比如 Area $\frac{1}{2}ab$，会写成 text`...`，反斜杠原样保留。

代码算出来的文字，比如 text(`Hi ${name}`)，以及由循环或辅助函数同时写给几个对象的文字，要在代码里修改：Studio 会说明原因，并附带 转到代码。公式、图片、图表、二维码和图标则会在 当前页 里打开设置，LaTeX 公式在那里边输入边排版。

插入内容#

菜单栏和预览顶部的 插入 能像文字处理软件和绘图软件那样，把对象放到预览里的这一页上。它的插入库分两边。左边的 内容 带有名字：

在流式排版的页上（除了自由画布，所有版式都是），对象会写在 选中的对象之后：也就是在预览里或 当前页 里选中的那个，或者编辑器光标所在的那条语句；什么都没选时，写在这一页最后一行之后。它会落在和那个对象相同的区域里。在自由画布上没有流式排版，对象改为像形状那样画出来：拖出它的宽度，或者单击放一个默认大小的。

新对象带着示例文字（用 Studio 的语言写成），并且已经选中，直接输入就能替换。文字、列表、步骤、引用、代码和表格直接在幻灯片上输入，从列表的第一项或表格的第一个表头开始。公式、图片、图表、二维码和图标则在 当前页 里打开设置，选中公式的源码或图片的说明文字；如果这个面板折叠了，就改为在编辑器里选中它们。LaTeX 公式由 KaTeX 即时排版；Typst 公式和 LaTeX 表格由 Typst 和 Tectonic 编译，FrameSeq 应用里已经自带。

图片 会用这台电脑自己的对话框让你选一张图片；没有对话框时就请你输入路径。图片会复制到演示文稿旁边的 images 文件夹里（已经在文件夹里的就不复制），这样无论文件夹拿到哪里，幻灯片都带着它。代码写成 image(new URL("./images/photo.png", import.meta.url).href, "图片")，第二个字符串是给看不到图片的人的说明。网址会原样写入。

图标 会打开整个图标库的选择器，可以按名字搜索，比如 chart、user、arrow；按 Enter 选第一个。选中的图标写成 icon("rocket")。

在 当前页 里，图片的文件和图标的名字旁边有一个 选择… 按钮，可以用同样的方式换一张图片或换一个图标。

同样的内容在编辑器里也是代码片段。在一行的开头输入它要写的命令，比如 typst、table 或 chart，然后选带 ◇ 标记的那一项：整个对象就写好了，示例文字已经选中，直接输入就能替换。写代码和从插入库插入，得到的是同样的源码。

在幻灯片上画对象#

插入 库的右边能像绘图软件一样，把对象画到预览里的这一页上：文本框、直线、箭头、连接线、多边形和所有形状。

• 选一个形状或文本框，在幻灯片上拖动画出它，或者单击放一个默认大小的。按住 Shift 保持等宽高；圆形始终是正圆。
• 选直线或箭头，从起点拖到终点。按住 Shift 按 45° 对齐。
• 选连接线，从一个对象拖到另一个对象。没有名字的对象会得到一个名字，以 .as("shape1") 写在它命令的末尾；连接线写在两者中靠后的那一个之后，形如 line().from("shape1").to("box1").arrow()，所以无论它们移到哪里，连接线都会跟着。
• 选多边形，在幻灯片上逐个单击放下它的每个顶点。双击、按 Enter 或单击第一个顶点完成，写成 polygon([[0, 0], [120, 0], [120, 90]]).position({ x, y })，顶点从它的左上角量起。按 Backspace 撤回上一个顶点，按住 Shift 让边按 45° 对齐。
• 按 Esc 放下工具，不写入任何东西。

对象会连同你画出的坐标和大小，写在这一页代码的末尾、这一页的第一个区域里。形状或文本框写入后，占位文字会在幻灯片上选中，直接输入就能替换，新对象也马上就能拖动和缩放。每次绘制都是编辑器历史里的一步。

由循环或辅助函数生成的页没有属于自己的代码行可写，所以不能往上面画对象。

调整页面#

左侧幻灯片栏按“生成页面的语句”来编辑文档。一页的源码从它的 slide() 语句开始（连同紧贴在上方的注释），到下一页的源码开始处为止，所以它的内容和后面的空行会跟着它一起走。

• 点击缩略图：显示这一页，并把编辑器移到生成它的代码处。
• 上下拖动缩略图：移动这一页。
• 右键可以选择 在后面新建一页…、复制、上移、下移、转到源码、从这里开始放映、编辑母版 和 删除。选中缩略图后按 Delete 也能删除。
• 幻灯片栏上方的 +：在预览当前页之后新增一页，版式由你挑选：标题和正文、标题和要点、章节页、左右两栏、三个数字、代码和说明、公式、表格、图表、流程图、逐条显示，或者结束语。新的一页插入后，它的标题或主要文字已被选中，可以直接输入。幻灯片 › 在这一页之后新建 列出同样的版式。

这些版式就是配方里的页面，占位文字用 Studio 当前的语言，插入后原样就能通过布局检查。

这些操作在编辑器的历史里都只占一步。

用代码生成的页面#

一个循环、或者一次辅助函数调用，会用一条语句生成好几页：

for (const topic of ["Alpha", "Beta", "Gamma"]) {
  slide(topic);
  text(`About ${topic}`);
}

section("Results"); // 一个会写出两页的辅助函数

这些页面没有哪一段源码单独属于其中某一页，所以它们作为生成它们的那条语句，一起移动、复制和删除。幻灯片栏会用竖线把这样的页面括在一起，编辑器给这条语句标上它生成的所有页码（如 2–4），右键菜单会说明一个操作会影响几页，拖动时也只能放在两组之间。循环前后的普通页面仍然可以逐页移动，声明在两页之间的辅助函数也会留在原处。

点击循环生成的页面，光标会落在循环里的 slide() 调用上；点击辅助函数生成的页面，光标会落在调用这个函数的那一行。由导入的模块生成、不在幻灯片文档里的页面，可以显示，但不能在这里调整。

幻灯片母版#

视图 › 幻灯片母版 让缩略图栏和预览显示演示的母版页，而不是幻灯片；上方有一条提示，也可以从那里关闭母版视图。母版页的编辑方式和幻灯片一样：拖动、缩放上面的对象，在 当前母版 里设置它们，从 插入 添加图片、形状和文字。插入 › 占位符 用来画放幻灯片标题、副标题、作者和正文的框；占位符的设置就是它里面的文字在每一页上的样式。

缩略图栏的 + 添加封面母版、内容页母版，或者一个自己命名的母版，写在 presentation() 后面。新母版从主题原本摆放内容的位置开始，所以在改动之前，幻灯片看起来和原来一样。幻灯片 › 删除 和缩略图栏的右键菜单可以删除母版，放映 会离开母版视图，放映幻灯片。

回到幻灯片时，幻灯片 › 母版 选择预览中这一页画在哪个母版上：它默认的母版、某个指定的母版，或者不用母版，写成这一页的 .master()。那里和缩略图栏右键菜单里的 编辑母版 会在母版视图里打开这一页的母版。

页面设置#

文件 › 页面设置… 像 PowerPoint 的“幻灯片大小”一样设置所有幻灯片的大小，并写进 presentation()：

• 宽屏 16:9 和 标准 4:3 用于屏幕：16:9 什么也不用写，4:3 写成 ratio: "4:3"。
• 纸张从 A0 到 A5，以及 Letter、Legal、Tabloid，可以纵向或横向：size: "A4", orientation: "landscape"。
• 自定义大小 填宽度和高度：屏幕用画布单位，写成 width: 1920, height: 1080；纸张用毫米、厘米或英寸，写成 size: "900x1200mm"。

幻灯片排在一块有自己单位的画布上：屏幕上的幻灯片横向 1280 个单位，纸张的短边 1600 个单位。内容随页面缩放 默认勾选，它让画布保持现在的横向单位数，写成 width: 1280，于是每个对象、每种字号相对新页面的大小都不变，就像 PowerPoint 缩放幻灯片内容一样；不勾选时，新页面用它自己的画布，对象保持原来的单位数。选项下方会先显示画布大小，纸张还会显示打印尺寸，确认后才改动；这次改动是一步，Ctrl+Z 可以撤销。

海报只提供纸张尺寸。论文插图的对话框设置的是它的画布单位和打印宽度：通栏 170 毫米、单栏 85 毫米，或自定宽度。同一份演示里所有幻灯片大小相同，和 PowerPoint 一样，导出时也保持不变。

问题列表#

问题面板汇集六类结果，随着编辑不断刷新：

• TypeScript：编辑器里画波浪线的那些错误。
• 名字：指向本页上不存在之物的名字、重复起的名字，以及这一页并没有的布局区域；见名字。
• 公式：写在引号字符串里、反斜杠被当成了转义符的公式。TypeScript 不会报错：text("$\frac{1}{2}$") 里的 \f 成了换页符，\alpha 变成了 alpha。旁边的按钮会把它改成 text`...` 写法，反斜杠原样保留；列表条目等不能用模板的地方，则把反斜杠写成两个。
• 布局：frameseq check 的规则，每次保存后都对实时演示测量一遍，而不是等你手动运行：画布溢出、文字被裁切、字号过小、空白页和空区域、相似的区域名，以及不起作用的修饰符。
• 构建：服务器编译演示时报告的错误，比如无法编译的 Typst 或 LaTeX 片段。
• 预览：演示运行时抛出的错误，附带它停下时正在执行的那条语句所在的行，编辑器会在那里画上波浪线。修好之前，预览会一直显示上一个能运行的版本。

点击一条结果就会跳过去：TypeScript 错误、名字错误和公式问题会选中对应文本，预览错误会把光标放到出错的语句上，布局问题会显示所在的那一页、框出对象，并把光标放到写出它的那一行。

别处做的修改#

Studio 会监视幻灯片文档。当它在磁盘上被修改（比如由编程代理或另一个编辑器写入），而 Studio 里没有未保存的编辑时，新文本会立刻载入，而且 Ctrl+Z 仍然可以撤回这次载入。如果你有未保存的编辑，顶部会出现提示条，让你选择保留哪个版本：使用磁盘上的文件 或 保留我的版本。不经过这个选择，任何内容都不会被覆盖。

演示与导出#

放映（F5）像 PowerPoint 一样，在 Studio 自己的窗口里从当前页开始全屏放映；放映 › 从头开始（Shift+F5）则从第一页开始。在预览和幻灯片栏里按 F5 也一样。单击、→、↓、空格、Enter 或 Page Down 前进，一页里的逐步显示也一步步走；←、↑、Backspace 或 Page Up 后退；Home 和 End 跳到第一页和最后一页。放完最后一页后屏幕变黑，和 PowerPoint 一样，再单击或按一次键就结束放映；Esc 随时结束放映。Studio 会回到放映停下的那一页。浏览器不允许全屏时，放映仍会占满整个窗口。

电脑连着第二块屏幕时，比如笔记本接了投影仪，放映的方式和 PowerPoint 的演讲者视图一样：幻灯片全屏显示在另一块屏幕上，Studio 所在的这块屏幕则打开演讲者视图，里面有备注、下一页和计时器。屏幕多于两块时，幻灯片优先放到外接屏幕上，或者放到 放映 › 放映屏幕 里选定的那块屏幕上。在演讲者视图里，同样的按键和翻页笔都能翻页；在那里按 Esc 或点 End show 会结束放映，和在幻灯片上按 Esc 一样；演讲者视图随放映一起关闭。演讲者视图像最大化的窗口一样铺满它所在的屏幕，点它的 Full screen 按钮还能盖住任务栏。

• 在 FrameSeq 应用里，窗口会自己把幻灯片移到另一块屏幕上，放映结束后再回到原处。
• 在 Chrome 或 Edge 里，第一次在两块屏幕上放映时，Studio 会先说明要做什么，然后浏览器询问一次是否允许 Studio 在各块屏幕上放置窗口。选 只用这块屏幕 则改为在这个窗口里放映。浏览器不允许时，幻灯片像只有一块屏幕时那样占满这个窗口。其他浏览器只在一块屏幕上放映。
• 放映 › 放映屏幕 按相对 Studio 所在屏幕的位置和尺寸列出各块屏幕，比如 右侧 · 1920 × 1080，浏览器或 macOS 给出屏幕名称时也会显示名称。幻灯片放到选定的屏幕上，演讲者视图留在 Studio 所在的屏幕；如果选的正是这块屏幕，演讲者视图就换到另一块。第一项 自动 按上面的方式挑选。选定的屏幕没有连接时，改用 自动，等它重新连上再用它。在浏览器里，查找其他屏幕… 会请求列出屏幕所需的权限。
• 放映 › 使用演讲者视图 一开始是打开的，关掉它就不再打开演讲者视图：幻灯片占满 放映屏幕 里选定的屏幕；选的是 自动 时，即使连着另一块屏幕，也只占满 Studio 所在的屏幕。

放映 › 在新窗口中打开演讲者视图 单独打开演讲者视图，可以用来彩排，或者自己把它放到想要的位置；它跟随放映和预览翻页，放映和预览也跟随它。

放映 › 用手机遥控… 让连在同一个 Wi-Fi 上的手机控制放映，就像在浏览器里用 npm run present 那样。第一次使用时，Studio 会先询问，然后在局域网上重新启动，再显示一个二维码供手机扫描。手机可以翻页、逐步显示内容，手机上的激光笔会显示在屏幕上，手机上的演讲者视图里能看到备注。手机遥控开启期间，同一网络里的其他设备只能打开这些幻灯片和它们导入的文件，别的都打不开：只有这台电脑能修改幻灯片、打开文件、使用终端和 AI 助手。手机遥控会一直开着，直到 Studio 停止；frameseq studio --remote 启动时就开启它。操作系统可能会询问是否允许 Node.js 接受专用网络上的连接。

文件 › 导出 运行与 CLI 相同的导出，并写到相同的位置：

PDF、两种 PowerPoint 和 Typst 会先问要导出哪些页：全部、当前页，或者按页码输入，比如 1-3, 5。只导出部分页时，文件名会注明这些页，比如 output/pdf/<name>-slides-1-3,5.pdf，和整份演示的导出放在一起，与 --slides 一样。HTML 总是包含所有页。

这些路径相对于启动 Studio 时所在的目录；如果演示是从 Studio 里打开的，则相对于这份演示所在的文件夹。导出开始前会先保存文档。导出完成后，提示里会提供 下载 和 在文件夹中显示；完整日志在 输出 标签页里。

终端#

底部面板的 终端 标签页是一个在演示所在文件夹里的 Shell，可以在幻灯片旁边运行 git、npm、编程智能体或其他任何命令。在 Windows 上它是 PowerShell（装了 PowerShell 7 时用 PowerShell 7），在 macOS 和 Linux 上是你自己的 Shell。在 FrameSeq 应用里，应用自带的 frameseq 命令排在 PATH 的最前面，所以即使什么都没装，frameseq pdf talk.slides.ts 也能在那里运行。

• Ctrl+` 显示终端；终端已经显示时把焦点移到它上面；终端有焦点时把面板收起来。在 macOS 上也是 Ctrl+`。
• 除了 Ctrl+`、Ctrl+J 和 Ctrl+Alt+I，所有按键都交给 Shell，所以 Ctrl+C 会中断程序，Alt 交给 Shell 而不是打开菜单。在 macOS 以外，选中了文字时 Ctrl+C 改为复制，Ctrl+Shift+C 总是复制，Ctrl+V 粘贴。
• Shell 打印的链接会在默认浏览器里打开。
• 窗口重新加载（比如切换语言）后 Shell 仍在运行，终端会接上它，并显示它最近的输出。Studio 停止或打开另一份演示时，Shell 随之结束。点面板右端的垃圾桶按钮可以立即结束它，之后按任意键就会启动一个新的 Shell。

Shell 会执行输入给它的任何命令，所以终端只会在运行 Studio 的那台电脑上、在 Studio 自己的窗口里打开，即使 Studio 是用 --host 启动的也一样。

AI 助手#

点顶栏的 AI 助手、选 视图 › AI 助手,或按 Ctrl+Alt+I,会在预览右边打开一个和 Claude Code 或 Codex 的对话。用自己的话说要改什么,比如把这一页改成两栏,图表放在右边,代理会直接修改幻灯片文档:

1. Studio 先保存编辑器里的文本,再把请求连同你所在的位置一起发出去:预览中的那一页及其源码行、你选中的行,以及问题列表里的问题。取消勾选 附带 就只发请求本身。
2. 代理读取并修改文档,并用 Studio 交给它的 frameseq mcp 检查和查看幻灯片。面板会随时显示它在做哪一步。
3. 每次修改都会重新载入编辑器,预览也立刻显示出来。代理工作时,编辑器不接受输入;点 停止 可以结束这次请求。
4. 代理完成后,编辑器会对照请求之前的文本显示它改了什么:被替换的文字标红,新文字标绿,每处修改旁边都有 接受 和 拒绝。编辑器顶部和面板里会显示还剩几处修改,并提供 全部接受 和 全部拒绝;↑ 和 ↓ 在修改之间跳转。被拒绝的修改会在文件里恢复原样,两种选择都能用 Ctrl+Z 撤回。审阅处理完之前再发的请求,会并入同一次审阅。

对话会从一次请求延续到下一次,所以再小一点这样的追问知道指的是什么;点 + 开始新对话,在 Claude Code 和 Codex 之间切换也会开始新对话。

想让代理根据你自己的材料来做,就把文件附到请求上:点输入框下方的回形针,把文件拖到面板上,或者直接粘贴(比如一张截图)。可以附上 Markdown 笔记,让它根据这些笔记做一份幻灯片;也可以附上一份 PDF 让它总结,或者一个放在封面上的标志。一次请求最多附带十个文件,每个不超过 32 MB。代理在 Studio 存放它们的地方读取这些文件,这个地方在演示的文件夹之外,文件会一直保留到这次对话结束。图片还会像 插入 › 图片 那样复制到演示旁边的 images 文件夹里,好让幻灯片用上它。Claude Code 能读文本、图片和 PDF;Codex 能读它自己的工具打得开的文件。

在代理名称下方,可以为下一次请求选择模型、推理强度和快速;它们一开始都是代理自己的默认值,面板会为每个代理分别记住你的选择。Codex 会列出你的账号可用的模型和推理强度。Claude Code 提供 Fable、Opus、Sonnet 和 Haiku,快速模式只在 Opus 上提供;快速输出会消耗更多额度。面板右侧显示额度用了多少,比如 5 小时 21% · 7 天 6%,鼠标停在上面能看到重置时间。Codex 随时都能报告额度,Claude Code 只在回答时报告,所以它的数字要在第一次请求之后才出现;点击可以刷新。

AI 助手用的是这台电脑上安装的代理,用它自己的登录和套餐,所以 Studio 不需要自己的密钥。安装 Claude Code 或 Codex(npm install -g @openai/codex),在终端里登录一次,面板就能找到它。代理只在演示所在的文件夹里工作:Claude Code 可以读写那里的文件、读取你附上的文件、使用 FrameSeq 的工具,但不能运行命令;Codex 在它的 workspace-write 沙箱里运行。只有运行 Studio 的那台电脑能用 AI 助手,即使加了 --host 也是如此。

键盘快捷键#

在 macOS 上，用 ⌘ 代替 Ctrl，Ctrl+` 除外。帮助 › 键盘快捷键 会在 Studio 里列出它们。

网络访问#

Studio 会写入整份文档，而普通预览从不这样做：在 frameseq dev 里拖拽只能改写数字。因此 Studio 的接口只存在于由 frameseq studio 启动的服务器上，只响应运行它的这台电脑，并拒绝任何其他网页发来的请求。只有在必须从这台机器之外访问 Studio 时（例如在容器或浏览器 IDE 里），才加上 --host：

frameseq studio talk.slides.ts --host

这样一来，任何能访问这个地址的人都可以编辑这份演示，不过终端仍然只会在运行 Studio 的电脑上打开。用 --no-open 只启动服务器而不打开窗口，用 --tab 在浏览器标签页而不是应用窗口里打开。