帮助我们测试 Composer 重新设计

目标

我们一直在进行一些小型的准备工作,例如将预览切换按钮移至其他窗口控件旁边在编辑器中集成 AI 建议以及在工具栏中添加 GIF 功能。现在,我们已准备好尝试一项更大的变更,该变更目前作为实验性的即将推出的功能供用户试用。

我们的主要目标是:

  1. 更新编辑器,使其与我们整体现代化外观和风格的变更保持一致
  2. 改善移动端的编辑体验

在正式发布之前,我们非常希望得到大家的帮助进行测试。

如何试用

  1. 前往 /admin/config/upcoming-changes 路径下的 管理即将推出的变更
  2. 找到 编辑器重新设计 并启用它
  3. 打开编辑器(回复、新主题或新私信),并在桌面端和移动端上体验一下

您可以随时在同一位置将其关闭。在这里,您可以加入新的测试组 composer-testers


我们特别需要那些运行自定义编辑器主题组件或插件的用户提供反馈 —— 此次重新设计不仅改变了样式,还略微调整了编辑器的结构。更多详情见下文。

变更内容

布局与结构

通用

  • 标题已整合到内容中,使其看起来更像文档标题(Notion 用户应该对此很熟悉)
  • 工具栏已移至页脚。这需要一点肌肉记忆的调整(头几天我也觉得有点别扭 :wink:
  • 重新设计了类别和标签输入框(包括标签图标和最小化选择显示)
  • 减少边框,增加空间感

Markdown

  • 标题、类别和标签现在位于编辑器 + 预览窗格上方的全宽元数据区域,而不再局限于左侧列。

移动端

改善移动端体验是该项目的一个主要驱动力。多年来,Meta 上一直有很多关于此问题的合理投诉 [1] [2] [3]

为了在编辑时增加可用空间,我们正在尝试一种可扩展的编辑器,它在获得焦点时会向上滑动,覆盖编辑器字段,并在编辑器保持焦点期间保持展开状态。这适用于创建新主题或新私信,但不适用于回复。

这将可用的书写空间增加了一倍以上,从 103px 增加到 212px(在我的设备上测试的结果 – 实际结果可能因设备而异)。

其他

  • 新布局中移除了工具栏切换按钮
  • 向下滑动以关闭键盘并将编辑器折叠回正常状态
  • 选中的标签仅在菜单打开时可见。图标会变色以指示已进行选择。

反馈

这仍然是一个高度实验性的功能,我主要想了解它在常规屏幕尺寸(桌面端和移动端)上的 Foundation 主题中的表现。平板电脑、折叠屏手机、其他主题等尚未进行优化。

致主题和插件作者 :wrench:

如果您连接了编辑器插件出口(outlets)或对编辑器进行了样式定制,请在启用重新设计的情况下进行测试。DOM 结构已发生变化,某些自定义可能需要调整:

  • 编辑器字段块现在渲染为编辑器容器的全宽子元素,不再位于编辑器的文本列内部
  • 注入到 composer-fields 出口的内容现在显示在标题上方(在类别/标签组和标题之间),且为全宽
  • 标题字段作为单独的一行渲染,与类别/标签集群分离,并位于其下方而不是上方

没有重命名或移除任何出口(尽管为了在语义上适应变更,未来可能会进行调整)—— 您的连接器仍然可以附加。变化在于您的内容渲染的位置宽度

如果您发现您的主题或插件中有损坏的地方,请在此回复,并附上组件/插件名称和截图。这正是此测试阶段所需要的反馈。

设计 :crayon:

以下是一些我自己也在犹豫的权衡或设计决策,希望能得到一些意见。当然,欢迎任何其他反馈。

A) 为什么标题输入框这么大?

想法是将其尺寸增加到比手动添加的 H1 标题更大,以确保它在文档中始终是视觉上的标题。有时我看着它觉得“好大”,有时又觉得“嗯,这样挺好”。

另一个想法是稍微缩小现有标题的尺寸,以达到同样的效果。

已在下一版本中回滚。

B) 隐藏标签是否是个问题……

……是否严重到不值得在移动端进行权衡(为类别腾出更多空间)?

如果是,为什么?

C) 可扩展编辑器的动画在您的设备上表现如何?

很卡顿?足够好?有所改善?有什么替代想法或调整建议让它变得更好?

D) AI 建议标题按钮怎么样

我个人不太喜欢它孤零零地漂浮在那里的样子。其他用户(使用它的人)感觉如何?非常乐意听取设计想法。

已移至不碍事的位置,参见 AI 标题建议移至编辑器助手


感谢大家在更广泛发布之前帮助我们完善此功能。:folded_hands:


  1. New Topic Editor Too Small iOS 26.5 Safari Web - #4 by fearlessfrog ↩︎

  2. Creating/Editing a post on mobile: let's discuss the 2026 Discourse experience ↩︎

  3. Such a tiny window to edit here on a cell phone ↩︎

17 个赞

嗯,老实说,我现在不太喜欢它放在文本区域附近,而不是一个独立的框……理论上听起来不错,但我就是不喜欢它现在的样子,它看起来像是开始文本输入的一部分,尤其是在可视化编辑器上。我更喜欢把它放在它一直所在的位置,也许再加一些水平空间。这完全可能是一种因为看到它改变而产生的本能反应,因为它以前完全没问题,也不需要改变,但根据我所看到的,我仍然不确定我是否喜欢它。

