This short guide will show you how easy it is to create versions of your design in multiple screen sizes using Anima in Sketch.
Let's get Started:
In order to create versions of your design in different screen sizes, you first need to use Pins to pin layers to the artboard and determine how each component will react when being resized.
- Pin the hamburger menu Top and Left to it stays in the top-left corner when the screen is resized
- Pin the profile image Center, to it will always stay centered, no matter the screen width
Then simply make a duplicate of your screen, go to Screen Presets in Sketch, and select a new device screen preset.
Notice how your design adapts to its new screen size:
Create an Overview of Every Device Screen Size
To see a version of your design in multiple screen sizes at once, create an overview:
Get started with these tutorials:
- Creating a High-Fidelity Prototyping in Sketch
- How to Publish a Website and Host it With Anima
- How to Handoff Design Specs to Developers
- How to Export Sketch to HTML
- Team Collaboration
We’re super excited to have you trying it out and hearing your feedback.