從去年下半年開(kāi)始，互聯(lián)網(wǎng)行業(yè)慢慢進(jìn)入寒冬，一些設(shè)計(jì)師也不得不重新找工作。關(guān)于求職這個(gè)事情，UI黑客之前寫(xiě)過(guò)一篇文章《面試了50多位UI設(shè)計(jì)師，我總結(jié)了這些求職技巧！》，大家可以參考下。打鐵還需自身硬，找工作最重要的還是靠自身的能力。
那么究竟需要具備什么樣的能力能得到公司的青睞呢？
就拿市面上眾多的 UI 培訓(xùn)班來(lái)說(shuō)吧，作為盈利性機(jī)構(gòu)，培訓(xùn)班的課程結(jié)構(gòu)肯定是和當(dāng)下公司實(shí)際需求掛鉤的。畢業(yè)的學(xué)生被公司錄用越多，口碑效應(yīng)就會(huì)出現(xiàn)，那么報(bào)班的生源也會(huì)越多，培訓(xùn)機(jī)構(gòu)自然賺的越多。
越來(lái)越多的培訓(xùn)機(jī)構(gòu)開(kāi)設(shè)了前端課程，這就說(shuō)明公司實(shí)際需求大概也是這樣的。現(xiàn)在求職，不說(shuō)自己會(huì)點(diǎn)前端都不好意思面試，UI設(shè)計(jì)師學(xué)前端也是時(shí)下的趨勢(shì)。
實(shí)際上，在公司項(xiàng)目中，設(shè)計(jì)師了解前端，會(huì)極大提升和程序員的協(xié)作效率，減少技術(shù)信息不對(duì)稱(chēng)的現(xiàn)象。如果在一個(gè)網(wǎng)站項(xiàng)目中，程序員還在跟設(shè)計(jì)師講解最基本的 html、css、盒子模型知識(shí)，那開(kāi)發(fā)效率就可想而知了。
很多公司的項(xiàng)目，都采用了前端框架來(lái)開(kāi)發(fā)，如果設(shè)計(jì)師了解這些框架，能在框架的結(jié)構(gòu)基礎(chǔ)上進(jìn)行 UI 設(shè)計(jì)，那無(wú)疑會(huì)提高項(xiàng)目整體的開(kāi)發(fā)效率。下面就一起了解下常見(jiàn)的前端框架，說(shuō)不定面試的時(shí)候能幫大忙。
網(wǎng)站鏈接：https://ant.design/index-cn
螞蟻金服出品，非常著名的框架。就算你不了解前端，也會(huì)在公司的項(xiàng)目中多少聽(tīng)到程序員說(shuō)起過(guò)。目前很多公司都在用，已經(jīng)很成熟。而且提供了對(duì)設(shè)計(jì)師友好的 Sketch 規(guī)范文件，可以直接拿來(lái)用。
Ant Design 是基于 React 開(kāi)發(fā)的，并不是傳統(tǒng)的 html。React 起源于 Facebook 的內(nèi)部項(xiàng)目，現(xiàn)在已經(jīng)成了一個(gè)很流行的開(kāi)發(fā)工具。
理想的項(xiàng)目開(kāi)發(fā)流程是，設(shè)計(jì)師和程序員一起熟悉 Ant Design 的各種樣式，設(shè)計(jì)師不再隨意設(shè)計(jì)，而是基于框架的基礎(chǔ)樣式進(jìn)行設(shè)計(jì)創(chuàng)新。這樣程序員在進(jìn)行 UI設(shè)計(jì)稿還原的時(shí)候，能極大提高開(kāi)發(fā)效率。
現(xiàn)在很多項(xiàng)目都使用了 Ant Design，一些公司在招聘 UI設(shè)計(jì)師的時(shí)候甚至?xí)?xiě)上：了解 Ant Design 規(guī)范的優(yōu)先考慮。所以這個(gè)框架建議設(shè)計(jì)師都好好看一下。
網(wǎng)站鏈接：http://www.bootcss.com/
Bootstrap 是 Twitter 推出的一個(gè)用于前端開(kāi)發(fā)的開(kāi)源工具包，是一個(gè) CSS/HTML 框架，目前世界上的很多網(wǎng)站開(kāi)發(fā)都使用了這個(gè)。其中的柵格理論、響應(yīng)式解決方案都變成了業(yè)界的參考規(guī)范。
很多設(shè)計(jì)師在學(xué)前端的時(shí)候，都會(huì)接觸到這個(gè)框架，甚至培訓(xùn)機(jī)構(gòu)有專(zhuān)門(mén)的課程，所以重要性可見(jiàn)一斑。
網(wǎng)站鏈接：https://taro-ui.aotu.io/
Taro UI，一套基于 Taro 框架開(kāi)發(fā)的多端UI組件庫(kù)，可以在微信小程序/H5/ReactNative 等多端適配運(yùn)行。京東用戶(hù)體驗(yàn)設(shè)計(jì)部的凹凸實(shí)驗(yàn)室出品。
現(xiàn)在一個(gè)產(chǎn)品要求在 iOS、安卓、小程序、h5 等多端運(yùn)行，針對(duì)不同的客戶(hù)端開(kāi)發(fā)不同的代碼會(huì)產(chǎn)生巨大的成本，這時(shí)候只編寫(xiě)一套代碼就能夠適配到多端的能力就顯得極為需要。
使用 Taro，就可以只寫(xiě)一套代碼，再通過(guò) Taro 的編譯工具，將源代碼分別編譯出可以在不同端（微信小程序、H5、RN等）運(yùn)行的代碼，節(jié)約成本。
網(wǎng)站鏈接：https://www.iviewui.com/
一套基于 Vue.js 的高質(zhì)量 UI組件庫(kù)。Vue.js 是一個(gè) JavaScriptMVVM 庫(kù)，是一套構(gòu)建用戶(hù)界面的漸進(jìn)式框架。
在網(wǎng)站中可以看到數(shù)量眾多的 UI組件和對(duì)應(yīng)代碼，本質(zhì)上和我們制作 UI規(guī)范是一樣的。
網(wǎng)站鏈接：https://l-ui.com/
LuLu UI，是一個(gè)基于 jQuery，針對(duì) PC 網(wǎng)站，兼容 ie8、ie7 的前端 UI 框架，包含很多靜態(tài)或動(dòng)態(tài) UI 組件。對(duì)設(shè)計(jì)師非常友好，只需要簡(jiǎn)單的 html、css 知識(shí)就能快速上手使用。
區(qū)別于 Ant design 面向中后臺(tái)開(kāi)發(fā)，LuLu UI 非常適合面向外部用戶(hù)的網(wǎng)站開(kāi)發(fā)。會(huì)簡(jiǎn)單的 HTML 和 jQuery 就可以上手了，不像一些流行框架，需要較多的學(xué)習(xí)成本。
網(wǎng)站鏈接：https://qmuiteam.com/
QMUI，騰訊出品，分為 Web、iOS、安卓三個(gè)端，都有相應(yīng)的 dome 下載安裝，設(shè)計(jì)師可以下載安卓和 iOS 應(yīng)用，經(jīng)?？纯蠢锩娴慕M件，熟悉后，和技術(shù)的協(xié)作會(huì)更有效率。
網(wǎng)站鏈接：http://element-cn.eleme.io/#/zh-CN
餓了么出品，一套為開(kāi)發(fā)者、設(shè)計(jì)師和產(chǎn)品經(jīng)理準(zhǔn)備的基于 Vue 2.0 的桌面端組件庫(kù)，很適合開(kāi)發(fā)后臺(tái)產(chǎn)品。有意思的是里面的默認(rèn)圖文數(shù)據(jù)很多都是食物……
網(wǎng)站鏈接：https://fusion.design/
阿里推出的一個(gè)適合設(shè)計(jì)、技術(shù)共同使用的設(shè)計(jì)規(guī)范框架?；灸康囊彩菫榱俗屧O(shè)計(jì)師在一個(gè)標(biāo)準(zhǔn)框架內(nèi)設(shè)計(jì)界面，同時(shí)也提供了 Sketch 插件，讓設(shè)計(jì)的組件直接轉(zhuǎn)化為代碼，技術(shù)直接調(diào)用。
網(wǎng)站鏈接：https://weui.io/
WeUI 是一套同微信原生視覺(jué)體驗(yàn)一致的基礎(chǔ)樣式庫(kù)，由微信官方設(shè)計(jì)團(tuán)隊(duì)為微信內(nèi)網(wǎng)頁(yè)和微信小程序量身設(shè)計(jì)，令用戶(hù)的使用感知更加統(tǒng)一。
這個(gè)小巧的框架提供了微信頁(yè)面常用的組件，我們?cè)谠O(shè)計(jì)微信風(fēng)格的項(xiàng)目時(shí)，可以參考使用。
網(wǎng)站鏈接：http://www.framework7.cn/
一個(gè)簡(jiǎn)單、免費(fèi)的 HTML 框架，主要用來(lái)構(gòu)建移動(dòng)端 web 應(yīng)用，分為 iOS 和安卓?jī)煞N風(fēng)格。
其本身的結(jié)構(gòu)非常簡(jiǎn)單，使用了最基礎(chǔ)的 html、css 和 js 構(gòu)建，很容易上手使用。也可以用來(lái)作為原型開(kāi)發(fā)工具，迅速創(chuàng)建一個(gè)應(yīng)用的原型。
此外還有很多其他的前端框架，以上10個(gè)框架其實(shí)不需要設(shè)計(jì)師非常深入去了解，最基本的要求是設(shè)計(jì)師對(duì)其內(nèi)容、樣式、組件有個(gè)大致的認(rèn)知即可。在和技術(shù)協(xié)作的過(guò)程中，知道哪些組件不需要額外設(shè)計(jì)，哪些組件可以進(jìn)行樣式擴(kuò)展。
就比如設(shè)計(jì)師去學(xué)習(xí)前端，并不是去代替前端的工作，而是對(duì) UI 界面有個(gè)更深層次的認(rèn)知，設(shè)計(jì)的同時(shí)會(huì)考慮到界面的交互性、擴(kuò)展性、可用性。猶如庖丁解牛，透過(guò)表象看到結(jié)構(gòu)本質(zhì)，提高自己的界面把控能力。
聯(lián)系客服
