Lazy loaded image
Lazy loaded imageAI in old UI 传统界面中的 AI
Words 9834Read Time 25 min
2025-9-11
2025-10-5
type
status
date
slug
summary
tags
category
icon
password
💡
旧产品集成AI让体验升级。比如Word、Notion、Photoshop等熟悉的软件现在都内置AI,可以补全、搜索、生成和排版。优势:无需学习新工具,AI自然融入现有流程,提升效率。典型功能:自然语言搜索、智能更新、AI引用等。AI增强传统界面,保持工作流的同时提升体验。

Natural language search 自然语言搜索

你不用点选项、拉下拉、翻一堆菜单,只要一句话,AI 帮你搞定。
想找“去年销量最好的产品”?想看“本月新用户增长图”?说一声,AI 自动筛出来。不管是搜索、筛选、打开页面,甚至发起某个操作,是把“说一句话”变成“万能遥控器”的设计模式
 
notion image
 
Linear 中的自然语言搜索模式:Linear 作为一款任务/项目管理工具,在保持原有“筛选器+列表”的经典 UI 架构基础上,通过嵌入 AI 提升搜索效率,体现了“旧界面 + 新 AI 能力”的设计理念。
 
入口路径(Entry touch point flow)
这一流程完全保留了旧有结构,用户无需学习新交互,却能通过 AI 获得更灵活的表达能力。
  • 用户从熟悉的“Filter”筛选器入口开始操作
  • 可选择“AI Filter”作为筛选方式
  • 与传统下拉选项不同,AI Filter 接受自然语言输入
  • 示例中,用户输入:“open bugs with SLAs” → AI 自动解析并生成匹配过滤条件
 
主要 AI–UX 交互(Main AI–UX interaction)
  • 输入框允许用户直接使用自然语言描述需求
  • 下方显示 AI 实时生成的过滤语义提示(AI Filter Suggestions)
  • 支持模糊查询、语义识别等,即使表达不精准也可智能理解
 
加载反馈(Loading state)
  • AI 处理过程中会显示状态条动画
  • 动画模拟传统“loading bar”,提升用户预期感,避免“卡住”错觉
  • 动效简洁,不破坏原有界面节奏
 
预设提示(Pre-made prompts)
  • 系统提供一些快捷提示选项,如“assigned to me”“due in next 2 weeks”
  • 这些不仅方便选择,也起到“引导用户学会怎么表达”的作用
 
输出示例(Example output)
  • AI 识别出多个过滤维度:如标签、状态、责任人等
  • 自动组合出标准结构的搜索条件
  • 搜索结果即刻呈现,用户无需手动点击多个筛选项
 
总结优势:
  • 保留原始界面,让用户毫无学习负担
  • 输入方式更自然,提升效率
  • 输出结果结构化,兼容原有系统逻辑
  • 可扩展性强,适合在已有产品上快速部署 AI 能力
 
notion image
 
Stripe 将自然语言搜索嵌入到开发者文档中,提供了一个轻量级但实用的 AI 助手,用于快速回答技术相关问题。这一案例很好地展示了“AI 融入旧界面”的落地方式。
 
入口触点(Entry touch points)
  • 用户通过文档搜索栏中的“Ask AI Assistant”入口激活 AI 搜索功能
  • 保留传统的搜索框设计,无需新增交互方式
  • 建议搜索提示(suggested queries)可引导用户进行自然语言提问
 
主要 AI–UX 交互(Main AI–UX interaction)
  • 用户在输入框中输入自然语言问题(如:What is test mode?)
  • 系统提供示例问题,引导用户提问方式
  • 输入后立即启动 AI 响应流程,自动调用语义理解与文档匹配
 
加载状态(Loading state)
  • 显示“Gathering sources”提示,模拟 AI 正在思考与抓取内容
  • 实现“双阶段加载”:
      1. 初期收集(gathering)
      1. 实时生成回答(thinking while writing)
  • 动态打字动画增强“AI 正在工作”的可感知性
 
结果输出(Example output)
  • 回答内容结构清晰、语义自然,仿佛人写的一样
  • 下方列出参考来源,点击可跳转至文档原文段落
  • 整合用户反馈组件:Was this useful? Yes / No,用于优化模型效果
 
预期管理(Expectation management)
  • 顶部显著标注:“这些回答由 AI 生成,可能不准确”
  • 明确传达“实验性”信息,避免用户误判 AI 为官方权威
 
