aiux
ToolToolCoursesCoursesNewsNewsSavedSaved
Menu

Explore

  • Map
  • Patterns
  • Skills
  • Open source↗

Courses

  • ›Claude Code
    Overview

    Setup

    • Sign In to Claude Code
    • Install Node.js
    • Install Claude Code

    Figma ↔ Code

    • Set Up Figma MCP
    • Turn Figma Frames into Code
    • Using Figma Links in Prompts
    • Figma to Code Best Practices
    • Bring Code Back to Figma

    Prototype

    • Start Your First Claude Code Session
    • Create Your Project Folder
    • Generate Your First Prototype
    • See Your Prototype Live
    • Get Back to Editing

    GitHub

    • Create a GitHub Account
    • Create a Repository on GitHub
    • Connect Your Local Project to GitHub
    • Save Your Changes Going Forward
    • Share Your Work (Let Claude Code Handle Git)

    Best Practices

    • How to Describe Your Design to Claude Code
    • Testing Your Prototype
    • Iterating Based on Feedback
    • Handing Off Work to Developers
    • Troubleshooting Common Issues
  • ›Cursor
    Overview

    Setup

    • Download and Install Cursor
    • Navigate the Interface
    • Edit Code with AI Assistance

    Prototype

    • Use Tab Completions
    • Chat with AI (Cmd+L)
    • Make Inline Edits (Cmd+K)
    • Build with Composer

    Design-to-code

    • Convert Designs to Components
    • Build Frontend with React and Tailwind

    Best Practices

    • Customize Your Workspace
    • Master Advanced Features
    • Best Practices and Team Workflows
  • ›GitHub Copilot
    Overview

    Setup

    • Install GitHub Copilot
    • Your First Code Suggestion
    • Workspace Setup for Designers

    Core Features

    • Autocomplete & Code Completions
    • Chat for Design Questions
    • Inline Code Explanations

    Prototyping Workflows

    • From Design to Interactive Prototype
    • Building Responsive & Interactive Layouts

    Developer Collaboration

    • Reviewing Developer Code
    • Communicating with Your Dev Team
  • ›GitHub
    Overview

    Setup

    • Create Your GitHub Account
    • Install Git on Your Computer
    • Understanding Git Basics

    Core Features

    • Clone Your First Repository
    • Making and Committing Changes
    • Working with Branches

    Developer Collaboration

    • Creating Pull Requests
    • Reviewing and Merging PRs

    Best Practices

    • Handling Merge Conflicts
    • GitHub Workflow for Design Teams
  • ›Build a Conversational UI
    Overview

    Foundations

    • What Is Conversational UI? (And What It Isn't)
    • Anatomy of a Chat Interface

    Building

    • Building Message Bubbles in React
    • Typing Indicators & Streaming Responses
    • Suggested Prompts & Conversation Starters

    Advanced Patterns

    • Managing Conversation Context
    • Error Handling & Fallback Design
    • Voice Interface Design Patterns

    Ship It

    • Accessibility in Conversational UI
    • Putting It All Together - Architecture Checklist
    • Agentic Conversational UI - When AI Takes Actions
  • ›Claude Design
    Overview

    Setup

    • What Claude Design Is (and Isn't)
    • Your First Prompt: The Four-Part Framework
    • Importing Assets: Screenshots, Docs, and Codebases

    Iteration

    • Iterating via Conversation
    • Inline Comments and Direct Edits
    • Tweaks: Explore Variations Without Chat

    Design-system

    • Extracting Your Design System
    • Publishing and Applying Your Design System
    • Team & Enterprise Setup

    Workflows

    • Prompt to Interactive Prototype
    • Prompt to Pitch Deck
    • Handoff to Claude Code for Implementation
  • ›Using AI UX Skills
    Overview

    Foundations

    • What Is Claude Code?
    • What a Claude Code Skill Is
    • Patterns Teach You, Skills Teach Your Agent

    Setup

    • Install a Skill Pack

    Core Features

    • How Triggering Works

    Best Practices

    • Working With Skills Day to Day
  • ›Claude Docs
    Overview

    Foundations

    • What a Doc Is, and Why It Is Not a Chat

    Working

    • The Anchored Comment: Brief It by Pointing
    • Watching It Work
    • Tabs, Sharing, and the Two Names Problem

    Judgement

    • When a Doc Is the Wrong Ask
  • ›Claude Slides
    Overview

    Foundations

    • The Question Slides Asks First

    Setup

    • The Empty Picker, and the Legacy Trap

    Working

    • Skipping the System, and What You Get
    • Editing by Comment, on a Canvas

    Handoff

    • The Export, Inspected

What’s new

  • Muse hits 5M and Claude Design sync
  • OpenAI Dots and Zombie UI
  • Shopify Agent Checkouts and Humane Design
  • All →

Topics

  • Adaptive & Intelligent Systems
  • Human-AI Collaboration
  • Trustworthy & Reliable AI
  • Natural Interaction
  • Performance & Efficiency
  • Privacy & Control
  • Accessibility & Inclusion
  • Safety & Harm Prevention
Previous: Intent PreviewNext: Action Audit Trail
Trustworthy & Reliable AIAgentic

Plan Summary

Provide a structured breakdown of the agent's reasoning and approach - showing goal interpretation, strategy, subtask checklist, and assumptions - so users can evaluate the plan before execution begins.

What is Plan Summary?

While Intent Preview shows WHAT the agent will do, Plan Summary explains WHY and HOW. When an agent breaks a complex goal into subtasks, users need to understand the agent's reasoning - not just its intended actions. This is especially critical for knowledge work where there are multiple valid approaches. 'Research competitor pricing' could mean scraping websites, reading analyst reports, or checking public databases - the strategy matters as much as the outcome. The Plan Summary provides goal interpretation, strategy explanation, a subtask checklist that updates in real-time, explicit assumptions the user can correct, and resource and time estimates. This pattern extends explainability from retrospective ('here's why I gave this answer') to prospective ('here's why I'm taking this approach').

Problem

While Intent Preview shows what the agent will do, users also need to understand why and how. When an agent breaks a complex goal into subtasks, users can't evaluate whether the approach is sound without seeing the reasoning and assumptions behind the plan.

Solution

Provide a structured plan summary with goal interpretation, strategy explanation, a subtask checklist with real-time progress, explicit editable assumptions, and resource/time estimates. Keep it concise by default with full reasoning available on expansion.

Real-World Plan Summary Examples

Implementation

Practice in Courses

Claude Code

Claude Code Course for Designers

23 lessons, free course

When to use Plan Summary, and when it backfires

Use it when

  • The goal is genuinely ambiguous and several valid approaches exist, so the strategy matters as much as the result.
  • The run is long or expensive enough that discovering a wrong interpretation at the end is costly.
  • The user holds context the agent cannot have, and a stated assumption is the only place that context can enter.

Don't, or minimize, when

  • The task has one obvious approach. Narrating it is ceremony, and users learn to approve without reading.
  • The run is cheap and reversible. Let it run and show the result. Reviewing a plan costs more than redoing the work.
  • You cannot let the user change anything. A plan presented for approval with no edit path is a loading screen with extra reading.

The trap

The plan with no edit button: a well-structured summary whose only controls are Approve and Cancel. Cancel means starting over, so everyone approves. The assumptions were the valuable part and the interface gave the user no way to touch them, so the plan reads as accountability while functioning as a delay.

Take it into your own product

  1. 1

    Lead with how the goal was read, not what will be done.

    'Research competitor pricing' can mean three different jobs. One sentence naming which one the agent chose catches more bad runs than a twelve-item checklist, because that is the step where the misunderstanding actually happens.

  2. 2

    If the user cannot edit it, it is not a plan.

    Approve and Cancel is a two-button loading screen. Cancel means losing the work and starting again, so people approve. Make each assumption a field they can change in place, and regenerate the affected steps when they do.

  3. 3

    Assumptions are the payload. Everything else is packaging.

    Users cannot judge whether a strategy is optimal, but they can instantly spot 'assumed you meant the UK market' being wrong. Put the assumptions where the eye lands first, not in an expandable section under the checklist.

  4. 4

    Say which step is the last free exit.

    Mark the subtasks that cannot be undone and name the point after which stopping costs something. A plan that reads as uniformly safe gets approved with the same attention whether step four sends email to customers or writes to a scratch file.

  5. 5

    Keep the plan alive while it runs.

    Replacing it with a progress bar throws away the thing that made it useful. When a step disproves an assumption, show that against the plan, so the user sees the moment the approach stopped matching reality rather than reading it in the summary afterwards.

Save as a Claude skill

Save Plan Summary as a Claude skill

Saved skills collect on your dashboard, ready to download one at a time or as a pack for your repo. Once a skill is in place, Claude Code applies it whenever you work on a surface this pattern covers.

30-second check

Check if your product already has this pattern

Upload a screenshot. We'll tell you which of the 38 patterns your AI interface uses and where the gaps are.

Audit My Design

Take all 38 patterns as Claude skills

Get the whole library as skill files, so Claude applies these patterns while it builds instead of after you catch them in review.

  • One skill file per pattern, all 38
  • Drop them in .claude/skills and Claude applies them as it builds
  • Daily AI UX newsletter (unsubscribe anytime)

More in Trustworthy & Reliable AI

Explainable AI (XAI)

Make AI decisions understandable via visualizations, explanations, and transparent reasoning.

Responsible AI Design

Prioritize fairness, transparency, and accountability throughout AI lifecycle.

Error Recovery & Graceful Degradation

Fail gracefully with clear recovery paths when things go wrong.

Want More Patterns Like This?

Daily AI UX news and new pattern breakdowns, straight to your inbox. Unsubscribe anytime.

Previous PatternIntent PreviewNext PatternAction Audit Trail

aiux

AI UX patterns from shipped products. Demos, code, and real examples.

Have an idea? Share feedback

Get daily AI UX news

Services

  • Audit my product
  • Request an audit

Resources

  • All Patterns
  • Browse Categories
  • Contribute
  • Claude Code Skills
  • AI Interaction Toolkit
  • Agent Readability Audit
  • Newsletter
  • Documentation
  • Figma Make Prompts
  • Designer Guides
  • Events
  • Design System
  • All Resources →

Company

  • About Us
  • Privacy Policy
  • Terms of Service
  • Contact

Links

  • Portfolio
  • GitHub
  • LinkedIn
  • More Resources

Copyright © 2026 All Rights Reserved.

Used by:
ChatGPT
ChatGPT
GitHub
GitHub
Google
Google

Research Task Plan Summary

An interactive plan summary showing goal interpretation, strategy, a progress checklist, and editable assumptions for a research task.

Toggle to code view to see the implementation details.