什麼是滾動講述? 外加 4 個真實的 Scrollytelling 示例

[ad_1]

尋找一些滾動的例子? 🧐

如果您使用數字內容,您可能聽說過「滾動講述」。 然而,這種引人入勝的設計實踐相對較新。 因此,您可能想知道它是如何工作的以及哪些類型的網站可以實施該技術。

幸運的是,scrollytelling 非常簡單,各種網站所有者都可以使用它來吸引用戶的注意力。 另外,大量的 WordPress 主題允許您在您的網站上進行設置。

在這篇文章中,我們將解釋 什麼是滾動講述. 然後,在分享一些之前,我們將討論哪些主題與此功能兼容 滾動的例子來激勵和激勵你. 讓我們開始吧!

#scrollytelling 是什麼? 查看 4 個真實示例。 🖱️📖

點擊推文

什麼是滾動講述?

「Scrollytelling」是一種垂直講述故事的數字敘事設備,需要用戶滾動。 這種網頁設計趨勢在過去幾年開始受到關註:

Pixie Think 網站的 GIF。

我們將在下面分享一些更滾動的示例,但基本思想是它通常包含許多引人注目的全幅圖像和圖形。 此外,它可能具有先進的設計元素,例如 視差滾動、GIF 和 動畫.

一頁式網站 經常使用 scrollytelling 方法,但也沒有理由不能在多頁網站上使用它。 例如,如果您需要展示一個與其他內容分開的一次性項目,這可能會有所幫助。

scrollytelling 的主要優點是它可以創建一個極具吸引力的 用戶體驗(UX). 這在當今的數字世界中至關重要,在線用戶通常期望越來越多的高質量多媒體內容。

此外,scrollytelling 特別適合特定目的。 例如,它很適合 長篇社論講故事,這在雜誌專題中很常見。

它也經常與互動式一起使用 信息圖表和數據可視化. 這使得scrollytelling非常適合以一種易於理解和引人入勝的方式呈現複雜研究的結果:

紐約時報的一個滾動的例子。

此外,較小的網站也可以從使用滾動講述中受益。 這是展示混合媒體藝術、企業歷史或引人入勝的故事的絕佳策略 關於頁面.

在成本和實用性方面,滾動講述網站涵蓋了整個範圍。 如果你有這個願望和資源,你可以聘請一個平面設計師和動畫師團隊來為一個精心製作的滾動講述項目創建原創內容。

另一方面,很多 WordPress 主題都與滾動講述功能兼容。 此外,WordPress 插件使您能夠為您的網站添加廣泛的功能。 因此,完全有可能作為 WordPress 初學者利用滾動講述。

四個滾動的例子

既然您對這種傳達故事的創造性方式有所了解,我們將分享一些滾動式的例子來激發您的靈感! 為方便起見,我們將介紹四種不同類型的網站,它們可以從使用滾動講述中受益,並分享每種類型的真實示例。

  1. 出版物
  2. 品牌推廣
  3. 非營利組織
  4. 以創意/藝術為中心

1. 出版物

正如我們之前提到的,滾動敘述非常適合長篇敘事。 因此,它在解說新聞和藝術出版物中變得越來越普遍。

例如,著名的音樂雜誌 Pitchfork 經常在其封面故事中使用令人印象深刻的圖形和動畫:

Pitchfork 上關於 Daft Punk 的長篇文章。

上述故事的數字版 關於 Daft Punk 的 GIF 動圖立即引起了您的注意。 然後,您可以看到遍布各處的藝術家的圖像。 此外,它使用兩個簡單的柱子來創造一個令人驚嘆的設計。

引語也在故事的不同點突出顯示,突出了藝術家最有趣的想法。 這種格式在雜誌滾動講述中很常見,因為這些引語使較長的故事更容易瀏覽,並使讀者能夠更快地獲得「外賣」信息。

2. 品牌推廣

如果您想獲得認可,為您的企業創建一個強大的視覺品牌是必不可少的。 總體而言,當您擁有獨特的形象時,您的公司會變得更加令人難忘和吸引人。 這可以增加銷售額和良好的聲譽。

由於scrollytelling允許創造性的靈活性,它也是使您的品牌與眾不同的絕佳方式。 無論您從事什麼行業,您都可以找到一種獨特的方式來以可滾動的格式講述您的故事。

以豪華住宿業務為例, 貝阿羅薩木屋,非常有效地使用scrollytelling:

BelArosa scrollytelling 示例。

如您所見,這個令人驚嘆的網站在使用大量有趣的圖像的同時保持經典和極簡主義。 在這裡,BelArosa Chalet 描述了客戶選擇入住時的感受。 這種設計創造了一種近乎圖畫書的效果。

該網站似乎也使用了縮小然後消失的粘性標題。 這樣,您更有可能記住品牌名稱和 標識.

3. 非營利組織

