轉(zhuǎn)載藍(lán)藍(lán)設(shè)計(jì)(   m.bouu.cn  )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(nèi)外企業(yè)提供有效的   BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、  ipad界面設(shè)計(jì)   、  包裝設(shè)計(jì) 、  圖標(biāo)定制 、  用戶體驗(yàn) 、交互設(shè)計(jì)、   網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)

來源：http://www.uisheji.com/212439.html 

如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中，   請點(diǎn)這里

我們做的每個(gè)項(xiàng)目都有各自獨(dú)特的游戲風(fēng)格和設(shè)計(jì)要求，但是所做的每一個(gè)設(shè)計(jì)都希望他們能給人留下深刻的印象。令用戶難忘的體驗(yàn)之一是要讓設(shè)計(jì)有趣。在這次分享中，我們將探討如何利用“有趣”的創(chuàng)意幫助我們的設(shè)計(jì)更吸引人，成為更優(yōu)秀的網(wǎng)站。

“有趣的”想法

創(chuàng)造一個(gè)愉快的用戶體驗(yàn)，用戶可能不會(huì)一直記得，但是，他們可能會(huì)告訴別人。

當(dāng)你想表達(dá)自己想法時(shí)，無論是使用語言還是使用“圖畫”，掌握的素材自然是越多越好。豐富的素材能使想法或感覺表達(dá)得更、鮮活。然而當(dāng)我們需要“輸出”想法的時(shí)候，有時(shí)卻發(fā)現(xiàn)頭腦中亂作一團(tuán)毫無頭緒。在創(chuàng)意想法上花費(fèi)的時(shí)間占整個(gè)設(shè)計(jì)時(shí)間的三分之一甚至更多。通常是邊做邊想修修調(diào)調(diào)，耗費(fèi)很多時(shí)間。

廣告設(shè)計(jì)≠網(wǎng)站設(shè)計(jì)？

廣告設(shè)計(jì)和網(wǎng)站設(shè)計(jì)相當(dāng)于虎和貓，都屬于貓科動(dòng)物，但又不是同一種生物，在視覺元素、呈現(xiàn)方式、信息載體、傳播途徑等方面有著很大的差別；在創(chuàng)意上卻是同根生，都是挖掘產(chǎn)品的特性進(jìn)行創(chuàng)新，注重生活中創(chuàng)意素材的積累。

看看下面的設(shè)計(jì)做了哪些工作留住用戶的心吧~

>廣告營銷案例1

創(chuàng)始于1992年的化妝品品牌LISSAGE麗雅姬。 設(shè)計(jì)師的靈感來源于曾經(jīng)在巴黎一家品牌概念店墻角見過的一只滅火器，經(jīng)過鍍鉻成銀白色的滅火器高貴又華麗。正是由于手壓式滅火器設(shè)計(jì)，麗雅姬成為同行中第一款采用手壓式容器的品牌。這一新穎實(shí)用的設(shè)計(jì)在當(dāng)時(shí)引起了很大反響，市場銷量大增，榮獲了“最佳化妝品”獎(jiǎng)，在女性雜志等媒體的刊載率也翻了一倍。

>廣告營銷案例2

東京都利川市藤幼兒園，設(shè)計(jì)師提出“校舍本身就是一個(gè)巨大的玩具”將幼兒園打造成孩子們最好的玩具一個(gè)游樂場。校舍設(shè)計(jì)成甜甜圈形狀，大樹從房頂穿過，孩子們能夠爬上屋頂自由奔跑，還能從上面乘滑梯下來。為了便于向社會(huì)宣傳，還為幼兒園設(shè)計(jì)了標(biāo)志，將他們貼在孩子們的T恤和書包、幼兒園接送車以及網(wǎng)站等媒體上，這次設(shè)計(jì)成為教育領(lǐng)域的一個(gè)典型案例。

只有在理解設(shè)計(jì)真正意義的基礎(chǔ)上重視設(shè)計(jì)，才能最大限度地發(fā)揮它的作用。

