12月16日，微信正式發(fā)布了 WeUI動態(tài)視覺組件庫。WeUI 是一套同微信原生視覺體驗一致的基礎(chǔ)樣式庫，由微信官方設(shè)計團(tuán)隊為微信內(nèi)網(wǎng)頁和微信小程序量身設(shè)計，可以讓用戶的使用感知更加統(tǒng)一，包含了button、cell、dialog、 progress、 toast、article、actionsheet、icon等各式元素。

一、weui.js是什么？

weui.js 是 WeUI 的輕量級 JS 封裝，不需要依賴其它庫，GZIP 后僅有 9.0 KB。

二、weui.js包含哪些組件？

• actionsheet
• alert
• confirm
• dialog
• form
• gallery
• loading
• picker
• searchbar
• slider
• tab
• toast
• toptips
• uploader

三、使用方式

Github：https://github.com/weui/weui.js

微信網(wǎng)頁開發(fā)樣式參考：http://dwz.cn/4QTFrm

四、微信團(tuán)隊為何在此時公布官方視覺組件庫

為了更像微信OS

微信團(tuán)隊和之前的輕應(yīng)用平臺相比，不是簡單為了給開發(fā)者和用戶之間提供一個平臺連接、也不是只為了做一個流量入口平臺那么簡單，而是為了打造一個完美的微信OS生態(tài)。當(dāng)年百度、UC等平臺推出的輕應(yīng)用，更多的只是起到了一個平臺倒流和連接的作用，并沒有對開發(fā)框架和設(shè)計規(guī)范進(jìn)行過如此統(tǒng)一的規(guī)范和要求?，F(xiàn)在看來，最好的生態(tài)，當(dāng)然是類似蘋果安卓OS那樣，所有的應(yīng)用具備統(tǒng)一的開發(fā)框架和接近OS生態(tài)的完美體驗。

為了極致的用戶體驗

從小程序內(nèi)測到公測已經(jīng)過去了三個月，我們有理由相信微信團(tuán)隊已經(jīng)接到了不少小程序開發(fā)者的審核需求，這其中最讓微信團(tuán)隊頭疼的應(yīng)該就是開發(fā)設(shè)計規(guī)范不符合微信團(tuán)隊的要求，達(dá)不到微信團(tuán)隊想要的那種用戶體驗。微信官方進(jìn)一步推出Weui就是為了讓所有開發(fā)者提交的小程序都能夠接近微信APP的體驗效果，從而給微信用戶帶去最佳的用戶體驗，這也是未來小程序生態(tài)能否提高8億用戶使用熱度和頻率的一個重要指標(biāo)。

倒逼第三方服務(wù)商轉(zhuǎn)型

微信團(tuán)隊在早年推出公眾號的時候曾經(jīng)推出過“開發(fā)者模式”，當(dāng)時，微信團(tuán)隊鼓勵第三方公司利用微信公眾號開放的接口進(jìn)行各種微應(yīng)用的開發(fā)，比如：微網(wǎng)站、微商城，微工具等各種應(yīng)用。但是，微信團(tuán)隊早期并沒有對這些接入應(yīng)用的開發(fā)框架和設(shè)計規(guī)范進(jìn)行統(tǒng)一的定義和嚴(yán)格要求，導(dǎo)致每一個服務(wù)接入商基本都是按照自己的開發(fā)框架和設(shè)計標(biāo)準(zhǔn)進(jìn)行開發(fā)來設(shè)計，使得市面上看到的這些應(yīng)用頁面呈現(xiàn)五花八門，用戶體驗極其糟糕，這也就造成了早期的應(yīng)用服務(wù)被用戶的接受度過低，同時無法給企業(yè)帶來實際價值的癥結(jié)所在。

隨著微信小程序的出現(xiàn)，微信團(tuán)隊重塑統(tǒng)一的開發(fā)框架和設(shè)計規(guī)范，倒逼這些第三方服務(wù)機(jī)構(gòu)重新定義自己的跟隨策略，按照新的開發(fā)規(guī)范重新提供新的平臺服務(wù)?；蛟S，現(xiàn)有的微信第三方服務(wù)機(jī)構(gòu)格局將被打破，第三方服務(wù)機(jī)構(gòu)將面臨新一輪的洗牌。

