Projektuj interaktywne efekty z progresywnym rozmyciem i gładkimi gradientami

Lekcja 7 z 15HanaPoczątkujący9 min

W tym samouczku poznamy różne style i techniki tworzenia miękkich, wyrafinowanych projektów z gładkimi gradientami i progresywnym rozmyciem oraz sposoby zamiany ich w interaktywne doświadczenia w Hana.

Zaczniemy od wyjaśnienia, jak dodawać gradienty i efekty rozmycia do kształtów, a potem przejdziemy do tworzenia interaktywnych elementów, takich jak animacje po najechaniu kursorem, efekty podążające za kursorem, zapętlone animacje i warstwowe rozmycia. Wszystko gotowe do osadzenia w Twoim projekcie webowym, bez kodowania! 👌

Sceny demo: https://app.spline.design/ui/f7cc3864-707e-492a-8148-0e1ea37be1d3

Czego się nauczysz

  1. 0:00Wstęp
  2. 0:15Prosty projekt z gradientami
  3. 2:57Dodawanie rozmycia warstwy
  4. 3:41Tworzenie interakcji po najechaniu kursorem
  5. 5:28Tworzenie interaktywnego efektu rozmycia tekstu
  6. 6:44Tworzenie zapętlonej animacji gradientu radialnego
  7. 7:43Tworzenie efektu gradientu i rozmycia podążającego za kursorem

Powiązane materiały