變化無端的奇思妙想，特立獨(dú)行的交互模式，獨(dú)樹一幟的設(shè)計(jì)手法，它們常常來自于設(shè)計(jì)師的靈光一閃。在設(shè)計(jì)項(xiàng)目中加入一點(diǎn)奇思，不僅能夠提升整體設(shè)計(jì)的意境，而且常常會(huì)獲得點(diǎn)鐵成金的奇效。

不論這個(gè)奇異的點(diǎn)子落腳在一個(gè)微小的元素上，還是貫徹到整體的設(shè)計(jì)里，這種專屬于腦洞的奇特魅力會(huì)自然地吸引這用戶。許多奇妙的設(shè)計(jì)常見于女性化和兒童化的設(shè)計(jì)，但是它們的作用不僅止于這兩個(gè)類型。許多不同類型的設(shè)計(jì)項(xiàng)目都能夠融入奇思妙想，不過近期這類創(chuàng)意腦洞最容易同摩登復(fù)古設(shè)計(jì)風(fēng)的網(wǎng)頁結(jié)合起來使用。

說一千道一萬，我們不如看看設(shè)計(jì)師們都是怎么做的吧。

手寫字體

相比于我們常用的襯線體和非襯線體，手寫字體常常顯得更加真實(shí)，更加情緒化，相比之下也更加富有魅力，能夠?qū)⒄麄€(gè)設(shè)計(jì)的情感最大化。參考上面的Summer Fridays。

當(dāng)然，過猶不及。在使用手寫字體的時(shí)候，有些老生常談的問題值得注意：不要使用那些被用濫了的手寫字體。為了效果最大化，越接近于手寫效果的字體，越真實(shí)，效果就越好。而絕大多數(shù)的計(jì)算機(jī)設(shè)計(jì)的字體就正好缺乏這種真實(shí)性。所以，下面的幾個(gè)問題值得你考慮：

·盡量挑選擁有多種樣式可替換的字體族。當(dāng)同一個(gè)字母使用多次又需要有細(xì)微差別的時(shí)候，可以通過替換同族不同樣式的字體來實(shí)現(xiàn)這種差異。
·不要大規(guī)模使用手寫字體，盡量最低限度的使用確保效果最大化，比如只在標(biāo)題中使用。
·請務(wù)必保持風(fēng)格和基調(diào)的一致性。纖細(xì)的字體盡量和細(xì)體一起搭配使用，而粗體則盡量和粗體組合使用。

水彩畫

水彩畫屬于那種上手并不那么容易，但是用好了又特別贊的設(shè)計(jì)元素。它的使用方式很多，從背景到插畫都很不錯(cuò)，像上面的網(wǎng)站 Made of Sundays 就是很好的例子。

當(dāng)你使用水彩畫的時(shí)候，應(yīng)當(dāng)明確你的目的：拿它來干什么。想要充分用好它，要么盡可能讓界面全套的元素都沿用水彩元素，要么僅僅在較小的元素上使用水彩元素。

當(dāng)然，如果沒有其他對比強(qiáng)烈的視覺效果的時(shí)候，使用水彩元素也無傷大雅。如果你覺得水彩元素會(huì)喧賓奪主的話，不妨適當(dāng)?shù)氐鼈儭?/p>

插畫

沒有什么比漂亮精致的插畫更抓人眼球的了。插畫本身就是高識別度的設(shè)計(jì)元素，而你的設(shè)計(jì)則可以借此更好的被用戶所認(rèn)識。所以，一份設(shè)計(jì)優(yōu)秀的插畫能夠成為你的重要的“身份識別”。

你并不需要用大面積、整幅的插畫來證明什么，一個(gè)小的插畫，甚至是草圖就足夠了。Rachel's Ginger Beer 這個(gè)頁面僅僅只是使用幾幅小的插畫，就很好的營造出整體效果，展現(xiàn)出設(shè)計(jì)者的奇妙思路。

鮮艷的色彩

沒有什么比鮮艷的色彩更能能營造輕松愉悅的氛圍了。色彩本身就能讓用戶第一時(shí)間感受到，而大膽明亮的配色在情緒表達(dá)上也有著先天的優(yōu)勢，用戶能從中直接感受到有趣或者愉悅的情緒。

設(shè)計(jì)師的奇思妙想常常會(huì)用高飽和度的黃色、橙色和綠色來表現(xiàn)。實(shí)際上，即使是只使用這些色彩就已經(jīng)能夠達(dá)到效果了，并非必須使用高飽和度。

正在影響整個(gè)設(shè)計(jì)領(lǐng)域的扁平化設(shè)計(jì)和Material Design 為我們貢獻(xiàn)出許多奇妙的配色方案，如果你想調(diào)出不同凡響的配色方案，不妨從這里開始：

·Flat UI Color Picker
·Material Design Color Palette Generator

線條和筆觸

想要讓你的設(shè)計(jì)顯得輕盈的另外一種手法的就是將細(xì)線和纖細(xì)的筆觸貫穿整個(gè)設(shè)計(jì)。從主視覺元素、圖片的邊緣到字體的筆畫都使用線條和細(xì)筆觸來表現(xiàn)，最關(guān)鍵的是，這些元素營造出輕盈的感覺的同時(shí)，還擁有強(qiáng)大的包容性，承載你的奇妙構(gòu)思，加入更多自定義的、獨(dú)特的元素。

