단계 템플릿

The subtitle renders under the activity name on the Lock Screen card and in the expanded Dynamic Island; the Apple Watch card shows it in place of the name. Builds before 1.9.2 show it only on the Apple Watch.

Set step_weights to render the steps as a single row of proportional segments instead of the equal-width matrix. Each weight is that step's relative share of the bar width, so [1, 2, 1] gives a narrow-wide-narrow layout. This suits a linear process whose stages take different amounts of time (a wash cycle, a multi-part checkout) more than a CI matrix.

In this layout the shared progress field fills the current segment fractionally: completed steps are filled solid, the current_step segment fills to progress (0.0-1.0), and later steps stay empty. Pair it with step_colors to give each stage its own tint.

{
  "state": "ongoing",
  "content": {
    "template": "steps",
    "state": "Drying",
    "icon": "dishwasher",
    "subtitle": "Eco cycle",
    "current_step": 3,
    "total_steps": 3,
    "progress": 0.5,
    "step_labels": ["Wash", "Rinse", "Dry"],
    "step_weights": [1, 2, 1],
    "step_colors": ["blue", "teal", "orange"],
    "accent_color": "teal"
  }
}

Weighted matrix

Send step_weights alongside step_rows to keep the parallel-jobs matrix but size each column by how long its step runs. Below, Build and Test dominate the width, Test fans out to three jobs, and each column is tinted by step_colors.

{
  "state": "ongoing",
  "content": {
    "template": "steps",
    "state": "Test",
    "icon": "arrow.triangle.branch",
    "subtitle": "my-app / CI/CD",
    "current_step": 3,
    "total_steps": 6,
    "progress": 0.5,
    "step_labels": ["Lint", "Build", "Test", "Scan", "Publish", "Deploy"],
    "step_rows": [1, 1, 3, 1, 1, 1],
    "step_weights": [15, 180, 90, 45, 20, 60],
    "step_colors": ["purple", "blue", "yellow", "orange", "green", "green"],
    "accent_color": "green"
  }
}

If you know how long the current step takes -- a 90-minute wash cycle, a 4-minute test suite -- set live_progress: true and tell the server when that step ends: iOS fills the current step and counts an ETA down natively between your pushes. The shared mechanics -- how the animation anchors, how the anchors carry forward across updates, and how to clear them -- are on the generic template. What is specific to steps:

• The ETA describes the current step, not the whole run. Steps before it stay filled solid; steps after it stay empty.
• While it is counting, the ETA takes the header and the current_step/total_steps counter moves down beside the step name. Leave live_progress off and the counter keeps the header.
• It works in every layout: the matrix column, the weighted column, and the segmented bar. In a fan-out column all the parallel jobs fill together, since they share one step deadline.
• If a step overruns its estimate without an update, its bar stops at full rather than racing ahead -- a stuck step never advances the counter on its own.
• Send duration only when current_step changes -- that is what re-anchors the animation to the new step. Restamping the window on every update makes each one a high-priority push that skips update coalescing, and snaps the bar back to empty.

{
  "state": "ongoing",
  "content": {
    "template": "steps",
    "state": "Heating water",
    "icon": "dishwasher",
    "subtitle": "Eco 50",
    "current_step": 2,
    "total_steps": 4,
    "step_labels": ["Pre-wash", "Wash", "Rinse", "Dry"],
    "step_weights": [1, 6, 1, 2],
    "live_progress": true,
    "duration": "90m",
    "accent_color": "teal"
  }
}

Artwork

Steps has the same image slot as the generic template: send image_url and the leading icon becomes artwork. On a step sequence that usually means the thing being processed rather than the tool doing the processing -- the film poster for a download that is grabbing, importing and renaming, the album sleeve for an import pipeline. The full rules -- reachability, the 2 MB limit, ThumbHash, shapes -- live on the generic page.

{
  "state": "ongoing",
  "content": {
    "template": "steps",
    "state": "Importing",
    "subtitle": "Radarr",
    "current_step": 3,
    "total_steps": 4,
    "step_labels": ["Grab", "Download", "Import", "Rename"],
    "progress": 0.6,
    "image_url": "https://image.example.com/posters/arrival.jpg",
    "image_shape": "poster",
    "image_thumbhash": "GYpSpSh4eHt4eHh4eHh4eHh4iIeH",
    "accent_color": "purple"
  }
}

Radarr, Sonarr, Jellyfin and Overseerr do this automatically when you drive them through the Relay.