Live Preview

Master the real-time preview to test and refine your app as you build.

Live Preview

The live preview is where your app comes to life. Test every feature, interact with your app, and see changes instantly as you build.

How It Works

The preview window shows your app exactly as users will experience it:

  • Real interactions - buttons work, forms submit, navigation flows
  • Instant updates - changes appear immediately after AI edits
  • Full functionality - all features work just like the final app

Interacting with Your App

  • Tap buttons to navigate between screens
  • Swipe if your app has swipe gestures
  • Use the back button to return to previous screens

Testing Forms

  • Fill out input fields with real data
  • Submit forms to see how they behave
  • Test validation with invalid data

Media Features

  • Tap camera buttons to test photo capture
  • Play audio/video if your app includes media
  • Test file uploads with sample files

Preview Controls

Refresh

  • Pull down to refresh the preview
  • Useful when the app seems stuck or unresponsive

Device Simulation

  • Portrait/landscape - rotate to test different orientations
  • Different screen sizes - see how your app adapts

Debug Mode

  • Long press the preview to see element boundaries
  • Helpful for understanding layout issues

Testing Best Practices

Comprehensive Testing

  1. Happy path - test the main user journey
  2. Edge cases - try unusual inputs or actions
  3. Error scenarios - what happens when things go wrong?
  4. Performance - does everything feel responsive?

Common Issues to Check

  • Text overflow - does long text break the layout?
  • Button accessibility - are buttons easy to tap?
  • Loading states - what happens while data loads?
  • Empty states - how does the app look with no data?

Preview Limitations

While the preview is powerful, some features work differently:

Device Features

  • Camera - shows placeholder images instead of real photos
  • GPS - uses simulated location data
  • Push notifications - won’t actually send notifications

External Services

  • API calls - may use mock data in preview
  • Payment processing - uses test mode only
  • Social sharing - shows share dialog but doesn’t actually share

Troubleshooting Preview Issues

App Not Loading

  1. Check your internet connection
  2. Pull down to refresh the preview
  3. Restart the app if needed

Features Not Working

  1. Describe the issue to the AI: “The submit button isn’t working”
  2. Be specific about what you expected vs. what happened
  3. Try the action again after the AI makes fixes

Performance Issues

  1. Close other apps to free up memory
  2. Restart Snowflame if the preview feels slow
  3. Simplify complex animations if they’re causing lag

Making the Most of Preview

Rapid Iteration

  • Test immediately after each AI change
  • Give quick feedback on what works and what doesn’t
  • Build incrementally - test small changes frequently

User Experience Focus

  • Think like your users - is the app intuitive?
  • Test with fresh eyes - would a new user understand this?
  • Consider accessibility - is text readable, are buttons large enough?

The live preview is your window into the user experience. Use it extensively to build apps that feel polished and professional.

Next: Learn about Making Edits to refine your app through conversation.