Can you make an interactive demo of a mobile app?

Yes, but not with a browser extension, which cannot see a native app. Capture device or simulator screenshots and assemble them as steps. Simulators are usually better for customer-facing work because they produce a clean, neutral status bar.

How do you fit a phone screenshot on a web page?

Use a device frame and put the space beside it to work -- captions, a feature list, or a second screen. A 9:19.5 screenshot dropped into a 16:9 layout either shrinks to nothing or creates a vertical block that pushes the rest of the page away.

How do you show gestures in a mobile app demo?

Annotate them explicitly with an arrow and a label, or use a short video for that step. Swipes, long presses and pinches leave no trace in a screenshot sequence, so the viewer sees the result without understanding what caused it.

← Back to blog

How to Demo a Mobile App (When Your Tools Assume a Browser)

August 18, 2026

Browser extensions cannot record a native mobile app, which rules out the usual capture path for most demo tools.

The workarounds are straightforward once you know them, and the harder problem is what a tall phone screenshot does to a wide web page.

Getting the screenshots

Device screenshots, taken on a real phone. Highest fidelity and the least effort for a short flow.
Simulator or emulator captures on a Mac or in Android Studio, which gives clean status bars and consistent sizing.
Screen recording, then extracting frames, if the flow involves gestures that are hard to capture as stills.
Not a photo of a phone. It looks improvised even when everything else is good.

Clean up the status bar

Real device captures show your battery at 14%, a personal notification, and the wrong carrier. It is a small thing that reliably makes a demo look unprofessional.

Simulators produce a neutral status bar automatically, which is the main reason to prefer them for anything customer-facing.

The aspect ratio problem

A phone screenshot is roughly 9:19.5. Dropped into a web page laid out for 16:9, it either becomes tiny or forces an enormous vertical block that pushes everything below it off screen.

The usual answer is a device frame with the space beside it doing work -- captions, a feature list, or a second screenshot. That turns dead horizontal space into layout instead of emptiness.

Gestures do not survive stills

Swipes, long presses and pinches are invisible in a screenshot sequence, and mobile apps are full of them. A viewer sees the result without understanding what caused it.

Annotate them explicitly -- an arrow and the word "swipe" -- or use a short video for that specific step. Assuming the gesture is obvious is the most common mobile demo mistake.

Frequently asked questions

Can you make an interactive demo of a mobile app?: Yes, but not with a browser extension, which cannot see a native app. Capture device or simulator screenshots and assemble them as steps. Simulators are usually better for customer-facing work because they produce a clean, neutral status bar.
How do you fit a phone screenshot on a web page?: Use a device frame and put the space beside it to work -- captions, a feature list, or a second screen. A 9:19.5 screenshot dropped into a 16:9 layout either shrinks to nothing or creates a vertical block that pushes the rest of the page away.
How do you show gestures in a mobile app demo?: Annotate them explicitly with an arrow and a label, or use a short video for that step. Swipes, long presses and pinches leave no trace in a screenshot sequence, so the viewer sees the result without understanding what caused it.

Keep reading

This is what Demorta does

Click through it — the same kind of demo you can record of your own product.

Try it on your own product

Record your first interactive demo free.

Five demos on the free plan, forever. No credit card, no trial countdown, no sales call. Install the Chrome extension, click through your product once, and you have a shareable link in about ten minutes.

Start free →