这是 Ali Grids 发布在X 上的一段工具栏交互设计方案。第一眼看上去很简单，但越看越觉得他处理得很聪明。这个方案实现了在同一块有限空间里，让两种完全不同的任务模式自然切换。
要知道很多设计师在做工具栏设计时，很容易陷入一个误区，那就是会把所有功能都平铺出来，希望“看起来功能很多、很全”。但真实使用中，用户并不是同时在做所有事。用户通常只处在某一种任务状态里，比如我现在要调音乐相关功能（剪辑、计时、录音等）或我现在要输入一句话，让 AI 帮我处理内容
这两类行为的操作方式完全不同，前者偏“点击型操作”，后者偏“输入型操作”。如果强行把这两类能力并排塞在一起，结果往往是工具栏变长、信息密度变高、用户注意力被分散、输入区和按钮区彼此抢空间。
Ali Grids 这套方案的亮点在于，它没有试图“兼容展示”，而是做了更合理的判断，既然任务模式不同，那就让界面形态跟着任务模式切换。这是一种很成熟的交互思路。
亮点 1
这套设计里最值得夸的地方之一，就是左侧两个按钮和右侧按钮的视觉关系。左侧两个按钮被做成一个独立区域，明显区别于右侧工具按钮。
这一步非常关键，因为它在视觉上提前告诉用户，左边这两个不是普通工具，它们更像“模式开关”或“上下文入口”，右边内容会受左边选择影响。也就是说，用户不需要先点一遍才知道规则，光看结构就能猜到一部分逻辑。
这就是优秀界面的一个特征：规则尽量通过布局表达，而不是靠说明文字补救。
很多设计会把“模式切换”和“普通功能按钮”做成一模一样的图标按钮，结果用户会误以为它们是同一层级的操作。点击后界面突然大变，心理预期会断裂。而这个方案通过“左侧独立分组 + 不同样式处理”，在操作前就建立了认知缓冲。这会让切换行为显得更自然，也更可控。