給自己在意的東西貼上標(biāo)簽輸入大腦素材庫，設(shè)計(jì)師需要站在客觀和理性的高度觀察日常生活，進(jìn)行深度挖掘，并將多個(gè)視角感知到的東西貼上“標(biāo)簽”輸入大腦，為設(shè)計(jì)準(zhǔn)備素材。

“創(chuàng)意=創(chuàng)造性地解決問題”，鑰匙就藏在客戶手中，我們要做的只是把它們引導(dǎo)出來，因此創(chuàng)意永遠(yuǎn)不會(huì)有枯竭的一天。

改善思路

改動(dòng)一小步前進(jìn)一大步，小小的創(chuàng)意也許能成為頁面設(shè)計(jì)的點(diǎn)睛之筆？麻雀變鳳凰！

>圖片選擇

俗話說，一圖勝千言，圖片是網(wǎng)頁中重要的組成部分。盡管這對于一款設(shè)計(jì)來說，是否正確利用了圖片并不是多大的影響，但是這些圖片可能會(huì)減少銷售產(chǎn)品的機(jī)會(huì)，除非有一個(gè)很好的誘導(dǎo)用戶的頁面或者創(chuàng)造了很好的閱讀條件。處理圖片應(yīng)該是設(shè)計(jì)師們更加需要理解和掌握的能力。

研究表明，使用了真人或者真實(shí)產(chǎn)品的圖片會(huì)自動(dòng)被大腦標(biāo)志為重要并能被進(jìn)一步地關(guān)注。如果你有一個(gè)個(gè)人博客，大家更希望看到的是你真人頭像而不是一張繪畫像。人們想看到正在與他們交流的人的樣貌，因?yàn)檫@對信任的建立尤其重要。

例：總部設(shè)在英國的生物突變實(shí)驗(yàn)室，這無非是一個(gè)無聊的生物公司網(wǎng)站，在圖素選擇上添加小小的創(chuàng)意，通過真人拍攝讓用戶更清楚了解到該實(shí)驗(yàn)室的工作生活環(huán)境。使用圖片去描述公司員工是一個(gè)非常棒的想法，它給外界提供了一個(gè)很親切的途徑去了解這家公司的員工生活。如果能支付得起，拍攝些好的創(chuàng)意照片，這會(huì)為公司的網(wǎng)站增色不少。

例：人大官網(wǎng)的女神圖，死氣沉沉的大學(xué)官網(wǎng)為了搶奪生源也一改往日嚴(yán)肅風(fēng)格開始走親民路線，這樣的大學(xué)怎能不吸引宅男，狠抓用戶口味是多麼重要。

>表單設(shè)計(jì)

當(dāng)用戶點(diǎn)擊了注冊鏈接之后，他很有可能想要注冊你提供的服務(wù)。重要的是，沒有更深的導(dǎo)航鏈接或者具有吸引力的廣告鏈接。

因此，去掉所有沒必要的詳細(xì)資料以及不能幫助用戶完成表單的描述。常常只呈現(xiàn)一個(gè)logo和表單自身，用戶會(huì)盡可能地關(guān)注在他要去完成的任務(wù)上。任何會(huì)分散用戶注意力的因素不應(yīng)該被保留。設(shè)計(jì)師要幫助用戶盡可能快速和無痛地完成注冊流程。

根據(jù)調(diào)查，61%的web表單和普遍的頁面相比更簡單。

靈活性的創(chuàng)意網(wǎng)站可以根據(jù)頁面本身的產(chǎn)品特性做相應(yīng)的變形或抽象設(shè)計(jì)，表現(xiàn)效果上更具象。

除了創(chuàng)意性網(wǎng)站外，傳統(tǒng)形網(wǎng)站表單夸張的樣式反而會(huì)喧賓奪主，在背景、外邊框上做些創(chuàng)新會(huì)更適合。

>錯(cuò)誤=好玩？404！

