炸毀艷俗！如何讓你的設計脫穎而出呢？邢臺方遠教你技巧！

如何讓你的設計脫穎而出呢？很多人認為設計是一個(gè)不斷發(fā)展和變革的領(lǐng)域，尤其是在趨勢的推動(dòng)下，搖身一變，下一刻就會(huì )又驚艷到你！而靈活的創(chuàng )意和開(kāi)放的想法，常常能夠使這些平常作品，化身為時(shí)代佳作。那么該如何擁有這樣的技能呢？今天，邢臺方遠電腦學(xué)校來(lái)為你講述設計中的技巧與方法，快來(lái)圍觀(guān)吧！

邢臺方遠電腦學(xué)校來(lái)為你講述設計中的技巧與方法

1、凸顯特點(diǎn)：設計工作室的官網(wǎng)設計

形體和色彩，到底哪個(gè)在設計中更加富有表現力？這個(gè)問(wèn)題可能沒(méi)有一個(gè)固定答案，這場(chǎng)在戰爭在設計領(lǐng)域當中已經(jīng)持續多年，甚至會(huì )一直持續下去。這個(gè)設計項目是為一個(gè)室內設計工作室來(lái)設計官方網(wǎng)站，他們的主要業(yè)務(wù)是制作可視化的室內設計渲染圖。他們熟知如何大限度地借助設計工具來(lái)呈現室內設計的效果，在接到需求之后，我們決定使用全屏背景結合他們擅長(cháng)的3D建模，來(lái)展現高質(zhì)量的室內設計能力和建模渲染效果。

富有層次感的排版布局，讓前后景的內容各司其職，關(guān)鍵的內容塊也可以很輕松地被掃視。每個(gè)區塊都有著(zhù)醒目的標題，能夠告知用戶(hù)內容的屬性。頁(yè)面頂部的導航中呈現了品牌的LOGO，頁(yè)面中相關(guān)社交媒體鏈接也非常清晰醒目。在這個(gè)色彩豐富的頁(yè)面中，關(guān)鍵的CTA按鈕是需要借助對比色來(lái)凸顯，將用戶(hù)導向特定的功能和頁(yè)面。

數字建模所帶來(lái)的好處是更加沉浸式的場(chǎng)景，和更加易于處理的數字素材，這樣一來(lái)，設計師也更容易處理，加入更加有效的動(dòng)畫(huà)效果。在這個(gè)案例當中，動(dòng)效設計師讓用戶(hù)在滾動(dòng)的過(guò)程中，看到條紋式的效果，使得頁(yè)面的層次感明顯，也暗示了這個(gè)設計工作室在視覺(jué)效果上的強大處理能力。此外，用戶(hù)可以借助頁(yè)面指示器快速切換頁(yè)面，這一點(diǎn)也確保了整個(gè)網(wǎng)站在功能上的便捷和完善性。

2、強化屬性：訂購服務(wù)的網(wǎng)站頁(yè)面設計

對于出門(mén)旅行，絕大多數的用戶(hù)都抱有著(zhù)不小的期待。但是旅行本身并不輕松，需要訂購酒店，需要購買(mǎi)機票和車(chē)票，租車(chē)，購買(mǎi)門(mén)票，同時(shí)旅行還意味著(zhù)非常大量的活動(dòng)。而這次的概念設計，就是圍繞著(zhù)預訂服務(wù)來(lái)展開(kāi)的。同樣使用了3D建模來(lái)構建視覺(jué)，諸多和日常出行相關(guān)的視覺(jué)元素占據了左側的頁(yè)面，而右側則是預訂需要填寫(xiě)的表單內容。整個(gè)頁(yè)面采用了更加富有活力的配色，降低用戶(hù)填寫(xiě)表單時(shí)候的緊張情緒，清晰直觀(guān)的頁(yè)面布局，讓用戶(hù)無(wú)需四處摸索，可以直接開(kāi)始交互。從標題到表單的條目都保有良好的對比度，可以快速掃視閱讀，便于用戶(hù)填寫(xiě)。

