<aside> đź“Ą Files for download:

  1. A petal that will be embedded in all animations. If there is a suggestion to change the imposed gradient for a more successful animation - ready to discuss.

    leaf2.svg

  2. Background for animation preview, where the animation will be placed.

    back.png

</aside>

Idea

Untitled

First Screen About harmony and wholeness = the circle turns into a lotus

Second Screen About the possibility to choose one of 4 practices = 4 petals are spinning

Third Screen About sound voice guidance & background music = the flower emits waves, imitating sound.

Visual requirements

  1. In animation, convey a feeling of lightness through smooth transitions from one animation to another.
  2. Observe:
    1. Balance of visual masses (red contour; therefore, it is sometimes permissible to reduce the scale of petals, for example, on screen 2)
    2. Visual centering of figures
    3. Mood - harmony, lightness

P.S. The petal should be pre-composed immediately, so that it is possible to change the stylistic petal to look at other options.

Technical Requirements

  1. Animation is divided into:

    Untitled

    1. The first main stage, where the transformation of figures takes place - 3 sec (discussable).
    2. The second, which is looped - 1.5 sec.

  2. Output file types:

    1. Source file in .aep
    2. 6 animations.gif (without background):
      1. 1x: 300px Ă— 300px
      2. 2x: 600px
      3. 3x: 900px
    3. 6 animation⚠️ .lottie (without background)

Script

Screen 1

1 – 2: A circle of 4 petals transforms into a lotus 3 sec

3: Lotus opens and folds back (looped animation for 1.5 sec)

onboarding.mp4

Untitled

Screen 2

The final frame of the 3rd animation of the previous screen is equal to the initial point of the 1st animation of the 2nd screen.

1–2: The lotus divides into 4 petals, decreasing in scale 3 sec