核心设计亮点:
  • 用自然语言提问,无需熟悉文档结构
  • 实时响应、结构化展示,提高信息获取效率
  • 保留传统 UI,不打扰原有用户习惯
  • 实用性强,特别适合开发者等信息密集型用户场景
 

Referencing for trust 引用来源以建立信任

这个模式其实就是:让 AI 的答案“有出处”,你才敢信它。因为大家都知道,AI 有时候会瞎掰(就是所谓“幻觉”),所以它说啥我们可能会打个问号。
最好的做法是:
  • AI 说完之后,底下列出参考资料
  • “这段话是从这篇文档来的,这句话在这儿能找到”
  • 用户点进去一看,确实有根据 → 就更愿意相信 AI 的话了
不只是“引用”,而是“可验证的引用”,这才是真正的建立信任。尤其是当你在问技术问题、合规内容、医疗解释的时候,这种设计非常关键。
 
notion image
 
在 Notion 的桌面应用中,AI 助手不仅能回答问题,还会主动列出答案的来源,用可点击的方式告诉用户:这不是“拍脑袋”,而是“有出处”的。这一模式非常符合“AI in old UI”的策略 —— 在不重构主界面的前提下,增强 AI 能力,并提升信任度。
 
入口触点(Entry touch points)
  • AI 可从多个入口唤起:
      1. 任务列表或笔记中直接打开 AI 聊天框(chatbot)
      1. 全屏 overlay 模式
      1. 快捷键调用浮窗模式(如 Shift + Ctrl + K)
  • 无需跳转页面,AI 即可在上下文中提供解答
 
主要 AI–UX 交互(Main AI–UX interaction)
  • 用户提问:“What fonts do we use on our website?”
  • AI 返回明确答案,并附上来源说明:“The primary font used is Inter…”
  • 关键亮点:答案下方会标注“8 pages found”,列出实际引用的页面标题
 
建立信任的引用机制(Referencing to build trust)
  • 所有参考页面以卡片样式展示
  • 支持点击跳转到具体笔记位置
  • 用户可看见信息是从哪些项目页面、会议记录、文档中提取的
  • 不仅有结果,还有“为什么是这个结果”的依据
 
结果输出(Example output)
  • 回答内容简洁清晰,引用页面精确到文档标题
  • 提供“复制 / 重试”按钮,方便用户进一步操作
  • 样式上保持 Notion 一贯的简洁设计,完全嵌入原有内容区
 
加载状态(Loading state)
  • 动态标签显示当前处理阶段(如:Thinking… / Searching… / Reading…)
  • 提升用户对 AI 进度的可预期性
  • 在用户等待时保持界面“活跃”,避免误判为“卡住”
 
预期管理 & 用户反馈(Expectation Management & Feedback)
  • 明确提示当前功能处于 Beta 测试
  • 提供“赞,踩”按钮收集反馈,以持续优化回答质量
 
核心洞察:
  • AI 提供的不是“万能答案”,而是“上下文中的引用总结”
  • 用户信任来自于能验证、能回溯、能控制
  • Notion 做法优雅地将 AI 能力嵌入原工作流,不破坏熟悉的使用习惯
 
notion image
Arc Search 是一款新型浏览器搜索工具,在传统搜索引擎体验中加入 AI 总结功能,并通过明确标注引用来源,增强用户对 AI 结果的信任感。这个案例体现了“AI in old UI”的经典范式:不改变用户习惯的基础上,用 AI 提升效率,并注重可信度表达。
 
入口触点(Entry touch points)
  • 用户在搜索框中输入自然语言查询,如:“how to make pasta”
  • 提供快捷选项:“Browse for me”来启用 AI 总结模式
  • 支持随时开启/关闭该功能,保留主动权给用户(Optional interaction)
 
加载状态(Loading state)
  • 显示“搜索中”的状态动画,搭配提示词:“Building user trust in the loading state”
  • AI 工作过程中实时反馈,避免用户产生“正在卡顿”或“不确定是否执行”的焦虑感
 
引用建立信任(Referencing to build trust)
  • 回答内容中包含了图片、视频、网页截图、段落引用等多种引用形式
  • 显示来源页面,如:
    • Love and Lemons 食谱网站
    • Epicurious 的教学视频
    • Jamielyn Nye 的博客文章
  • 每一段回答内容都明确标注对应出处,支持点击跳转到原文位置
  • 这种结构帮助用户理解“这句话为什么这么说”,提升透明度与验证性
 
