Tutoriaali: Luo animoitu logo

Muuta staattinen logo silmiin tarttuvaksi animaatioksi.

Aika: ** 10 minuuttia ** Vaikeus: Keskivaikea

Mitä sinä luot

Logo sisäänkäynnin animaatiolla ja hienovaraisella jatkuvalla liikkeellä.

Animoitu logo sisäänpääsyefektillä ja hienovaraisella pulssilla

Vaihe 1: Aseta kangas

  1. Napsauta kangaskoon pudotus
  2. Valitse **Default (800×600) ** tai haluamasi koko
  3. Aseta logosi kanssa kontrastinen taustaväri

Vaihe 2: Lisää logoteksti

Tätä opetusohjelmaa varten luomme tekstipohjaisen logon.

  1. Paina T tekstityökalua varten
  2. Kirjoita tuotemerkkisi (esim. “ACME”)
  3. Sarjan ominaisuudet:
    • Kirjasinkoko: **96 **
    • Kirjasinväri: brändisi väri
  4. Kankaan keskipiste

Vaihe 3: Lisää tagline (valinnainen)

  1. Paina T uudelleen
  2. Kirjoita taglinesi
  3. Päätunnuksen alapuolella oleva sijainti
  4. Aseta pienempi kirjasinkoko (24- 36)

Vaihe 4: Luo sisäänpääsyanimaatio

Käytämme avaimia ammattisisäänkäyntiin.

Päälogo sisäänkäynti

  1. Valitse päälogoteksti
  2. Avaa aikajanapaneeli
  3. 0 sekunnissa:
    • Aseta sameus: **0 **
    • Aseta asteikko: **0,5 **
  4. ** 0,5 sekunnissa **:
    • Aseta Opacity: **1
    • Aseta asteikko: **1,0 **
    • Aseta helpotus: ** Helpota

Tagline Entrance (poistettu)

  1. Valitse tagline
  2. 0 sekunnissa:
    • Aseta sameus: **0 **
    • Aseta sijainti Y: +20px (lopullisen sijainnin alapuolella)
  3. **0, 8 sekunnissa **:
    • Aseta Opacity: **1
    • Aseta sijainti Y: lopullinen sijainti
    • Aseta helpotus: ** Helpota

Vaihe 5: Lisää hienovarainen silmukkaanimaatio

Sisäänkäynnin jälkeen lisää hienovarainen jatkuva animaatio:

  1. Valitse päälogo
  2. Aseta animaatio: ** Pulssi
  3. Aseta nopeus: 0,5 (hyvin hidas)

Vaihe 6: Lisää kipinävaikutus (valinnainen)

  1. Valitse päälogo
  2. Lisää tehoste
  3. Valitse **Sparkle
  4. Aseta merkkisi väri
  5. Aseta nopeus: **0,8 **

Vaihe 7: Esikatselu ja säätö

  1. Paina Space pelataksesi
  2. Säädä aikataulua tarvittaessa
  3. Varmista, että silmukkapiste näyttää tasaiselta

Vaihe 8: Vie

Verkkosivuja varten

  1. Vie **Animoitu SVG
  2. Upota sivuston otsikko

Sosiaalinen media

  1. Vie MP4 (5 sekuntia)
  2. Tai GIF autoplay-alustoille

Pro Vinkkejä

** Logo-animaatio Parhaat käytännöt:

  • Pidä animaatioita hienovarainen … logo pitäisi tuntea ammattimaista
  • Sisäänkäynnin pitäisi olla nopea (0,5-1 sekunti)
  • Loop animaatioiden pitäisi olla tuskin havaittavissa
  • Testi pienillä kooilla … jotkut vaikutukset eivät toimi hyvin kun skaalataan alas

Muutokset

Minimaalinen sisäänkäynti

Häivy hiljaa

  • 0s: Opasiteetti 0
  • 0,5s: Opacity 1

Bounce Entrance

Leikkisät brändit:

  • Käytä Bounce-animaatiota
  • Lyhyempi kesto

Kirjoituslaite Paljasta

Tekstipohjaiset logot:

  • Käytä kirjoituskoneen animaatiota
  • Vie MP4 (ei SVG)

Seuraavat vaiheet