Do you feel that aligning objects in Storyline 360 is critical to your design? Do you ever happen to see items on screen that are not aligned, cringe, then feel the dread of hoping that your colleagues didn’t accidentally see before you fixed it? You’re not alone! We’re often asked how to distribute items evenly, so we’ve whipped up just the blog post you’re looking for!
Effectively using space in your layouts is critical and can lead to eye-catching designs. When it comes to lining up items (like images or shapes or text boxes) to ensure they’re centered or equal distance apart, we’re talking about a few different cases today—and have some tricks up our sleeve! Hopefully, you can use them in your next e-Learning project.
Case #1: Position the first, the last, then distribute
Suppose you know where you want your first object to go on your slide, and your last object, and you want the rest of the objects to be distributed equally in between. To display those just right, place your outer objects where they should be first. Then, select all the objects, and from your Format tab, select either Distribute Vertically, or Distribute Horizontally, depending on the layout of your objects.
Tip: We use this button so much that we’ve also added it to our Quick Access Toolbar! Right-click on a command in your Storyline 360 tabs to add it to yours!
Case #2: Equal size based on the available space
In this case, let’s say you have some available space for your shapes, but you’re really not sure how tall or wide each should be to fully fit in the available space. One way we have identified that information is to draw a rectangle in the available space. From there, we can check the height (or width) of this sizing rectangle.
Select the sizing rectangle and note the size provided on the Format tab.
Next, divide that rectangle’s size by the number of objects you have. For this example, our sizing rectangle is 492 pixels in height, and since we have four objects, we’ll divide that number by 4. With the answer of 123, we now know that each of our four objects should be 123 pixels in height.
Now that your objects are all the correct size, you can remove your sizing rectangle!
Case #3: Centering the objects on the slide
Say that you want to ensure an entire group of objects are placed in the exact center of the slide! Here’s one easy way to do that…
First, select all the objects. Then, on the Home tab, in the Arrange drop-down, select the Align subtab, and then select Align to Slide.
Since you’ve adjusted your alignment to work with the slide, the Distribute Horizontally or Distribute Vertically options will now align your objects to the slide versus in relation to the selected objects!
We often use a combination of these techniques to distribute slide objects in the space provided. You can always use temporary placeholder shapes to gauge size or create boundaries or reference items to align your content to.
So, what works for you while you’re developing?
Let us know in the comments below!