Device Overflow: render 3D devices seamlessly across neighboring artboards
What is Device Overflow?
App Screenshots are how you visually tell your app’s story, and enabling 3D devices to be shown on multiple artboards allows you to get more creative and cohesive. With traditional design tools, this would generally require stiff templates, or multiple renders, cropping, and careful compositing; making edits expensive/time-consuming.
That’s why ButterKit’s “Device Overflow” feature is so exciting. It does a ton of hard work for you (automatically rendering, cropping, and compositing multiple times per second), and it does it in realtime using Metal – no waiting for renders. So you can focus on showcasing your app, rather than technical rendering in multiple apps.
Prerequisites
- ButterKit v1.4+ (to check for updates, select ButterKit > Check for Updates)
- An open project with 2 or more artboards
ButterKit makes it easy to render 3D devices seamlessly across multiple artboards
Quick Start
Enable “Device Overflow” in the Inspector
Select an artboard and enable the new “Device Overflow” toggle (Inspector > Basics)
Select one or more artboards and enable "Device Overflow" in the Basics Inspector
Add & edit 3D devices
With the feature enabled, 3D devices will now “overflow” into neighboring artboards. If you don’t have one already, add a 3D device (e.g. iPhone 17 Pro Max) and move/scale/rotate it; watch it appear on neighboring artboards seamlessly!
Tip
Get started quickly with templates, then adjust from there. Download free templates