Capture a mobile app or desktop app
Turn your native mobile app or desktop app into an interactive Walnut demo by recording it from the browser — no Chrome extension needed.
Capture a mobile app or desktop app
Overview
Your product isn't only a web app. With Walnut you can now demo your native mobile app (iOS or Android) and your desktop app too — not just what runs in a browser tab.
You record the app straight from Walnut in your browser. Walnut finds the key moments in the recording, turns each one into a screen, places a hotspot where you clicked or tapped, and links the screens so the demo clicks through end to end. Mobile screens are placed in a matching iPhone or Android device frame.
No Chrome extension is needed.
Snapshot 📸
- Works for: native iOS and Android apps (mirrored to your computer), desktop apps on Mac or Windows, and anything else you can show on screen
- Where to start: New template → Record my phone or Record my screen, or in the editor, Add → Capture with screenshot and video → App recording
- Limits: recordings up to 60 minutes
Capture a Mobile App
1. Mirror your phone to your computer
Walnut records your phone through your computer, so first show the phone's screen on your desktop:
- iPhone: use iPhone Mirroring on your Mac.
- Android: use the screen-mirroring tool you already use to show your phone on your computer.
Open the app on your phone and get it to the first screen of the flow you want to show.
2. Start a phone recording
- For a new demo: on the New template page, choose Record my phone.
- For an existing demo: open it in the editor, choose Add → Capture with screenshot and video, then App recording → Record my phone.
When your browser asks what to share, pick the phone-mirroring window.
3. Walk through the flow
Use the app the way you want a viewer to experience it. Tap, scroll and move through the flow at a normal pace, pausing briefly after each tap so the new screen settles.
Walnut watches for changes as you go, including small ones like an opened dropdown, a toggled switch or a filled field. Stop the recording when you've finished the flow.
4. Review the key moments
Walnut analyzes the recording and lists the key moments it found, each with a thumbnail and a suggested name. For each moment you can:
- Keep it or skip it. Small changes are marked Small change, so they're easy to remove if you don't need them.
- Keep or clear the hotspot Walnut placed where you tapped.
- Rename the screen.
- Turn a span into a clip screen, so that part of the recording plays as video inside the demo.
5. Check the device frame
Walnut picks the device frame that matches what you recorded — iPhone, iPhone SE or Android. For an iPhone recording it defaults to the (no notch) version, so the screen doesn't show the phone's notch twice. You can change the frame or choose No frame.
6. Create the demo
Click Create (or Create demo for a new demo). Screens appear in the editor as soon as they're ready, and you can start editing while the rest finish.
Capture a Desktop App
1. Open the app
Open your desktop app and get it to the first screen of the flow. Close anything you don't want on camera.
2. Start a screen recording
- For a new demo: on the New template page, choose Record my screen.
- For an existing demo: open it in the editor, choose Add → Capture with screenshot and video, then App recording → Record my screen.
When your browser asks what to share, pick the app's window, or your entire screen.
3. Record, review and create
Walk through the flow, stop the recording, then review the key moments and create the demo exactly as described for a mobile app above.
Already Have Screenshots or a Recording?
You don't have to record live. If you already have screenshots of your app, or a recording of it, upload them instead:
- Screenshots: up to 100 PNG, JPG or WebP files at a time. They become screens in the order you pick, and Walnut adds hotspots between them where it can tell what was clicked. Portrait phone screenshots get a matching device frame.
- A video: one MP4, MOV or WebM file, up to 5 GB and 60 minutes, reviewed the same way as a live recording.
See Build a demo from screenshots or a screen recording for every option.
After the Capture
Your mobile and desktop screens work like any other Walnut screen:
- Move, resize or redraw hotspots, or add new ones
- Add guides and annotations on top
- Personalize with variables
- Use Make editable to turn part of a screen into editable, interactive content — see Make a screenshot editable
You can mix sources in one demo: web screens captured with the Chrome extension, mobile screens, desktop screens, Figma designs and slides.
FAQs
Do I need the Chrome extension?
No. Recording your phone or your screen, and uploading screenshots or videos, all run from Walnut in your browser.
Which phones are supported?
Any phone you can mirror to your computer. Walnut has device frames for iPhone, iPhone SE and Android, and picks the one that matches your recording.
Why does my iPhone screen show two notches?
Choose the (no notch) version of the frame in the review step. It's the default for iPhone recordings.
I got more screens than I expected. What can I do?
Skip the moments you don't need in the review step before you create the demo. Small changes are marked so you can spot them quickly. Pausing briefly after each tap while you record also helps.
Can I keep part of the recording as video?
Yes. Turn any span into a clip screen during review, or choose Add as one video to keep the whole recording as a single video screen.
Is the text on these screens editable?
Recorded screens are images, so their text isn't editable by default. Use Make editable on the part of the screen you want to change.