如何讓設(shè)計(jì)的關(guān)鍵一秒鐘映入眼簾
如果你的網(wǎng)站顏色很單調(diào),形狀規(guī)規(guī)矩矩,那么,你的用戶一定只是走馬觀花,讓用戶知道并去使用網(wǎng)站的新產(chǎn)品或某個(gè)point,必須是讓用戶看到以及有讓用戶去點(diǎn)擊的欲望。接下來,我們從視覺的角度談?wù)勗趺慈プ層脩艨吹?,使要突出的?nèi)容鶴立雞群。
一、醒目的顏色
“萬綠從中一點(diǎn)紅”中的“紅”固然容易被發(fā)現(xiàn),用顏色上的沖撞來突出關(guān)鍵點(diǎn)是常見的方法之一。
二、不同的形狀
不同的形狀會(huì)使內(nèi)容從千篇一律的模式中嶄露頭角,從而吸引用戶的關(guān)注,這種方法常用于引導(dǎo)注冊(cè)或消費(fèi)等去指引用戶參與到網(wǎng)站活動(dòng)中進(jìn)行交互,凸顯網(wǎng)站的某方面優(yōu)勢(shì)。
三、加入背景色
添加亮麗明顯的背景色也是目前使用較多的方法,市面上的眾多網(wǎng)站都能見到這樣類似的引導(dǎo)。最常見的是鼠標(biāo)懸停時(shí)會(huì)顯示背景,也有固定顯示背景的,如電子商務(wù)類的大分類會(huì)加入背景色。
四、加外框
這個(gè)方法和加背景屬于同一個(gè)性質(zhì)。不過在中國(guó)四周加邊框有其他含義。所以經(jīng)常用到的還是底邊的下劃線。如網(wǎng)易新出來的一個(gè)功能,可以顯示用戶從上次訪問到現(xiàn)在的更新資訊,用加下劃線表示。
五、不成一條直線
將要突出顯示的內(nèi)容高于其他內(nèi)容 從而達(dá)到特別,去引導(dǎo)用戶,最常見的還是在導(dǎo)航,或者網(wǎng)站地圖中突出某一個(gè)服務(wù)。
六、填充
填充看上去和加背景色差不多,不過這個(gè)方法要比加背景色更廣義一點(diǎn)。加背景色只是把容器加了底色,而填充的概念是把容器給填滿了而填充物品不局限于顏色,可以有豐富多彩的樣式。
七、讓內(nèi)容動(dòng)起來
動(dòng)態(tài)的物體總會(huì)比靜止的耀眼,同樣的互聯(lián)網(wǎng)產(chǎn)品里,靜止的文字中突然有一行文字在來回晃動(dòng)。那么肯定能吸引眼球。
八、陰影
陰影能使人的眼球?qū)ξ矬w產(chǎn)生立體的感覺,同樣能夠使產(chǎn)品凸顯出來。
九、凹凸(立體感)
凹凸效果也是常見的起到重點(diǎn)突出的作用,最多的是按鈕的表現(xiàn)手法,一個(gè)視覺很好的按鈕足以讓人產(chǎn)生點(diǎn)擊的欲望。
十、閃爍效果
相信你閱讀在這里的時(shí)候一定很容易的發(fā)現(xiàn)上圖在跳躍的文字了吧,的確這種方式是很能吸引到用戶的注意,但是網(wǎng)頁上如果很多這樣的效果,會(huì)顯得很不友好。
十一、清晰度
平面設(shè)計(jì)中常采用局部模糊來烘托出重點(diǎn)展示的部分,在網(wǎng)站的品牌設(shè)計(jì)或者宣傳類設(shè)計(jì)亦可用這用方法。
本文地址:http://m.likemindfilms.com/tutorial/di1964.html
您可能還喜歡
- Macaron 馬卡龍系色譜 ;附HC(16進(jìn)制碼
- 7個(gè)手機(jī)版網(wǎng)頁設(shè)計(jì)的原則
- 折紙多邊形網(wǎng)頁背景效果制作教程
- 龐門正道:好好玩耍的點(diǎn)線面(上)
- 網(wǎng)頁設(shè)計(jì)中的常見頁面布局方式
- WAP APP的柵格設(shè)計(jì)
- 八種很漂亮的排版方法和技巧分享
- 網(wǎng)頁設(shè)計(jì)的首屏標(biāo)準(zhǔn)你了解多少?
- 字體大寶庫(kù):40款為網(wǎng)頁設(shè)計(jì)師準(zhǔn)備的時(shí)
- 視覺設(shè)計(jì)分享—專題頁面設(shè)計(jì)篇
- 專訪:石墨文檔產(chǎn)品總監(jiān)羅穎
- UI設(shè)計(jì)不得不知的移動(dòng)端UI尺寸適
- 光音移動(dòng)設(shè)計(jì)規(guī)范 — 表單類
- 體驗(yàn)設(shè)計(jì)中的排序問題
- 網(wǎng)頁設(shè)計(jì)精粹 網(wǎng)頁中那些迷人的按
- aliued:響應(yīng)式設(shè)計(jì)的現(xiàn)狀與趨勢(shì)
- 10個(gè)智能對(duì)象處理的ps技巧
- 網(wǎng)頁UI - 原子設(shè)計(jì)理論(上)
- 如何通過設(shè)計(jì)提升banner點(diǎn)擊率?
- 晉小彥視覺設(shè)計(jì)系列文章(二):全屏