Back to Details

chunking

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Chunking

Chunking

Chunking is the practice of grouping a long string of items into a smaller number of meaningful units, each containing a few items. The classic insight: working memory can hold only a handful of independent items, but each "item" can itself be a chunk containing several pieces. Phone numbers are easier to remember as 
555-867-5309
(three chunks) than as 
5558675309
(ten digits). The same principle applies broadly across UI design.
Chunking是将一长串内容分组为数量更少的有意义单元的实践，每个单元包含若干项内容。经典研究发现：工作记忆只能容纳少量独立内容，但每个“内容项”本身可以是一个包含多个元素的Chunk。电话号码以
555-867-5309
（3个Chunk）的形式呈现比
5558675309
（10位数字）更容易记忆。这一原则广泛适用于UI设计领域。

Definition (in our own words)

定义（我们的解读）

Working memory is a small, short-lived store for the items the user is actively manipulating. Its capacity is roughly four to seven independent units. When information is presented as one long unbroken sequence, the user has to hold all of it as separate units and quickly hits the limit. When information is grouped into a few meaningful chunks, the same total content fits within the working-memory budget. Chunking is the design technique for fitting information to that budget.
工作记忆是用于临时存储用户正在处理内容的小型短期记忆空间，其容量约为4到7个独立单元。当信息以冗长且无分隔的序列呈现时，用户需要将所有内容视为独立单元来记忆，很快就会达到记忆上限。而当信息被分组为几个有意义的Chunk时，相同的总内容就能适配工作记忆的容量。Chunking就是让信息适配该容量的设计技巧。

Origins and research lineage

起源与研究脉络

  • George Miller, "The Magical Number Seven, Plus or Minus Two: Some Limits on Our Capacity for Processing Information." Psychological Review, 1956, vol. 63, p. 81–97. The foundational paper. Miller observed that across many tasks (recalling lists, distinguishing tones, judging quantities), people maxed out at about 7 ± 2 items. The paper introduced "chunk" as the unit of measurement: an item could itself be made up of smaller items, but it counted as one chunk if treated as a unit.
  • Nelson Cowan, "The Magical Number Four in Short-Term Memory: A Reconsideration of Mental Storage Capacity." Behavioral and Brain Sciences, 2001, vol. 24, p. 87–114. Refined Miller's estimate downward. Cowan's analysis found that when chunks are truly independent (not aided by rehearsal or grouping), capacity is closer to 4 ± 1 than 7 ± 2. The "magical number" is now usually given as 4.
  • Alan Baddeley, Working Memory (1986) and Working Memory, Thought, and Action (2007). The standard reference work on the structure and limits of working memory.
  • Lidwell, Holden & Butler (2003) compactly summarized the design implications and warned about misapplication: chunking is for tasks involving memory, not for tasks involving scanning (like consulting a reference list).
  • George Miller，《神奇的数字7±2：人类信息处理能力的局限》。发表于《Psychological Review》，1956年，第63卷，第81–97页。这是奠基性论文。Miller观察到，在众多任务（回忆列表、区分音调、判断数量）中，人们的处理上限约为7±2项内容。该论文引入“Chunk”作为衡量单位：一个内容项本身可由更小的元素组成，但如果被视为一个整体，就算作一个Chunk。
  • Nelson Cowan，《短期记忆的神奇数字4：对心理存储容量的重新思考》。发表于《Behavioral and Brain Sciences》，2001年，第24卷，第87–114页。将Miller的估算值向下修正。Cowan的分析发现，当Chunk是真正独立的（无需借助复述或分组辅助），其容量更接近4±1而非7±2。如今“神奇数字”通常取4。
  • Alan Baddeley，《Working Memory》（1986）及《Working Memory, Thought, and Action》（2007）。这是关于工作记忆结构与局限的标准参考文献。
  • Lidwell, Holden & Butler（2003）简洁总结了该原则对设计的启示，并警示误用：Chunking适用于涉及记忆的任务，而非涉及浏览的任务（比如查阅参考列表）。

Why chunking matters

Chunking的重要性

