您當前位置:圖趣網(wǎng)(Tuquu) >> 網(wǎng)頁設計教程 >> 設計理論 >> 瀏覽設計教程

網(wǎng)頁設計如何做才能讓用戶有“參與感”?

參與感一詞最近很火,也是打動用戶一個非常有效的表現(xiàn)手法,今天阿里的同學從這個角度聊聊如何做網(wǎng)頁設計,利用空間法則、抽象法則和換角度法則給用戶更多的愉悅感和融入感,非常有料的一篇教程,來漲姿勢吧。

  遇到的問題

  在設計運營類需求時,我們采用的比較常規(guī)的設計形式是先設計一個漂亮的頭圖然后再將信息內(nèi)容進行排版填充,當遇到頁面中的文字元素比較繁冗時,大量內(nèi)容的堆砌不僅很容易讓用戶瀏覽時產(chǎn)生疲勞,而且設計師在這個過程中也會容易陷入在傳統(tǒng)框框里無法突破,在設計時感到枯燥乏味、越做越無趣。平時采集設計靈感時我們會注意到現(xiàn)在很多優(yōu)秀的運營設計已經(jīng)不僅僅局限于常規(guī)的形式,而是越來越注重整體畫面給用戶帶來的更多愉悅感及融入感。怎樣突破常規(guī),讓頁面在形式及情感上更吸引用戶是我們設計師值得思考的問題。

  什么樣的設計形式能更有趣、更容易打動用戶?運營設計主要表現(xiàn)手法之一就是通過制造情景來渲染主題氣氛。對“情景”的理解一層指場景、環(huán)境;氛圍有了,那試試再增加一些情緒上的感染和共鳴把,“情景”的另一層就是指人物,情節(jié),景物喚起人的情緒和內(nèi)心境界。制造情景體驗一方面是把頁面信息放置到貼近生活的真實環(huán)境中,讓畫面符合主題并且非常直觀,另一方面能引導用戶展開想象,喚起某種記憶,讓用戶有身臨其境的感受。

  用戶不僅作為一個看客,還能以第一人物的視角參與到畫面中,讓用戶迅速置身場景中,帶動情緒,引發(fā)用戶興趣去完成后續(xù)操作。這里總結出一些打造情景體驗的具體方法及例子幫助大家去設計更有意思的運營頁面:

  空間法則

  空間感的渲染能讓人更有“身臨其境”的感覺,這種方式主要根據(jù)主題模擬真實場景,再通過整體透視的構圖使畫面呈現(xiàn)立體空間感,增加畫面沖擊力強,一下子吸引把用戶代入到氛圍中。我們來看幾個例子:

如何設計網(wǎng)頁才能讓用戶有“參與感”? 三聯(lián)
ali2015 (1)

  以上的例子都通過空間打造增加畫面代入感,畫面的氣氛和現(xiàn)實生活中的場景極其相似,用戶很容易被吸引到氣氛中。需要注意的是這種立體場景的搭建對素材及整體層次的控制力要求比較高,在設計的時候需要先搭建大的畫面關系,再往里頭添細節(jié)和內(nèi)容,同時也要注意不要讓場景搶了內(nèi)容的視覺焦點,在適當?shù)臅r候還需要做些減法。

  抽象法則

  不同于上面提到的逼真空間搭建方法,這種設計方式雖然也是選取現(xiàn)實存在的對象,但是需要提煉一個可以將內(nèi)容信息巧妙的融合串聯(lián)的承載容器構建出主體輪廓,然后再將內(nèi)容填充到輪廓里面。這種形式能夠讓用戶一眼就能了解到一些信息,同時又能貼合主題很好地傳達情景氛圍,讓頁面生動更有趣味性,特別適合一些節(jié)日主題的運營頁面。