五、WeUI給小程序開發(fā)者帶來了哪些好處？

• 使用Weui設(shè)計出來的小程序如同用戶使用微信客戶端一樣的視覺效果，可以讓小程序的體驗感更強(qiáng)。
• 使用Weui設(shè)計小程序更夠提高開發(fā)者的開發(fā)效率，降低開發(fā)者的開發(fā)成本，從而讓開發(fā)者更快的開發(fā)出符合規(guī)范的小程序。
• 使用Weui設(shè)計小程序如同您雇傭一支國內(nèi)頂尖的設(shè)計團(tuán)隊幫您打造一個接近完美的視覺框架。

六、微信小程序給前端設(shè)計領(lǐng)域帶來了那些影響和推動

全平臺兼容

微信小程序重新定義了APP，使得一款應(yīng)用能夠在android、iphone以及windows phone中都能運(yùn)行，對于前端來說實現(xiàn)了“一次編譯，到處運(yùn)行”的理念。

前端開發(fā)思維的改變

設(shè)計理念需要從傳統(tǒng)的PC思維需要轉(zhuǎn)向到以移動為先的思維，這其中主要考慮的差異化在于屏幕尺寸、網(wǎng)絡(luò)帶寬、輸入設(shè)備等幾個方面的不同。同時很多之前可以用于iOS 與 Android 的控件需要在小程序上重新調(diào)整和創(chuàng)新。

推動前端技術(shù)的發(fā)展

微信小程序以其簡單的開發(fā)環(huán)境，使以Javascript和HTML5為主的前端技術(shù)成為真正的主流，越來越多的人開始接觸前端開發(fā)，為前端技術(shù)的發(fā)展貢獻(xiàn)力量。

前端投入成本的增加

原本一家傳統(tǒng)企業(yè)的前端開發(fā)人員需要覆蓋PC端、移動端、APP應(yīng)用等各種平臺，微信小程序的出現(xiàn)會導(dǎo)致未來的前端開發(fā)人員還需要涉及小程序的前端開發(fā)設(shè)計，這在一定程度增加了前端開發(fā)人員學(xué)習(xí)和工作成本，同時也會給企業(yè)帶來更多的人才投入成本。

前端人才的競爭更加明顯

微信小程序的誕生會吸引一大批后臺開發(fā)、APP開發(fā)的程序猿們加入前端開發(fā)大軍，進(jìn)一步?jīng)_擊現(xiàn)有的前端開發(fā)人員的的知識結(jié)構(gòu)，加劇前端開發(fā)崗位的競爭格局，迫使一些低端且知識結(jié)構(gòu)不全面的前端開發(fā)人員面臨被淘汰或者失業(yè)的風(fēng)險。

全棧工程師會越來越吃香

隨著微信小程序的出現(xiàn)，既懂后臺，又懂前端的人才會越來越受到企業(yè)的重視和擁抱，特別對于創(chuàng)業(yè)團(tuán)隊和互聯(lián)網(wǎng)企業(yè)來說，一個擁有全局思維、熟悉各種技術(shù)的人才非常重要。身為技術(shù)人員，我們需要不斷擁抱變化，不斷get新技能，努力成為一個全棧工程師。

小結(jié)

微信團(tuán)隊在之前小程序的公測指南里有詳細(xì)的定義小程序的設(shè)計規(guī)范，明確地告訴各位開發(fā)者哪些可以做，哪些不能做，應(yīng)該怎樣做的問題。

但是，微信團(tuán)隊似乎覺得這些工作還不足以規(guī)范小程序的整體體驗。畢竟小程序是一件新生事物，吃瓜群眾還非常多。

微信團(tuán)隊就是希望通過此次公布官方視覺組件庫，明確直接地告訴開發(fā)者“如何寫”的問題。我們有理由相信，未來首批被公布的小程序，在視覺體驗上能夠和微信原生的視覺體驗保持高度的一致，從而真正拉開小程序生態(tài)的序幕。

本文由 @呆盟說?原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。