舉個(gè)最簡單的例子，即使是纖細(xì)的元素貫穿始終，你依然可以使用一些不那么纖細(xì)的元素與之搭配，形成對比?？纯?Sonikpass 這個(gè)設(shè)計(jì)，它就很好的融入了一些相對厚重的字體（注意背景），鮮亮的色彩和深沉的黑色文字、淺灰的背景形成了很好的對比，不單調(diào)也不繁復(fù)，陰陽調(diào)和。

簡單的動(dòng)效

雖然動(dòng)效主要是用來同用戶進(jìn)行交互、引導(dǎo)交互、呈現(xiàn)效果，但是也可以純是為了有趣而進(jìn)行設(shè)計(jì)。懸停特效、舞臺(tái)效果、跳動(dòng)、拉伸、擬物的運(yùn)動(dòng)等等等等，它們都能夠給用戶以情緒上的觸動(dòng)。

當(dāng)你要將一種獨(dú)特的想法注入到你的動(dòng)畫中的時(shí)候，務(wù)必記住它是要用來取悅用戶的。這也是為什么許多設(shè)計(jì)師在這么做的時(shí)候會(huì)選擇明亮的色彩或者結(jié)合有趣的插畫——用戶吃這一套。

Pharrell Williams 的網(wǎng)站就集成了許多不錯(cuò)的動(dòng)效，動(dòng)態(tài)磁貼式的布局，鮮艷的配色和各式各樣的懸停效果，它們不僅讓用戶讀取到更多的而內(nèi)容，而且更好的引導(dǎo)用戶去尋找他們想要的內(nèi)容。

有目的性的設(shè)計(jì)缺陷

通過設(shè)計(jì)來呈現(xiàn)完美和有目的性的設(shè)計(jì)出缺陷是同樣的道理。那些小瑕疵、小缺陷惹人注意，令人側(cè)目，是設(shè)計(jì)師故意為之，從而達(dá)到特定的目的。就像動(dòng)畫和電影中的各種致敬一樣，這些缺陷會(huì)成為你的優(yōu)勢。

這些缺陷可以以不同的形式存在于不同的地方：

·一條線比其他的線都要粗或者細(xì)
·文本中某幾個(gè)字和其他的字的字體明顯不同
·某個(gè)線條或者插畫和其他的部分明顯不對齊或者不一致
·明顯不匹配的元素相互混合
·不對稱的圖形和不一致的比例
·現(xiàn)實(shí)的元素和幻想的元素相互混合搭配

結(jié)語

如果你拿不準(zhǔn)你的奇妙想法能否迎合用戶，那么就從小的元素開始嘗試，一點(diǎn)一點(diǎn)嘗試中打磨這些元素。不要怕腦洞大，在這個(gè)時(shí)代想法很重要。有人習(xí)慣于平庸，不過更多的人在尋求不同，也許你的腦洞正好合用。

推薦一部腦洞大的合不攏的電影，哪怕是致敬也致敬得不同凡響。B站熟肉，為了致敬字幕都是繁體的 ，希望你喜歡：《Kung Fury》

【技多不壓身的設(shè)計(jì)師才有高薪資！】

1. 平面設(shè)計(jì)：《超贊！設(shè)計(jì)師完全自學(xué)指南》
2. 交互設(shè)計(jì)：《交互設(shè)計(jì)師修煉指南！教你從零開始成為優(yōu)秀交互設(shè)計(jì)師》
3. UI設(shè)計(jì)：《超實(shí)用新手指南！零基礎(chǔ)如何自學(xué)UI設(shè)計(jì)？》
4. 前端開發(fā)：《天貓高手來教你！零基礎(chǔ)如何系統(tǒng)地學(xué)習(xí)前端開發(fā)？》
5. 摳圖技巧：《從菜鳥到高手！PHOTOSHOP摳圖全方位攻略》
6. 配色方案：《色彩搭配速成！3個(gè)實(shí)用方法幫你全面搞定配色》
7. DPI指南：《基礎(chǔ)知識學(xué)起來！為設(shè)計(jì)師量身打造的DPI指南》
8. 交互設(shè)計(jì)自學(xué)路徑圖：《零基礎(chǔ)入門！給非科班生的自學(xué)路徑圖之交互設(shè)計(jì)篇》

原文地址：designshack
原文作者：CARRIE COUSINS
優(yōu)設(shè)譯文：@陳子木

本文由優(yōu)設(shè)網(wǎng)原創(chuàng)翻譯，請尊重版權(quán)和譯者成果，轉(zhuǎn)摘請附上優(yōu)設(shè)鏈接，違者必究。謝謝各位編輯同仁配合。

【優(yōu)設(shè)網(wǎng) 原創(chuàng)文章 投稿郵箱：2650232288@qq.com】

================關(guān)于優(yōu)設(shè)網(wǎng)================
"優(yōu)設(shè)網(wǎng)uisdc.com"是國內(nèi)人氣最高的網(wǎng)頁設(shè)計(jì)師學(xué)習(xí)平臺(tái)，專注分享網(wǎng)頁設(shè)計(jì)、無線端設(shè)計(jì)以及PS教程。
【特色推薦】
設(shè)計(jì)師需要讀的100本書：史上最全的設(shè)計(jì)師圖書導(dǎo)航：http://hao.uisdc.com/book/。
設(shè)計(jì)微博：擁有粉絲量150萬的人氣微博@優(yōu)秀網(wǎng)頁設(shè)計(jì) ，歡迎關(guān)注獲取網(wǎng)頁設(shè)計(jì)資源、下載頂尖設(shè)計(jì)素材。
設(shè)計(jì)導(dǎo)航：全球頂尖設(shè)計(jì)網(wǎng)站推薦，設(shè)計(jì)師必備導(dǎo)航：http://hao.uisdc.com