输出内容(Example output)
  • 回答内容为结构化摘要(Step 1~5)
  • 每一步配图或配引用,增强可读性
  • 内容类型丰富:文字 + 图片 + 视频 + 源文链接
  • 适合“快速获取 + 深度阅读”的组合型用户行为
 
可选交互设计(Optional interaction)
  • 用户可在任意时刻选择“开启/关闭 AI 总结”功能
  • 保持传统搜索入口的同时,提供 AI 增强路径
  • 实现一种无侵入式的 AI 融合体验
 
核心设计价值:
  • 引用内容不只是来源链接,而是“内容可视化+可验证”
  • 结果摘要帮助用户快速理解,引用支持用户深度确认
  • 兼顾速度与可信度,在日常搜索场景中极具实用性
 
notion image
Adobe Acrobat 在传统 PDF 阅读器界面中加入 AI 助手功能,用于快速总结、问答、提取重点信息,并通过原文定位引用的方式增强用户对 AI 回答的信任。这个模式是“AI in old UI”的经典代表 —— 在熟悉工具中增强体验,而不干扰原有工作流。
 
入口触点(Entry touch points)
  • 用户点击右上角 “AI Assistant” 按钮即可激活
  • Hover 状态会提示:该功能可用于生成摘要、提取要点、回答与文档相关的问题
  • UI 嵌入于 Acrobat 主窗口右侧,不遮挡主内容区
 
预处理机制(Pre-processing)
  • 首次启动 AI 助手时,系统自动扫描整份文档
  • 建立语义索引(如章节结构、关键词位置等),为用户提问做准备
  • 显示“Processing document...”加载动画,并提供快速说明
 
主要 AI–UX 交互(Main AI–UX interaction)
  • 用户可自由输入问题,如:“这本教材讲了哪些主题?”
  • 或直接选择预设问题模板进行快速提问
  • 回答输出以段落摘要或结构化列表呈现,简洁清晰
  • 每段回答均可一键复制,并支持生成 Slack 消息
 
引用机制(Referencing to build trust)
  • AI 回答同时标出信息来源于文档的具体段落或标题
  • 鼠标悬停时可高亮 PDF 中的实际位置
  • 示例中回答了“能给我一份章节标题列表吗?”并将其与原文位置直接关联
  • 用户可点击跳转、验证引用内容的准确性
 
加载状态(Loading state)
  • 明确显示“Generating response…”状态
  • 支持随时点击“Stop”中止回答
  • 提升可控性和预期透明度
 
预期管理(Expectation Management)
  • 所有回答下方附有免责声明:
    • “AI-generated responses may be inaccurate or misleading. Be sure to double-check responses and sources.”
  • 强调 AI 只是辅助工具,鼓励用户“验证答案”
 
核心价值总结:
  • 引用机制并非简单“附链接”,而是基于原文位置的“语义引用”
  • 用户看到答案后,能立刻知道这句话“来自哪里”
  • 特别适用于法律、科研、教材等内容权威性要求高的场景
  • 熟悉的阅读器体验 + AI 能力加持 + 引用增强可信度
 

Context bundling 上下文捆绑

在使用 AI 时,空白输入框常让用户无从下手,尤其是在复杂场景中。核心设计:将提示词(Prompt)预设在按钮中。点击后即可生成带上下文的问题或指令,简化用户思考过。例如:
  • "写一封辞职信"
  • "总结这份报告的重点"
  • "给我解释这张图"
主要优势:
  1. 降低启动成本(Reduce cognitive load)
      • 降低使用门槛
      • 适合新手用户
  1. 嵌入上下文的提示语设计(Context-aware prompting)
      • 自动融合页面内容和用户选择
      • 如:"基于此段落总结重点"
  1. 提升工作流连续性(In-flow assistance)
      • AI 功能融入日常操作
      • 实现自然的功能扩展
 
notion image
Grammarly 在原本专注语法校对的工具基础上引入了 AI 写作辅助,尤其通过“Context Bundling(上下文捆绑)”的方式,让用户无需输入任何提示词也能触发智能写作功能。
这不仅提升效率,还大幅降低使用门槛,是“AI in old UI + 流程内辅助”的经典组合。
 
