Forum Discussion

hfalearning's avatar
hfalearning
Community Member
1 day ago

Tips for working with icons in Storyline 360

I am looking for some tips on the easiest way to work with icons in Storyline 360.

I often place an icon inside a shape, such as a circle or rounded rectangle. The challenge comes when I later want to move or adjust just the icon. I’ve tried selecting the icon through the Timeline, but it can still take quite a bit of time to select, separate, and reposition the icon without moving the shape behind it.

Is there a better or more efficient way to work with icons so that individual elements are easier to select and move?

5 Replies

  • hfalearning​ Are you okay with me moving this to its own post? I think you'll get more visibility and better responses that way! 

  • katherinezf's avatar
    katherinezf
    Community Member

    I may be simplifying this-- but I would suggest Grouping your icon with the shape so that the placement remains the same- yet the Total object can be moved about on the slide, i.e., a light bulb inside a square.

  • hfalearning​: A few years ago, I wrote a tip about putting an icon into the state(s) of a shape. I think that makes it easier to program and to take advantage of built-in states. (I jokingly call it "introverted Storyline," because it avoids Groups.)

    Depending on the shape and the icon, it can be difficult to select the icon when that needs to be adjusted, as you've discovered.

    Because so many icons are actually groups of freeform shapes, I often save the overall icon as a PNG, and insert that into the shape. Ideally its dimensions are somewhat smaller than the shape, which makes it a bit easier to select.

    After I select the icon, I adjust the X, Y, Width, and Height metrics by clicking the corresponding up/down arrows in the Size and Position section of the FORMAT ribbon. 

    By using those buttons, I don't have to worry about accidentally selecting the main shape when trying to grab part of the icon to move or resize it. 

  • ronald-hicks's avatar
    ronald-hicks
    Community Member

    One more workflow that saves me a lot of clicking: use the Selection Pane. Home tab > Select > Selection Pane lists every object on the slide — click the icon's name there and it's selected instantly, no digging through the shape on the canvas. Even better, rename the objects first (double-click the name in the timeline, e.g. 'icon-check' and 'circle-bg') so you're not hunting through 'Freeform 47'. Between Judy's states trick for the finished build and the Selection Pane for editing, the click-through problem mostly disappears.