This short guide will show you how easy it is to create versions of your design in multiple screen sizes using Anima in Sketch.

Prerequisites:

Let's get Started:

Step 1:
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.

For example:

  • 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

Step 2:
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:

Learn More

Get started with these tutorials: 

We’re super excited to have you trying it out and hearing your feedback.


Did this answer your question?