Skip to main content
In this guide, you’ll learn how to:
  • Upload an image to visually guide Rocket and kickstart your build.
  • Add instructions to your image.
  • Generate your app from the image and prompt.
Why start from an image?Upload a mockup, wireframe, or screenshot to guide Rocket visually. Combine the image with a description of what you want, and Rocket generates your app faster and more accurately than text alone. Perfect when you have a visual reference but haven’t created full Figma designs yet.

​
Before you begin

You’ll need:
  • You’re signed in to Rocket.
  • An image file (.png, .jpg, .jpeg) under 10 MB.

​
About starting from an image

Guide Rocket with an image. You can upload a UI mockup, wireframe, or screenshot.This is useful when you want to:
  • Add visual context to your prompt
  • Start from “Create an app like this”
Supported formats: .png, .jpg, .jpeg
Best results: Clear UI screenshots or mockups work best
1

Attach an image

Click at the lower left of the input box to upload an image. You can also drag and drop or paste an image into the chat box.
Keep the file under 10 MB to speed up processing.
Attach button near the input box for uploading an image to guide app generation.
2

Add instructions

Describe what you want built. Examples:
  • Create an app like the uploaded image
  • Use this layout to build a sign-up form
Example:
Upload a dashboard screenshot and say: Use this as a reference to build my dashboard app.
3

Generate the app

Press Enter. Rocket builds from your image and prompt.From here, continue just like starting from an idea, starting at Select your framework.You will choose a stack, select screens, and watch the build progress.

Start from an idea

Learn how to select frameworks, languages, and screens.

You did it!

You’ve uploaded an image and started building your app. Continue with framework selection and screen choices to complete your app.