設計師必備的40個國外設計素材網站：

1. Fribbble

來自Dribbble的免費素材會在這個網站匯集，有圖標、PSD、各類視覺稿，不一而足。

2. Behance project template

在Behance上發布設計項目的時候，不知道如何展示才漂亮？看看這篇文章，下載結尾漂亮的模板，問題就迎刃而解了。

3. psddd.co

這也是一個尋找免費PSD文檔、虛化背景圖和漂亮UI元素的好網站。

4. colour lovers

如果你還在為尋找好的色彩搭配而糾結，那么千萬不要錯過這個網站，你要的一切都在這里，從靈感搜集到成型的方案，滿足你的每一個愿望。

5. CG textures

這個網站提供了大量的免費圖片，這類圖片大多是關于石頭、天空、樹木等富有紋理質感的對象，當你需要制作有質感的對象的時候，這個網站會成為你最好的幫手！

6. Subtle Patterns

紋理神站！它不僅提供了超過400款高品質紋理素材，還提供了在線紋理制作工具，你還在等什么呢？

7. Webydo

著名的無代碼網站搭建平臺Webydo在此，上手試試吧~

8. guideguide

如果你也苦于設計網頁中的柵格和布局，那么GuideGuide 會是你的好幫手。我們也曾發文講述如何使用這一工具《PS 參考線插件GUIDEGUIDE下載及使用說明》

9. No more banding

有時候使用PS制作漸變效果的時候，漸變效果并不平滑，而是呈現出階梯狀的變化，這個動作可以消除這種階梯狀漸變，看起來更加順暢平滑，非常不錯哦。

10. Gridzzly

Gridzzly 可以幫你制作自己的格紙，制作出非常不錯的印刷圖案，精確而實用。

11. Make app Icon

這個工具可以幫你將你的圖標轉變為可為iOS和Android 設備使用的APP圖標尺寸。

12. Perfect Effects 3

這是專門為攝影師所設計的工具，使用Perfect Effects 3 你可以更容易添加效果，想比起耗時龐大的Photoshop、Lightroom以及Aperture，它更加快速實用。

13. Cut & Slice

著名的Mac平臺切圖工具，它可以幫你在短短幾分鐘內搞定分組切圖的工作，不過請務必記住要重命名各個圖層。

14. Layrs Control 2

這是一組包含7個不同腳本的圖層管理插件合集，它可以讓你繁瑣的工作更加簡單。

15. Hexy

選擇圖層，高亮文本，然后通過拾色器來取色，有的時候是太過復雜的過程，Hexy 則非常方便，它可以使用滴管快速取色然后直接復制到剪切板當中，即取即用。

16. WhatTheFont!

看到一個漂亮的字體想知道它到底是什么字體？試試WhatTheFont吧，上傳截圖，它會為你在數據庫中進行匹配。

17. Typewolf

Typewolf 可以幫你顯示正在瀏覽的網站所使用的字體，推薦類似的字體和背景信息。

18. Size Marks

Size Marks是一個非常實用的 Photoshop 腳本，它可以測量不同元素之間的距離，對于設計師和前端頗為有用。

19. Velositey Version 2

僅需要幾秒鐘，Velositey 可以借助模板在Photoshop中快速構建網頁布局。

20. FontAwesomePS

這個工具可以幫你快速搜索圖標，一鍵點擊將其新建為新的圖層，并且可以輕松編輯。

21. Liveshare PS

借助LivesharePS，你可以將PSD文檔在Liveshare會議上在線分享展示，你的任何操作都可以讓大家看到，哪怕你沒有點擊保存按鈕。

22. Photoshop Share plugin

這個插件可以讓你無需離開Photoshop就一鍵分享你的設計作品。

23. Prisma

想把你的AI中的配色方案同步到PS？Prisma 可以讓所有支持這一插件的軟件中的配色方案都同步起來。

24. Free Lorem Ipsum Generator

這是最好的假文生成器，可以在Photoshop、AI、ID和Dreamweaver 中使用。

25. Free Behance Presentation Builder

這個免費的Behance 展示生成器可以借助一個免費PSD文檔和PS動作幫你將作品制作成展示效果。

26. Kaku

一個簡單的PS插件，可以幫你將圖層中的文本而翻譯成不同的語言。

27. Instagram Filters

