Skip to main content
All CollectionsPlay 1.0
SF Symbol Actions in Play 1.0 (Outdated)
SF Symbol Actions in Play 1.0 (Outdated)
Updated over a week ago

This support article is for an older version of Play for macOS (1.0), which is still available in the App Store. Play 2.0 has an updated interface and new interactions.

To read about actions in Play 2.0, visit this article.

Set SF Symbol

A Set SF Symbol action replaces one SF Symbol with another.

  • Target: Select the image element that this action will affect

  • SF Symbol: Select the new icon

  • Variable Progress: Turn on your new icon's variable color (if applicable) and choose its progress

  • Replace Animation: Choose whether or not to animate the new icon into view

    • By Layer: Choose whether to animate in the full icon at once or each layer sequentially (only applicable to some icons)

    • Direction: Specify how the icon is animated; options are Down Up, None Up, and Up Up.

      • Down Up: the existing icon scales down and fades out; the new icon scales up and fades in

      • None Up: the existing icon fades out; the new icon scales up and fades in

      • Up Up: the existing icon scales up and fades out; the new icon also scales up and fades in

Set Symbol Effect

A Set Symbol Effect action adds motion to an SF Symbol in one of six animation types.

  • Target: Select the image element that this action will affect

  • Animation: Choose the animation type; options are Appear, Disappear, Pulse, Bounce, Scale, or Variable Color (descriptions below are from Apple)

Appear

"Causes a symbol to gradually emerge into view"

  • Direction: Specify how the icon is animated into view; options are Up or Down

    • Up: the icon scales up as it fades into view

    • Down: the icon scales down as it fades into view

Disappear

"Causes a symbol to gradually recede out of view."

  • Direction: Specify how the icon is animated out of view; options are Up or Down

    • Up: the icon scales up as it fades out of view

    • Down: the icon scales down as it fades out of view

Pulse

"Varies the opacity of a symbol over time."

  • By Layer: Choose whether to animate the full icon at once or each layer sequentially (only applicable to some icons)

  • Speed: Choose how fast or slow the animation should be; options are 0.25x, 0.5x, 1x, 1.5x, and 2x

  • Repeat: Choose how many times the animation should repeat before ending; select "continuous" to repeat indefinitely by sliding the slider all the way right

Bounce

"Briefly scales a symbol with an elastic-like movement that goes either up or down and then returns to the symbol’s initial state."

  • Direction: Specify whether the icon scales up or down from its original size as it bounces; options are Up or Down

    • Up: the icon scales up as it fades out of view

    • Down: the icon scales down as it fades out of view

  • By Layer: Choose whether to animate the full icon at once or each layer sequentially (only applicable to some icons)

  • Speed: Choose how fast or slow the animation should be; options are 0.25x, 0.5x, 1x, 1.5x, and 2x

  • Repeat: Choose how many times the animation should repeat before ending; select "continuous" to repeat indefinitely by sliding the slider all the way right

Scale

"Changes the size of a symbol, increasing or decreasing its scale."

  • Direction: Specify whether the icon scales up or down; options are Up or Down

    • Up: the icon scales up, resulting in a larger final icon

    • Down: the icon scales down, resulting in a smaller final icon

  • By Layer: Choose whether to animate the full icon at once or each layer sequentially (only applicable to some icons)

  • Speed: Choose how fast or slow the animation should be; options are 0.25x, 0.5x, 1x, 1.5x, and 2x

Variable Color

"Incrementally varies the opacity of layers within a symbol."

  • Layer Style: Choose which layers are visible as they animate in; options are Cumulative or Iterative

    • Cumulative: layers animate in and stay visible until all layers are visible

    • Iterative: layers animate in one at a time, with each layer disappearing as the next layer comes into view

  • Hide Inactive Layers: Choose to show a lower opacity version of all layers at all times (on) or only show the

  • Reverse: Choose whether to ping pong (on) or loop (off) the layers' opacity

  • Speed: Choose how fast or slow the animation should be; options are 0.25x, 0.5x, 1x, 1.5x, and 2x

  • Repeat: Choose how many times the animation should repeat before ending; select "continuous" to repeat indefinitely by sliding the slider all the way right

Did this answer your question?