PS:轉(zhuǎn)載請(qǐng)注明出處
作者: TigerChain
地址: http://m.itdecent.cn/p/0830fe9950bb
本文出自 TigerChain 簡(jiǎn)書 侃大山
AI
從阿爾法"狗"到京東智能物流「大量機(jī)器人」,再到富士康的產(chǎn)線,人工智能顯的越來越歷害并且替代了人們的重復(fù)勞動(dòng),現(xiàn)在又充斥智能音響,智能汽車,智能女朋友 ... 等等,AI 使用場(chǎng)景逐漸增多
科技的進(jìn)步確實(shí)帶給人們極大的便利和快捷,但也導(dǎo)致一部分人"失業(yè)",這個(gè)再正常不過了,馬車替代了步行,自行車淘汰了馬車,電動(dòng)車淘汰了自行車/摩托車「共享單車不來,自行車行業(yè)真就死翹翹了」,新的事物替代舊的事物往往推動(dòng)的是發(fā)展,所以這都是事物發(fā)展的規(guī)律
人工智能以后的使用場(chǎng)景可能會(huì)讓人無法想像,但是目前來說想達(dá)到真正的人工那差的不止十萬八千里,目前來說只是稍微智能一點(diǎn)而已,重復(fù)勞動(dòng)肯定會(huì)被替代的「和寫代碼一毛一樣,重復(fù)的代碼遲早會(huì)被替代的」,扯的遠(yuǎn)了,回到主題
Sketch2Code
差不多幾個(gè)月前左右微軟開源了一個(gè) Sketch2Code 東東,這是什么鬼,老話再牛 B 的論調(diào)也抵不過官網(wǎng)的定義,來 Look 一下

翻譯過來就是把手繪的設(shè)計(jì)稿通過 AI 轉(zhuǎn)化成 html,聽起來有點(diǎn)高大尚,這讓我想起了前一段時(shí)間 Google 開發(fā)的猜畫小歌小程序--無疑都是把人工智能應(yīng)用到特定的領(lǐng)域,讓人們好玩的同時(shí),感覺到人工智能就在我們身邊
實(shí)戰(zhàn)
對(duì)新鮮事物好奇的我就感受了一把 sketch2code ,它就是把一張草圖上傳到的指定的網(wǎng)站 https://sketch2code.azurewebsites.net,然后后臺(tái)根據(jù) AI 來識(shí)別圖片中的框框條條后根據(jù)算法轉(zhuǎn)化成 html 代碼,廢話不多說來一個(gè)例子看一下「為演示方便,我們來一個(gè)官方例子」
選擇一張手稿

點(diǎn)擊綠色按鈕使用這個(gè)例子

我們看到手搞「左邊」生成了 html 界面「右邊」,下面有下載 html 代碼按鈕,我們下載下來瞧瞧

展示結(jié)果
生成的 html「部分內(nèi)容沒有展開」 默認(rèn)是使用 bootstrap 來填充樣式的,在網(wǎng)頁上瀏覽沒啥問題,我們切換到手機(jī)平臺(tái)

適配效果很差「還能愉快的寫代碼嗎,說好的自動(dòng)生成 html 呢?難不成要讓我手動(dòng)再改一下」
Sketch2Code 工作流程

