Live Mockups · Animation · 2 min read

Control the animation

Play the built-in motion of a 3D scene in Live Mockups, jump to any moment on the timeline, loop it and change its speed.

To control a scene’s animation in Live Mockups on ls.graphics, click Play below the canvas, click or drag along the ruler to move the playhead, turn on Loop to repeat the animation, click Back to start to rewind, and set Speed in the right panel to run it faster or slower.

Editor: Live Mockups at ls.graphics/live-mockup-editor. Result: a MacBook Pro scene played, paused at 2.1 seconds, looped and run at Speed 2. In our test, Speed 2 played about twice as fast as Speed 1.

Press Play

Click Play, the first button below the canvas. The device starts moving and the button turns into Pause.

The MacBook closed at the start, with Play, Back to start and Loop belowThe MacBook closed at the start, with Play, Back to start and Loop below
Play is the first of three buttons under the canvas.

Move the playhead

Click or drag along the ruler to jump to any moment. The device shows its pose at that moment, so you can stop on the frame you like.

The MacBook half open with the playhead at 2.1 seconds on the rulerThe MacBook half open with the playhead at 2.1 seconds on the ruler
The playhead at 2.1 seconds.

Turn on Loop

Click Loop, the third button. It gets a gray background while it is on, and the animation repeats until you pause it.

The Play, Back to start and Loop buttons with Loop switched onThe Play, Back to start and Loop buttons with Loop switched on
Loop is on when its button has a gray background.

Click Back to start

Click Back to start, the second button. The playhead returns to 0 ms.

The MacBook closed again with the playhead at 0 msThe MacBook closed again with the playhead at 0 ms
Back to start puts the scene at its first frame.

Set the Speed

In the settings panel on the right, scroll to Speed, between Camera and Tone mapping. Type a number in its box or drag the slider. In our test, Speed 2 played about twice as fast as Speed 1, and Speed 0.5 about twice as slow. To change the framing as well, see Frame the shot with Camera, and to save the motion as a file, see Export an MP4 video.

The Speed section in the settings panel set to 2The Speed section in the settings panel set to 2
Speed 2 plays the animation faster.

Questions

Does Loop keep the animation going until I stop it?

Yes. In our test, with Loop on and Speed set to 2, the scene was still playing after 7 seconds. Click Pause to stop it.

How long does the animation take at each Speed in Live Mockups?

In our test on a MacBook Pro scene, Speed 2 played the scene about twice as fast as Speed 1, and Speed 0.5 about twice as slow.

Why do scenes in Live Mockups play for different lengths?

Each scene carries its own built-in animation, so the ruler under the canvas ends at a different time in every scene. In our test the ruler of the iPhone 17 Pro scene ended at 6 seconds.

Where is the Speed setting in Live Mockups?

Speed sits in the settings panel on the right, between Camera and Tone mapping, as a slider with a number box. Scroll the panel down to reach it.

Try it in the Live Mockups

Real 3D devices you turn, light and animate.

Open editor