• EN
香港:(852)3749 9734
[email protected]

新聞資料

如何更好地利用流體效果來賦予網頁設計的生命力

儘管如今依然是極簡主義風格大行其道的時代,但設計師在設計時依然會試圖在網站中復刻現實世界中的元素和質感,比如流動的質感。就像現實生活中水無常形一樣,在網頁設計中,液體也可以不同的流態,不同的視角,不同的色彩來構建不同的解決方案。

下面小編將通過一些網頁設計案例和大家探討,如何更好地利用流體效果來賦予網頁的生命力。

如何更好地利用流體效果來賦予網頁設計的生命力

Kikk Festival巧妙地藉助海島和大猩猩相似的形態創造出錯位而雙關的視覺語言,而水在整個網頁設計中成為最自然東西,也是創造錯位感的環境。

如何更好地利用流體效果來賦予網頁設計的生命力

雖然Wed'ze Goggles的頁面設計並沒有Kikk Festival那麼令人難忘,但是它展示了如何充分利用簡單的元素來製造自然流體質感的視覺元素。頁面設計使用類似流體的斑點來裝飾背景,巧妙地讓原本簡約的頁面顯得不那麼單調。

如何更好地利用流體效果來賦予網頁設計的生命力

Julie Bonnemoy的頁面中添加很多流動液態泡泡動畫作為介面的背景來使用,加上溫暖柔和的色調,整個頁面顯得非常舒適而誘人。

如何更好地利用流體效果來賦予網頁設計的生命力

Studio Gusto的頁面同樣使用類似的設計,但泡泡的質感不太像液體,反而像更加輕盈的肥皂泡效果,流暢而順滑。

如何更好地利用流體效果來賦予網頁設計的生命力

Viennese modernism 2018這個網頁中,液態效果甚至是網頁涉及到的展覽中一個組成部分。在這個案例當中,液態效果成為現代主義設計的代表,為整個網頁氛圍作出了貢獻。

【總結】

如何更好地利用流體效果來賦予網頁設計的生命力

通過上述案例,我們可以了解到液態效果對網頁設計有着一定的作用,這包括:

• 加強網站的用戶體驗

• 給用戶留下深刻的印象

• 完善整個頁面給人的感覺

• 讓留白或背景顯得不再單調

• 避免頁面看起來太簡單

如何更好地利用流體效果來賦予網頁設計的生命力

同時,網頁設計中在運用液體效果時,也應該遵守以下原則:

▪ 放置視覺錨點,以不太吸引人的方式來引導用戶注意力到特定的地方

▪ 利用動效設計,為用戶提供完整的視覺路徑

▪ 加強整個視覺設計的一致性

▪ 提升網站本身的創造性和專業性

水是人類最熟悉的元素,對人類有着本能上的吸引力,因此無論網頁中液體效果是如何千變萬化,可以給用戶帶來如何截然不同的感覺,它們都應該遵循物理規律,否者會讓整個網頁有種失真的感覺。