設計師必備！40個免費資源全家桶，UI元件、設計模板通通都有

從初學者到專業設計師必藏40種免費資源網，其中包括PSD檔、UI元件以及網頁模版等等的相關素材 ... 原作者是荷蘭平面設計師兼部落客Jennifer Cirpici。

新聞 最新新聞數位專題熱門圖解專家觀點 主題分類 前端科技5G通訊AI與大數據電動車/交通科技物聯網區塊鏈能源環保服務消費新零售金融科技服務創新產業應用半導體與電子產業醫療生技資訊安全智慧城市智慧製造雲端運算與服務數位生活3C生活遊戲/電競影音/新媒體教育/人文企業職場商業經營創新創業行銷與Martech職場/工作術程式開發產業動態 數位行銷學院 課程一覽企業內訓團票預購 品牌活動 社群活動未來商務展MeetTaipei 品牌社群 未來商務Meet創業小聚 雜誌 最新出刊訂閱優惠關於我們內容轉載規範服務條款與隱私權政策廣告刊登徵才聯絡我們客服信箱：[email protected]服務時間：週一～週五09:00-12:00；13:30-17:0010694台北市光復南路102號9樓aboutus|廣告刊登|內容授權 新聞 專題 社群 活動課程雜誌調查所Podcast登入／ 註冊熱門新聞活動會員Podcast 免費資源網路社群 設計師必備！40個免費資源全家桶，UI元件、設計模板通通都有2019.12.20職場/工作術免費資源網路社群從初學者到專業設計師必藏40種免費資源網，其中包括PSD檔、UI元件以及網頁模版等等的相關素材，使用簡便、輕鬆玩出好設計。

你可曾想過，設計師們都從那裡獲得大量資源，以幫助他們完成手邊的專案呢？這裡有一份絕佳的免費資源列表，包括網站、PSD檔、UI元件以及網頁模版等等的相關素材，最重要的是這些資源完全免費！並可自由下載使用。

只需要點選網站標題或擷圖，就會帶你到相對應的免費資源網站。

把這篇文章加入書籤，你便可以隨時回頭來查看這份精采絕倫的免費資源列表，讓龐大的資源幫助你獲得成功。

喜歡的話，也別忘記把這篇文章分享、轉貼給你的好友。

1.FribbbleFribbble提供網站適用圖示、一些iPhone模型及建立登錄頁面的PSD檔等資源。

2.BehanceProjectTemplate許多人在發佈專案至Behance網站時感到無所適從。

該如何才能讓它看起來正確？首先，請先閱讀這篇文章（英文），然後下載漂亮的背景模版。

3.psddd.co另一個獲取免費PSD檔的好網站，同時也提供背景模版和UI元件。

5.CGtextures一個可以下載相片的免費圖庫。

內容從石頭、天空到大自然，應有盡有。

6.SubtlePatterns需要一些高畫質的圖樣嗎？不用再看了，SubtlePatterns提供來自全世界超過400種的圖樣，供使用者免費下載。

7.Webydo讓你免費設計一個網站，無須學會程式碼。

大喊一聲：哈雷路亞！8.guideguide網頁設計對每個人來說不見得是簡單的事，但這裡提供你簡單的方法！9.Nomorebanding當使用Photoshop的漸層時，有沒有因為不夠圓滑而感到灰心。

利用這個動作，讓它看起來更加平滑。

10.Gridzzly讓你自製網格紙，並將它列印出來！對於要畫草圖來說非常方便。

11.MakeappIcon這個工具會自動為你的圖示設計重新調整大小，依照iOS和Android手機應用程式需要的格式進行最佳化。

延伸閱讀：MakeAppicon一鍵快速產生iOS、Android適用的應用程式圖示12.PerfectEffects3專為攝影師而設計。

PerfectEffects3是一款直觀又強大的工具，可以很容易地為照片加入效果，一些在Photoshop、Lightroom、PhotoshopElements或Aperture需要費時才能做出來的效果，在PerfectEffects3可以輕鬆辦到。

13.Cut&Slice使用Cut&Slice可以在彈指間將圖片輸出成不同裝置適用的格式。

14.LayrsControl2一款免費的Photoshop外掛，集合七種程式來簡化你繁瑣的工作。

15.Hexy每次選取圖層、高亮文字，開啟選色工具來抓取特定範圍的Hex值是否讓你感到痛苦。

利用Hexy可讓你快速使用滴管工具，並將顏色複製到剪貼版。

16.WhatTheFont!看到某個字型，想知道它的確切名稱嗎？把擷圖上傳到WhatTheFont就能從資料庫中找到最相近的結果。

