結合插畫與視差的滾動動態單頁式網站，在效果呈現上是非常顯著的！之前我也有介紹數個這種網站設計的操作方式，非常容易引人入勝。
這類的網站有幾個重點：

• 「分層輸出」

目的做出視差空間感，所以將插畫區分成前、中、後、碎，
– 後段就是大背景，也是滾動最慢的。
– 中段就是大物件，滾動速度正常。
– 前段通常是主物件，滾動偏快。
– 碎片物件通常用於點綴物畫面、加強景深之物件。

• 「持續動態」

目的做出活的畫面，將部份局部意義上可持續動態的物件用 GIF 或序列圖方式做成「持續動態」，可體現畫面的生命感。

• 「風格筆觸」

目的是讓 UI 能夠更融入畫面，讓使用者更沈浸而不出戲。
可以看到 Section 與 Section 之間都有一些插畫筆觸來做銜接。另外在按鈕背景、主標題背景上也都會看到這類筆觸。
→ → 網站連結