VOCABULARY / ENTRY
Determinate Progress Bar
determinate-progress
Represent the actual completed proportion with a progress bar when both total work and completed work are known.
Interactive specimen · Fictional product FIELDNOTES
Import notes · Simulated task
0 / 5 notes · 0%
The percentage is calculated from simulated completed notes, not invented by a timer.
Recognizing it
- An explicit task name
- Measurable completed work and total work
- A completed or failed end state
Concept boundary
The percentage must correspond to completed work. This specimen uses a manually advanced simulated task, not real network speed.
When to consider it
- The system provides real completed-work and total-work values
- People need to know how far a task has progressed
When to be cautious
- Using a timer to invent percentages when progress is unknown
- Treating upload completion as server-side processing completion
Tradeoff
Progress is more concrete, but the total and measurement method must be reliable across task stages.
Conditional rules · Editorial advice
When Real completed-work data is unavailableMustDo not display a fabricated determinate percentage.
When The task completesMustShow completion and explain the next step.
Query requirement:measurable_progress = true
Determinate progress requires reliable completed-work and total-work values.
Related entries
Skeleton Screen ↗Conditional alternative · Presenting a waiting state
Do not choose a definite percentage without reliable completed-work data.
Calm Technology ↗Works with · Progress requires no immediate response
Use a status presentation that does not interrupt the task.
Sources and what they support
Carbon · Progress bar ↗
Distinguishes determinate and indeterminate progress; the determinate form represents quantifiable progress.
Retrieved: 2026-09-15Definitions reference these sources. Digital specimens, selection advice, relationships, and recipes are editorial work and have not been validated through user research.
Type extensions and implementation notes
Capability tags describe this specimen only; verify the implementation again in a real product.
{
"states": [
"idle",
"progress",
"success",
"error"
],
"a11y": [
"The progress indicator has an accessible name",
"Use native progress; avoid announcing every percentage point"
],
"motion": "Manual advancement, with no automatic animation"
}Full Agent entry JSON
{
"id": "determinate-progress",
"type": "micro",
"name": {
"zh": "确定进度条",
"en": "Determinate Progress Bar"
},
"aliases": [
"Progress Bar",
"百分比进度",
"可测进度"
],
"granularity": "state",
"intents": [
"wait-for-content",
"track-progress"
],
"tags": [
"loading",
"upload",
"measured progress",
"percentage",
"progress"
],
"definition": "Represent the actual completed proportion with a progress bar when both total work and completed work are known.",
"boundary": "The percentage must correspond to completed work. This specimen uses a manually advanced simulated task, not real network speed.",
"signature": [
"An explicit task name",
"Measurable completed work and total work",
"A completed or failed end state"
],
"when": [
"The system provides real completed-work and total-work values",
"People need to know how far a task has progressed"
],
"when_not": [
"Using a timer to invent percentages when progress is unknown",
"Treating upload completion as server-side processing completion"
],
"tradeoff": "Progress is more concrete, but the total and measurement method must be reliable across task stages.",
"comparison": {
"focus": "Showing how much is complete",
"mechanism": "Actual completed work divided by total work",
"cost": "Depends on reliable progress data"
},
"sources": [
{
"id": "carbon-progress",
"title": "Carbon · Progress bar",
"url": "https://carbondesignsystem.com/components/progress-bar/usage/",
"claim": "Distinguishes determinate and indeterminate progress; the determinate form represents quantifiable progress.",
"checkedAt": "2026-09-15",
"archive": {
"lookupUrl": "https://web.archive.org/web/20260915*/https://carbondesignsystem.com/components/progress-bar/usage/",
"status": "available",
"checkedAt": "2026-09-15T16:51:23.998Z",
"jobId": "spn2-6e1e1bb11e36ab96223035765b5f0c213507b98b",
"url": "https://web.archive.org/web/20260915165300/https://carbondesignsystem.com/components/progress-bar/usage/",
"timestamp": "20260915165300"
}
}
],
"relations": [
{
"target": "skeleton",
"kind": "alternative",
"condition": "Presenting a waiting state",
"reason": "Do not choose a definite percentage without reliable completed-work data.",
"basis": "editorial"
},
{
"target": "calm-technology",
"kind": "composes_with",
"condition": "Progress requires no immediate response",
"reason": "Use a status presentation that does not interrupt the task.",
"basis": "editorial"
}
],
"rules": [
{
"when": "Real completed-work data is unavailable",
"instruction": "Do not display a fabricated determinate percentage.",
"strength": "must",
"basis": "editorial"
},
{
"when": "The task completes",
"instruction": "Show completion and explain the next step.",
"strength": "must",
"basis": "editorial"
}
],
"requirements": [
{
"fact": "measurable_progress",
"value": true,
"reason": "Determinate progress requires reliable completed-work and total-work values."
}
],
"behavior": {
"states": [
"idle",
"progress",
"success",
"error"
],
"a11y": [
"The progress indicator has an accessible name",
"Use native progress; avoid announcing every percentage point"
],
"motion": "Manual advancement, with no automatic animation"
},
"demo": "determinate-progress",
"version": "0.1.0",
"editorialStatus": "sample-reviewed",
"demoCapabilities": [
"keyboard",
"reduced_motion"
],
"implementationNote": "Capability tags describe this specimen only; verify the implementation again in a real product.",
"searchTerms": [
"加载",
"上传",
"真实进度",
"百分比",
"progress"
]
}