UI設(shè)計(jì)和前端工程師之間，可能還需要一個(gè)神經(jīng)網(wǎng)絡(luò)。

近日，位于哥本哈根的一家創(chuàng)業(yè)公司Uizard Technologies開(kāi)發(fā)出了一個(gè)名為“pix2code”的系統(tǒng)。運(yùn)用深度學(xué)習(xí)，這個(gè)系統(tǒng)能夠根據(jù)輸入的圖形用戶(hù)界面（GUI）截圖直接輸出對(duì)應(yīng)的代碼，從而省去前端手動(dòng)編寫(xiě)代碼的過(guò)程。

目前pix2code所生成代碼的準(zhǔn)確率已經(jīng)達(dá)到77%，且這些代碼能夠兼容安卓、iOS以及Web界面三種平臺(tái)。

到底有多神奇？看看下面這段視頻就知道了。

UIzard的創(chuàng)始人Tony Beltramelli說(shuō)，為了搞出這個(gè)神經(jīng)網(wǎng)絡(luò)，研發(fā)團(tuán)隊(duì)不得不克服三個(gè)主要方面的困難：

• 第一是計(jì)算機(jī)視覺(jué)層面——計(jì)算機(jī)無(wú)法自動(dòng)識(shí)別、理解給定的對(duì)象和場(chǎng)景，也無(wú)法判斷它們的位置和特征；

• 第二是語(yǔ)言層面——他們需要教會(huì)神經(jīng)網(wǎng)絡(luò)理解文本，好讓它能夠創(chuàng)造出準(zhǔn)確的樣本；

• 最后，神經(jīng)網(wǎng)絡(luò)需要理解代碼、文本以及對(duì)應(yīng)圖像之間的關(guān)聯(lián)。

Beltramelli還表示，在未來(lái)，他們可能會(huì)用生成對(duì)抗網(wǎng)絡(luò)（GANs）對(duì)pix2code進(jìn)行進(jìn)一步的完善。GANs已經(jīng)證明了自己在生成序列和圖像時(shí)的優(yōu)勢(shì)，但因?yàn)檫@一領(lǐng)域內(nèi)的研究還處于相對(duì)初步的階段，要對(duì)神經(jīng)網(wǎng)絡(luò)進(jìn)行訓(xùn)練仍然需要花費(fèi)大量的時(shí)間。

附paper地址：

https://arxiv.org/abs/1705.07962

GitHub地址：

https://github.com/tonybeltramelli/pix2code

此外，在GitHub上，Beltramelli對(duì)于pix2code相關(guān)的一些常見(jiàn)問(wèn)題進(jìn)行了解答。量子位將這一部分編譯如下：

Q：數(shù)據(jù)集會(huì)在什么時(shí)候開(kāi)放？

A：我們把論文投到了今年的NIPS，等他們給出采納或拒絕的結(jié)果后，數(shù)據(jù)集將會(huì)開(kāi)放，具體時(shí)間大概在九月。那時(shí)我們將會(huì)提供包含在數(shù)據(jù)集中的GUI截圖、相關(guān)的DSL代碼以及針對(duì)iOS、安卓和Web界面的三種目標(biāo)代碼。

Q：源代碼什么時(shí)候開(kāi)放？

A：原本如論文中所寫(xiě)，我們沒(méi)有開(kāi)放源代碼的計(jì)劃。但沒(méi)想到這個(gè)項(xiàng)目吸引了如此多的關(guān)注，因此我們決定將論文中說(shuō)的pix2code實(shí)現(xiàn)代碼和數(shù)據(jù)集一起開(kāi)源。

Q：pix2code會(huì)支持其他目標(biāo)平臺(tái)/語(yǔ)言嗎？

A：不，pix2code只是一個(gè)研究項(xiàng)目，它將保持論文中所描述的狀態(tài)。這個(gè)項(xiàng)目其實(shí)只是對(duì)我們?cè)赨izard Technologies所做工作的一個(gè)小小展示。當(dāng)然，我們歡迎你fork，自己在其他目標(biāo)平臺(tái)/語(yǔ)言上進(jìn)行實(shí)驗(yàn)。

Q：我能在自己的前端項(xiàng)目中用上pix2code嗎？

A：不，pix2code只是實(shí)驗(yàn)性的項(xiàng)目，目前還無(wú)法讓你在特定案例上應(yīng)用。但我們正在努力爭(zhēng)取讓它實(shí)現(xiàn)商業(yè)化。

Q：模型的表現(xiàn)是如何進(jìn)行測(cè)量的？

A：論文中所報(bào)告的準(zhǔn)確或是錯(cuò)誤結(jié)果都是在DSL層次上，通過(guò)對(duì)生成的token和預(yù)期的token進(jìn)行比較而得出的。如果二者存在任何長(zhǎng)度上的差異，同樣會(huì)被認(rèn)定為錯(cuò)誤。

Q：訓(xùn)練這個(gè)模型要花費(fèi)多久？

A：在一塊英偉達(dá)的Tesla K80 GPU上，要讓一個(gè)數(shù)據(jù)集中包括的109 * 10^6條參數(shù)最優(yōu)化，需要花費(fèi)不到5個(gè)小時(shí)的時(shí)間。因此如果你想在三個(gè)目標(biāo)平臺(tái)上對(duì)這個(gè)模型進(jìn)行訓(xùn)練的話(huà)，大概要花費(fèi)15個(gè)小時(shí)。

Q：我是一名前端開(kāi)發(fā)者？我是不是很快就要失業(yè)？（我非常真誠(chéng)地問(wèn)了這個(gè)問(wèn)題好多遍了……）

A：AI并不會(huì)那么快就把前端工程師替代。

即便假定已經(jīng)存在一個(gè)成熟的pix2code版本，在每種不同的平臺(tái)/語(yǔ)言上生成的代碼都能達(dá)到100%的準(zhǔn)確率，好的前端仍然需要邏輯、互動(dòng)、高級(jí)的圖形和動(dòng)畫(huà)，以及其他所有用戶(hù)喜歡的東西。

我們做這個(gè)東西的目的是填平UI/UX設(shè)計(jì)師與前端開(kāi)發(fā)者之間的鴻溝，而不是去代替他們。我們希望能讓設(shè)計(jì)者更好地創(chuàng)作，同時(shí)讓開(kāi)發(fā)人員將自己的時(shí)間更多地花費(fèi)在那些核心功能上。

我們相信未來(lái)AI將與人類(lèi)協(xié)作，而不是代替人類(lèi)。

---------------------------------------------------

唐旭 編譯整理

量子位 報(bào)道 | 公眾號(hào)QbitAI