大概就是通過微軟的 Custom Vision「自定義模型,通過不同的手稿圖片大量訓(xùn)練,并且標(biāo)記了常見的 html 元素」然后通過一些服務(wù)生成對(duì)應(yīng)的 html 片段
其實(shí)類似的工作 ps 有插件可以轉(zhuǎn)化「不過是手動(dòng)的,并且手繪的不可以」,我不禁想起了被人們遺忘的 dw「dreamware」那種所見即所得拖動(dòng)一下就可以得到 html 界面「真特么爽」,而 Sketch2Code 就是把這些東西通過 AI 來解決掉了
前端涼了?
我大概看了一下 Sketch2Code 這個(gè)東東,就是一個(gè)把手稿轉(zhuǎn)化 html 的這么一個(gè)東西,這個(gè)東西對(duì)產(chǎn)品經(jīng)理來說做個(gè)原型是非常不錯(cuò)的選擇「就目前來說」開發(fā)人員使用?還是算了吧,前端可不只是 html ,當(dāng)然你現(xiàn)在只會(huì)一個(gè) html 那你真該涼了,自從有了大前端以后,誰 tm 會(huì)一個(gè) html 能找到工作「簡(jiǎn)直是扯淡」,大量的邏輯和 js 還有 css 的一些特效 Sketch2Code 根本做不到
歷史前端工程師
如果倒退幾年,在前后端沒有分離,并且業(yè)務(wù)不復(fù)雜的 web 開發(fā)時(shí)代,前端就是一個(gè)寫 html 模版的工作「經(jīng)常被后端瞧不起-見的太多了」,那個(gè)時(shí)代前端寫個(gè) html 然后給后端去套模版調(diào)用,確實(shí)這個(gè)東西 Sketch2Code 就能幫你搞定,現(xiàn)在前端發(fā)生了翻天覆地的變化,半年不學(xué)習(xí)你就 out 了,特別是前后端分離以后
現(xiàn)在的前端
現(xiàn)在前端的生態(tài)發(fā)生了革命性的發(fā)展,以虛擬 dom 為主的前端框推動(dòng)主流前端技術(shù),并且前后端分離以后,大量的邏輯都放在前端了「前端不單單是畫個(gè) html 界面那么簡(jiǎn)單了」,學(xué)了 grunt 接著是 gulp ,gulp 還沒有熟練 webpack 又出來了,你剛學(xué)會(huì)寫 js ,commonjs 出來了,隨著 node 的興起 amd 又出來了「國內(nèi)還出了個(gè) cmd」后來 ES6 直接把前幾個(gè)干趴下了,為了瀏覽器的兼容你得學(xué) babel,為了模塊化你得看 npm/yarn ... 你的學(xué)習(xí)速度永遠(yuǎn)跟不上前端發(fā)展的速度



怎么樣熟悉吧,沒錯(cuò)這就是在 bootstrap 官網(wǎng)上列出的比較有代表性的框架或類庫,你把這些東西都掌握了?你以為前端那么容易就是寫一個(gè) html,所以前端涼不了,你需要做的就是靜下心好好的把技術(shù)學(xué)好,別聽風(fēng)就是雨好吧,為了有說服力,我特意看了一下招聘網(wǎng)站「以北京為例子搜索 html5 開發(fā)工程師」
牛 B 的可以達(dá)到百萬級(jí)別

我們來一個(gè)沒有排序隨便搜索的,還是以北京為例子

基本上 2 年以上 html 開發(fā)經(jīng)驗(yàn)就能拿到 1.5 萬以上,崗位多的要死,包括 BAT 都在招牛 B 的工程師,所以不存在前端涼了一說,只有不斷的提高技術(shù)才是王道,別的都扯淡
洗洗睡吧
前端涼不了,所以看到這些字眼,我想說洗洗睡吧,別聽風(fēng)就是雨「靜下心來,提升自己比什么都強(qiáng)」
當(dāng)然 Sketch2Code 的人工智能解放了部分 UI,原型圖可以設(shè)計(jì)的很牛 B 了「不用再看手搞了」,產(chǎn)品經(jīng)理以后可以橫著走了「好像一直都是橫著走的」
話說寫一個(gè) html 界面和 server 寫 crud 一樣沒啥含量,如果 bootstrap 上面提到庫和框架你都能吃透,拿不了高工資還有天理嗎?還有王法嗎?前端涼了只能當(dāng)作娛樂娛樂一下就好了,真的洗洗睡吧,時(shí)間不早了
作者: TigerChain 訂閱查看更多內(nèi)容。
本文出自 TigerChain 侃大山