向下滾動(dòng)，用戶(hù)可以了解這項服務(wù)的相關(guān)優(yōu)勢，特殊的功能，相關(guān)福利，以及更多的信息。每個(gè)信息都緊密?chē)�繞著(zhù)一個(gè)主題來(lái)予以闡述，視覺(jué)化的元素被設計得非常吸睛，同時(shí)，和整體在風(fēng)格調性上也保持著(zhù)高度的一致。

3、營(yíng)造層次：庫布里克的作品網(wǎng)站

今年 7 月 26 日，世界電影人都在慶賀著(zhù)名導演庫布里克誕辰90周年，同樣身為庫布里克粉絲的我們，也為他制作了一個(gè)相對優(yōu)雅的作品網(wǎng)站。網(wǎng)站展現了他的榮耀之路，他的生活，以及他是如何進(jìn)行創(chuàng )作的。整個(gè)網(wǎng)站的設計都是借助視覺(jué)化的設計來(lái)驅動(dòng)用戶(hù)不斷瀏覽，交互不僅在上下左右布局上富有層次，而且在視覺(jué)縱深上做文章。作為一個(gè)產(chǎn)出過(guò)如此之多經(jīng)典作品的導演，我們選取了對比度強烈、經(jīng)典的紅黑白三色來(lái)作為整個(gè)網(wǎng)站的主要配色，這一點(diǎn)非常符合他獨特的定位和屬性。

4、渲染氛圍：托兒服務(wù)的著(zhù)陸頁(yè)設計

所有的父母在尋找托兒所和托管機構的時(shí)候，都希望他們的孩子獲得好的服務(wù)，找到能夠給予孩子無(wú)微不至關(guān)懷的保姆。這個(gè)著(zhù)陸頁(yè)的設計是為名為 Kiddy 這個(gè)托兒服務(wù)提供機構所設計的著(zhù)陸頁(yè)。Kiddy 致力于為用戶(hù)提供服務(wù)良好的保姆，在這里雇傭保姆稱(chēng)得上是小菜一碟。

為了讓整個(gè)頁(yè)面足夠可愛(ài)，風(fēng)格獨特有趣的插畫(huà)發(fā)揮了極大的作用，搭配性格富有童趣的字體，讓整個(gè)頁(yè)面足夠視覺(jué)化。與此同時(shí)，柔和的配色方案之下，文本和背景之間的對比度非常高，用戶(hù)只需要掃視就可以輕松讀取內容。

整個(gè)頁(yè)面包含了一個(gè)著(zhù)陸頁(yè)應有的所有組件：有過(guò)去客戶(hù)的推薦內容，新用戶(hù)可以和、專(zhuān)業(yè)的托管人員直接連線(xiàn)溝通，相關(guān)的信息一應俱全。重要的是，用戶(hù)如果想直接雇傭保姆，甚至不需要翻頁(yè)，進(jìn)入頁(yè)面就可以直接溝通。

5、引人注意：VR虛擬聊天室服務(wù)的網(wǎng)站設計

我們很多時(shí)候會(huì )有脫離現實(shí)的沖動(dòng)，還有什么比VR 更具有沉浸式的體驗呢？這個(gè)瘋狂的想法催生出了VR虛擬聊天室的概念，更瘋狂的是它還是基于Web平臺來(lái)實(shí)現。明亮而帶有迷幻特征的配色，引人矚目的3D圖形象征著(zhù)現代技術(shù)。為了更好地演示，用戶(hù)可以直接在第一屏觀(guān)看，而無(wú)需滾動(dòng)頁(yè)面。主頁(yè)提供了相關(guān)虛擬聊天室的介紹和模板鏈接，用戶(hù)甚至可以訂閱而定期獲取不同的模板，進(jìn)行升級。

高飽和度的色彩和3D建模非常貼合目前虛擬現實(shí)給用戶(hù)帶來(lái)的體驗，而極端醒目的色彩所給人的不真實(shí)感，相反更加強調了虛擬聊天室超越現實(shí)的特征。

6、制造對比：為手作市場(chǎng)進(jìn)行網(wǎng)站設計

