直接操纵

本词条尚无可操作示例；插画为编辑示意。应用到产品时仍须验证每个拖动操作是否都有非拖动与键盘替代路径、效果是否即时可见并可撤销，以及必要功能是否有拖动之外的可见入口。

{
  "states": [
    "idle",
    "grabbed",
    "dragging",
    "dropped",
    "reverted"
  ],
  "a11y": [
    "每个可拖动对象都有名称，并可用键盘选中、移动和放下",
    "存在与拖动等价的非拖动单指针操作，例如上移下移按钮或移动菜单",
    "拖动中的位置变化与放下结果通过文字向辅助技术宣告"
  ],
  "motion": "拖动跟随指针属于必要反馈；落位动画可省略，减弱动态偏好下直接放到目标位置"
}

{
  "id": "direct-manipulation",
  "type": "interaction",
  "name": {
    "zh": "直接操纵",
    "en": "Direct Manipulation"
  },
  "aliases": [
    "直接操作",
    "Direct Manipulation Interface",
    "DM interface"
  ],
  "granularity": "component",
  "intents": [
    "manipulate-object"
  ],
  "tags": [
    "拖放",
    "可逆",
    "即时反馈",
    "对象",
    "手柄"
  ],
  "definition": "一种交互风格：用户直接作用于屏幕上持续显示的目标对象，通过点击、拖动、触摸等物理动作而不是命令语法来操作，操作是增量、快速、可逆的，效果立即在屏幕上可见。术语由 Shneiderman 于 1983 年提出。",
  "boundary": "直接操纵是一个交互风格层面的概念，不是某个具体控件：拖放、缩放手柄、滑块、捏合缩放都是它的实现方式；行内编辑只是它在编辑场景中的一个具体情境，不是同义词。判断标准是四个特征是否同时成立：对象持续可见、用物理动作而非命令、操作增量且可逆、效果立即可见。只有手势而没有可见对象、或效果要提交后才显示的界面，不算直接操纵。",
  "signature": [
    "目标对象持续显示在屏幕上，用户直接在对象本身上操作",
    "操作以点击、拖动、触摸等物理动作完成，无需记忆命令",
    "每一步的效果立即可见，且能撤销或反向操作"
  ],
  "when": [
    "任务本身是空间性或连续量的，例如排序、移动、调整大小、设定范围",
    "用户需要边试边看，通过即时反馈逐步逼近想要的结果",
    "新手或偶尔使用者需要靠识别可见对象来学习，而不是靠回忆命令"
  ],
  "when_not": [
    "需要对大量对象做批量或重复操作，逐个拖动比一条命令或一个批量控件慢得多",
    "目标对象不可见或数量太多无法全部显示，直接操纵只能作用于看得见的东西",
    "精确数值比手感更重要，例如输入确切尺寸或日期，拖动反而容易出错"
  ],
  "tradeoff": "换来的是可控感、低学习成本和即时纠错，代价是只能作用于可见对象、批量与重复任务效率低，而且拖动等精细动作对运动或视觉障碍用户构成障碍，必须另备非拖动替代路径。",
  "comparison": {
    "focus": "让用户直接作用于可见对象，而不是通过命令或表单间接描述想要的结果",
    "mechanism": "持续显示对象，把物理动作映射为增量、可逆、即时可见的操作",
    "cost": "为每个拖动操作提供单指针非拖动或键盘替代方案，并实现撤销与实时反馈"
  },
  "sources": [
    {
      "id": "nng-direct-manipulation",
      "title": "NN/g · Direct Manipulation: Definition",
      "url": "https://www.nngroup.com/articles/direct-manipulation/",
      "claim": "直接操纵是用户通过物理、增量、可逆的动作作用于屏幕上显示的目标对象、效果立即可见的交互风格；其特征为对象持续显示、用物理动作代替命令语法、持续反馈与可逆、易于学习；术语由 Shneiderman 在 1983 年论文中提出；缺点包括只能作用于可见对象、批量与重复任务效率低、对运动或视觉障碍用户构成无障碍挑战。",
      "checkedAt": "2026-09-15",
      "archive": {
        "lookupUrl": "https://web.archive.org/web/20260915*/https://www.nngroup.com/articles/direct-manipulation/",
        "status": "available",
        "checkedAt": "2026-09-15T18:45:03.812Z",
        "jobId": "spn2-ac56bde0a577549afc6187c245521d3059a59aa0",
        "url": "https://web.archive.org/web/20260915184528/https://www.nngroup.com/articles/direct-manipulation/",
        "timestamp": "20260915184528"
      }
    },
    {
      "id": "wcag-dragging-movements",
      "title": "W3C · Understanding SC 2.5.7: Dragging Movements (WCAG 2.2, Level AA)",
      "url": "https://www.w3.org/WAI/WCAG22/Understanding/dragging-movements.html",
      "claim": "所有依赖拖动操作的功能都必须能用单指针在不拖动的情况下完成，除非拖动是必要的或由用户代理而非作者决定；该准则为 AA 级，服务于无法精确拖动或使用轨迹球、头控、眼动等辅助输入设备的用户；替代方式包括点击轨道任意位置、输入精确数值、相邻的上移下移按钮或点击后弹出的移动菜单。",
      "checkedAt": "2026-09-15",
      "archive": {
        "lookupUrl": "https://web.archive.org/web/20260915*/https://www.w3.org/WAI/WCAG22/Understanding/dragging-movements.html",
        "status": "available",
        "checkedAt": "2026-09-16T03:49:42.520Z",
        "jobId": "spn2-de0b078ac0d810da71f0131e386164242929d831",
        "url": "https://web.archive.org/web/20260916035006/https://www.w3.org/WAI/WCAG22/Understanding/dragging-movements.html",
        "timestamp": "20260916035006"
      }
    }
  ],
  "relations": [
    {
      "target": "inline-edit",
      "kind": "realized_by",
      "condition": "在阅读位置直接修改短字段",
      "reason": "行内编辑把直接操纵应用于编辑场景：对象保持可见，就地修改，效果立即呈现；它是直接操纵的一个具体情境，而不是同义词。",
      "basis": "editorial"
    },
    {
      "target": "error-prevention",
      "kind": "composes_with",
      "condition": "设计拖放、缩放等操作的可逆性",
      "reason": "直接操纵靠增量与可逆让用户随做随改；撤销和拖动中的实时预览是在错误发生前或刚发生时化解它的手段。",
      "basis": "editorial"
    },
    {
      "target": "recognition",
      "kind": "informs",
      "condition": "决定哪些对象和动作要持续显示",
      "reason": "直接操纵之所以易学，是因为对象和可执行动作都看得见，用户靠识别而不是回忆命令来操作。",
      "basis": "editorial"
    },
    {
      "target": "wizard",
      "kind": "alternative",
      "condition": "任务有固定顺序且后续步骤依赖前面的输入",
      "reason": "分步向导用受控顺序引导，直接操纵让用户自由摆弄对象；两者适合的任务结构不同，不应为了显得直观而把有序流程做成自由拖放。",
      "basis": "editorial"
    }
  ],
  "rules": [
    {
      "when": "任何功能依赖拖动操作完成",
      "instruction": "提供单指针不拖动即可完成的替代方式和键盘路径，例如点击轨道、输入数值、上移下移按钮或移动菜单；仅当拖动本身是功能的本质时例外。",
      "strength": "must",
      "basis": "editorial"
    },
    {
      "when": "用户正在操作对象",
      "instruction": "让每一步的效果立即在屏幕上显示，并允许撤销或反向操作，不要等提交后才呈现结果。",
      "strength": "must",
      "basis": "editorial"
    },
    {
      "when": "某个功能对完成任务是必要的",
      "instruction": "不要把它只藏在拖动或手势后面；提供可见的入口，例如按钮或菜单。",
      "strength": "recommend",
      "basis": "editorial"
    }
  ],
  "behavior": {
    "states": [
      "idle",
      "grabbed",
      "dragging",
      "dropped",
      "reverted"
    ],
    "a11y": [
      "每个可拖动对象都有名称，并可用键盘选中、移动和放下",
      "存在与拖动等价的非拖动单指针操作，例如上移下移按钮或移动菜单",
      "拖动中的位置变化与放下结果通过文字向辅助技术宣告"
    ],
    "motion": "拖动跟随指针属于必要反馈；落位动画可省略，减弱动态偏好下直接放到目标位置"
  },
  "demo": null,
  "version": "0.1.0",
  "editorialStatus": "drafted",
  "requirements": [],
  "demoCapabilities": [],
  "implementationNote": "本词条尚无可操作示例；插画为编辑示意。应用到产品时仍须验证每个拖动操作是否都有非拖动与键盘替代路径、效果是否即时可见并可撤销，以及必要功能是否有拖动之外的可见入口。",
  "image": {
    "src": "/images/direct-manipulation.webp",
    "alt": "虚构的 FIELDNOTES 看板：一张卡片被手形光标从左栏拖向右栏，右栏中有虚线的放置占位，左栏另一张卡片角上带有缩放手柄。"
  },
  "searchTerms": [
    "drag and drop",
    "reversible",
    "immediate feedback",
    "objects",
    "handles"
  ]
}