編者按：今天給大家分享的兩個(gè)超棒的網(wǎng)站，一個(gè)專注分享 Dribbble 當(dāng)天最流行的配色方案，知曉設(shè)計(jì)趨勢(shì)就這么簡(jiǎn)單。另一個(gè)是能在線制作樣機(jī)的網(wǎng)站，特別之處在于它能提供模擬真實(shí)場(chǎng)景的樣機(jī)，讓你的作品看起來(lái)更有質(zhì)感。

Colorbook

酷站鏈接：https://colorbook.me/

一個(gè)好的作品，至少要把握好顏色，才會(huì)讓作品更有吸引力。想看看大神們的配色嗎？Colorbook 可能會(huì)幫到你。

我們打開(kāi)網(wǎng)站后，可以看到 Most popular 和 Timeline，前者是看最受歡迎的顏色方案，后者是看當(dāng)天最受歡迎的配色。

點(diǎn)擊某一個(gè)配色方案，就會(huì)顯示對(duì)應(yīng)配色的作品圖像以及16進(jìn)制值。

點(diǎn)擊配色方案正面的鏈接，可以轉(zhuǎn)到官網(wǎng)對(duì)應(yīng)頁(yè)面。根據(jù)網(wǎng)站提示，日后還會(huì)開(kāi)放 .aco 格式的色板文件下載，這樣就更加方便了。

下面小編分享幾個(gè)截圖給大家欣賞下，更多請(qǐng)自己瀏覽官網(wǎng)。

△ Forgot your password?

△ More Illustrations for the 2018 Calendar

△ El Famoso, Brand Specimen

△ EVE Online – Frontpage

△ Fame Lab Profile

△ Big Jazz

△ landing page

△ UI/UX Case: My Car parking

△ ?Gordo!

△ Blockchain powered VR

△ Canonical forms in design

△ Get New Gear

△ Travel 3D app

△ landing page

△ Voysis – AI platform for e-commerce

這么多大神們的配色方案，還怕配不好色嗎？

Fotomock

酷站鏈接：http://www.fotomock.com/

有時(shí)候我們會(huì)看到很有質(zhì)感的樣機(jī)（Mockups），可能是將網(wǎng)頁(yè)或應(yīng)用程序畫(huà)面整合到 Macbook 或 iPhone 手機(jī)上，但其實(shí)這些照片并不是真正通過(guò)相機(jī)拍攝而成，而是以在線服務(wù)加以合成，讓它看起來(lái)很特別、很不一樣。

「Fotomock」是一款讓用戶免費(fèi)制作模型樣板的在線工具，可快速將截圖上傳、整合到免費(fèi)圖庫(kù)素材，打造出更完美的樣板。在 Fotomock 里可選擇臺(tái)式機(jī)（iMac）、平板（iPad）或筆記本電腦（Macbook）及智能手機(jī)（iPhone、Samsung 等等），通過(guò)用戶上傳的圖片，將畫(huà)面整合到這些設(shè)備的屏幕中，使照片看起來(lái)更出色。

雖然 Fotomock 使用方法很簡(jiǎn)單，而且無(wú)須注冊(cè)，但它仍有一些限制存在，例如免費(fèi)方案只能下載低畫(huà)質(zhì)圖片（及部分高畫(huà)質(zhì)圖片），不過(guò)對(duì)于網(wǎng)頁(yè)使用來(lái)說(shuō)，其實(shí)低畫(huà)質(zhì)圖片就已經(jīng)相當(dāng)足夠（寬度大約在 800px 左右）。目前 Fotomock 收錄的照片大約有一百多張，如果剛好需要將畫(huà)面合成到圖庫(kù)樣板，可以試試這個(gè)免費(fèi)服務(wù)，或許能夠解決你當(dāng)前的問(wèn)題。

