Quick answer
A multi-device mockup video places two or more phones, tablets, laptops, watches, or displays in one animated scene. The strongest compositions give every device a specific role, use different media where needed, and coordinate the movement from a shared timeline.
When this workflow is useful
Use a multi-device scene when the product genuinely spans platforms: a mobile companion for a desktop SaaS product, an iPhone and Apple Watch workflow, or a responsive website shown across phone, tablet, and laptop. One device should remain the visual lead while the others provide context or proof.
Explore the 3D device mockup video generator for a focused creation workflow and a clear comparison of Free and Pro capabilities.
Step-by-step workflow
- Choose the product story. Decide whether the scene demonstrates responsive design, a connected workflow, or a family of apps. Assign one message to the scene before adding hardware.
- Prepare media for every screen. Export clean screenshots or short recordings at each platform's natural aspect ratio. Use fictional data and remove notifications, tokens, and customer information.
- Build the device group. Add the devices in the Pro editor, place the lead device first, then arrange supporting devices with enough separation to keep every screen recognizable.
- Animate in layers. Keyframe the group for the overall entrance, then adjust individual devices only when a screen needs emphasis. Add a restrained camera move after the device timing is stable.
- Export a reusable master. Render a clean landscape master for the website or launch page. Create separate vertical and square edits rather than forcing one crop into every channel.
Decisions that improve the result
Hierarchy
Make one screen largest or closest to the camera. Equal-sized devices often create visual competition and leave the viewer unsure where to look.
Timing
Stagger device entrances by a few frames so the composition is easy to read. Keep long enough holds for dashboard labels and mobile interface text.
Camera
Use one intentional camera path. Too many orbits can hide screens and turn a product explanation into a hardware showcase.
Production checklist
- One lead device
- Correct media for each screen
- Readable interface at final size
- Coordinated group timing
- No private data
- Landscape and vertical deliverables
Frequently asked questions
Can every device show different media?
Yes. Pro device layers can use separate screenshots or video clips, which is useful for showing a connected workflow or responsive product.
Should every device animate separately?
Not necessarily. Start with a grouped movement, then add individual keyframes only when they clarify the story.
What is the best device combination?
For cross-platform SaaS, start with a laptop and phone. Add a tablet, watch, or display only when it represents a real customer touchpoint.