入口触点(Entry Touch Points)
  • 在输入框下方出现快捷按钮:“Reply quickly”
  • 鼠标选中文本后自动弹出 “Rewrite with Grammarly” 按钮
  • 按钮点击后即触发 AI 写作面板,自动带入选中内容上下文
 
主要 AI–UX 交互(Main Interaction)
  • 打开后自动识别文本意图,用户可进一步设置:
    • “Set your voice”(语气风格)
    • “Improve it”(润色内容)
    • “Identify any gaps”(识别逻辑缺口)
  • 页面底部提供自由输入框,但不强制用户自行构建 prompt
  • 鼓励引导式探索,而不是自由式输入(降低认知负担)
 
预设模板(Pre-made Templates)
  • 系统提供多个 rewrite 模板:
    • 让语气更有力(assertive)
    • 听起来更自信(confident)
    • 更具建设性、更外交式等(diplomatic)
  • 将“风格选择”设计成按钮样式,行为明确且可预期
 
加载状态(Loading State)
  • AI 处理期间显示明确状态信息:“Working on it…”
  • 文本正在逐句重写时,用户可以看到实时反馈
  • 减少等待的不确定性
 
输出内容(Example Output)
  • 输出内容已自动调整语气并优化逻辑
  • 在文本下方提供按钮选项:
    • 插入(Insert)
    • 重写(Retry)
    • 缩短(Shorten it)
  • 输出不是终点,而是继续微调的起点
 
专业逻辑解析:
  1. 上下文绑定(Context-aware triggers)
      • 根据选中内容或输入场景自动识别 intent
      • 系统预先知道你“想写什么”,不需要你自己说
  1. 交互闭环设计(Interaction loop)
      • 快速输入 > 快速重写 > 快速插入 > 再次微调
      • 一气呵成,不跳出工作流
  1. UI 轻量集成(Embedded in old UI)
      • Grammarly 是“外挂式”增强,而不是强制重构界面
      • 经典的“AI in old UI”融合策略
 
notion image
Apple 在系统原生写作环境中(如 Mail 或 Notes)悄悄集成了 AI 写作助手,通过“Context Bundling(上下文捆绑)”的方式,把复杂的 AI 写作流程封装进一个按钮、一段文字、甚至一句话背后。
 
入口触点(Entry Touch Points)
  • 在输入邮件或笔记时,系统检测到一段文字
  • 用户选中后,可点击 “Rewrite”“Proofread” 按钮
  • 无需调用额外应用或写 prompt,AI 功能直接嵌入熟悉的界面
 
主要交互(Main AI–UX Interaction)
  • 弹出提示框,显示智能改写建议
  • 用户可选择语气与风格,如:
    • Friendly(友好)
    • Professional(专业)
    • Concise(简洁)
  • 支持一键套用,保持用户原始写作节奏
 
预设模板(Pre-made Templates)
  • 除了风格,还提供结构选项:
    • 概要(Summary)
    • 要点(Key Points)
    • 表格(Table)
    • 列表(List)
  • 所有模板都已与内容上下文绑定,无需自定义 prompt
 
加载状态(Loading State)
  • 在后台处理过程中,页面保留原内容并显示半透明加载动画
  • 告知用户“AI 正在处理”,但不会中断书写体验
 
输出与历史记录(Output + Action History)
  • 显示改写后的内容
  • 可通过 “Revert / Done” 按钮切换原始版本与修改建议
  • 提供清晰、可撤销的操作轨迹(符合苹果一贯“可控性”设计哲学)
 
专业逻辑解析:
  1. 上下文捆绑(Context-aware Templates)
      • 不需要用户输入“我要重写”或“请润色”,系统根据上下文主动判断并触发建议
  1. 非侵入式嵌入(Embedded in Old UI)
      • 没有引入新的面板或弹窗,写作体验没有“AI 的存在感”
      • 保持 Apple 系统一贯的极简界面
  1. 微交互辅助(In-flow Nudging)
      • 改写、润色、总结等行为通过小组件形式存在,不打扰主任务流程
      • 属于“Just in time”的智能提示
 
notion image
这个案例展示的是 Figma 在文本编辑中嵌入 AI,利用“上下文捆绑”技术,让用户不用写任何 prompt,通过拖动一个视觉控件(2D 点阵图)来控制输出语气,属于非常创新的“Spatial AI-UX”。
 
