The Plan Is The King

When we think about creating our AI coding workflow in Cursor, Claude Code, or any other AI tool, we first need to understand that planning is the most important concept.

Why planning is so important?

If you are a developer, you know that one of the most vital processes in development is designing your solution before touching any code. It is the same here. If you give the AI general instructions, it can do whatever it wants (often leading to hallucinations or wrong paths). However, if you give it specific instructions on what needs to be done at each step, you are far less likely to encounter mistakes.

How to activate plan?

In most AI coding tools, there is a command called /plan (or a specific mode). If you choose it, the AI will guide you through the planning process.

What can be inside the plan?

Before you start, you need to think about what needs to be included.

1. LLM Understanding: You need to make sure the AI understands what it needs to plan. What is the feature? What is the bug? What is the end goal (output)? There are many ways to achieve this. I use hooks (we will talk about this in a different post). I added a hook that always asks me clarifying questions to ensure it understands my prompt.
2. Spec / PRD: I will explain this in a different post, but for now, just know there is a methodology called "Spec-Driven Development." You can add this to your process if needed.
3. Wireframes / UI Design: If you are building UI components and have wireframes or designs, it is highly important to add them. This makes the process much easier.
4. Task List: A list of actions the AI needs to perform to complete the plan. I believe this is one of the most important elements.
5. Tests: You can add tests of any kind (unit, integration, E2E) to the plan. This ensures the feature works and hasn't impacted other features.

My custom plan mode?

When creating Vibki, I tested many planning modes. This is what worked for me:

• No Spec Development Process: My project and features are relatively small. I want the AI to be more technically oriented and less product-oriented.

• Saving in Project Folder: I save every new plan in a specific folder inside the project. This allows me to review it, lets the AI see it, and saves it in Git if I need to implement a new feature based on it in the future.

• Creating a Task List with Agents: I don't just create a list of what needs to be done, I also assign a specific agent to the task.

  example:

  📝Markdown
  Copy
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  ### Task 11: Update Post Type Definitions
  **Agent:** `@.claude/agents/frontend.md`
  Update TypeScript types to support new category structure.
  **Files to modify:**
  - `src/types/post.ts` or relevant type file
  **Changes:**
  ```typescript
  // Add Category type
  interface Category {
  ...
  }
  // Update Post type
  interface Post {
  ....
  }
  ...
  Show More (4 more lines)

• Adding Test Tasks: Finally, I add test tasks to ensure the feature works. I use the Playwright MCP for these tests.