這是一組13個濾鏡，可以在PS中幫你將圖片制作成類似Instagram的效果。

28. VSCO Cam Effect in Photoshop Tutorial

來自Go Media的Simon Hartmann 撰寫了這篇實用而炫酷的教程，教你如何在Photoshop中實現VSCO處理圖片的效果。

29. Social Kit

這款Photoshop插件包含了一系列可用于社交媒體的圖片、廣告Banner和資料信息等內容。

30. Mobile UI Blueprint psd files

這是一組免費的包含大量移動端UI元素的PSD文檔。

31. Free Images

這個網站之前一直以sxc.hu而聞名，其中包含了395000 多個可免費下載的圖片。

32. UI Cloud

這是世界上最大的UI設計數據庫，現在它包含了超過46000個UI控件，并且可以免費下載。

33. Mock Up Zones

Mockup Zones 為你提供了大量優秀的免費視覺稿下載，從iPhone、iPad 的界面設計到商業名片和文化衫設計，覆蓋廣泛。

34. Macbook Air and Thunderbolt Display

這是一組用來展示設計作品的Macbook Air 和 Thunderbolt 顯示的視覺稿 PSD文檔。

35. Greyscalegorilla 3D Tutorials

設計師 Greyscale Gorilla 的個人站點，這個才華橫溢的設計師在自己的網站中發布了許多制作3D設計作品的教程。

36. Vray Materials

如果你是經常使用C4D的設計師的話，這個網站不要錯過，其中有許多優質的貼圖材質素材。

37. Blendme

這個可用于PS和AI的插件可以讓你直接在軟件中搜索并獲取各類素材。

38. AdobeKnowHow

這個是Adobe最新推出的教程網站，提供了幾款著名軟件的免費的初級課程。

39. Tuts

這是最知名的PS教程網站，不論你是初學者還是專業的設計師，都能從中獲益良多。

40. Pixeden

這是一個堪稱偉大的免費資源包，從視覺稿到模板、圖標，非常全面，不要錯過

前端工程師與后端工程師的區別主要體現在三個方面，其一是工作的職責不同，其二是知識結構不同，其三是發展領域不同。

前端工程師主要的工作職責分為三大部分，分別是傳統的Web前端開發，移動端開發和大數據呈現端開發。Web前端開發主要針對的是PC端開發任務；移動端開發則包括Android開發、iOS開發和各種小程序開發，在移動互聯網迅速發展的帶動下，移動端的開發任務量是比較大的，隨著5G標準的落地，未來移動端的開發任務將得到進一步的拓展；大數據呈現則主要是基于已有的平臺完成最終分析結果的呈現，呈現方式通常也有多種選擇，比如大屏展示等。

后端工程師的主要職責也集中在三大部分，分別是平臺設計、接口設計和功能實現。平臺設計主要是搭建后端的支撐服務容器；接口設計主要針對于不同行業進行相應的功能接口設計，通常一個平臺有多套接口，就像衛星導航平臺設有民用和軍用兩套接口一樣；功能實現則是完成具體的業務邏輯實現。

在知識結構方面，前端開發涉及到的內容包括Html、CSS、JavaScript、Android開發（采用Java或者kotlin）、iOS開發（采用OC或者Swift）、各種小程序開發技術（類Html），隨著前端開發任務的不斷拓展，前端開發后端化也是一個較為明顯的趨勢，比如Nodejs的應用。

后端開發通常需要根據業務場景進行不同語言的選擇，另外后端開發的重點在于算法設計、數據結構、性能優化等方面，在具體的功能實現部分可以采用Java、Python或者PHP等編程語言來實現。對于不少中小企業來說，后端開發通常都會采用開源的開發平臺，這樣就可以把精力集中在業務處理上，通常應用級程序員就可以解決問題，相應的開發成本也會有大幅度的下降。

最后，從應用范圍來看，前端開發顯然有更廣泛的應用場景，所以建議職場人掌握一定的前端開發技術。

我從事互聯網行業多年，目前也在帶計算機專業的研究生，主要的研究方向集中在大數據和人工智能領域，我會陸續寫一些關于互聯網技術方面的文章，感興趣的朋友可以關注我，相信一定會有所收獲。

如果有互聯網方面的問題，或者考研方面的問題，都可以咨詢我，謝謝！

不需要下載，只需要在用到模板的時候，引入bootstrap的css樣式就行了