ali2015 (2)
ali2015 (3)

  把內(nèi)容放到盒子里或者一封情書中,頓時就產(chǎn)生了親切感,抽象的主題通過實體顯性化地表達出來,第一眼就能明白主題。這種方法需要選取合適的現(xiàn)實元素并對其高度概括,注意將形狀盡量精簡強調(diào),避免太具象,適當?shù)厣釛壱恍┓爆嵉?、不必要的元素,以免影響閱讀的內(nèi)容。

  換角度原則

  除了還原真實場景,角度的不同也會呈現(xiàn)不一樣的形式和感受,千篇一律的規(guī)則視角會難免讓頁面顯得單調(diào)平庸。不妨試試模擬真實生活中的視角,我們來看幾個例子:

b58a4d7ad8c94c8393dd88017a78b66568fc1d0865f97-h82bVk_fw658
11054IZ5-1

  這些例子往往是我們生活中很熟悉的情景卻容易被忽略,工作中俯視看到正在寫作的區(qū)域,對頁面的傾斜還原最真實的狀態(tài);吃飯時關注自己盤子中食物的角度,親切的視覺感受令人置身其中,感染力非常強。同樣的元素主題往往變換一下畫面視角的方式能巧妙的打破常規(guī)構圖的呆板并不落俗套,讓頁面輕松活躍。同時真實的場景一下次拉近了和用戶的距離,也很容易和用戶內(nèi)心產(chǎn)生共鳴。不過變換角度可能不太適合文字正常閱讀,要注意文字排版保證流量的舒適性。

  局部突出法則

我們常??吹胶芏嚯娪昂蟮脑O計中會截取某部分的方式作為的重心集中表現(xiàn),最大化也是最突出,以小見大來引起注意,同時“猶抱琵琶半遮面”的方式制造更多懸念,引起觀眾興趣及思考。具體運用在運營設計中又是怎么做的呢?我們來看幾個例子來體會其中的設計思路。

518f2701c8473e2dc35d01ec77e07488ed2c5a9010be58-Bg82jV_fw658
bdc815cf6b602fdb13e271a43fd2e8f4f84da8866ca8e-U7fvZ0_fw658

  以上的例子都是通過截取局部來吸引眼球,這種某個局部特征被放大強調(diào)的方式推翻我們常規(guī)的視覺習慣從而讓感情集中強化,視覺充滿神秘感瞬間抓住了用戶的眼球,頁面的目的也就達到了。這種方法可以多從電影、攝影中借鑒手法,通過特殊的視角打造出精彩的畫面。

  小結

  制造頁面中情景體驗主要通過還原現(xiàn)實場景再加以藝術化的表達來增強頁面的整體氣氛,讓用戶不用去閱讀文字就能很快明白這是個跟主題相關的頁面,代入感極強,能比較直觀獲取信息;同時擬物具象的方式也減少了用戶認知成本,親和的設計形式在情感上給用戶更多情共鳴。當然這種方式需要設計師日常要注意觀察生活中的細節(jié),多聯(lián)想與各場景相關的事物,不一定需要靠素材的堆積也能打造出動人的頁面一擊擊中用戶。

  運營設計現(xiàn)在越來越注重個性、趣味性以及視覺沖擊力,頁面的形式和技巧也是多種多樣,以上總結的方法希望能幫助大家在設計遭遇瓶頸時找尋一些解決思路。設計師需要時刻靈活創(chuàng)新汲取靈感,才能夠避免按習慣性的思維去設計,不斷創(chuàng)造出新的視覺表現(xiàn)。當然還有更重要的是運用方法多多進行實踐轉化成自己的東西,才能得到能力上的有更大地提高。

[教程作者:zhuying]
免責聲明:本站文章系圖趣網(wǎng)整理發(fā)布,如需轉載,請注明出處,素材資料僅供個人學習與參考,請勿用于商業(yè)用途!
本文地址:http://irelandcustomcontracting.com/tutorial/di2616.html
網(wǎng)頁設計論:sloagn排版、斷句/段據(jù)?
跟隨阿里-淺析數(shù)據(jù)化設計思維
圖趣網(wǎng)微信
建議反饋
×