Add multiple devices to a scene
Add extra mockup devices to a scene and showcase your designs on several screen sizes at the same time. Now in public beta.
Modern UI design often involves designing for a myriad of screen sizes - especially web design. Adding multiple devices to your scene can help you showcase your responsive design.
Multiple devices is currently in public beta, so you may experience hiccups and even crashes. We'd love to hear what you think on beta@rotato.app
How to do it
- Open a template or device sceen
- Click the + button in the Device section of the side bar
- Choose a device to add to your scene
- Use the 3D arrows or keyboard to position the added device
- Use the 3D arcs to rotate the device
- Drop a video or image on the screen of the new device
Watch a video
Resetting a device
If you want to start over positioning your device, you can reset its position and rotation.
- Click the device you want to reset
- A Selected Device opens in the sidebar (you may have to scroll)
- Click the Reset if you want to reset all values. Enter zero if you only want to reset e.g. a device's rotation on the x-axis.
Precise adjustment
Sometimes you want to position and rotate the device with the greatest possible precision. You can use the sidebar to do that in Rotato.
- Click on the device you want to position.
- The 3D arrows appear, indicating that the device is selected.
- A new sidebar inspector also appears that lets you input Position x, y, and z, as well as Rotation x, y, and z.
- Enter the precise values for any of them to change position and rotation.
- You can also drag on the strip below the field to change a specific value without changing other values.
You can also use the keyboard to place the added devices. Hold Shift or Shift + Command to move in larger or smaller increments.
Examples
