Learning Path Selector

Live preview

Choose Your Path

Beginner Path

Advanced Path

Path chooser presented at course entry. Shows 2-4 role or level path cards (icon, title, description, duration). Learner clicks to select — selection is stored in progress_store via setPath() and optionally navigates to a path-specific url. Selected path can drive personalised module_map content.

Surfaces

google-apps-script-webwebgoogle-meet-stagemcp-apps ⚠android ⚠

Degraded on

Surface	Note
mcp-apps	renders fully but without persistence — progress and live data need an Apps Script deployment
android	renders fully but without persistence — progress and live data need an Apps Script deployment

Fields

Field	Type	Required
title	string. Chooser heading. Default "Choose Your Path".	optional
intro	string. Introductory text below the heading.	optional
paths	array (required). Array of {id, label, description, icon, accent, duration, url?} objects.	required

Example payload

{
  "type": "learning_path_selector",
  "paths": [
    {
      "label": "Beginner Path",
      "steps": []
    },
    {
      "label": "Advanced Path",
      "steps": []
    }
  ]
}

ARD catalog entry

{
  "identifier": "urn:air:a2uicatalog.ai:atom:learning_path_selector",
  "displayName": "Learning Path Selector",
  "type": "application/vnd.a2ui.atom+json",
  "url": "https://a2uicatalog.ai/atoms/learning_path_selector/",
  "capabilities": [
    "google-apps-script-web",
    "web",
    "google-meet-stage",
    "mcp-apps",
    "android"
  ],
  "description": "Path chooser presented at course entry. Shows 2-4 role or level path cards (icon, title, description, duration). Learner clicks to select \u2014 selection is stored in progress_store via setPath() and optionally navigates to a path-specific url. Selected path can drive personalised module_map content.",
  "representativeQueries": [
    "show a course entry path chooser \u2014 role/level cards, writes selection to progress_store, optional navigation",
    "path chooser presented at course entry. shows 2-4 role or level path cards (icon, title, description",
    "render a learning path selector"
  ]
}

← Full ARD catalog

Deploy your own Google Apps Script renderer

The renderer is an open-source Google Apps Script web app. Deploy your own instance in 4 commands — you own the URL, no dependency on the demo endpoint.

git clone https://github.com/a2uicatalog/a2ui
cd a2ui/apps-script-surface/gas-wired-renderer
clasp push && clasp deploy

Full deploy guide →