DEV Community

Martin Grüner
Martin Grüner

Posted on

Keeping 3D device-frame perspective editable through native export

A device frame can explain what kind of app is being shown, but a flat mockup often sits on top of the composition instead of belonging to it. In Screen Studio Kit 1.2, I added controlled depth without flattening the frame into a finished bitmap.

Device-frame layers now store independent Turn and Tilt angles. The hardware body, screen content, finish, shadows, and perspective remain connected to the same editable layer. Both angles are constrained from -60° to 60°, and the canvas updates immediately while the frame is edited.

The detail that mattered most was export parity. The interactive canvas is not the final renderer, so the native export engine consumes the same stored angles. Existing projects migrate with zero-degree values, preserving their previous appearance until a frame is deliberately changed. Perspective is scene data, not a preview-only effect.

This also needs restraint. Screen Studio Kit warns when a rotated custom iPhone frame is used for an App Store output so the artwork can be checked against Apple’s current requirements. The same reusable project can keep a 3D treatment for another store or campaign and reset the App Store version.

The complete editor, local projects, asset management, preview, validation, device-frame editing, one size and one language per export, and up to 10 full-resolution exports per local day are in the Free tier.

The release notes show the real editor and exported artwork: https://martingruner.com/blog/screen-studio-kit-1-2

Top comments (0)