入口触点(Entry Touch Points)
  • 用户在编辑文字时点击“魔法棒”图标,即可唤起 AI Tone 调整界面
  • 无需切换上下文或跳出当前工作流程
  • 图标被巧妙嵌入到原有 UI 的“字体样式”旁边
 
AI 交互主界面(Main AI–UX Interaction)
  • 弹出一个 2D 矩阵图,四个维度为:
    • Casual(随意) vs. Professional(正式)
    • Basic(基础) vs. Technical(技术)
  • 用户拖动中间的橙色点来调节输出语气的平衡
  • 实时看到修改预览,不再是黑箱操作
 
预设模板(Pre-made Templates)
  • 如果用户不想微调,也可以直接选择预设:
    • Executive
    • Technical
    • Educational
    • Basic
  • 实现“懒人操作 + 高级微调”并存
 
输出示例(Example Output)
  • 界面右侧实时预览调整后的文案
  • 示例展示:移动橙点后,文本从“Radicle makes learning STEM fun...” 变成了
    • “Radicle enhances STEM learning with practical, bite-sized activities.”
    • “Radicle enhances the learning experience in STEM fields...”
  • 每次变化都体现了语气的不同,例如更专业、更基础或更简洁
 
加载状态与反馈(Loading State & Expectation Management)
  • 显示“Adjusting tone...”等提示词
  • 带有“AI 输出可能有误”免责声明
  • 提供“Try again”或“Done”操作,用户可重新生成或接受结果
 
操作历史(Action History)
  • 用户可随时点击“Reset changes”恢复原文
  • 确保每一次 AI 辅助都可撤回,符合专业编辑工作流的可控性需求
 
专业逻辑拆解:
  1. 上下文捆绑
      • 用户只需点击文本旁边按钮,无需跳转、输入 prompt
      • 系统已知上下文,直接进行修改处理
  1. Spatial UI(空间交互)
      • 通过二维空间表达多维语气参数
      • 更符合视觉工具(如 Figma)用户的交互习惯
      • 拖动橙点=调整 prompt 参数,但更直观
  1. 语气为核心的智能写作辅助
      • 不是生成文字,而是围绕“如何表达”来微调内容
      • AI 被定位为“语气调整器”而非“内容生成器”
 
notion image
这个案例展示的是 Monday.com 如何利用“上下文捆绑”策略,在不打断原有使用流程的前提下,让 AI 成为用户任务中的自然一环,比如写公式、总结内容等。
 
入口触点(Entry Touch Points)
  • AI 功能嵌入原生操作 UI,例如:
    • 在文字段落右侧点击“⋯”调出 AI Assistant
    • 在公式栏点击“Formula Builder”快速生成公式
  • 嵌得很深,UI 无需切换,用户保持专注流
 
AI 交互界面(Main AI–UX Interaction)
  • 显示一个对话框或下拉菜单,用户可以:
    • 输入自然语言描述公式逻辑,AI 自动生成公式
    • 选择“Summarize doc”,AI 自动总结当前内容段落
  • 原本复杂或多步的操作被简化成一步
 
预设模版(Pre-made Templates)
  • 文本类操作提供常用选项,例如:
    • Write me...
    • Summarize doc
    • Complete text
  • 降低 prompt 门槛,让普通用户也能用 AI
 
加载状态(Loading State)
  • 清晰显示正在处理,例如:“Summarizing...”
  • 防止用户误以为系统无响应
  • 某些模块会高亮文本正在被处理区域,提高可视性
 
输出示例(Example Output)
  • 文本总结后自动显示在页面内,提供 Copy / Edit 按钮
  • 公式生成后用户可直接点击“Set Formula”应用
  • AI 结果是可编辑、可选择的,而不是直接覆盖
 
提示与反馈(Expectation Management & User Feedback)
  • 显示警告:“AI 生成内容可能不准确,请自行校验”
  • 引导用户用 AI 辅助,而不是盲目信任
 
专业逻辑拆解:
  1. 上下文捆绑降低使用门槛
      • AI 功能融入已有控件,而不是新建入口
      • 用户无需跳出页面,也不需要 prompt 专业知识
  1. AI 能力匹配具体任务点
      • AI 并不“泛用”,而是针对“写公式”、“总结段落”做精准优化
      • 模板 + 上下文理解,大幅降低理解成本
  1. 任务原地完成,流畅不打断
      • Monday 的 AI 并非独立聊天,而是嵌在文档、表格、结构数据的上下文中
      • 类似 Excel 的公式辅助、Notion 的 block 总结功能,都是向 AI-UX 的方向进化
 

