Displaying 3D devices across artboards
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 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 “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
Voilà!
It’s that easy. ButterKit does the heavy lifting for you. Share your screenshots and app launch on the ButterKit Discord or subreddit for feedback and support from fellow builders/designers/devs.