開(kāi)啟 Fotomock 網(wǎng)站后，從左側(cè)選單找到你要使用的設(shè)備類(lèi)型，有手機(jī)、平板、臺(tái)式機(jī)和筆記本電腦可選擇，或者依照類(lèi)型、場(chǎng)景等標(biāo)簽來(lái)篩選出特定素材，和一般免費(fèi)圖庫(kù)一樣都會(huì)列出目前最熱門(mén)、最新的模型樣板。

點(diǎn)擊要使用的模型樣板后，會(huì)有更大張的預(yù)覽圖及詳細(xì)信息，可以看到下面這張圖提供免費(fèi)下載低分辨率樣板，但如果要下載高分辨率 3500×2338 圖片必須付費(fèi)，此外，還能從頁(yè)面中找到授權(quán)信息。

點(diǎn)擊右上角「Upload Image」即可把你要合成到模型樣板的圖片上傳上去。

上傳后需要等待一段時(shí)間，F(xiàn)otomock 會(huì)產(chǎn)生你的模型樣板。

我試著上傳一張網(wǎng)頁(yè)截圖，可以看到 Fotomock 已經(jīng)將它整合到圖庫(kù)圖片中的筆記本電腦屏幕里，看起來(lái)就像是直接開(kāi)啟網(wǎng)頁(yè)然后拍攝而成的照片。

從右上角點(diǎn)擊「Download Mockup」下載成品，低分辨率的素材可以免費(fèi)獲取，高分辨率的話部分免費(fèi)提供，但如果后方標(biāo)記黃色感嘆號(hào)代表必須付費(fèi)才能獲取。

下圖是另一張 Fotomock 提供的素材，可以看到在這張素材中，無(wú)論低分辨率或高分辨率的模型樣板皆可免費(fèi)下載，F(xiàn)otomock 每張素材定價(jià)不太一樣，不過(guò)對(duì)于一般使用來(lái)說(shuō)，其實(shí)低分辨率素材就可以用于網(wǎng)頁(yè)用途，除非要拿來(lái)印刷可能才會(huì)需要用到更大的圖片。

這是我通過(guò) Fotomock 制作的模型樣板，看起來(lái)非常逼真，而且也很適合使用于展示產(chǎn)品或網(wǎng)絡(luò)服務(wù)，有興趣的話不妨照著本文教學(xué)，通過(guò)這項(xiàng)服務(wù)動(dòng)手做做看吧。

值得一試的三個(gè)理由：

• 將網(wǎng)頁(yè)截圖或應(yīng)用程序畫(huà)面整合到計(jì)算機(jī)或手機(jī)屏幕中。
• 超過(guò)百?gòu)埫赓M(fèi)圖庫(kù)素材。
• 免費(fèi)下載低分辨率的模型樣板照片。

優(yōu)設(shè)人氣專題

iPhone X 學(xué)習(xí)指南丨優(yōu)設(shè)獨(dú)家專訪丨在線摳圖神器丨靈感大全

樣機(jī)素材 |?Sketch神器?|?免費(fèi)圖庫(kù)丨配色神器丨讀書(shū)計(jì)劃丨PPT 神器丨魯班設(shè)計(jì)

iOS 11 學(xué)習(xí)指南丨人工智能丨PS 教程丨AI 教程丨C4D 教程?|?3D教程

================明星欄目推薦================

優(yōu)優(yōu)教程網(wǎng)： UiiiUiii.com 是優(yōu)設(shè)旗下優(yōu)質(zhì)中文教程網(wǎng)站，分享了大量PS、AE、AI、C4D等中文教程，為零基礎(chǔ)設(shè)計(jì)愛(ài)好者也準(zhǔn)備了貼心的知識(shí)樹(shù)專欄。開(kāi)啟免費(fèi)自學(xué)新篇章，按照我們的專欄一步步學(xué)習(xí)，一定可以迅速上手并制作出酷炫的視覺(jué)效果。

設(shè)計(jì)導(dǎo)航：國(guó)內(nèi)人氣最高的設(shè)計(jì)網(wǎng)址導(dǎo)航，設(shè)計(jì)師必備：http://hao.uisdc.com