PS：轉(zhuǎn)載請(qǐng)注明出處
作者: TigerChain
地址: http://www.itdecent.cn/p/0830fe9950bb
本文出自 TigerChain 簡(jiǎn)書(shū) 侃大山
AI
從阿爾法"狗"到京東智能物流「大量機(jī)器人」，再到富士康的產(chǎn)線，人工智能顯的越來(lái)越歷害并且替代了人們的重復(fù)勞動(dòng)，現(xiàn)在又充斥智能音響，智能汽車(chē)，智能女朋友 ... 等等，AI 使用場(chǎng)景逐漸增多
科技的進(jìn)步確實(shí)帶給人們極大的便利和快捷，但也導(dǎo)致一部分人"失業(yè)"，這個(gè)再正常不過(guò)了，馬車(chē)替代了步行，自行車(chē)淘汰了馬車(chē)，電動(dòng)車(chē)淘汰了自行車(chē)/摩托車(chē)「共享單車(chē)不來(lái)，自行車(chē)行業(yè)真就死翹翹了」，新的事物替代舊的事物往往推動(dòng)的是發(fā)展，所以這都是事物發(fā)展的規(guī)律
人工智能以后的使用場(chǎng)景可能會(huì)讓人無(wú)法想像，但是目前來(lái)說(shuō)想達(dá)到真正的人工那差的不止十萬(wàn)八千里，目前來(lái)說(shuō)只是稍微智能一點(diǎn)而已，重復(fù)勞動(dòng)肯定會(huì)被替代的「和寫(xiě)代碼一毛一樣，重復(fù)的代碼遲早會(huì)被替代的」，扯的遠(yuǎn)了，回到主題
Sketch2Code
差不多幾個(gè)月前左右微軟開(kāi)源了一個(gè) Sketch2Code 東東，這是什么鬼，老話再牛 B 的論調(diào)也抵不過(guò)官網(wǎng)的定義,來(lái) Look 一下
翻譯過(guò)來(lái)就是把手繪的設(shè)計(jì)稿通過(guò) AI 轉(zhuǎn)化成 html，聽(tīng)起來(lái)有點(diǎn)高大尚，這讓我想起了前一段時(shí)間 Google 開(kāi)發(fā)的猜畫(huà)小歌小程序--無(wú)疑都是把人工智能應(yīng)用到特定的領(lǐng)域，讓人們好玩的同時(shí)，感覺(jué)到人工智能就在我們身邊
實(shí)戰(zhàn)
對(duì)新鮮事物好奇的我就感受了一把 sketch2code ，它就是把一張草圖上傳到的指定的網(wǎng)站 https://sketch2code.azurewebsites.net，然后后臺(tái)根據(jù) AI 來(lái)識(shí)別圖片中的框框條條后根據(jù)算法轉(zhuǎn)化成 html 代碼，廢話不多說(shuō)來(lái)一個(gè)例子看一下「為演示方便，我們來(lái)一個(gè)官方例子」
選擇一張手稿
點(diǎn)擊綠色按鈕使用這個(gè)例子
我們看到手搞「左邊」生成了 html 界面「右邊」，下面有下載 html 代碼按鈕，我們下載下來(lái)瞧瞧
展示結(jié)果
生成的 html「部分內(nèi)容沒(méi)有展開(kāi)」 默認(rèn)是使用 bootstrap 來(lái)填充樣式的，在網(wǎng)頁(yè)上瀏覽沒(méi)啥問(wèn)題，我們切換到手機(jī)平臺(tái)
適配效果很差「還能愉快的寫(xiě)代碼嗎，說(shuō)好的自動(dòng)生成 html 呢？難不成要讓我手動(dòng)再改一下」
Sketch2Code 工作流程
大概就是通過(guò)微軟的 Custom Vision「自定義模型，通過(guò)不同的手稿圖片大量訓(xùn)練，并且標(biāo)記了常見(jiàn)的 html 元素」然后通過(guò)一些服務(wù)生成對(duì)應(yīng)的 html 片段
其實(shí)類似的工作 ps 有插件可以轉(zhuǎn)化「不過(guò)是手動(dòng)的，并且手繪的不可以」，我不禁想起了被人們遺忘的 dw「dreamware」那種所見(jiàn)即所得拖動(dòng)一下就可以得到 html 界面「真特么爽」，而 Sketch2Code 就是把這些東西通過(guò) AI 來(lái)解決掉了
前端涼了？
我大概看了一下 Sketch2Code 這個(gè)東東，就是一個(gè)把手稿轉(zhuǎn)化 html 的這么一個(gè)東西，這個(gè)東西對(duì)產(chǎn)品經(jīng)理來(lái)說(shuō)做個(gè)原型是非常不錯(cuò)的選擇「就目前來(lái)說(shuō)」開(kāi)發(fā)人員使用？還是算了吧，前端可不只是 html ，當(dāng)然你現(xiàn)在只會(huì)一個(gè) html 那你真該涼了，自從有了大前端以后，誰(shuí) tm 會(huì)一個(gè) html 能找到工作「簡(jiǎn)直是扯淡」，大量的邏輯和 js 還有 css 的一些特效 Sketch2Code 根本做不到
歷史前端工程師
如果倒退幾年，在前后端沒(méi)有分離，并且業(yè)務(wù)不復(fù)雜的 web 開(kāi)發(fā)時(shí)代，前端就是一個(gè)寫(xiě) html 模版的工作「經(jīng)常被后端瞧不起-見(jiàn)的太多了」，那個(gè)時(shí)代前端寫(xiě)個(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ù)，并且前后端分離以后，大量的邏輯都放在前端了「前端不單單是畫(huà)個(gè) html 界面那么簡(jiǎn)單了」，學(xué)了 grunt 接著是 gulp ，gulp 還沒(méi)有熟練 webpack 又出來(lái)了，你剛學(xué)會(huì)寫(xiě) js ，commonjs 出來(lái)了，隨著 node 的興起 amd 又出來(lái)了「國(guó)內(nèi)還出了個(gè) cmd」后來(lái) ES6 直接把前幾個(gè)干趴下了，為了瀏覽器的兼容你得學(xué) babel，為了模塊化你得看 npm/yarn ... 你的學(xué)習(xí)速度永遠(yuǎn)跟不上前端發(fā)展的速度
怎么樣熟悉吧，沒(méi)錯(cuò)這就是在 bootstrap 官網(wǎng)上列出的比較有代表性的框架或類庫(kù)，你把這些東西都掌握了？你以為前端那么容易就是寫(xiě)一個(gè) html，所以前端涼不了，你需要做的就是靜下心好好的把技術(shù)學(xué)好，別聽(tīng)風(fēng)就是雨好吧，為了有說(shuō)服力，我特意看了一下招聘網(wǎng)站「以北京為例子搜索 html5 開(kāi)發(fā)工程師」
牛 B 的可以達(dá)到百萬(wàn)級(jí)別
我們來(lái)一個(gè)沒(méi)有排序隨便搜索的，還是以北京為例子
基本上 2 年以上 html 開(kāi)發(fā)經(jīng)驗(yàn)就能拿到 1.5 萬(wàn)以上，崗位多的要死，包括 BAT 都在招牛 B 的工程師，所以不存在前端涼了一說(shuō)，只有不斷的提高技術(shù)才是王道，別的都扯淡
洗洗睡吧
前端涼不了，所以看到這些字眼，我想說(shuō)洗洗睡吧，別聽(tīng)風(fēng)就是雨「靜下心來(lái)，提升自己比什么都強(qiáng)」
當(dāng)然 Sketch2Code 的人工智能解放了部分 UI，原型圖可以設(shè)計(jì)的很牛 B 了「不用再看手搞了」，產(chǎn)品經(jīng)理以后可以橫著走了「好像一直都是橫著走的」
話說(shuō)寫(xiě)一個(gè) html 界面和 server 寫(xiě) crud 一樣沒(méi)啥含量，如果 bootstrap 上面提到庫(kù)和框架你都能吃透，拿不了高工資還有天理嗎？還有王法嗎？前端涼了只能當(dāng)作娛樂(lè)娛樂(lè)一下就好了，真的洗洗睡吧，時(shí)間不早了
作者: TigerChain 訂閱查看更多內(nèi)容。
本文出自 TigerChain 侃大山
