Live Mockups · Getting started · 2 min read

Start with a 3D scene

Pick a 3D device in Live Mockups, play its built-in animation, and turn it with your mouse.

Open the scene list

Open Live Mockups. The Scenes tab on the left lists 3D devices in groups: MacBook, iPhone, iPad and Nothing Phone. Each group shows six scenes. Click Load More under a group to see more.

Live Mockups with the Scenes tab open on the left, the MacBook and iPhone groups, and a 3D phone on the canvasLive Mockups with the Scenes tab open on the left, the MacBook and iPhone groups, and a 3D phone on the canvas
Scenes are grouped by device on the left.

Pick a scene

Click a scene card. This guide uses the iPhone 17 Pro scene in the iPhone group. The selected card gets an outline, and the scene opens on the canvas.

The iPhone 17 Pro scene opened on the canvas, with its card outlined in the iPhone groupThe iPhone 17 Pro scene opened on the canvas, with its card outlined in the iPhone group
The outlined card is the scene on the canvas.

Press Play

Click Play under the canvas. The scene runs its built-in animation, and the playhead moves along the timeline. Click Back to start to rewind, or Loop to repeat the animation.

The timeline with the Pause button showing and the playhead part of the way along the rulerThe timeline with the Pause button showing and the playhead part of the way along the ruler
The playhead shows where the animation is.

Turn the mockup

The Hand tool is selected by default. Drag across the canvas to turn the device and see it from another side.

The phone turned on the canvas after a drag with the Hand toolThe phone turned on the canvas after a drag with the Hand tool
Drag the canvas with the Hand tool to turn the device.

Questions

Which devices can I start with?

The Scenes tab of Live Mockups groups 3D devices into MacBook, iPhone, iPad and Nothing Phone. Each group shows six scenes; click Load More under a group to see more.

Do the scenes move on their own?

Yes. Every scene has a built-in animation. Click Play under the canvas to run it, Back to start to rewind, or Loop to repeat it.

How do I turn the device?

The Hand tool is selected by default. Drag across the canvas to see the device from another side.

Is there a tour of the editor?

Yes. Open the menu in the top-right corner and click Take the Tour. It walks through the editor panels one by one.

Try it in the Live Mockups

Real 3D devices you turn, light and animate.

Open editor