今年作為 AIGC 大爆發(fā)的一年，在插畫、游戲行業(yè)已經(jīng)得到了廣泛的普及和應用，有效的提高了相關行業(yè)的產出效率，幫畫師們少掉了不少頭發(fā)。

但這些主流的 AIGC 工具，卻很難直接應用到 UI 領域中，因為生成不準確的位圖對于實際項目來說是毫無意義的，這在前面的文章也解釋過。

當時我也提過，AI 繪圖要應用到非插畫的其它行業(yè)，就必然要推出細分領域的獨立工具，以滿足相關行業(yè)的專業(yè)需要。所以，近期更新的即時 AI 就是針對 UI 行業(yè)專用的細分工具。

內測版在3月份上線，雖然第一時間拿到內測資格，但因為前期版本網(wǎng)絡比較擁擠，且存在比較多的優(yōu)化空間，所以沒有第一時間做分享。等到近期正式版發(fā)布，能符合我對它的預期以后，就可以和大家聊聊這款工具了。

今天，我們就緊跟潮流來認識它的功能和使用方法。

即時 AI 是即時設計官方推出（非插件）使用自然語言生成界面的 AI 工具，我們可以像 AIGC 一樣輸入 Prompt 指令來生成 UI 界面。

之前內測版本需要申請邀請碼所以很多同學體驗不了，目前開放版本已經(jīng)不在需要內測資格，任何同學都可以使用，只要訪問下方網(wǎng)址就可以進入到 AI 工具的主頁。

https://js.design/ai

目前界面非常簡單，包含左側的畫布和右側的文本編輯區(qū)，只要我們在右側輸入 Prompt 文本，點擊生成界面，就可以獲得相關的界面結果。每次輸入的文本內容只生成一個頁面的多種結果，但不能輸出多個不同的頁面。

想要生成新的頁面，就要在右側再輸入新的內容進行生成，生成后的結果會排列到上一次的結果之后，而不會清空它。

如果想要生成一整套 APP 的頁面，那么每次生成的多個結果就肯定要剔除掉不滿意的那些，所以在畫布中選中畫板，并在上方彈窗中點擊刪除圖標即可完成刪除。畫布左下角的圖標則是清空這個頁面的所有內容。

但畢竟這是用來生成特殊界面結果的工具，不是 ChapGPT 做問答，所以我們輸入的 Prompt 自然需要具備一定的邏輯和規(guī)則，才能盡可能保證結果符合我們的預期。

首先，Prompt 描述具備一定的結構特征：

主題+ 頁面類型 + 布局 + 模塊內容

比如官方的示例：

生成健康管理的 APP 首頁，首頁內容以減肥塑形為主，有運動計劃、推薦課程、本周食譜、個人數(shù)據(jù)檢測4個部分，運動計劃中需要有個人的身體健康信息與正在進行的運動。

值得注意的是，對于模塊的描述是非常關鍵的。在我們過去的分享中時常會提及，頁面是由若干組件構成的，所以我們在輸入 Prompt 時就是聲明這個頁面包含了哪些組件內容。

不要使用疑問句的方式，或者產品需求的描述來讓 AI 自己想應該提供哪些組件和模塊出來。比如：

頁面中包含了用戶可以自己查看聽歌記錄和喜好標簽的功能……

同時，目前的關鍵字并不能定義畫板大小、風格、配圖等非常具體的細節(jié)，且文字過多可能會忽略超額的信息內容。所以目前的版本，在輸入 Prompt 時盡量使用簡潔、具體、利落的文本信息。

目前官方發(fā)布的 Prompt 相關類型詞匯有以下這些：

應用主題：輸入文本進去

頁面類型：輸入文本

頁面布局：

頂部欄、導航欄、底部欄

頁面模塊內容：

輸入框、搜索框、熱門推薦、圖片、視頻封面、入口、返回鍵

掌握上面這些信息，你就可以自己去動手嘗試用文本生成 UI 界面了。

當然，作為一個剛上線不久的產品，目前可以生成的頁面內容、樣式、細節(jié)，肯定不可能是想象中直接可以替代正式工作產出成果的地步。我相信在短時間內技術也沒辦法實現(xiàn)，因為需求端的輸入再怎么完善也無法滿足復雜的工作場景。

所以即時 AI 到底能發(fā)揮什么作用呢？我就在下面繼續(xù)談一談。

在我看來，即時 AI 這類工具最大的作用，并不是生成盡善盡美的復雜頁面，直接抵消我們的設計過程。像下面這些包含大量字段和狀態(tài)的組件，就沒辦法使用 AI 來完成。

或者那些非常有創(chuàng)造力，和場景搭配得非常巧妙的創(chuàng)意型組件樣式，在短時間內應該也無法用 AI 直接實現(xiàn)。

AI 要結合進工作流，就首先得知道我們的工作流是什么樣的，設計除了過去我們說的前期分析的黑箱外，整個和設計有關的實踐步驟還有前期的產品原型、交互原型和版式規(guī)劃。

這些步驟都是方案的磨合階段，主要的目標是通過可視化的線框圖來進行內部的討論，需要在設計過程中盡可能的節(jié)省時間，自然不需要提供精度非常高的頁面出來。

尤其是產品經(jīng)理在輸出產品原型時，Axure 制作的原型質量往往產不忍賭，即使樣式做的很 “隨便” 了，操作所花的時間也一點都不少。

所以依靠文本生成頁面的方法，可以快速生成一個基本的頁面結構出來，然后再在這個基礎上做刪改，就可以輸出質量遠比 Axure 優(yōu)質的原型，這對于設計外行來說是非常有效的功能。

再者，就是對于一個頁面或者組件，應該用什么布局來實現(xiàn)好光靠想是沒用的，往往是需要動手把大概得布局實現(xiàn)出來，所以很多時候因為設計師懶，做了第一版就不想再往下做下去，忽視其它可能性。

使用 AI 來幫我們快速生成一些不同結果，也可以供我們進行評審或者參考，或者激發(fā)設計師的靈感，為后續(xù)的正式設計帶來更多的啟發(fā)。

做前期版本，即時 AI 也還有很大的發(fā)展空間，在后續(xù)的快速迭代中肯定會發(fā)展出很多更強大的算法和功能。但不管怎么提升，它核心的應用場景都是在進入設計步驟前的準備階段中。

再換個角度，作為 UI 設計師我們也不應該一直奢求軟件可以一次性生成整套能夠落地的項目界面出來，退一萬步說真的有天接入 “外星科技”，用腦電波就能一秒出整套項目圖交付開發(fā)，那這一天并不是讓我們可以更好的劃水，而是直接原地下崗的一天，項目有產品或者體驗設計就夠了。

所以，要對這樣的工具樹立合理的預期，把對它的學習和使用有效關聯(lián)到你的設計流程前期階段去，才能發(fā)揮它的最大價值。

結尾

AI 的興起勢必會對各行各業(yè)有影響，但這種影響一定不是那么膚淺的直接快進到取代專業(yè)人士的地步。所以到底會影響在哪些方面，影響有多大，也是最近我們一直在摸索和思考的問題。

如果有什么想法，可以在下面的留言中提出來。

我們下篇再賤~

往期文章閱讀：

已經(jīng)開課，變強在即！