<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:content="http://purl.org/rss/1.0/modules/content/"><channel><title>Progressive-Disclosure on Tarragon</title><link>https://tarrragon.github.io/blog/tags/progressive-disclosure/</link><description>Recent content in Progressive-Disclosure on Tarragon</description><generator>Hugo -- gohugo.io</generator><language>zh-TW</language><copyright>Tarragon (CC BY 4.0)</copyright><lastBuildDate>Mon, 19 Oct 2026 00:00:00 +0800</lastBuildDate><atom:link href="https://tarrragon.github.io/blog/tags/progressive-disclosure/index.xml" rel="self" type="application/rss+xml"/><item><title>Progressive Disclosure（漸進式揭露）</title><link>https://tarrragon.github.io/blog/ux-design/knowledge-cards/progressive-disclosure/</link><pubDate>Mon, 19 Oct 2026 00:00:00 +0800</pubDate><guid>https://tarrragon.github.io/blog/ux-design/knowledge-cards/progressive-disclosure/</guid><description>&lt;p>Progressive Disclosure（漸進式揭露）是把介面內容分成層級的設計手法：常用、每次都需要的內容放在&lt;strong>初始層&lt;/strong>——使用者一進來就看到的那一層；進階或少用的功能移到&lt;strong>次要層&lt;/strong>，使用者要用時才展開。Jakob Nielsen 在 2006 年的整理裡把它定義成「把進階或少用的功能延後到次要畫面」，好處是介面容易學、操作比較不容易出錯。它與 &lt;a href="https://tarrragon.github.io/blog/ux-design/knowledge-cards/modal/" data-link-title="Modal（模態）" data-link-desc="UI 元素阻斷背景互動、要求使用者回應後才能繼續 — 區分 Dialog 與 non-modal Bottom Sheet 的關鍵行為屬性">Modal&lt;/a> 常一起出現：次要層內容常用對話框或展開面板呈現。&lt;/p>
&lt;h2 id="概念位置">概念位置&lt;/h2>
&lt;p>Progressive Disclosure 處理的是一個畫面上該放多少內容：所有功能都攤在初始層，常用的功能被少用的淹沒；功能藏得太深，使用者找不到。Nielsen 指出它成立的條件有兩個：初始層與次要層要切對，常用的功能要在初始層；使用者要看得出怎麼從初始層進到次要層。入口能否被看見，屬於 &lt;a href="https://tarrragon.github.io/blog/ux-design/knowledge-cards/affordance/" data-link-title="Affordance（操作暗示）" data-link-desc="說明介面元素透過外觀傳達「可以對它做什麼」的訊號 — 可點、可捲、可拖的暗示與實際行為對齊時介面才可預測">Affordance&lt;/a> 管的範圍：「更多選項」的入口要讓人一眼看出可以點。他也觀察到超過兩層的設計可用性通常偏低，使用者在層與層之間迷路。&lt;/p>
&lt;p>同一個手法也用在給代理人讀的規則文件上。Anthropic 在 2025 年介紹 Agent Skills 時，把 Progressive Disclosure 稱為它的核心設計原則：代理人啟動時只載入每個 skill 的名稱與描述，判斷某個 skill 相關才讀它的主檔，主檔連到的其他檔案在需要時才讀。這裡的初始層是每次都會進到代理人上下文的內容，代價是每次都要付的讀取成本。&lt;/p>
&lt;h2 id="可觀察訊號與例子">可觀察訊號與例子&lt;/h2>
&lt;p>需要 Progressive Disclosure 的訊號是：使用者每次完成同一件事，都要先跳過一批這次用不到的內容。&lt;/p>
&lt;ul>
&lt;li>&lt;strong>畫面&lt;/strong>：列印對話框的初始層只有份數、印表機與頁面範圍，紙張來源、雙面設定、色彩管理放在「更多設定」裡。&lt;/li>
&lt;li>&lt;strong>設定頁&lt;/strong>：一般使用者會改的選項放在設定首頁，進階選項收進「進階」分頁。&lt;/li>
&lt;li>&lt;strong>規則文件&lt;/strong>：一份判斷指南每次判斷都要先跳過範例、模板與只在特定情況才用的規則。把每次都要用的判斷依據與強制規則留在常駐的入口檔，其餘移到入口檔指向的參考文件，做法與一份規則文件精簡前後的行數在&lt;a href="https://tarrragon.github.io/blog/record/non-code-refactoring/" data-link-title="規則文件的精簡：用 Progressive Disclosure 分出常駐內容與參考細節" data-link-desc="規則文件膨脹之後的精簡：Progressive Disclosure 的四層分法（快查表、強制規則、決策流程、參考細節）、把參考細節移出常駐文件的做法、一次規則文件精簡的前後量測，以及過度精簡、只按章節切開與移出後未留入口這幾種失誤">規則文件的精簡&lt;/a>。&lt;/li>
&lt;/ul>
&lt;h2 id="設計責任">設計責任&lt;/h2>
&lt;p>設計 Progressive Disclosure 的責任是決定每一項內容放在哪一層，依據是使用頻率與漏看的代價：每次都用得到的放初始層；只有某些任務才用到的放次要層，並在初始層留下何時該打開它的提示；很少用到、但漏看的代價很高的內容（例如會造成資料遺失的設定、必須遵守的約束），即使少用也要在初始層留下觸發條件，讓使用者在該打開的時候知道要打開。分層之後確認從初始層到次要層的入口看得見，否則次要層的內容對使用者等於不存在。&lt;/p></description><content:encoded><![CDATA[<p>Progressive Disclosure（漸進式揭露）是把介面內容分成層級的設計手法：常用、每次都需要的內容放在<strong>初始層</strong>——使用者一進來就看到的那一層；進階或少用的功能移到<strong>次要層</strong>，使用者要用時才展開。Jakob Nielsen 在 2006 年的整理裡把它定義成「把進階或少用的功能延後到次要畫面」，好處是介面容易學、操作比較不容易出錯。它與 <a href="/blog/ux-design/knowledge-cards/modal/" data-link-title="Modal（模態）" data-link-desc="UI 元素阻斷背景互動、要求使用者回應後才能繼續 — 區分 Dialog 與 non-modal Bottom Sheet 的關鍵行為屬性">Modal</a> 常一起出現：次要層內容常用對話框或展開面板呈現。</p>
<h2 id="概念位置">概念位置</h2>
<p>Progressive Disclosure 處理的是一個畫面上該放多少內容：所有功能都攤在初始層，常用的功能被少用的淹沒；功能藏得太深，使用者找不到。Nielsen 指出它成立的條件有兩個：初始層與次要層要切對，常用的功能要在初始層；使用者要看得出怎麼從初始層進到次要層。入口能否被看見，屬於 <a href="/blog/ux-design/knowledge-cards/affordance/" data-link-title="Affordance（操作暗示）" data-link-desc="說明介面元素透過外觀傳達「可以對它做什麼」的訊號 — 可點、可捲、可拖的暗示與實際行為對齊時介面才可預測">Affordance</a> 管的範圍：「更多選項」的入口要讓人一眼看出可以點。他也觀察到超過兩層的設計可用性通常偏低，使用者在層與層之間迷路。</p>
<p>同一個手法也用在給代理人讀的規則文件上。Anthropic 在 2025 年介紹 Agent Skills 時，把 Progressive Disclosure 稱為它的核心設計原則：代理人啟動時只載入每個 skill 的名稱與描述，判斷某個 skill 相關才讀它的主檔，主檔連到的其他檔案在需要時才讀。這裡的初始層是每次都會進到代理人上下文的內容，代價是每次都要付的讀取成本。</p>
<h2 id="可觀察訊號與例子">可觀察訊號與例子</h2>
<p>需要 Progressive Disclosure 的訊號是：使用者每次完成同一件事，都要先跳過一批這次用不到的內容。</p>
<ul>
<li><strong>畫面</strong>：列印對話框的初始層只有份數、印表機與頁面範圍，紙張來源、雙面設定、色彩管理放在「更多設定」裡。</li>
<li><strong>設定頁</strong>：一般使用者會改的選項放在設定首頁，進階選項收進「進階」分頁。</li>
<li><strong>規則文件</strong>：一份判斷指南每次判斷都要先跳過範例、模板與只在特定情況才用的規則。把每次都要用的判斷依據與強制規則留在常駐的入口檔，其餘移到入口檔指向的參考文件，做法與一份規則文件精簡前後的行數在<a href="/blog/record/non-code-refactoring/" data-link-title="規則文件的精簡：用 Progressive Disclosure 分出常駐內容與參考細節" data-link-desc="規則文件膨脹之後的精簡：Progressive Disclosure 的四層分法（快查表、強制規則、決策流程、參考細節）、把參考細節移出常駐文件的做法、一次規則文件精簡的前後量測，以及過度精簡、只按章節切開與移出後未留入口這幾種失誤">規則文件的精簡</a>。</li>
</ul>
<h2 id="設計責任">設計責任</h2>
<p>設計 Progressive Disclosure 的責任是決定每一項內容放在哪一層，依據是使用頻率與漏看的代價：每次都用得到的放初始層；只有某些任務才用到的放次要層，並在初始層留下何時該打開它的提示；很少用到、但漏看的代價很高的內容（例如會造成資料遺失的設定、必須遵守的約束），即使少用也要在初始層留下觸發條件，讓使用者在該打開的時候知道要打開。分層之後確認從初始層到次要層的入口看得見，否則次要層的內容對使用者等於不存在。</p>
]]></content:encoded></item></channel></rss>