Making Edits

Learn how to refine your app through natural conversation with AI.

Making Edits

Snowflame’s AI understands natural language, making it easy to refine your app through simple conversation. No code required.

How Editing Works

Simply describe what you want to change:

  1. Type your request in the chat
  2. AI processes your request and updates the code
  3. Preview updates instantly with your changes
  4. Test the change in the live preview

Types of Edits

Visual Changes

  • Colors: “Make the background blue” or “Change the button color to green”
  • Layout: “Move the search bar to the top” or “Make the text larger”
  • Styling: “Add rounded corners to the cards” or “Make the font bold”

Functional Changes

  • Add features: “Add a delete button to each item”
  • Modify behavior: “Make the form validate email addresses”
  • Change flow: “Go to the home screen after saving”

Content Changes

  • Text updates: “Change the title to ‘My Recipe Book’”
  • Add sections: “Add a settings page with dark mode toggle”
  • Remove elements: “Remove the share button from the header”

Writing Effective Requests

Be Specific

❌ Vague: “Make it look better” ✅ Specific: “Increase the font size and add more spacing between items”

❌ Unclear: “Fix the button” ✅ Clear: “Make the save button green and move it to the bottom right”

Reference Elements Clearly

  • Use descriptive names: “the red delete button” instead of “that button”
  • Mention location: “the search bar at the top” or “the footer menu”
  • Be contextual: “on the settings page” or “in the recipe list”

Describe the Goal

  • User experience: “Make it easier to add new items”
  • Visual outcome: “Make the app feel more modern”
  • Functional goal: “Help users find recipes faster”

Advanced Editing Techniques

Iterative Refinement

  1. Start broad: “Make the design more modern”
  2. Get specific: “The cards need more spacing”
  3. Fine-tune: “Increase the spacing to 16 pixels”

Conditional Logic

  • “Only show the delete button when editing mode is on”
  • “Hide the premium features for free users”
  • “Show different content based on user preferences”

Multi-step Changes

  • “Add a new screen for user profiles with name, email, and photo fields”
  • “Create a onboarding flow with 3 steps: welcome, permissions, and tutorial”

Common Edit Patterns

Adding New Features

"Add a search feature that filters the list as I type"
"Include a favorites system where users can star items"
"Add photo upload capability to the form"

Improving User Experience

"Add loading indicators when data is being fetched"
"Include confirmation dialogs before deleting items"
"Make the app work offline with local storage"

Visual Polish

"Add subtle animations when items are added or removed"
"Use a consistent color scheme throughout the app"
"Make the design responsive for different screen sizes"

Handling Complex Changes

Breaking Down Big Requests

Instead of: “Completely redesign the app”

Try:

  1. “Update the color scheme to use blue and white”
  2. “Reorganize the navigation to use a bottom tab bar”
  3. “Redesign the item cards with larger images”

Referencing Examples

  • “Make it look like Instagram’s story interface”
  • “Use a card layout similar to Google Material Design”
  • “Add a swipe gesture like in dating apps”

Troubleshooting Edits

When Changes Don’t Work

  1. Rephrase your request with different words
  2. Be more specific about what you want
  3. Break it into smaller steps
  4. Reference the current state: “The blue button that says ‘Save‘“

Undoing Changes

  • “Undo the last change”
  • “Go back to how the button looked before”
  • “Remove the feature I just added”

Clarifying Intent

The AI might ask follow-up questions:

  • “Which button do you mean?”
  • “What color would you prefer?”
  • “Should this apply to all screens or just this one?”

Best Practices

Test After Each Change

  • Use the preview to verify the change worked
  • Test the functionality to ensure nothing broke
  • Check different screens if the change affects multiple areas

Keep Context

  • Reference previous changes: “Make the new search bar match the header style”
  • Build incrementally: Make related changes together
  • Stay focused: Complete one feature before moving to the next

Communicate Clearly

  • Use simple language - avoid technical jargon
  • Be patient - complex changes may take a moment
  • Provide feedback - let the AI know if something isn’t quite right

The editing process is collaborative. The AI learns from your feedback and gets better at understanding your preferences as you work together.

Next: Learn about Data & Images to add content to your app.