如今各種設計工作室甚至家庭制作的各種手工制品正在受到越來(lái)越多的追捧，通過(guò)這樣的一個(gè)C2C平臺，大家可以將自己的手作提交上來(lái)銷(xiāo)售，買(mǎi)家借此可以獲得很多特別的商品。在給這個(gè)手作市場(chǎng)設計網(wǎng)頁(yè)的時(shí)候，主要借助了柵格系統來(lái)確保整個(gè)頁(yè)面布局看起來(lái)錯落，但實(shí)際非常規律。優(yōu)雅的布局和配色，在陰影和動(dòng)效的加持之下，看起來(lái)層次豐富，又不顯得混亂，非常引人矚目。

淺色的背景賦予網(wǎng)站以良好的空間感，這使得圖片天然具備了抓人視線(xiàn)的特質(zhì)，相對多樣的文本、色彩和樣式，讓整個(gè)網(wǎng)站顯得豐富而不單調。頁(yè)腳采用了黑色的背景圖片，主要內容以外的其他信息和鏈接都被收納在這里，方便用戶(hù)獲取內容。

7、打破常規：建站服務(wù)公司的網(wǎng)站設計

誰(shuí)說(shuō)一個(gè)提供網(wǎng)站建設和開(kāi)發(fā)的企業(yè)，官網(wǎng)就一定是要看起來(lái)簡(jiǎn)單、中性且無(wú)聊的？當然不是！這個(gè)專(zhuān)注于 Ruby on Rails 開(kāi)發(fā)的公司，就設計的非常視覺(jué)化。通過(guò)建模制作出來(lái)的寶石是 Ruby on Rails 的代表，這和公司常用的開(kāi)發(fā)語(yǔ)言有了清晰的關(guān)聯(lián)，首屏底部標識出了公司相關(guān)的社交媒體帳號的鏈接，即使同樣是CTA按鈕，主要的按鈕采用的是強對比的實(shí)底，而次要的則選用的是幽靈按鈕。

向下滾動(dòng)的過(guò)程中，用戶(hù)會(huì )在信息圖式的內容塊中了解到團隊所采用的技術(shù)，公司的相關(guān)信息，服務(wù)的客戶(hù)群，以及聯(lián)系該團隊的快速提交表單。內容清晰，疏密有致，目的明確，用戶(hù)在這樣的網(wǎng)站中永遠不會(huì )感到迷惑。

8、沉浸體驗：在線(xiàn)百科知識網(wǎng)站

這個(gè)網(wǎng)站致力于幫你了解宇宙和太陽(yáng)系相關(guān)的知識，你在這里能夠針對行星和宇宙空間進(jìn)行探索。在宇宙黑暗的背景之下，你可以看到木星表面清晰的地貌所構成的紋路，極度視覺(jué)化的UI設計和動(dòng)效加持下的交互，讓用戶(hù)不再需要枯燥的閱讀，而是在不斷的瀏覽和交互中，逐步了解頭頂的天空和黑暗中的渺遠宇宙。整個(gè)網(wǎng)站的底色和宇宙的黑色保持著(zhù)一致，帶來(lái)了相對沉浸的體驗，流暢的動(dòng)畫(huà)下，用戶(hù)在瀏覽的時(shí)候會(huì )感到仿佛在太空中遨游一般的體驗。

9、呈現韻律：音樂(lè )APP的著(zhù)陸頁(yè)

如何通過(guò)UI來(lái)呈現出韻律感？這是在給時(shí)尚的音樂(lè )APP設計著(zhù)陸頁(yè)的時(shí)候，先想到的問(wèn)題。設計師通過(guò)明亮而抽象的圖形來(lái)構建動(dòng)畫(huà)，通過(guò)韻律感十足的動(dòng)畫(huà)來(lái)呈現獨特的節奏感和韻律感，從而實(shí)現情感和情緒的表達。頁(yè)面不需要大量的文本，一個(gè)醒目的大標題就夠了，接下來(lái)就是將用戶(hù)的注意力引導到CTA按鈕上，相反大量的文本會(huì )影響用戶(hù)的注意力，所以，就有了這個(gè)頁(yè)面的設計。

看完了邢臺方遠電腦學(xué)校的分享，也看過(guò)了這些優(yōu)秀案例分析，你都清楚地知道了些什么呢？想不想學(xué)習一下專(zhuān)業(yè)的網(wǎng)頁(yè)設計呢？來(lái)邢臺方遠電腦學(xué)校，讓你成為專(zhuān)業(yè)的設計師！