Living documents 灵活文档

人类一次只能处理少量任务,但AI可以同时完成数百个!它能从文件中快速提取时间、地点、人物,分析语气情绪。这种并行处理能力尚未充分利用,未来的文档工具将帮你轻松获取所有关键信息。
 
notion image
Elicit 用 Living Documents 实现批量数据提取与对比分析。Elicit 利用自然语言指令,把学术论文处理流程嵌入结构化表格中,让用户能高效对比多个文献、自动生成笔记,极大提升调研效率。
 
Entry touch points(入口触点)
  • 通过“Add new step”按钮开启任务流程。
  • 用户可以逐步添加多个步骤构建一个工作链条,也可以选择不同的起点(如“Find papers”、“Extract data from PDFs”)。
  • 清晰分阶段设计,有利于用户建立操作节奏。
 
Main AI-UX interaction(核心交互)
  • 用户输入研究问题(如 “What is the future of AI and design?”),系统推荐可能的下一步操作。
  • 支持“多步骤”式分析流程,逐步深入用户研究主题。
  • 明确呈现各个分析步骤和数据处理过程,强化逻辑连贯性。
 
Loading state(加载状态)
  • 显示“Generating title”等提示语,告知用户系统正在处理。
  • 使用灰色骨架屏和内容遮罩,体现“分批处理(batch processing)”的特点。
  • 风格内敛但有效,传达系统在有序执行。
 
Example output(示例输出)
  • 输出为结构化表格,清晰对比各文献在不同属性下的内容(如 Hypothesis、Findings 等)。
  • 支持大规模横向比较,是典型的“空间对比(Spatial Comparison)”型 AI-UX。
 
Expectation management(预期管理)
  • 明确提示系统置信度,如“Low confidence”、“Answer may not be accurate”。
  • 强调用户需自行判断结果可靠性,引导理性使用 AI 工具。
  • 透明度高,提升信任。
 
Pre-made templates(预设模板)
  • 提供快速起步选项,如“Chat with papers”、“Get a list of concepts”。
  • 帮助用户快速构建任务流,不必从零输入。
 
Bonus & Highlights
  • Bonus 区域展示了一个支持大规模研究的“AI UX for scale”表格布局,强调 Elicit 在数据密集型任务中的表现力。
  • 部分引用内容带有高亮处理,帮助用户追踪引用来源,强化“可信度”维度(trust-building)。
 
notion image
V7 Go 通过 Living Documents 模式,实现大规模并行提取 + 可视化对比,在表格型 UI 中实现结构化数据的批量提取与空间对比,典型“AI 嵌入旧界面”的混合式模式。
 
入口触点(Entry Touch Points)
  • 用户直接在表格中新建一个属性列(New Property),输入名称和指令,例如:Extract items(提取内容物品)
  • 选择 AI 工具(如 GPT & Omni)与目标源(如图片文件 Bill.jpg)
  • Bonus:未来将支持「图像中区域」与文字绑定(Image-linked text),进一步增强可用性
 
AI 交互界面(Main AI-UX Interaction)
  • 用户通过字段配置进行提示设置,比如:
    • 类型选择为 Multi Select(多选型)
    • 使用 GPT 工具分析“图像中包含的情绪关键词”,或识别图像中的收据信息
  • 一切都嵌入在熟悉的表格视图内,降低学习成本
  • 操作全程无需离开主界面,AI 像“插件”一样嵌入现有工作流
 
预设模板(Pre-made Templates)
  • 常见字段类型可快速选择(如 Text / Multi Select / JSON / URL)
  • 降低用户设置复杂度,尤其适合结构化数据提取的场景
 
加载状态(Loading State)
  • 系统展示完整数据列表,并标出正在处理的单元格
  • 提供对比视觉,防止用户误判系统卡顿
  • 大量数据时也能保持清晰流程,支持批处理并发运行
 
输出示例(Example Output)
  • 最终结果直接体现在表格中:
    • 每个文件后生成多选字段,如:Joy / Disappointment / Anger / Admiration
  • 颜色标签让情绪/分类一目了然,便于后续筛选、排序、可视化分析
 
提示与反馈(Expectation Management & User Feedback)
  • 当前界面未展示专门的反馈入口,但通过属性类型、字段设定、处理进度等细节,整体建立了“结果是 AI 生成,但结构清晰可控”的心理预期
 
专业逻辑拆解(分析亮点)
  1. 让 AI 成为表格字段的“生成引擎”
    1. AI 不再是独立助手,而是列字段背后的智能处理器,实现无缝嵌入
  1. 大规模并行处理,提升信息密度
    1. 用户一次性处理几十上百张图像,每一张都能自动生成结构化字段,是 AI “扩容能力”的典型应用
  1. 适配旧 UI,体验不割裂
    1. 不重做 UI,只在表格原有逻辑上“挂上 AI 功能”,降低迁移成本,易于被已有工作流采纳
 

Infinite Canvas 无限画布

想象一个无限大的白板,你可以在上面随意记笔记、画图和写想法。只要你说一句话,比如"帮我总结"或"整理图标",AI就会帮你完成这些工作。这不只是普通的电子白板,而是一个智能助手。它特别适合做设计、规划方案、发挥创意和集体讨论。Infinite Canvas把AI融入到你的工作空间中,让你可以更自由、更轻松地完成工作。
notion image
Figma 通过 Infinite Canvas 模式让 AI 融入创作流程,这是一个典型的“AI in old UI + Spatial exploration”结合案例。Figma 将 AI 深度嵌入“无限画布”中,实现了对设计元素的智能识别、替换与生成,用户无需跳出设计流程即可直接与 AI 协作。
 
入口触点(Entry Touch Points)
  • 用户在任意画布对象上右键,或点击底部 AI 操作栏触发“AI 替换内容”功能
  • 操作入口不打断用户流,像“图层操作”一样自然可见
  • 该入口类似 AI 以“助手”的身份随时待命,介入时机高度灵活
 
AI 交互界面(Main AI-UX Interaction)
  • 用户框选页面区域(如食谱表格),点击“Replace content”,即可触发 AI 协作
  • AI 读取当前上下文结构并补全内容(如自动补齐食谱表格)
  • 操作基于空间感知 —— AI 并非替换整段文本,而是“在区域内填充结构化内容”
  • 下方工具栏保留所有原生编辑功能,AI 输出后仍可进行视觉微调或回退
 
加载状态(Loading State)
  • 状态栏显示“正在替换”,AI 运算时保留原始结构轮廓
  • 黄色高亮显示当前处理区域,用户随时了解 AI 工作的“范围”和“进度”
  • 透明过渡效果强调 AI 作为“协作者”,而非“接管者”
 
输出示例(Example Output)
  • AI 自动生成多行表格内容,包括材料、单位、数量等字段
  • 输出结果直接保留在原始区域中,用户无需复制粘贴或重新排版
  • 底部提供反馈操作:“How does this look?” + 按钮 Make changes
  • 支持“一键确认 / 一键替换”操作
 
用户反馈(User Feedback)
  • AI 生成后,弹出提示“Done! How does this look?”
  • 用户可以点击 Make changes 回退或微调,也可直接确认
  • 类似设计协作里的“建议采纳”机制,符合团队协作语境
 
个性化设置(Customization)
  • 可在右下角选择 AI 输出样式:字体、颜色、字号、填充风格等
  • 支持拖拽式的样式调整,提升控制感
  • 明确区分“结构生成”与“样式控制”,两者并行不冲突
 
专业逻辑亮点
  1. 空间语境识别能力:AI 不只懂文本,而是识别“视觉 + 布局 + 功能”的组合区域。
  1. 非线性交互设计:整个流程不打断视觉编辑,AI 像“贴在画布上的智能标签”随时调动。
  1. 保持设计语言一致性:AI 输出遵循原有页面风格,用户无需手动统一格式。
  1. AI = 帮你做,而不是替你做:所有生成内容都支持撤回、编辑、个性化微调,强调协作感而非控制感。
 
notion image
ldraw 将语言转化为空间操作,实现 AI on canvas 的直接控制。这是一个极具实验性的 AI-UX 模式,让 AI 与“画布”本身进行对话。tldraw 没有构建复杂的 AI 面板,而是将语言输入直接嵌入到“画布”的一部分,使之成为空间交互的一环。
 
入口触点(Entry Touch Points)
  • 用户无需进入任何对话框,只需在画布上点击语音按钮或输入栏,即可直接输入指令
  • 输入区域就是画布组件之一,始终可视,不打断绘图体验
  • 在这个 UI 中,“画布 = 输入设备”,“图形 = 数据对象”
 
