首頁

表單設(shè)計(jì)與轉(zhuǎn)化率的提升

藍(lán)藍(lán)設(shè)計(jì)的小編

 

無論是用于注冊(cè)、支付還是聯(lián)絡(luò),我們總是需要通過表單來獲取用戶的信息。不幸的是,在現(xiàn)實(shí)當(dāng)中,總會(huì)有很多訪問者一見到表單就會(huì)立刻點(diǎn)擊瀏覽器上的后退按鈕。這里面原因有很多,例如表單篇幅太長、不大友好、不那么值得信任,或是用戶還沒真正準(zhǔn)備好進(jìn)行交易等等。

這種情況每發(fā)生一次,我們就失掉了一個(gè)潛在用戶。怎樣將表單設(shè)計(jì)的讓盡量多的訪問者更愿意完成填寫,這是設(shè)計(jì)師們必須面對(duì)的挑戰(zhàn)。站在用戶的角度,我們可以將問題分為四個(gè)方面。

我能得到什么?

一提到“轉(zhuǎn)化”,設(shè)計(jì)師們首先想到的往往是一些相關(guān)操作的細(xì)節(jié)問題,包括按鈕的顏色、標(biāo)題的字號(hào)、對(duì)比度、對(duì)其方式等等。當(dāng)然,這些是必須考慮的,但最最首要的問題是:作為網(wǎng)站的訪問者,我為什么要填寫表單?我能得到什么?

訪問者不會(huì)簡單的因?yàn)槟闾岢隽讼嚓P(guān)要求而把自己的個(gè)人信息透露給你;你要讓他們看到這樣做的好處在哪里。不妨把這件事看作一種交易,你的訪問者提供他們的名字與郵箱地址,從而換取到一些他們需要的東西,例如享受服務(wù)、免費(fèi)試用軟件、下載PDF文檔等等。

點(diǎn)擊查看原圖

除了讓瀏覽者知道他們能得到什么東西以外,你最好還能告訴他們這東西為什么是他們所需要的。要聚焦在產(chǎn)品的價(jià)值上,如果你能用最簡單的介紹文字描述出你的產(chǎn)品能幫用戶解決怎樣的問題,喚起他們的共鳴,那么即使表單本身稍微復(fù)雜些,他們也會(huì)愿意完成填寫;否則,字段最少的表單也不會(huì)引起他們的興趣。

年度最佳的30個(gè)名片設(shè)計(jì)

藍(lán)藍(lán)設(shè)計(jì)的小編

 某國外設(shè)計(jì)網(wǎng)站連續(xù)12個(gè)月評(píng)選出月度精選名片設(shè)計(jì)之后,在年底推出了年度最佳的30個(gè)名片設(shè)計(jì)。在這30個(gè)入選的名片中,造型感突出的名片顯然比較受歡迎,尤其是與各自行業(yè)相關(guān)的創(chuàng)意名片讓人驚喜不已。 
 

ade_chong005.jpg

精彩的公司宣傳樣本欣賞

藍(lán)藍(lán)設(shè)計(jì)的小編

精彩的公司宣傳樣本欣賞!最近要設(shè)計(jì)一些白皮書,藍(lán)藍(lán)采集了許多公司樣本,這是其中一部分,分享!點(diǎn)擊查看原圖

30幅動(dòng)人心脾的優(yōu)秀攝影作品欣賞

藍(lán)藍(lán)設(shè)計(jì)的小編

 這篇文章向大家分享30幅精美的高速攝影作品。高速攝影能夠拍攝到肉眼看不見的瞬間動(dòng)作:如子彈飛出膛時(shí)的運(yùn)動(dòng)狀態(tài);足球被射門時(shí)的動(dòng)作過程;還有我們?cè)陔娨暲锝?jīng)常看到一滴乳液落進(jìn)乳汁里產(chǎn)生的優(yōu)美的漣漪。它不僅揭示出人眼難以看到的自然界的現(xiàn)象,還能創(chuàng)造出一種運(yùn)動(dòng)的美的形式,或某種寓意和象征。

Apple

高速攝影作品欣賞

分享42個(gè)優(yōu)秀的名片設(shè)計(jì)案例

藍(lán)藍(lán)設(shè)計(jì)的小編

名片,中國古代稱名刺,是標(biāo)示姓名及其所屬組織、公司單位和聯(lián)系方法的紙片。名片是新朋友互相認(rèn)識(shí)、自我介紹的最快有效的方法。交換名片是商業(yè)交往的第一個(gè)標(biāo)準(zhǔn)官式動(dòng)作。今天,本文與大家分享42個(gè)優(yōu)秀的名片設(shè)計(jì)案例,希望能帶給你靈感。Love Money

