The official workflow
Explore, Plan, Code, Commit: The Claude Code Workflow
Anthropic's four-step loop for getting real work out of Claude Code, illustrated from the official walkthrough with links to the exact video second.

An illustrated walkthrough of 12 steps - about 4 minutes to read. Every step links back to the exact moment in the source video.
TL;DR
Don't paste a task and hope. Enter plan mode (Shift+Tab), let Claude explore the codebase and propose a plan, review and revise that plan, then approve and let it code with accept-edits on. Keep the tests honest, save recurring fixes to CLAUDE.md, and finish by asking Claude for a commit in your style. Exploration feeds the plan; the plan is the success criteria; the commit is where you stay in charge.
About the source video
This page illustrates the workflow demonstrated in Anthropic's own Claude Code video, hosted by Lewis Menelaws. Each step links back to the exact second.
Screenshots are frames from the video, credited to Anthropic; the write-up is our own. Steps verified against the video in September 2026.
Explore: give Claude the context
Read-only research first - no files get touched.
- 1
Two phases before any code
Anthropic's core advice: explore, then plan, then code, then commit. Jumping straight to 'write this feature' means more course-correcting later. Plan mode is the fastest way to run the first two steps because Claude cannot edit files in it - it only reads and researches.

The loop this page walks through, straight from the source.Watch at 0:20 - 2
Start every session with context
The welcome banner nags you to run /init, and that is the point: a CLAUDE.md generated at the start of a project teaches every future session your stack and commands. Exploration gets much cheaper when the basics are already written down.

/init at session start; CLAUDE.md carries the context forward.Watch at 1:04 - 3
Work from terminal and browser
The remote-control banner means this CLI session is linked to claude.ai/code - you can follow the same session in the browser. Handy when you want the web UI's readability while the agent works in your repo.

One session, two surfaces: the CLI and claude.ai/code.Watch at 0:32 - 4
Describe the goal, not the implementation
The demo prompt: 'My app needs a dark mode... Can you create a toggle switch based on my existing light theme? I need you to find a good contrast color that works based on my existing light theme.' Goal plus constraints - and plan mode finds where things live before changing them.

A dark-mode request, phrased as a goal with a constraint.Watch at 0:24 - 5
Watch Claude explore your codebase
In plan mode Claude reads files, greps, and can even search the web. The trace shows the Explore agent reading route files and running find commands - sixteen tool uses before it writes a word about your task. That research is what the plan is built on.

Reads and finds - sixteen tool uses, zero edits.Watch at 2:40 - 6
Parallel explore agents
For bigger asks Claude splits the research: here two Explore agents map project structure and the existing color palette at once, each reporting token counts as it goes. You watch the context being gathered instead of hoping it happened.

Two explore agents, one dark-mode feature.Watch at 2:50
Plan: agree on success before code
The plan is where course-corrections are cheapest.
- 7
Pick a real task and scope it
The worked example: 'I need to add WebP conversion to our image upload pipeline. Figure out where in the pipeline it should happen, whether we need new dependencies, and how to approach it.' Three explicit questions - that is what makes the resulting plan reviewable.

One prompt, three explicit questions for Claude to answer.Watch at 0:40 - 8
Read the plan as changes-by-file
A good plan reads like a changelog: add sharp to package.json, switch the upload handler from disk to memory storage, convert and write in the handler. If a line surprises you, that is exactly what the review step is for.

The plan, organized as per-file changes you can veto.Watch at 0:56 - 9
Approve with the verification checklist in view
Before code exists, Claude lists how it will verify the work - installs succeed, avatars convert, corrupt files get rejected with a 422. Then you choose: clear context and auto-accept, just auto-accept, approve each edit, or type feedback. This is the best place to course-correct.

Verification steps first, then four ways to proceed.Watch at 0:52 - 10
Use the interview to steer the plan
Claude can interview you about the plan: looks good and proceed, update the plan, different dark colors, extract a shared component. Answering '2' with a sentence gets you a revised plan instead of a revised codebase later.

Steer now - every option here is cheaper than a rewrite.Watch at 2:54
Code and commit: stay in the loop
Auto-accept the edits, verify in the browser, then commit in your style.
- 11
Let Claude test its own UI work
The video's tip: give Claude tools to verify itself. With the Claude in Chrome extension it can drive a browser tab, open the built app, and check the UI before declaring the task finished - this sign-in screen is exactly that loop running.

The agent checked this screen in a real browser tab.Watch at 2:58 - 12
Finish with a commit message in your style
Once you have tested the result yourself, ask 'Can you create a commit for this?' - and Claude writes the commit. The accept-edits footer reminds you the mode is still on; Shift+Tab cycles it back off when you return to careful mode.

One prompt turns the finished work into a commit.Watch at 0:12