When users must hold multiple items in mind — to dial a phone number, type a confirmation code, follow multi-step directions, complete a multi-part form — the amount they can hold determines whether they succeed. Exceeding working memory means they make mistakes, look back, or give up.
Chunking expands the effective capacity by packing more information into each chunk. A user can hold roughly 4 chunks; if each chunk contains 3 digits, that's 12 digits total — meaningful for phone numbers. Without chunking, 12 raw digits is well past the limit.
Chunking also accelerates learning: chunked patterns become familiar units (the "555" prefix becomes one chunk, not three) and free up capacity for new information.
当用户需要记住多项内容时——比如拨打电话号码、输入验证码、遵循多步骤指引、填写多部分表单——他们能记住的内容量决定了任务能否成功。超出工作记忆容量意味着用户会犯错、反复回看或直接放弃。
Chunking通过将更多信息打包到每个Chunk中来扩展有效记忆容量。用户大约能记住4个Chunk；如果每个Chunk包含3位数字，那总共就能记住12位数字——这对电话号码来说非常实用。如果不进行Chunking，12位原始数字远超记忆上限。
Chunking还能加速学习：经过Chunking的模式会成为熟悉的单元（比如“555”前缀会成为一个Chunk，而非3位独立数字），从而为新信息腾出记忆空间。

When to apply

适用场景

  • Numeric strings the user must type or read — phone numbers, OTP codes, account numbers, IDs, dates, currency.
  • Long forms — group fields into named sections of 4–6 fields each.
  • Navigation menus — group items into named sections of 4–7 items each.
  • Multi-step instructions — break a 12-step process into three groups of four steps.
  • Tables with many columns — visually group columns by category if they're related.
  • Dashboards with many widgets — group widgets into themed regions.
  • 用户需要输入或阅读的数字字符串——电话号码、OTP码、账户号码、ID、日期、货币。
  • 长表单——将字段分组为包含4–6个字段的命名章节。
  • 导航菜单——将项目分组为包含4–7个项目的命名章节。
  • 多步骤指令——将12步流程拆分为3组，每组4步。
  • 包含多列的表格——如果列之间相关，按类别进行视觉分组。
  • 包含多个小组件的仪表盘——将小组件分组为主题区域。

When NOT to apply

不适用场景

The book's specific warning: don't chunk reference content the user scans rather than memorizes.
  • Long lists the user filters or searches — a contact list with 200 entries shouldn't be chunked into "Contacts A–E, F–J, K–O..." because the user isn't memorizing it; they're scanning or searching. Forced chunking adds visual noise without cognitive benefit.
  • Reference material the user looks up — dictionary entries, documentation pages, settings pages where the user knows what they want. Search and clear labeling beat chunking.
  • Continuous prose — chunking sentences into "first 4 words, next 4 words, next 4 words" damages reading. Body text follows its own rhythm.