Inner Wave Studios

生活的色彩——攝影作品欣賞

藍(lán)藍(lán)設(shè)計(jì)的小編

你有沒有想過假如生活中沒有顏色會(huì)是什么樣?顏色無處不在,我們?cè)缫蚜?xí)以為常了。假如生活真的沒有了顏色,世界會(huì)變成什么樣,我們無法想象。今天,本文收集了30個(gè)例子,通過黑白照片和彩色照片對(duì)比,讓你感受顏色在我們生活中的重要性和意義。

A magical place

black and white A magical place

A magical place

2012年最佳免費(fèi)網(wǎng)站和移動(dòng)應(yīng)用 PSD 界面素材揭曉

藍(lán)藍(lán)設(shè)計(jì)的小編

眨眼間,2012年又要過去了,長期關(guān)注 WDL 的朋友都知道,每到年末,WDL 將發(fā)布一系列本年度 Web 開發(fā)和設(shè)計(jì)領(lǐng)域的最佳資源。今天這篇文章與大家一起分享這一年來設(shè)計(jì)師們分享的最佳免費(fèi) PSD 用戶界面素材,包含滑塊、表單、按鈕、菜單、進(jìn)度條、播放器等等。這些免費(fèi)的 PSD   素材資源對(duì)于網(wǎng)頁設(shè)計(jì)師來說都非常有用,既能節(jié)省時(shí)間又能有很好的效果。記得分享和推薦一下哦 :)

 

Light UI Kit in CSS and HTML

非常好的一套界面設(shè)計(jì)素材資源,提供了 PSD  源文件和HTML/CSS代碼下載。

Beautiful UI Kits For Web and Graphic Designers

Pure and Modern UI Kit

非常有質(zhì)感的一套現(xiàn)代風(fēng)格 UI 素材資源,包含音樂播放器、表單元素和各種操作按鈕。

Beautiful UI Kits For Web and Graphic Designers

12款非常精致的免費(fèi) HTML5 & CSS3 網(wǎng)站模板

藍(lán)藍(lán)設(shè)計(jì)的小編

01. Joefrey Mahusay

很炫的單頁網(wǎng)站模板,基于 HTML5 & CSS3 制作,適合用于設(shè)計(jì)師個(gè)人簡歷、攝影師和平面設(shè)計(jì)師的個(gè)人作品展示。

BFHCT 35

演示   下載

02. Folder

Folder是一款響應(yīng)式 HTML5 網(wǎng)站模板,能夠自適應(yīng)各種設(shè)備和瀏覽器尺寸。適合用于創(chuàng)意展示和企業(yè)網(wǎng)站項(xiàng)目。

BFHCT 30

演示   下載

Win8 Metro UI風(fēng)格Web資源大收集

藍(lán)藍(lán)設(shè)計(jì)的小編

最近微軟已經(jīng)正式發(fā)布了Windows8 操作系統(tǒng),Window操作系統(tǒng)的風(fēng)格已經(jīng)完全改變成了瓦片狀的Metro UI。

對(duì)于微軟來說這是一個(gè)巨大的改變,而且所有微軟的平臺(tái)包括,桌面,平板,移動(dòng)及其網(wǎng)站都使用這個(gè)UI風(fēng)格。

Metro UI包含了所有的現(xiàn)代Web設(shè)計(jì)的特點(diǎn),包括了,簡化,基于網(wǎng)格的界面,并且富有連續(xù)性。 大家如果有興趣可以看看這個(gè)界面設(shè)計(jì)說明(http://msdn.microsoft.com/en-us/library/windows/apps/hh465424.aspx )。

如果你也喜歡Metro風(fēng)格的話,這里我們收集了很多windows 8的Metro UI風(fēng)格布局資源,希望大家喜歡!

Metro風(fēng)格的網(wǎng)站框架和模板

Metro UI CSS

Metro UI CSS是一個(gè)非常完整的創(chuàng)建Metro風(fēng)格的網(wǎng)站的框架。使用LESS創(chuàng)建,并且擁有網(wǎng)格系統(tǒng),排版樣式,表格,按鈕和圖片。

同時(shí)也擁有內(nèi)建的javascript組件,幫助你生成片狀,菜單,邊欄,進(jìn)度條,提示等等

etro UI CSS

BootMetro

BootMetro是一個(gè)Twitter Bootstrap的Metro風(fēng)格主題。你可以創(chuàng)建Metro風(fēng)格的樣式。例如,片狀UI,工具欄,其它組件。

metro-bootstrap

日歷

鏈接

個(gè)人資料

存檔