在工作中需求方往往不是設計出身，提需求時傳達上往往也沒有辦法很好的表達自己的想法，在這種需求模糊的環(huán)境中往往做的 banner 會被需求方怒懟，而追問原因是，只會得到“不好看！”或者當我們每天瘋狂填充自己的素材庫時，很多小朋友都會有“該如何分辨作品的好壞”這樣的疑問，那到底什么樣的 banner 算是優(yōu)質(zhì)的 banner 呢？

一、簡單了解 Banner 本質(zhì)，Banner 在運營工作中的作用，從需求方的角度來看 banner 的作用大致分為兩種：

便于上線操作：如果直接投放活動內(nèi)容頁面，首先屏幕使用空間有限，不能多個活動共同展示，其次每次活動上線基本上都是凌晨，暫且不說累不累，在人工成本上就會消耗大半。如果遇到大促或者重要節(jié)日，那全體運營需要時時刻刻更改內(nèi)容。而 banner 的定時上架和權(quán)重排序大大減少運營工作成成本，提高工作效率。

清晰看到數(shù)據(jù)反饋：說白了，banner 就是廣告形式的一種，在一款 APP 中，除 banner 外還存在很多形式的廣告比如開屏廣告、彈窗廣告、落地頁內(nèi)嵌廣告等。而對于運營同學來說，他們需要清晰的了解每一條廣告，每一種投放形式的數(shù)據(jù)反饋，根據(jù)數(shù)據(jù)對每次活動的內(nèi)容進行復盤、優(yōu)化。應對以后的不同的活動形式。

優(yōu)質(zhì) banner 的特點，由于 banner 的位置和大小都屬于產(chǎn)品中的絕對的巔峰，但用戶在此頁面停留的時間往往很短暫，所以在整個產(chǎn)品頁面中，視覺層面會呈現(xiàn)鮮明的中心，設計層面需明確視覺層級關系，以最短的文案加上圖像形式直擊目標用戶內(nèi)心，使用戶快速獲取信息。

三秒原則，通過對市面上大多數(shù)產(chǎn)品 banner 進行研究，發(fā)現(xiàn)輪播中每一張 banner 停留時間不超過三秒，在這里我們需要做的就是在三秒內(nèi)傳遞用戶所有重要信息。

增強可讀性，由于 banner 是由文案、CTA 按鈕、配圖、裝飾元素、背景組成，增強識別性一般指的是文案以及按鈕元素。文案部分需要盡量精簡，控制在一級標題、二級標題、備注標題?三段式，針對不同的目標用戶做到內(nèi)容可讀性，確保用戶快速獲得信息。設計部分不僅要保證頁面整體美觀、觀看舒服，更重要的是確保信息層級關系，?引導控制用戶視覺動線?。其目的都是為引導用戶不斷的參與內(nèi)容，促使 banner 極大程度的轉(zhuǎn)化用戶，同時也間接提升了企業(yè)的商業(yè)價值。

二、Banner設計的核心目標

在我看來，與文字信息相比，我們更容易被圖形化的內(nèi)容所吸引，也更加能夠快速理解圖形化內(nèi)容。產(chǎn)品頁面的 banner 也是主要展示一些產(chǎn)品最近的活動或者一些傳遞產(chǎn)品內(nèi)容信息的圖片，而根據(jù) Jakob Nielsen（尼爾森十大可用性原則的那個男人）做了一個眼動實驗，發(fā)現(xiàn) 2010 年后用戶平均花費 80.7%的閱讀時間在前三屏，其中首屏時間占總時長的 57%。基于在第一時間抓住用戶注意的角度出發(fā)，我們必然將最顯眼，最突出的 banner 放在首屏的位置，這樣不僅讓我們進入頁面后第一時間看到，而且還可以在三秒內(nèi)了解具體主要宣傳信息。

正確傳達信息：有一天你的好朋友在過生日，你拿著一個生日禮物送給他，你的朋友肯定希望打開禮盒直接就能看到禮物，而如果里面和套娃一樣全是包裝盒，你的朋友也許只會這個表情，然后流露一絲尷尬。

有一天你的好朋友在過生日，你拿著一個生日禮物送給他，你的朋友肯定希望打開禮盒直接就能看到禮物，而如果里面和套娃一樣全是包裝盒，你的朋友也許只會這個表情，然后流露一絲尷尬。

什么是視覺動線？我們可以將一個 banner 理解成你大學所在的城市的地圖，回想一下當年你來到這所城市后，首先想到的是什么？以我來說，我大學是穩(wěn)坐中國宜居城市榜首的城市-成都，來到這所城市后首先想到的就是吃喝玩樂感受這座城市的美好。但我又不能沒有目的的亂逛，相信喜歡旅游的朋友都做過攻略，都是想在最短的時間內(nèi)逛某個城市，我也不例外，從路線到景點大小再到美食據(jù)點等等安排出一條最佳線路。而在欣賞景區(qū)的過程中如果遇到很不錯的的地方，肯定會記住之后頻繁到訪，為其消費?；貧w到 banner 中，視覺動線就是最終安排出的這一條旅游路線，而“做攻略的我”這個角色就相當于在手機面前的你“設計師”這個角色，由你來安排用戶在 banner 內(nèi)觀看內(nèi)容的順序，而“不錯的景點”對應在 banner 內(nèi)是可以讓用戶進行下一步行為，保證用戶留存，提高轉(zhuǎn)化率的亮點區(qū)域。

如何讓用戶跟隨視覺動線觀看？應用于 banner 內(nèi)容排布時受限于 banner 的長條尺寸，視覺盲區(qū)壓縮。往往將重要的信息放在左邊，右邊放主視覺圖形和其他元素。運用視覺元素創(chuàng)建一條虛擬的“動線”，引導用戶實現(xiàn)從左往右移動，符合用戶習慣性的眼動規(guī)律。在這種左右排版是最我們最容易上手的一種排版方式，雖然不算很驚艷，但是永遠不會出錯。其中根據(jù)文字與圖形級別高低決定采用左文右圖還是右圖左文。

二、實現(xiàn)用戶轉(zhuǎn)化

我在工作中，運營同學經(jīng)常將 banner 稱為“資源位”，從這個名稱就可以看出 banner 在整體頁面中的價值所在。它對產(chǎn)品來說起到了非常好的宣傳作用，用非常短的時間讓用戶幫助用戶了解主要內(nèi)容，通過 banner 傳達出的真實有效信息為用戶提供愉快、優(yōu)惠、收入、知識等情緒價值，促使用戶做出行為。這也大大降低了企業(yè)在傳播和獲客的成本，而且可以快速增強產(chǎn)品競爭力。

當下我們方方面面都在體現(xiàn)著良好的用戶體驗，由此我們在設計 banner 后，我們可以模擬用戶去檢查我們的 Banner，是否能直觀感受到畫面內(nèi)容，內(nèi)容是否吸引我們，是否第一眼就想了解畫面內(nèi)容參與其中。如果以上問題都是否定的，那可以說是相當失敗了！

在整個 Banner 中不光要看表面的圖形字體的美丑，更需要建立在用戶研究和事實之上貼近用戶，幫助用戶零成本了解畫面內(nèi)容，了解用戶行為，具體需求以及背后動機，從而打入用戶內(nèi)部，激發(fā)用戶操作，提高內(nèi)容轉(zhuǎn)化率。

分享名稱：Banner設計全方位教學！
本文網(wǎng)址：http://www.rwnh.cn/news8/319758.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供建站公司、云服務器、、用戶體驗、網(wǎng)站內(nèi)鏈、品牌網(wǎng)站制作

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)