The discriminator: are users holding the items in mind (apply chunking) or finding them (don't)?
书中特别警示：不要对用户浏览而非记忆的参考内容进行Chunking。
  • 用户会筛选或搜索的长列表——包含200条条目的联系人列表不应被拆分为“A–E联系人、F–J联系人、K–O联系人……”，因为用户并非要记住列表内容，而是浏览或搜索。强制Chunking会增加视觉干扰，却无认知收益。
  • 用户查阅的参考资料——词典条目、文档页面、用户明确需求的设置页面。搜索和清晰标注比Chunking更有效。
  • 连续文本——将句子拆分为“前4个词、接下来4个词、再接下来4个词”会破坏阅读体验。正文文本有其自身的节奏。
判断标准：用户是在记住内容（适用Chunking）还是查找内容（不适用）？

Optimal chunk size

最佳Chunk大小

Different sources give different numbers; the working consensus:
  • Each chunk: 3–5 items. More than 5 risks overflow within the chunk.
  • Total chunks visible: 4–7. More than 7 risks overflow across chunks.
  • For numeric strings: typically 3–4 digits per chunk. Phone numbers, credit cards, OTP codes all converged on this.
These are heuristics; specific tasks may justify different sizes. The grouping should always be perceptually clear (visual gap, dash, slot separation).
不同来源给出的数值不同，行业共识如下：
  • 每个Chunk：3–5项内容。超过5项可能导致Chunk内部溢出。
  • 可见总Chunk数：4–7个。超过7个可能导致跨Chunk溢出。
  • 数字字符串：通常每个Chunk包含3–4位数字。电话号码、信用卡号、OTP码都遵循这一标准。
这些是启发式规则；特定任务可能需要调整大小。分组必须在视觉上清晰可辨（比如视觉间隙、短横线、输入框分隔）。

Worked examples

实践案例

Example 1: phone numbers

案例1：电话号码

Most common chunking case. A 10-digit US phone number formatted three ways:
5558675309        ← unchunked: 10 digits, hard to verify or recall
555-867-5309      ← three chunks: 3-3-4
(555) 867-5309    ← same three chunks, with area code marked
555 867 5309      ← spaces instead of dashes
The chunked versions are easier to read aloud, easier to verify, easier to remember briefly. Most international phone formats follow similar logic.
最常见的Chunking场景。美国10位电话号码的三种格式：
5558675309        ← 未Chunking：10位数字，难以验证或回忆
555-867-5309      ← 3个Chunk：3-3-4
(555) 867-5309    ← 同样3个Chunk，标注区号
555 867 5309      ← 用空格代替短横线
经过Chunking的版本更易朗读、验证和短期记忆。大多数国际电话号码格式遵循类似逻辑。

Example 2: OTP / verification codes

案例2：OTP/验证码

A 6-digit OTP entered into a single field is hard to verify mid-entry. Chunked input fields make each digit's position visible:
html
<input type="text" inputmode="numeric" maxlength="6" />  <!-- unchunked -->

<!-- vs. chunked input -->
<div class="otp-input" role="group" aria-label="Verification code">
  <input type="text" inputmode="numeric" maxlength="1" />
  <input type="text" inputmode="numeric" maxlength="1" />
  <input type="text" inputmode="numeric" maxlength="1" />
  <span class="separator" aria-hidden>—</span>
  <input type="text" inputmode="numeric" maxlength="1" />
  <input type="text" inputmode="numeric" maxlength="1" />
  <input type="text" inputmode="numeric" maxlength="1" />
</div>
The chunked version (3-3) helps users verify they typed the right digits and matches the chunked format that's typically displayed in the originating email or SMS.
在单个输入框中输入6位OTP难以在输入过程中验证。分块输入框能让每位数字的位置清晰可见：
html
<input type="text" inputmode="numeric" maxlength="6" />  <!-- 未Chunking -->

<!-- 分块输入 -->
<div class="otp-input" role="group" aria-label="Verification code">
  <input type="text" inputmode="numeric" maxlength="1" />
  <input type="text" inputmode="numeric" maxlength="1" />
  <input type="text" inputmode="numeric" maxlength="1" />
  <span class="separator" aria-hidden>—</span>
  <input type="text" inputmode="numeric" maxlength="1" />
  <input type="text" inputmode="numeric" maxlength="1" />
  <input type="text" inputmode="numeric" maxlength="1" />
</div>
分块版本（3-3）帮助用户验证输入的数字是否正确，且与原始邮件或短信中显示的分块格式一致。

Example 3: long forms broken into sections

案例3：拆分为章节的长表单

A 24-field signup form is overwhelming. Group into 4 sections of ~6 fields each, with named headings:
html
<form>
  <section>
    <h2>Account</h2>
    <!-- 5 fields: email, password, name, etc. -->
  </section>
  <section>
    <h2>Profile</h2>
    <!-- 4 fields: title, bio, photo, etc. -->
  </section>
  <section>
    <h2>Workspace</h2>
    <!-- 6 fields: workspace name, members, etc. -->
  </section>
  <section>
    <h2>Preferences</h2>
    <!-- 5 fields: notifications, language, etc. -->
  </section>
</form>
The user holds in mind "I'm in the workspace section" rather than "I'm at field 17 of 24." Each section is a manageable chunk.
包含24个字段的注册表单会让用户望而生畏。将其分为4个章节，每个章节包含约6个字段，并添加命名标题：
html
<form>
  <section>
    <h2>Account</h2>
    <!-- 5个字段：邮箱、密码、姓名等 -->
  </section>
  <section>
    <h2>Profile</h2>
    <!-- 4个字段：头衔、简介、照片等 -->
  </section>
  <section>
    <h2>Workspace</h2>
    <!-- 6个字段：工作区名称、成员等 -->
  </section>
  <section>
    <h2>Preferences</h2>
    <!-- 5个字段：通知、语言等 -->
  </section>
</form>
用户只需记住“我正在填写工作区章节”，而非“我在填写第17个字段，共24个”。每个章节都是易于管理的Chunk。

Example 4: navigation grouped by purpose

案例4：按用途分组的导航

A sidebar with 18 nav items is hard to scan; grouped into 3 themed sections of 6 items each:
html
<nav>
  <h3>Workspace</h3>
  <ul>
    <li><a href="/dashboard">Dashboard</a></li>
    <li><a href="/projects">Projects</a></li>
    <li><a href="/team">Team</a></li>
    <li><a href="/calendar">Calendar</a></li>
    <li><a href="/files">Files</a></li>
    <li><a href="/inbox">Inbox</a></li>
  </ul>
  <h3>Reports</h3>
  <ul>...</ul>
  <h3>Settings</h3>
  <ul>...</ul>
</nav>
Users learn the section structure quickly and use it to predict where things live.
包含18个导航项的侧边栏难以浏览；将其分为3个主题章节，每个章节包含6个项目：
html
<nav>
  <h3>Workspace</h3>
  <ul>
    <li><a href="/dashboard">Dashboard</a></li>
    <li><a href="/projects">Projects</a></li>
    <li><a href="/team">Team</a></li>
    <li><a href="/calendar">Calendar</a></li>
    <li><a href="/files">Files</a></li>
    <li><a href="/inbox">Inbox</a></li>
  </ul>
  <h3>Reports</h3>
  <ul>...</ul>
  <h3>Settings</h3>
  <ul>...</ul>
</nav>
用户能快速熟悉章节结构，并以此预测内容位置。

Example 5: address strings

案例5：地址字符串

An address string is a chunked structure even when displayed compactly:
1234 Main Street, Apt 5B
San Francisco, CA 94110
Two-line break separates "street" chunk from "city/state/zip" chunk. The internal commas chunk apartment from street and city from state from zip. Users parse and recall this far better than the same characters in one continuous line.
即使紧凑显示，地址字符串也是一种分块结构：
1234 Main Street, Apt 5B
San Francisco, CA 94110
换行将“街道”Chunk与“城市/州/邮编”Chunk分隔开。内部逗号将公寓号与街道、城市与州、州与邮编进行分块。用户解析和回忆这种格式远优于将所有字符放在一行中。

Example 6: multi-step instruction

案例6：多步骤指令

"To set up your account: Open Settings, click Notifications, choose Email, set frequency, save changes" — five steps in one sentence. Chunked as a numbered list:
1. Open Settings
2. Click Notifications
3. Choose Email
4. Set frequency
5. Save changes
Easier to follow; users can mark progress and look back at any step.
“设置账户步骤：打开设置，点击通知，选择邮件，设置频率，保存更改”——一句话包含5个步骤。分块为编号列表：
1. Open Settings
2. Click Notifications
3. Choose Email
4. Set frequency
5. Save changes
更易于遵循；用户可以标记进度，并随时回看任意步骤。

Cross-domain examples

跨领域案例

Music

音乐

Western music notation chunks notes into measures (typically 3 or 4 beats). Beats group into bars; bars group into phrases; phrases group into sections. Musicians read music as nested chunks, not as individual notes.
西方音乐记谱法将音符分块为小节（通常3或4拍）。拍组成小节；小节组成乐句；乐句组成章节。音乐家以嵌套Chunk的形式阅读乐谱，而非单个音符。

Reading

阅读

Skilled readers don't process individual letters; they process chunks (common letter combinations, then whole words, then phrases). Speed reading techniques are largely about recognizing larger chunks more efficiently.
熟练的读者不会逐字母处理内容；他们会处理Chunk（常见字母组合、完整单词、短语）。速读技巧主要是更高效地识别更大的Chunk。

Chess

国际象棋

Expert chess players recall positions vastly better than novices — not because their working memory is larger, but because they chunk pieces into meaningful patterns (a defensive formation, an opening structure). De Groot's classic studies (1965) showed that experts and novices recalled random piece arrangements equally; the expert advantage came entirely from recognizing meaningful chunks.
专业象棋选手回忆棋局的能力远超新手——并非因为他们的工作记忆容量更大，而是因为他们将棋子分块为有意义的模式（防御阵型、开局结构）。De Groot的经典研究（1965）表明，专业选手和新手回忆随机棋子布局的能力相当；专业选手的优势完全来自对有意义Chunk的识别。

Telephone area codes

电话区号

Area codes are mnemonic chunks that group geography into recognizable units. "212" is Manhattan; "415" is San Francisco. The numeric chunk doubles as a categorical signal.
区号是助记Chunk，将地理区域分组为可识别的单元。“212”代表曼哈顿；“415”代表旧金山。数字Chunk同时作为分类信号。

Anti-patterns

反模式

  • Chunking what should be searched. Forcing a long list into chunks the user must navigate when search would do.
  • Chunks too large. A "section" containing 20 items isn't a chunk; it's a list.
  • Chunks too small. A "section" containing 2 items isn't worth its overhead. Combine.
  • Inconsistent chunk sizes within a sequence. A 10-digit string chunked 5-2-3 is harder than 3-3-4 because the rhythm is irregular.
  • Visual chunking that contradicts logical chunking. Visual separators in places that don't match meaning ("123-4567-89" is structurally awkward even if visually chunked).
  • Decorative grouping with no labels. Grouping must be communicated via headings or visible regions. Just "putting space between things" without naming the groups misses the cognitive benefit.
  • 对应搜索的内容进行Chunking：当搜索就能解决问题时，强制将长列表分块让用户导航。
  • Chunk过大：包含20个项目的“章节”不是Chunk，而是列表。
  • Chunk过小：包含2个项目的“章节”不值得付出额外成本，应合并。
  • 序列内Chunk大小不一致：将10位数字分块为5-2-3比3-3-4更难记忆，因为节奏不规则。
  • 视觉分块与逻辑分块矛盾：视觉分隔符的位置不符合内容逻辑（比如“123-4567-89”即使有视觉分块，结构也很别扭）。
  • 无标签的装饰性分组：分组必须通过标题或可见区域传达。仅“在内容间添加空格”而不命名分组无法带来认知收益。

Heuristics

启发式规则

  1. Count chunks visible. More than ~7? Reorganize or split.
  2. Count items per chunk. More than ~5? Split that chunk.
  3. The "what's in this group?" test. Can you name each chunk in 2–3 words? If yes, the chunking is meaningful. If no, the chunks are arbitrary; rethink.
  4. The scanning vs. memorizing diagnostic. Is the user holding this in mind, or finding it? If finding, chunking may be noise; replace with search and clear labeling.
  1. 统计可见Chunk数：超过约7个？重新组织或拆分。
  2. 统计每个Chunk的内容项数：超过约5个？拆分该Chunk。
  3. “此组包含什么？”测试：能否用2-3个词命名每个Chunk？如果可以，分块是有意义的；如果不行，Chunk是随意划分的，需重新考虑。
  4. 浏览vs记忆判断：用户是在记住内容还是查找内容？如果是查找，Chunking可能是干扰项；改用搜索和清晰标注。

Related principles

相关原则

  • performance-load
     — chunking is the canonical reduction of cognitive load.
  • hicks-law
     — fewer visible options means faster decisions; chunking and Hick's Law often combine in nav design.
  • progressive-disclosure
     — disclosure works between chunks (show one section, hide others); chunking works within the visible content.
  • mnemonic-device
     — chunking is itself a mnemonic technique; explicit mnemonics layer on top.
  • signal-to-noise-ratio
     (perception) — well-chunked content has less perceptual noise.
  • proximity
     (perception) — proximity is the visual mechanism for showing chunks: closer items group, gaps mark boundaries.
  • hierarchy
     (perception) — chunked content carries a hierarchy of structure (sections > items).
  • performance-load
    ——Chunking是减少认知负荷的标准方法。
  • hicks-law
    ——可见选项越少，决策速度越快；Chunking与希克定律常结合应用于导航设计。
  • progressive-disclosure
    ——渐进式披露适用于Chunk之间（显示一个章节，隐藏其他章节）；Chunking适用于可见内容内部。
  • mnemonic-device
    ——Chunking本身就是一种助记技巧；显式助记符是在此基础上的补充。
  • signal-to-noise-ratio
    （感知）——分块合理的内容感知噪声更少。
  • proximity
    （感知）——接近性是展示Chunk的视觉机制：距离近的内容会被归为一组，间隙标记边界。
  • hierarchy
    （感知）——分块内容具有结构化层级（章节 > 内容项）。

Sub-aspect skills

子技能

  • chunking-form-grouping
     — applying chunking to long forms.
  • chunking-numeric-and-otp
     — applying chunking to numeric strings, OTP codes, and identifiers.
  • chunking-form-grouping
    ——将Chunking应用于长表单。
  • chunking-numeric-and-otp
    ——将Chunking应用于数字字符串、OTP码和标识符。

Closing

结语

Chunking is the cheapest cognitive lift available in design — it costs only structure, not new content. The discipline is recognizing when content is being held in working memory (chunk it) versus scanned for retrieval (don't add chunks; use search). When applied correctly, chunking turns "too much to hold" into "manageable."
Chunking是设计中成本最低的认知优化手段——仅需调整结构，无需新增内容。关键在于判断内容是需要用户保存在工作记忆中（进行Chunking）还是用于浏览检索（无需分块，改用搜索）。正确应用Chunking可以将“难以记住”的内容转变为“易于管理”的内容。