故事的(de)存在，幾乎和(hé)人(rén)類的(de)曆史幾乎一樣長。自人(rén)類會(huì)說話(huà)以來，就開(kāi)始用(yòng)故事來溝通信息，傳承思想，總結經驗。網頁設計(jì)本質上(shàng)也(yě)是在溝通想法和(hé)概念，這就是爲什(shén)麽，講故事是網絡上(shàng)最吸引用(yòng)戶的(de)表達方式。
網頁設計(jì)師(shī)總在尋找更多的(de)創意和(hé)方法來提升用(yòng)戶體驗，所以他(tā)們也(yě)會(huì)越來越多地(dì)在設計(jì)中運用(yòng)講故事的(de)方法。
當設計(jì)師(shī)将故事變成一個(gè)網站的(de)時候，這種引人(rén)入勝的(de)體驗也(yě)能(néng)更加有(yǒu)效地(dì)吸引用(yòng)戶。講故事的(de)形式有(yǒu)很多，也(yě)可(kě)以橫跨多種不同的(de)設備，運用(yòng)在不同類型的(de)網站中。
用(yòng)社交媒體講故事
現如(rú)今，社交媒體和(hé)網頁設計(jì)之間的(de)關系越來越緊密。即便是很多大(dà)型企業(yè)也(yě)将社交媒體的(de)按鈕放(fàng)在每個(gè)頁面上(shàng)，這使得分(fēn)享和(hé)發布信息更加簡單快捷。這也(yě) 使得品牌的(de)用(yòng)戶和(hé)粉絲更便捷地(dì)同産品供應商和(hé)服務供應商溝通了。社交媒體讓品牌可(kě)以将産品以講故事的(de)方式推向市場(chǎng)，俘獲忠實的(de)顧客和(hé)用(yòng)戶，而社交媒體可(kě)以以多樣的(de)形式傳遞出品牌的(de)激情，達成目的(de)，或者炒作。
下面以Tommy-Hilfiger的(de)Facebook頁面爲例。這個(gè)美(měi)國潮牌的(de)Facebook頁面有(yǒu)著(zhe)870萬粉絲，如(rú)此衆多的(de)粉絲都(dōu)是Hilfiger品牌故事的(de)忠實 聽衆。Hilfiger在頁面上(shàng)分(fēn)享設計(jì)、名人(rén)合作夥伴的(de)照(zhào)片和(hé)新聞以及各種宣傳活動，圖示通過圖片、視頻、文(wén)字等多種形式傳遞給用(yòng)戶，引人(rén)入勝。
使用(yòng)圖片講故事
有(yǒu)時候，簡單而不張揚的(de)圖片可(kě)以更好地(dì)講述一個(gè)故事。一圖勝千言這句話(huà)沒有(yǒu)錯，人(rén)本身是視覺動物(wù)，圖片信息更容易被吸收，所以合理(lǐ)地(dì)運用(yòng)圖片語言，可(kě)以更加有(yǒu)效地(dì)傳達信息。圖片2.jpg
LinkedIn的(de)注冊頁面就很好的(de)說明(míng)了這一點。當你(nǐ)打開(kāi)注冊頁面的(de)時候，左側的(de)用(yòng)戶小(xiǎo)頭像是極具目的(de)性的(de)，它向用(yòng)戶展示了網站用(yòng)戶的(de)多樣性，并且傳遞出一個(gè)信息：這個(gè)網站真正是适合每個(gè)人(rén)的(de)。這些照(zhào)片中的(de)人(rén)，種族背景不盡相(xiàng)同，有(yǒu)男有(yǒu)女(nǚ)，不包括老年人(rén)，并且每個(gè)人(rén)看起來自信而快樂(yuè)。哪怕是不明(míng)白 社交網絡的(de)人(rén)也(yě)能(néng)夠通過這個(gè)簡單的(de)信息了解到(dào)這個(gè)星球上(shàng)來自不同地(dì)域不同背景的(de)人(rén)正彙聚于此，使用(yòng)共同的(de)服務一起交流 ，甚至業(yè)務往來。
使用(yòng)插畫來講故事
同圖片一樣，用(yòng)插畫來講述故事也(yě)有(yǒu)著(zhe)不錯的(de)效果。作爲視覺上(shàng)的(de)輔助，插畫會(huì)讓用(yòng)戶更加易于理(lǐ)解品牌故事。比起照(zhào)片的(de)簡單直白，插畫的(de)表達方式更多，它可(kě)以以抽象的(de)方式來表達，也(yě)可(kě)以更以更加寫實的(de)方式來講述。
在Evernote Clipper的(de)網頁中，我們看到(dào)了使用(yòng)了偏向寫實手法的(de)故事闡述方式。插畫與文(wén)字結合在一起，告訴用(yòng)戶Web Clipper是如(rú)何工(gōng)作的(de)，看起來像故事書(shū)一樣簡單直白。
使用(yòng)吉祥物(wù)來講故事
說道吉祥物(wù)，滑稽可(kě)愛幽默賣萌是它們的(de)優勢。當一個(gè)公司機構或者網站擁有(yǒu)吉祥物(wù)的(de)話(huà)，用(yòng)它來同用(yòng)客戶進行(xíng)交流是一個(gè)簡單方便的(de)方法，可(kě)以通過它以幽默的(de)方式向客戶來傳遞品牌價值，講述品牌故事，比如(rú)MailChimp。
MailChimp有(yǒu)個(gè)非常有(yǒu)名的(de)吉祥物(wù)，名叫Freddie，它在傳遞企業(yè)理(lǐ)念和(hé)講述企業(yè)故事上(shàng)有(yǒu)著(zhe)極大(dà)的(de)貢獻。MailChimp不論是在業(yè)務還是在生活上(shàng)都(dōu)奉行(xíng)輕松而非嚴肅的(de)理(lǐ)念，而Mailchimp在描述Freddie的(de)時候，字裏行(xíng)間也(yě)能(néng)看出這家企業(yè)的(de)精神。
你(nǐ)還可(kě)以從Freddie不同的(de)頭像上(shàng)感受到(dào)這一點，不論是它微笑(xiào)、眨眼還是用(yòng)耳朵夾著(zhe)鉛筆(bǐ)的(de)時候，都(dōu)通過表情傳遞著(zhe)正能(néng)量，你(nǐ)可(kě)以直觀地(dì)體會(huì)到(dào)這個(gè)品牌形象接地(dì)氣的(de)設定，從容而有(yǒu)風度。現在，你(nǐ)幾乎可(kě)以在MailChimp所有(yǒu)的(de)頁面上(shàng)看到(dào)各種型态的(de)Freddie。
使用(yòng)視差效果講故事
雖然國内網站運用(yòng)的(de)還不夠多，但(dàn)是視差網站已經存在好幾年了，并且目前仍然處于潮流巅峰。而流行(xíng)本身很可(kě)能(néng)就證明(míng)了，這種網站設計(jì)本就是最簡單有(yǒu)效的(de)講故事的(de)方式。在使用(yòng)視差滾動設計(jì)的(de)網站中，一直向下滾動浏覽的(de)方式就是一個(gè)不斷透露更多信息的(de)過程，就像剝洋蔥一樣，它本質上(shàng)和(hé)講故事非常接近。
以The Royal British Legion爲例，這個(gè)網站就是通過視差滾動的(de)方式想你(nǐ)展示了捐助是如(rú)何全程使用(yòng)過來的(de)必要信息。當你(nǐ)向下滾動的(de)時候，這些充滿活力的(de)故事就通過視差特效一一展現在你(nǐ)的(de)眼前，你(nǐ)會(huì)看到(dào)軍團爲退伍老兵所提供的(de)各種各樣有(yǒu)益的(de)服務。
使用(yòng)過個(gè)性化來講故事
個(gè)性化是當代網頁設計(jì)中最重要的(de)因素之一。個(gè)性化是有(yǒu)效的(de)，而且是有(yǒu)力的(de)，當你(nǐ)爲企業(yè)和(hé)品牌尋求個(gè)性化的(de)時候，它就是拉近企業(yè)/品牌和(hé)客戶之間距離(lí)的(de)神奇工(gōng)具，因爲當你(nǐ)使用(yòng)個(gè)性化的(de)時候，訪客、粉絲和(hé)客戶會(huì)與這個(gè)品牌産生認同感和(hé)共鳴，如(rú)此一來，自然就會(huì)産生更大(dà)的(de)利潤空間和(hé)可(kě)能(néng)性。
個(gè)性化讓你(nǐ)的(de)品牌講述它偉大(dà)的(de)故事。就以Pet Relocation爲例子，在這個(gè)網站的(de)團隊介紹頁面中，每個(gè)成員都(dōu)倍受矚目，這與傳統的(de)“關于我們”頁面有(yǒu)著(zhe)巨大(dà)的(de)差别。你(nǐ)會(huì)在頁面中看到(dào)團隊中每個(gè)人(rén)、每個(gè)寵物(wù)的(de)微笑(xiào)著(zhe)的(de)頭像，當你(nǐ)鼠标移動到(dào)頭像上(shàng)的(de)時候，頭像會(huì)變成更加個(gè)性化的(de)樣子——更萌、更有(yǒu)趣。而這種設計(jì)正是要告訴訪客，這家機構的(de)企業(yè)文(wén)化 是講究放(fàng)松和(hé)自然的(de)。
結語
在人(rén)類還生活在洞穴中的(de)時候，牆壁上(shàng)的(de)繪畫就在講述著(zhe)部落的(de)故事。對人(rén)類而言，講故事本就是一個(gè)自然地(dì)傳遞信息的(de)方式，直到(dào)今天，它也(yě)依然是網頁設計(jì)中最重要的(de)方式之一。你(nǐ)會(huì)發現，不僅越來越多的(de)企業(yè)和(hé)品牌機構都(dōu)會(huì)采用(yòng)講故事的(de)方式來呈現自己，普通的(de)網站設計(jì)中也(yě)會(huì)在越來越的(de)細節中，融入故事性。
