Advanced Communication and Planning

When working with Claude Code in your development environment, you’ll often need to make changes to existing projects. This lesson covers practical techniques for implementing changes effectively. This includes clear visual communication with screenshots and leveraging Claude’s advanced reasoning capabilities to ensure your instructions are understood and executed correctly.

How do we use screenshots in Claude Code?

Communicating visually with Claude can dramatically improve clarity when describing UI changes, layout tweaks, or error states. One of the most effective ways to point Claude to a specific part of your interface is by providing a screenshot. Instead of relying on lengthy text descriptions, a screenshot lets Claude see exactly what you’re referring to, which reduces ambiguity.

You can paste a screenshot directly into the Claude chat. Use “Ctrl+V” (even on macOS) or drag it to the interface to insert the image. Once the screenshot is attached to your conversation, you can ask Claude to analyze it or make changes related to that visual. For example: “See the highlighted button in the screenshot? Please adjust its color and alignment according to our design.”

Screenshots provide Claude with a concrete reference. Claude can interpret UI elements or design mockups from images and then modify your code to match the visual reference. For instance, you could paste a design mockup image and ask Claude to update the front-end code until the application output matches the mockup. This represents an iterative process where Claude generates code, you review the result (possibly with another screenshot), and refine further. This visual feedback loop helps ensure the changes Claude makes align with the intended design.

Let’s take a look at a small example. We have a tiny demo chat app running where the “Reset Chat” button is neutral/unstyled. Moreover, the application isn’t really a proper AI chatbot; it just returns some placeholder messages we have added beforehand.

We can take a screenshot showing the gray button in context and paste it with “Ctrl+V,” or drag it into your Claude Code chat. Give a concrete request tied to the screenshot, for example: “Change the color of the buttons shown in the screenshot.”

Note: Due to platform limitations that restrict copy-pasting files, we cannot run a live demo here. The following slides illustrate the approach.