簡而言之,滾動講述是一種極好的策略,可以在您想要創建引人入勝的敘述或傳達一些重要歷史時採用。 這使其成為試圖說服讀者捐贈或分享歷史事件的非營利組織的絕佳選擇。

更重要的是,它非常適合與非營利組織相關的一些常見文件,例如時間表和年度報告。 例如,紐約法律援助協會在其 2021 年年度報告中使用了滾動講述 [1]:

紐約法律援助協會的年度報告。

這個簡單而優雅的示例顯示了多個圖像、重要的統計數據等。 此外,由於這是一份報告,因此該頁面包含大量 紐扣 導致更多信息。

通過在這種情況下選擇滾動講述,非營利組織使其年度摘要更具可讀性和可訪問性。 因此,用戶可以輕鬆了解年度亮點並點擊任何他們感興趣的主題。 請記住,對於「關於」或「使命宣言」頁面,滾動講述也特別方便。

4. 以創意/藝術為中心

儘管滾動講述可以非常實用,但它也具有一定的實驗性。 因此,創意網站可以從使用這種方法中受益。

投資組合網站 對於畫廊來說,如果您希望您的網頁包含大量媒體,滾動式講述通常是您的最佳選擇。 這樣,您就不會局限於任何特定的風格,並且可以更輕鬆地展示藝術或創意服務等內容。

鏡子網站 是一個獨一無二的例子:

Mirows NFT 藝術網站。

這個 NFT 藝術網站處於網頁設計的最前沿。 您可能會注意到的第一件事是它具有水平滾動而不是標準的垂直方法。 雖然這很不尋常,但它可以立即創造令人難忘的用戶體驗。

Mirows 網站可能看起來很大膽,但它在確保用戶永遠不會被激進的設計所迷惑方面也做得非常出色。 它具有指示用戶滾動的清晰消息,這對於任何可滾動格式都是值得推薦的。

此外,頁面頂部的菜單似乎處於無限循環中,與您一起瀏覽頁面。 這是一個有趣的效果,但更重要的是,一致的菜單按鈕可以讓您輕鬆訪問其他站點頁面。

您可以使用哪些 WordPress 主題進行滾動講述?

對於 WordPress 用戶來說,主題在網頁設計中扮演著重要的角色。 WordPress 網站是高度可定製的,但您的主題決定了您可以使用哪些獨特的設計功能。 此外,許多主題都帶有入門網站,可以幫助您避免基本設計功能所需的大量初始工作。

因此,您可能想知道可以使用哪些 WordPress 主題進行滾動講述。 好消息是,歸根結底,大多數製作精良和 響應式主題 可以容納許多高度複雜的設計元素。

您可能需要一個快速、輕量級的主題,因為在滾動講述中添加的所有媒體都會減慢您的網站速度。 更重要的是,您可能需要一個與視差滾動兼容的主題。 此外,如果您有興趣創建一個單頁網站來講述您的故事,那麼查找具有單頁起始站點的主題可能會很有用。

內芙 如果您有興趣嘗試 scrollytelling,這是一個很好的免費增值選項:

Neve 主題可以幫助您實現這些滾動式示例

那是因為它速度很快,並且包含一些內置的視差滾動功能。 安裝並激活此主題後,您可以通過轉到外觀 → Neve 選項 → 查看演示輕鬆預覽這些功能。

Neve 與 Advanced WordPress Backgrounds 等視差插件無縫集成。 另外,它的專業版讓你 創建粘性標題,這對於滾動講述通常很有用。


高級WordPress背景 高級WordPress背景

作者: 高級WordPress背景團隊

當前版本:1.9.4

最後更新時間:2022 年 8 月 29 日

高級背景.1.9.4.zip

94% 評分

超過 30,000 次安裝

WP 5.8+需要

此外, Elementor 頁面構建器 在視差功能方面具有巨大的潛力。 由於 Neve 允許您使用 Elementor 進行編輯,因此您可以解鎖大量有用的滾動講述功能。

轉到頂部

今天試試scrollytelling🚀

Scrollytelling 在網頁設計領域變得越來越流行。 儘管如此,當談到這種流暢的數字故事講述策略時,還有很多東西需要學習。

#scrollytelling 是什麼? 查看 4 個真實示例。 🖱️📖

點擊推文

網站所有者可以使用滾動講述來製作有關其品牌的引人入勝的敘述,並以可訪問的方式呈現信息。 如果您想使用 WordPress 進行嘗試, 內芙 是工作的絕佳主題。 它與視差滾動和粘性標題兼容。 此外,它的速度超級快,因此您無需等待令人興奮的圖形和多媒體元素。

您對滾動講述或這些滾動講述示例有任何疑問嗎? 在下面的評論部分讓我們知道!

參考

[1] https://legalaidnyc.org/annual-reports/2021/

相關文章