404頁面的目的是告訴瀏覽者其所請求的頁面不存在或鏈接錯(cuò)誤，同時(shí)引導(dǎo)用戶使用瀏覽網(wǎng)站的其他頁面而不是關(guān)閉網(wǎng)頁離開。花時(shí)間去設(shè)計(jì)一個(gè)創(chuàng)意的404錯(cuò)誤頁面是一件非常值得的事情，盡管這個(gè)頁面被看到的概率很小。下面分享的這些404錯(cuò)誤頁面設(shè)計(jì)相信能帶給你你眼前一亮的感覺。

>為設(shè)計(jì)添加一筆亮點(diǎn)

瞬間被干凈整潔的版面帶入環(huán)境中，內(nèi)容區(qū)基本按照自身產(chǎn)品樣式做版式設(shè)計(jì)，RSS郵件產(chǎn)品的特性在其中展露無遺，最有趣的是logo和相框中猴子的呼應(yīng)。

《新水滸Q傳》cover頁進(jìn)入官網(wǎng)按鈕，為與“五轉(zhuǎn)新生”的slogan呼應(yīng)將按鈕設(shè)計(jì)成羅盤指針形式不停搖擺。

講一個(gè)好故事更吸引人

把頁面當(dāng)作一個(gè)連貫性的故事，用生動(dòng)有趣的形式為觀眾們講述，是不是比簡單的圖文混排會(huì)更有意思？

云房子該網(wǎng)站主要針對少兒類創(chuàng)意視頻設(shè)計(jì)，設(shè)計(jì)亮點(diǎn)在：林中木屋、各種奇幻包容下的世界，這是大多數(shù)人童年時(shí)代都幻想過的場景，木屋承載著頁面的框架和板塊內(nèi)容，每一處角落中都隱藏著與用戶的互動(dòng)交流的小驚喜，充滿發(fā)現(xiàn)和未知探索。該網(wǎng)站在設(shè)計(jì)形式上也是非常繁復(fù)，但由于放置在接近頁面頂部的標(biāo)語——“一個(gè)小小的創(chuàng)意設(shè)計(jì)工作室，致力于影音，娛樂，和奇思妙想?！焙芸毂闱宄@家公司的性質(zhì)！

網(wǎng)站，建立“液體產(chǎn)品灌裝和包裝線”，集成了一個(gè)精彩的動(dòng)畫灌裝生產(chǎn)線，加強(qiáng)了整套生產(chǎn)線這一信息傳達(dá)。從網(wǎng)站設(shè)計(jì)（裝瓶開始的地方）的頂部一路到底部（搬送至貨車運(yùn)走），整個(gè)網(wǎng)站很好的傳達(dá)了公司業(yè)務(wù)服務(wù)的主要流程。一個(gè)有趣的動(dòng)畫，跨越了整個(gè)一條龍生產(chǎn)線。

簡單的幾種小元素和顏色平鋪，排列形式非常活潑隨意，書寫體和簡單的標(biāo)簽文字內(nèi)容，運(yùn)用JS控制主體和云層、山脈、波浪等元素的滑動(dòng)速度，出現(xiàn)空間落差，實(shí)現(xiàn)從天空到地面到海底的縱向穿透。

吸管中液體滴落延展出的點(diǎn)線面3重組合，串聯(lián)出網(wǎng)站【關(guān)于我們】【工作流程】【組合投資】【聯(lián)系我們】幾塊內(nèi)容，采用線體連接的形式加入JS動(dòng)態(tài)彈性跳轉(zhuǎn)使本來有色塊區(qū)分的5大塊內(nèi)容也能連貫串聯(lián)。

鹿鼎記新春專題，碗狀設(shè)計(jì)很貼合“紅包快到碗里來”的主題，桌面做背景，紅色臺(tái)布、紅包、彩帶這些元素營造了強(qiáng)烈的環(huán)境氛圍感。

寫在最后：

優(yōu)秀的WEB體驗(yàn)好比一頓美味的大餐，產(chǎn)品策劃好比菜單創(chuàng)建者，設(shè)計(jì)師好比廚師，為這道菜添加適當(dāng)?shù)淖袅?、做下小?chuàng)新便能成就一席與眾不同的盛宴