3D Transforms

Every device has full 3D transform controls: position, rotation, and scale along the X, Y, Z axes.

Open the transform panel

Select the device on the mockup canvas → the transform panel docks to the right. Each axis has its own input.

Position (px)

  • X — horizontal, positive moves right.
  • Y — vertical, positive moves down.
  • Z — depth, positive moves toward the camera (closer).

Drag the input number left / right to scrub, or type a value. Hold Shift while dragging for ×10 step.

Rotation (degrees)

  • X — pitch (tilt forward / back).
  • Y — yaw (turn left / right).
  • Z — roll (rotate in the screen plane).

Combine all three for compound rotations. The order is intrinsic XYZ (apply X first, then Y, then Z).

Scale (multiplier)

  • Uniform scale — drag the master slider.
  • Per-axis — toggle Lock, then set X, Y, Z independently for non-uniform scaling.

Anchor point

The transform centre. By default it is the geometric centre of the device. Drag the anchor handle in the preview to move it — useful for rotation-around-a-corner effects.

Decimal precision

Every value accepts decimals. Position is in pixels; rotation in degrees; scale as a multiplier. The app stores values internally as floats.

Snap to round values

Hold Cmd / Ctrl while dragging to snap to integer degrees / pixels. Or type an exact value.

Resetting

The header of each axis has a small reset to default (0 for position and rotation, 1 for scale).

Keyframing

Every transform value is keyframable — see Keyframe Timeline.

Where to go next

Was this helpful?

0

Updated

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *