Working in Vly

Main interface components

Project workspace

The central area where you interact with your project:

• Chat interface for communicating with the AI agent
• Code preview to see generated files and structure
• Live preview of your running application
• File explorer to navigate your project structure

Navigation tabs

• Chat: Main interaction area with the AI agent
• Preview: Live preview of your application
• Assets: File management and uploads
• Database: Dev and prod database access
• Settings: Project configuration and team management

Interacting with the AI agent

Starting a conversation

Simply start typing in the chat input to begin interacting with the AI agent. The agent will:

• Analyze your request and ask clarifying questions if needed
• Generate code based on your specifications
• Provide updates on progress and decisions made

Effective communication

Be specific about your needs:

Good: "Add a user profile page with avatar upload and editable bio"
Less effective: "Add user stuff"

Reference existing components:

"Modify the navigation bar to include a search input next to the logo"

Describe desired outcomes:

"Make the checkout process feel more trustworthy by adding security badges and progress indicators"

Interrupting and redirecting

You can interrupt the AI agent at any time:

• Type while the agent is thinking to provide additional context
• Send corrections if the agent misunderstood your request
• Change direction if you want to focus on a different feature

Project management

Version control

Every significant change creates a checkpoint:

• Automatic saves as you work
• Manual checkpoints for major milestones
• Rollback capability to any previous state
• Branch creation for experimental features

Continue reading

• Interacting with Vly
• Backups and reverting changes