Create foldable phone mockups with Duo Studio
Duo Studio is an open-source, browser-based tool for creating foldable phone mockups and folding animations from app screenshots. Upload inner and outer screen images, choose a device pose, and export a visual for your product launch. Browser simulation previews websites that permit iframe embedding. The editor processes screenshots locally and runs on static hosting.
How do I make a mockup from screenshots?
- Choose Screenshots in the top bar and expand Upload your screenshot.
- Upload the inner screen and, optionally, a separate outer screen. Without a separate outer image, the editor can derive the outer view from the inner image’s left side. Choose a fill mode to cover the screen when aspect ratios differ.
- Choose Unfold, Closed, Landscape, Portrait, Seated or Standing. Assign screenshots that match the orientation of each scene, then adjust the folding slider.
- Select Export, choose a format and size, then generate and download. Advanced opens additional framing and scene controls.
Which mode should I use?
| Mode | Input | Useful for |
|---|---|---|
| Screenshots | Inner and outer screen images | Launch graphics, device mockups and folding animations |
| Browser simulation | An embeddable website URL | Exploring responsive page layouts and live interactions across poses |
Can I preview any website?
No. The target website must allow iframe embedding. Sites using restrictive Content-Security-Policy frame-ancestors or X-Frame-Options headers may refuse to load. Duo Studio cannot bypass those restrictions. Browser mode loads content directly from the target site; it is not a screenshot upload.
Live webpage exports require permission to capture the current tab in a supported browser. Preview viewport dimensions and exported image pixels are separate settings; check the selected scene and output size before exporting.
What can I export?
PNG stills, MP4 and WebM folding animations, GIF loops, scene bundles as PNG ZIP files, and raw UI PNGs. Video encoder support depends on your browser. Use screenshots for repeatable launch visuals and browser mode when you need to inspect live page behavior.
Do screenshots leave my device?
Duo Studio processes uploaded screenshots and exports locally. Projects can be saved as .duo.json files and are autosaved in the browser. A saved project can contain your original images, so share project files only when you intend to share those assets. Browser mode makes requests to the website you open, which has its own privacy practices.
Is this an iPhone Duo emulator or an Apple tool?
Duo Studio provides iPhone Duo-style visual mockups using device assets attributed in the project. It does not run iOS or your native app and is not an Apple product. Mockups do not prove real-device compatibility, app adaptation, or App Store acceptance. Use actual device testing and current submission requirements for those decisions.
Who maintains the project?
The implementation, license, asset attribution and issue tracker are available in the iPhoneDuoMock source repository. The example screenshots show EchoPod; replace them with your own app. Report a problem or suggest a feature.