延伸閱讀：FontfaceNinja一鍵查看網頁使用的字型名稱、大小和行高，快速下載字體檔案17.TypewolfTypewolf將各式網站使用的字型直接顯示出來，並有針對類似字型提供的個人建議。

18.SizeMarksSizeMarks對網頁設計師或前端工程師來說是個很實用的Photoshop外掛。

這個外掛能幫你標記出矩形選取框的間距。

19.VelositeyVersion2Velositey讓你在Photoshop內快速設計出一個網頁，並有多種模版和模組可選擇。

20.FontAwesomePS搜尋圖示，然後點選建立新圖層形狀，並能夠輕鬆編輯。

21.LivesharePS透過LiveSharePS，你可以利用LiveShare會議來線上分享Photoshop文件給其它使用者，而且沒有人數限制。

如果你想修改你的Photoshop檔案，他們也能立即在LiveShare裡看到變化——甚至不用按下儲存按鈕！22.PhotoshopShareplugin使用LayerHero’sPhotoshopShare外掛在Photoshop裡直接分享你的設計。

23.PrismaIllustrator的選色器無法和Photoshop協調嗎？Prisma將所有應用程式同步。

24.FreeLoremIpsumGenerator最佳的LoremIpsum測試文字產生器，針對Photoshop、Illustrator、InDesign和Dreamweave設計。

延伸閱讀：12個你應該知道的中英文假字、文章產生器（LoremIpsum）25.FreeBehancePresentationBuilder幫你利用一個免費的PSD檔和PSAction來建立你的Behance個人資料簡報。

26.Kaku一個簡單的Photoshop外掛，幫你把你的文字圖層翻譯成其他語言。

27.InstagramFilters為Photoshop加入Instagram的13種濾鏡效果。

28.VSCOCamEffectinPhotoshopTutorial透過Photoshop也可以使用VSCOCam的濾鏡特效啦！延伸閱讀：VSCOcam：精緻濾鏡與優雅介面，充滿底片風格的質感相機29.SocialKitSocialKit由MadebySource設計，包括社群網站的封面圖、個人圖片和廣告橫福。

30.MobileUIBlueprintpsdfiles 免費行動裝置UI元件PSD檔，由Chrometaphore設計。

31.FreeImages前身為sxc.hu，FreeImages提供超過395,000免費圖庫圖片下載。

32.UICloud全世界最大的使用者介面設計資料庫，提供超過46,608種UI元件免費下載。

延伸閱讀：UICloud免費UI素材搜尋引擎，含GUI設計作品全部免費下載！33.MockUpZonesMockUpZones是一個免費圖片設計公司，提供iPads、iPhones、商務名片和T恤的免費版面設計模版。

34.MacbookAirandThunderboltDisplay由設計師JozefMak創作，免費的MacbookAir和Thunderbolt顯示器PSD檔。

35.Greyscalegorilla3DTutorials與這網站的站長都是OFFF2010講者，我得說他是一個友善且有才華的藝術家。

他的網站是許多3D藝術家的靈感來源，也提供可供你學習的教學。

36.VrayMaterials超愛這個網站！如果你需要免費的Vraymaterials素材，可以來這裡找找。

37.Blendme這個外掛可以讓AdobePhotoshop和Illustrator搜尋成千上萬的資源，無須離開應用程式，其中包括熱門的免費圖示集。

38.AdobeKnowHowAdobe最近剛上線的新網站，這網站提供你一些Adobe產品的免費初學者課程。

39.Tuts+一個絕佳的網站，提供你多種應用程式的教學。

不僅為初學者，也為專業人員。

40.PixedenPixeden是你不能錯過的網站，收錄許多免費資源，包括網站設計、模版和特效等等。

如果你想尋找免費圖庫，可參考以下幾篇文章：Part1:免費下載高解析度圖片的15個最佳圖庫網站Part2:下載高畫質相片素材的13個免費圖庫資源精選46個免費圖庫網站總彙整本文參考資料為40ResourcesEveryDesignerShouldKnow,原作者是荷蘭平面設計師兼部落客JenniferCirpici。

本文授權轉載自：免費資源網路社群延伸閱讀●快收藏！13個找圖必備免費圖庫精選，CC0高畫質素材都在這了 ●46個免費圖庫總整理，高品質CC授權圖片都在這裡了 關鍵字：#數位工具本網站內容未經允許，不得轉載。

往下滑看下一篇文章 追蹤我們 BnextMedia媒體群|數位時代經理人ShoppingDesign創業小聚未來商務 ©2022BusinessNextMediaCorp.All RightsReserved.106台北市大安區光復南路102號9樓