AI 交互界面(Main AI-UX Interaction)
  • 用户输入自然语言指令,例如 “Arrange the rectangles along the curved line”
  • 无需选择目标、确认区域或点击确认,系统即刻识别画布中对象与意图
  • AI 自动将底部一排矩形,排列到用户画出的弯曲曲线上
  • 动作过程无需弹窗、选项或多轮确认,是一种“即时命中”的语义交互模式
 
加载状态(Loading State)
  • 无需显式加载动画,用户发出指令后结果即刻可见
  • 默认使用最小化“等待”机制,保持对画布流畅性的尊重
  • 高级用户可快速连发多个指令,实现连续操作
 
输出示例(Example Output)
  • 指令完成后,矩形对象立即围绕弯曲线分布
  • 整个布局保持流畅、精确、视觉反馈明确
  • 用户可以立刻基于这个结果做后续调整(如手动微调、加样式)
 
专业逻辑亮点
  1. 语言即 UI 操作的桥梁:自然语言直接控制“空间上的对象排列”。
  1. 零跳出,零干扰:没有切换模式、弹窗、AI 面板,一切都在原位完成。
  1. 视觉输入即上下文:AI 自动识别当前画布状态作为语义背景,无需再选中对象。
  1. 语义驱动空间运算:不仅仅是生成文本或图片,而是做“几何动作”、“空间安排”,让 AI 具备类似 CAD 操作能力。
 
 

Non-linear conversation 非线性对话

“脑图 + 聊天 + 编辑器”的结合体!不是“从头聊到尾”,而是:点击任意内容块,即可与 AI 对话
回答会直接显示在相应位置,可随时切换话题节点,对话可以灵活延伸和拓展,最终形成一张融合 AI 互动的知识图谱。
notion image
Miscellaneous 通过空间布局和多线索 AI 交互,打造思维导图式对话体验。这种系统突破了传统线性对话模式,让用户可以自由发散提问和展开分支,AI 则实时跟踪每条语义脉络并生成相关内容。
 
入口触点(Entry Touch Points)
  • 用户无需手动切换上下文,而是在阅读中自然点击内容关键词或高亮句子触发 AI 生成解释或延伸
  • 入口可隐于内容中,或者以「+」按钮、浮动卡片形式呈现,随点随开、无打扰感
  • 在草图式概念交互中(如图左下),点击任意分支节点都可触发新一轮对话展开
 
AI 交互界面(Main AI-UX Interaction)
  • 支持多个语义分支同时生成,每一分支有自己的提问和回复链,彼此平行、互不干扰
  • 用户可以任意点开其中某一点,继续拓展,也可以从其他节点重新开启新话题
  • 界面结构接近“卡片式内容网格”或“语义导图”:每一张卡片代表一个子主题,AI 回答围绕该卡展开
  • 对话支持「引用式跳转」,可以从某一句话快速跳到另一个内容块,形成语义联动
 
加载状态(Loading State)
  • 回应正在生成时,对应卡片上会出现局部 loading 动画,提示该分支正在进行中
  • 用户可继续浏览其他分支内容,交互是“异步”的,不阻断阅读节奏
  • 局部生成 + 全局平行的 loading 状态让人感受 AI 在不同语义线上并行处理
 
输出示例(Example Output)
  • 所有回答内容被嵌入到相应语义位置,结构化呈现,不是连续长文本
  • 每一张卡片可能会自动扩展为段落、图文、甚至表格形式,根据提问内容智能决定
  • 回答不仅提供事实解释,还包括后续建议、延伸概念、补充背景等,并可继续追问拓展
 
专业逻辑拆解(分析亮点)
  1. 空间布局替代线性时间轴:打破“顺序式”对话,所有内容可并列展开,类脑图、类拼贴板。
  1. 高自由度分支控制:用户可以根据自己的问题节奏自由开辟话题分支,无需回到历史记录找线索。
  1. 语义上下文始终在线:AI 在每个分支中都能“记住”上下文,持续追踪并回应,不断演进答案。
  1. 草图概念也能具象表达:底部的手绘图展示未来交互的可能性,任何一个想法都能变成节点继续生成。
  1. 适合复杂议题或协同写作场景:如文献调研、产品拆解、知识地图构建等非线性思考任务。
 
上一篇
Hyper personalization 超懂你的个性化体验
下一篇
Human in the loop 人类和 AI 一起干活