AI Assistant

Juliet's AI assistant transforms natural language into working code. Learn how to work with AI effectively to build better projects faster.

Written By Samir Patel

Last updated 3 months ago

How the AI Works

Powered by Advanced AI: Juliet uses state-of-the-art AI technology to understand your intent from natural language, generate clean working code, fix errors automatically, suggest improvements, and adapt to your feedback.

Context-Aware Intelligence: The AI understands your project structure (knows what files exist), current code (reads existing implementations), project type (adapts to React, Vue, vanilla JS, etc.), your conversation history (remembers previous requests), and best practices (follows coding standards).

AI Workflow Phases

Every AI interaction follows a structured workflow:

Phase 1 - Planning: AI analyzes your request, creates an implementation strategy, outlines steps to complete the task, and shows you the proposed approach. You can Accept (proceed with the plan as-is), Edit (modify the plan directly), Respond (provide feedback for AI to revise), or Ignore (discard and start over).

Phase 2 - Implementing: AI writes code based on the approved plan, creates and modifies files, follows the implementation steps, and updates todo list as tasks complete. Duration: Usually 30 seconds to 2 minutes depending on complexity.

Phase 3 - Executing: AI runs necessary commands, installs dependencies, starts development server, and prepares live preview.

Phase 4 - Completed: AI summarizes what was built, preview is live and ready, all files are saved, and you can test and iterate.

Writing Effective Prompts

Be Specific: Instead of "Make a website", say "Create a landing page with a hero section, features list, and contact form".

Include Context: Instead of "Fix the bug", say "The submit button doesn't work when the form is empty - add validation".

Describe Desired Functionality: Instead of "Build a form", say "Build a contact form with name, email, and message fields, with validation for required fields".

Reference Visual Examples: Attach mockups, compare to similar sites, or use style references.

Break Down Complex Requests: Build incrementally with smaller, focused requests that produce better results and are easier to debug.

Image Attachments

How to Attach Images: Click the attachment button, select up to 5 images (PNG, JPG/JPEG, GIF, WebP), images are automatically compressed, total compressed size max 5MB.

Best Use Cases: Design mockups, reference screenshots, error screenshots, wireframes.

AI Limitations & Expectations

What AI Does Well: Generating boilerplate code, implementing common patterns, creating UI components, writing CRUD operations, setting up project structure, styling with CSS frameworks, fixing syntax errors, and adding basic features.

What AI May Struggle With: Highly custom logic, external API integration with complex authentication, performance-critical code, and large-scale legacy code refactoring.

Iterative Development: Build better projects through conversation. Start with initial build, then refine, enhance, and polish through specific feedback.

Advanced AI Features

Multi-Step Workflows: AI can handle complex, multi-step tasks systematically.

Contextual Awareness: AI remembers your conversation and can reference previously created components.

Error Recovery: If errors occur during build, AI reads error, identifies issue, and makes corrections automatically.

Automatic Optimization: AI optimizes as it builds using efficient algorithms, implementing lazy loading, following framework best practices, structuring code for maintainability, and adding helpful comments.

Tips for Best Results

  1. Start simple, add complexity incrementally

  2. Review plans before accepting

  3. Test after each change

  4. Combine AI with manual edits

  5. Provide examples when possible

  6. Ask questions when uncertain

Troubleshooting AI Issues

If AI misunderstands request: Rephrase more clearly, break into smaller requests, provide examples.

If AI creates wrong implementation: Don't accept the plan, click "Respond", explain what's wrong, provide more specific requirements.

If results don't match mockup: Attach higher quality image, describe specific elements (colors, fonts, spacing), iterate with specific feedback.