用漸進模糊與平滑漸層設計互動效果

第 7 課,共 15 課Hana入門9 分鐘

在這個教學中,我們會探索運用平滑漸層與漸進模糊,打造柔和、精緻設計的各種風格與技巧,以及如何在 Hana 中把它們變成互動體驗。

我們會先說明如何為形狀加上漸層與模糊效果,接著打造互動元素,例如懸停動畫、跟隨游標的效果、循環動畫,以及多層模糊效果。這一切都能直接嵌入你的網頁專案,完全不需要寫程式!👌

示範場景:https://app.spline.design/ui/f7cc3864-707e-492a-8148-0e1ea37be1d3

你將學到

  1. 0:00開場
  2. 0:15使用漸層的簡單設計
  3. 2:57加入圖層模糊
  4. 3:41建立滑鼠懸停互動
  5. 5:28為文字打造互動模糊效果
  6. 6:44製作循環的放射狀漸層動畫
  7. 7:43打造跟隨游標的漸層與模糊效果

相關資源