When we paste the image into Claude Code, we see a reference added, as shown above with [Image #1]. Now, if we run the updated application, we can see that the required changes have been made, and Claude is actually able to identify what we were talking about.

This simple loop—screenshot → concrete request → patch → follow-up screenshot—turns fuzzy UI feedback into precise, reviewable diffs. For front-end work, it reduces rounds of guesswork and lets you ship pixel-accurate changes faster.

What are the different modes available in Claude Code?

Claude Code exposes two complementary “control levers” you can use when a task gets tricky: planning mode and thinking mode. Planning mode prioritizes breadth as it has Claude explore more of your repository, draft a step-by-step implementation plan, and pause for your approval before touching code. Thinking mode prioritizes depth: it gives Claude more reasoning time to analyze a hard problem, compare approaches, or trace a subtle bug before answering.

You invoke planning mode from the editor with a keystroke by pressing “Shift+Tab” twice. You invoke thinking modes with prompt cues (think, think more, think a lot, think longer, ultrathink). Both features consume extra tokens, so treat them like power tools. Use them when the stakes or complexity justify it, and not just by default.

What exactly is the Planning mode?

For more complex tasks that require broad exploration or multiple coordinated changes, planning mode is an invaluable feature. Planning mode helps Claude think before it acts by performing a thorough analysis, and formulating a game plan without immediately writing or altering any code. When activated, Claude explicitly enters a planning phase and does not execute any changes until you give approval.

In planning mode, Claude will perform the functions mentioned below.

• Explore and gather context: It scans relevant files, searches directories, and reads documentation or web resources in a read-only way to fully understand the feature or codebase. This is especially helpful for large projects spanning multiple modules.

• Create a detailed implementation plan: Instead of coding immediately, Claude drafts a step-by-step plan describing which files to modify, what functions or classes to add or update, and how everything fits together.

• Present the plan for your review: The plan is shown in a clear, structured format (often an ordered list) before any edits, so you can easily follow and verify the approach.

• Wait for approval before proceeding: Claude will not modify files or run commands until you explicitly confirm. This safeguard ensures changes only happen once you approve, preventing mistakes and catching omissions early.

In summary, planning mode acts as a safety net for complex changes. It separates research and analysis from execution, which leads to a more deliberate development process. You gain Claude’s ability to understand the bigger picture while maintaining control over your codebase. This mode is ideal for tasks such as implementing a new feature that touches many parts of the system, major refactors, or any change where you want to double-check the approach before any code is written. By reviewing Claude’s plan, you can redirect or refine the solution early, which saves time and prevents incorrect implementations. Once you are satisfied with the plan, approve it, and Claude switches back to execution mode to apply the changes.

Try the planning mode for yourself in the terminal below. You can ask Claude Code to “Plan a dry-run migration from Astro to Eleventy. Produce a step-by-step plan only with no edits yet. Wait for my approval.”

You will be able to see a much more detailed plan than we have previously seen.

What are the available Thinking modes in Claude Code?

Claude offers different levels of reasoning intensity through thinking modes. These are not toggles in the interface; they are triggered by certain keywords in your prompt (for example, telling Claude to “think”). By using these prompts, you can give Claude more time and “brainpower” to tackle hard problems. In practical terms, enabling thinking mode allocates additional computational resources, allowing Claude to reason through complex questions or tasks with greater depth and deliberation.

The thinking keywords, from lightest to deepest, are mentioned below.

• Think: Adds a bit more analysis and context than a normal prompt.

• Think more: Goes deeper, examining alternatives and details for moderately complex issues.

• Think a lot: Produces a thorough, multi-angle analysis for complex problems.

• Think longer: Extends reasoning time significantly, suited for tricky or open-ended challenges.

• Ultrathink: Maximum depth and token use for the hardest problems like complex algorithms, or design trade-offs.

Each progressively intense keyword can grant Claude more tokens and time to reason. In practice, you might see Claude output a “thinking…” stage where it internally works through the problem (often shown in italic gray text in some interfaces) before producing the final answer. The result is usually a more detailed, well-reasoned response, because Claude has considered more possibilities or explored the code and context more deeply.

You can go ahead and use the keywords mentioned above. It’s important to remember that you will always see “thinking” before Claude Code goes ahead and starts working on the task at hand. This means that the reasoning capabilities have been activated according to the keyword you used in the prompt.

When to use Planning Mode vs. Thinking Modes

Both planning mode and thinking modes are powerful features for handling complexity, but they serve different purposes. Understanding when to use each, or both, will help you get the most out of Claude while avoiding unnecessary token usage.

Planning mode is best suited for specific tasks mentioned below.

• Broad, multi-file, or architecture-wide changes: If your task requires a comprehensive understanding of the codebase or multiple components, use planning mode. For example, adding a major feature or refactoring a system module often affects many files and requires coordination. In planning mode, Claude can safely explore relevant files and propose a high-level plan that covers all the moving parts.

• Multistep implementations: Tasks that naturally break down into multiple stages, such as updating the database schema, followed by back-end logic and front-end UI, benefit from planning mode. Claude will outline each step in sequence, ensure nothing is overlooked, and confirm that the steps make sense together.

• Ensuring safety and oversight: When you want to review Claude’s approach before any code changes, planning mode provides a safety net. As it does not execute changes until approval, you maintain control. This is ideal when the consequences of a mistake are high, such as touching critical code, or when you want to verify Claude’s understanding for accuracy.

Thinking modes are best suited for specific tasks mentioned below.

• Complex logic or algorithmic problems: If the challenge is figuring out how to do something, rather than what to change in each file, thinking modes shine. For instance, debugging a difficult issue or solving a complicated algorithm can require deep reasoning about a specific piece of code or logic.

• Deep analysis and brainstorming: When you need Claude to evaluate approaches, weigh pros and cons, or anticipate pitfalls, an extended thinking prompt is valuable. Claude uses the extra tokens to explore possibilities in greater detail.

• Debugging and troubleshooting: Thorny bugs often require tracing through logic, considering state, and recalling related context. Asking Claude to “think longer about why this bug is happening” gives it more leeway to simulate execution, and hypothesize potential causes or solutions.

Here is a table to provide you with a quick comparison between planning and thinking mode:

You can also combine both features for challenging tasks. For example, you might enter planning mode for a large feature to map out the pieces, then, within that plan, ask Claude to “think more” about a particularly complex step. Keep in mind that both planning mode and intensive thinking consume additional tokens. Use them when they add value, and avoid overusing them on unimportant or minor tasks.

By thoughtfully choosing between (and combining) planning mode and thinking mode, you can make collaboration with Claude significantly more effective. Simple changes or straightforward questions likely do not need a full plan or ultra-deep thinking. For big refactors, feature rollouts, or perplexing bugs, these advanced capabilities help Claude deliver safer, smarter, and more accurate results.