Working with Manus: From First Prompt to Finished Project
Learn how Manus AI guides you through the entire building process with contextual recommendations, prompt badges, and collaborative iteration.
You've crafted the perfect initial prompt using Manus Mate's templates and frameworks. Now what? This tutorial explains how Manus takes over and guides you through an iterative, collaborative building process that transforms your idea into a finished project.
Key Insight: Manus isn't a one-shot tool. It's a collaborative partner that continuously suggests improvements, asks clarifying questions, and recommends next steps as your project evolves.
1Initial Prompt & Project Setup
You submit your supercharged prompt from Manus Mate. Manus analyzes it and immediately begins:
- Creating the project structure and initial files
- Installing necessary dependencies and frameworks
- Setting up the development environment
- Generating boilerplate code based on your requirements
2Contextual Recommendations
As Manus builds, it continuously analyzes your project and suggests improvements:
These recommendations are based on best practices, common patterns, and what Manus has learned from millions of successful projects.
3Prompt Badges & Clarifying Questions
During development, you'll see prompt badges appear in the chat. These are Manus asking for confirmation or clarification:
Database Schema
"I'm about to create a users table with email, password, and profile fields. Should I also add OAuth provider fields for social login?"
Performance Optimization
"I can add image lazy loading and CDN integration to improve page load times. Proceed?"
How to respond: Simply reply "yes", "no", or provide additional context. Manus adapts based on your feedback.
4Iterative Refinement
As you review the project, you'll naturally want changes. Manus excels at iterative refinement:
- "Make the header sticky" → Manus updates CSS and tests scrolling behavior
- "Add dark mode" → Manus implements theme switching with proper color variables
- "The login form needs validation" → Manus adds client and server-side validation
Each request builds on the previous context. Manus remembers your design decisions and maintains consistency.
5Testing & Deployment
When you're ready to launch, Manus guides you through:
- Running automated tests to catch bugs
- Optimizing for production (minification, compression)
- Setting up environment variables and secrets
- Deploying to your chosen platform (Vercel, Netlify, etc.)
Prompt badges are Manus's way of signaling different types of interactions. Here's what each badge type means:
Manus wants your approval before proceeding with a significant change (e.g., database schema, API integration, major refactoring).
Best response: "Yes, proceed" or "No, let's use X instead"
Manus has identified a potential improvement (e.g., performance optimization, security enhancement, UX improvement).
Best response: "Sounds good" or "Not needed right now"
Manus is proposing a new feature or capability based on your project's context (e.g., "Add user analytics dashboard?").
Best response: "Yes, add it" or "Maybe later"
Manus has finished a requested task and is showing you the results.
Best response: "Looks good" or "Can you adjust X?"
✅ Do This
- Respond to prompt badges promptly - Manus is waiting for your input to continue
- Be specific with feedback - "Make it blue" → "Use #3B82F6 for the primary button color"
- Ask questions - "Why did you choose this approach?" helps you learn
- Test frequently - Review the preview after each major change
- Save checkpoints - Use Manus's checkpoint feature before risky changes
❌ Avoid This
- Ignoring recommendations - Manus's suggestions are based on best practices
- Making too many requests at once - Break complex changes into steps
- Expecting perfection immediately - Iteration is part of the process
- Forgetting to specify constraints - Tell Manus about budget, timeline, or tech stack limits
You (Initial Prompt from Manus Mate):
"Build a task manager web app with user authentication, task categories, due dates, and priority levels. Use React, TypeScript, and Tailwind CSS. Include dark mode support."
Manus:
"I'll create a task manager with the following structure: React 19 + TypeScript + Tailwind 4, Supabase for auth and database, shadcn/ui components, and dark mode toggle."
Confirm"Should I add task sharing and collaboration features, or keep it single-user for now?"
You:
"Single-user for now, but design the database schema to support collaboration later."
Manus:
"Perfect. I've created the project structure and set up authentication. Testing the login flow now..."
Suggestion"I can add email verification and password reset flows using Supabase Auth. This is recommended for production apps."
You:
"Yes, add those. Also, can you make the task list sortable by drag-and-drop?"
Manus:
"Added dnd-kit for drag-and-drop sorting. You can now reorder tasks within categories."
CompleteThis back-and-forth continues until your app is complete. Manus handles the technical implementation while you focus on product decisions.
Now that you understand how Manus guides you through the building process, you're ready to start your first project:
- Use Manus Mate's prompt templates to craft your initial prompt
- Submit it to Manus AI and watch the magic happen
- Respond to prompt badges and recommendations as they appear
- Iterate until you're satisfied with the result
- Deploy your finished project to the web
Pro Tip: Keep this tutorial open in a separate tab while building your first project. Reference the prompt badge guide when you're unsure how to respond.