你说得对,它现在看起来确实很孤单。也许它应该固定在标题结束的地方,或者如果设计像我建议的那样恢复,那么旧的方式就可以了。

不过,我确实很喜欢这个。设计看起来很棒(边框更少!),我很期待移动端最终成为一个可用的体验,即使我主要还是桌面用户。

5 个赞

你好 :waving_hand:

这项工作做得真棒!我很喜欢。:heart_eyes: 感觉这是一种更现代、更优雅的编写方式。我之前也尝试过将工具栏移到底部,我觉得这样确实更舒适。

整体来看,界面相当简洁。我注意到一点:当标题缩回且正文获得焦点时,用户可能会感到困惑,不知道如何重新显示标题、类别等部分。既然整个编辑器文本区域在这种情况下是可以滑动的,我认为添加一个可视化的抓手/句柄会有助于向用户提示这一点。

6 个赞

这是否受到 AI 消息停靠式作曲器工作的启发?让我想起了它。

这似乎仅在 Meta 品牌应用中可用?

我喜欢图标变小了(我觉得?)且设计更极简。

但我觉得一个问题是我现在必须看得更高才能看到我输入的内容,因为工具栏挡着。如果工具栏在顶部会怎样?那样可行吗?(我现在用手机,所以无法移动它来查看)

3 个赞

倒也不是 :slight_smile:

不是的,应该与主题无关。你在其他主题上看不到吗?:eyes:

2 个赞

好吧,再仔细看看之后,当键盘收起时,是否可以让主题内容编辑器也收起?否则需要按两次才能完成(一次点击键盘按钮,一次滑动)。

我还觉得无色的类别图标有点不寻常。这是有意设计的吗?

是的,AI 标题建议功能让那里看起来有点拥挤,但我不确定还能放在哪里。

刚开始的时候确实出现过这种情况。看起来现在已经正常工作了。

总的来说,目前在移动设备上表现还不错!

2 个赞

你能详细说明一下吗?你是如何关闭键盘的?另一个方向应该是自动的:缩小编辑器 → 键盘自动关闭,所以只需要一个操作。

2 个赞

哦!你的意思是向下滑动以同时关闭内容编辑器键盘?嗯……

根据我的个人经验,在 Android 上我会点击主页栏中的按钮来关闭键盘。因为当前的编辑器并没有这种功能(即滑动或点击来关闭键盘),所以我觉得这样操作起来更不自然。

2 个赞

明白了,我觉得接线应该没问题。

纯属意外,谢谢提醒!正在修复中

4 个赞

我注意到,当您进入一个主题时,草稿总是会自动弹出,而编辑器却没有这种行为。这是有意设计的吗?(这让我有点烦)

1 个赞

我不太明白你的意思。你是说,当你为某个主题保存了草稿,然后进入该主题时,编辑器就会自动打开吗?如果是这样,这种情况已经存在一段时间了(或者说一直如此,我不太确定);无论如何,行为都没有(有意)被更改过。

还是说你指的是其他情况?

我之前说错了。当前的 Composer 确实是可见的,只是它稍微隐藏在后台,而新的 Composer “挡住了视线”。不过我现在发现可以移动这个新的 Composer :slight_smile:


2 个赞

我喜欢这个设计,不过目前只从桌面端发布过。

我不太喜欢那个看起来像是文本区域一部分的 H1 标题。我发现自己会点击标题的末尾,然后按 试图跳到下一行,但这显然行不通。

大标题可能会部分被遮挡:

chrome_SvkGo3rsgf

在移动端,工具栏相当窄。拇指在智能手机屏幕上从左向右自然移动时,轨迹并非笔直的水平线,而是从右下略微弯曲至右上。如果目标区域位于屏幕较高位置,这种影响可能会加剧。

这往往导致我错过侧边栏的拖拽开关。

我不确定该如何改进这一点。加高工具栏似乎不是最好的解决方案。

或许检测区域可以比工具栏稍大一些,就像平台游戏开发者允许玩家角色即使偏离边缘几个像素(按常理应掉落)也能从边缘起跳或着陆一样。

5 个赞

将按钮移至底部的原因是什么?

这似乎会造成严重的肌肉记忆问题,而且这么做究竟有何意义?

此外,在移动设备上,这些按钮离“丢弃”和“回复”太近,容易导致误发帖子。

鉴于这会引发诸多问题,我实在看不出此举有何益处。

3 个赞

我想我们大多数人都是单手使用移动设备,而底部更容易触及。有些浏览器(例如)也基于同样的思路将地址栏移到了底部。

我喜欢这个改动,而且我认为我们需要一些时间来适应。我的意思是,至少试用一两周这个改动,因为我们自动执行的操作在面对突然变化时往往会产生负面反应,但一旦我们习惯了新系统,整体效果可能是积极的。

顺便说一句,我是那些不希望在手机上使用触摸屏的人之一 :joy:

12 个赞

有意思。我其实一直在用 TC 把菜单放在底部。这个改动挺不错。

7 个赞

对我来说,将工具栏移到底部的主要原因之一。

7 个赞

我非常喜欢底部工具栏。在移动设备上这样设计更合理,因为更容易触及。

我认为在桌面上也合理:内容(文本区域)是首要的,格式(工具栏)次之,因此这样的顺序很合适。

5 个赞

在移动设备上的外观和手感都不错。不过,在创建主题时,标签图标或许可以稍微放大一点,至少在我的 Google Pixel 9 XL 上感觉有点小。
我也对测试 Meta 平台感兴趣。

1 个赞