(相關(guān)資料圖)
最近給大家分享了不少用 AI 生成前期素材、輔助需求落地的案例，確實能省不少時間。同時我們也在想，能不能讓 AI 幫我們做更多的事情，比如生成一整張 UI 設(shè)計稿。
01 選擇 AI 工具
輸入關(guān)鍵詞，讓 AI 生成一張電影網(wǎng)站首頁。
確實有那么點兒意思了，但生成的只是一張圖，可以看看布局和樣式，想要落地使用肯定是不行。
用 AI 生成一個圖標(biāo)時，我們可以通過多次生成來篩選，再用 PS 精修調(diào)整；但用 AI 生成 UI 設(shè)計稿的要求就高了，字體、樣式、組件都需要遵循設(shè)計規(guī)范，所以最好能生成可編輯的源文件。
翻遍全網(wǎng)，終于讓我找到了一款滿足條件且立刻就能用上的工具——「即時 AI」，輸入文字就能生成可編輯 UI 設(shè)計稿，而且同時支持生成 APP 和 web 兩種尺寸。
「即時 AI」官網(wǎng)：http://mtw.so/5LkTpb
先來簡單嘗試一下，讓 AI 生成一個電影播放網(wǎng)站首頁，等待幾十秒，得到了以下 4 個頁面。
基礎(chǔ)結(jié)構(gòu)都還比較清晰，界面 1 和 2 明顯完整性更高，可以先保留下來。
參考第一次生成的結(jié)果，我們對于這個「電影網(wǎng)站首頁」應(yīng)該包含哪些模塊有了一個大概的印象，可以將欄目進(jìn)一步劃分為熱門影片、近期上映、電影資訊等。
根據(jù)這些優(yōu)化描述語再生成一次，得到了又一張可用的設(shè)計稿。
描述語：生成一個電影播放網(wǎng)站首頁，包含熱門影片推薦、近期上映、電影行業(yè)資訊模塊
即時 AI 生成圖片如下：
看著效果已經(jīng)很不錯了，簡單修改下頂部的圖標(biāo)、替換一下 logo，拿去給老板看看布局、根據(jù)這個對齊細(xì)化需求肯定是沒問題的。
02 快速產(chǎn)出多個方案
正常我們做需求，畫一個方案已經(jīng)很耗費時間，最多再給出兩個備選方案，但用 AI 輔助產(chǎn)出完全沒有這個壓力。
每次只要等待 60s 左右就可以獲得 4 張不錯的設(shè)計稿，一共嘗試了四五次，就篩選出了以下可供參考、可二次編輯使用的 AI 作品。
除了出圖快，借助 AI 工具我們還可以不受限制地發(fā)揮創(chuàng)意。
我嘗試了繼續(xù)增加描述詞，讓即時 AI 生成更符合預(yù)期的設(shè)計稿；也試了試只保留對頁面主要內(nèi)容的描述，看看 AI 還能怎樣發(fā)揮創(chuàng)意。
當(dāng)我刪去關(guān)于內(nèi)容模塊的描述后，AI 非常有創(chuàng)意地在頁面中加上了電影詳情（包含劇情簡介、演職員表）。
在另一張生成結(jié)果中，AI 還幫我加上了「影評」和「購票信息」，直接“打通”線上線下觀影流程。
主要的功能用得差不多了，我的 10 個方案也攢夠了。
同樣需要 AI 幫忙設(shè)計初稿，給老板過方案的，現(xiàn)在就可以去試試了。全面開放使用，每天 20 次機會，最多可生成 80 張 APP/web 設(shè)計稿，完全夠用。
「即時 AI」官網(wǎng)：http://mtw.so/5LkTpb
03 一鍵發(fā)布“上線”
「即時 AI」和即時設(shè)計工具是打通的，原本打算把我剛用 AI 做好的 10 個方案保存到即時設(shè)計，然后分享預(yù)覽給領(lǐng)導(dǎo)看，但我突然注意到還有個按鈕是【發(fā)布網(wǎng)頁】，點一下直接幫我把 AI 設(shè)計稿發(fā)布成可在線查看的網(wǎng)頁了。
發(fā)布成功后，復(fù)制鏈接或者截圖二維碼發(fā)給領(lǐng)導(dǎo)同事，就能在線打開查看“線上”效果，而且高度還原設(shè)計稿。
目前這個發(fā)布上線的功能只可以在「即時 AI」中使用，如果能在即時設(shè)計內(nèi)使用，那不僅能給前端開發(fā)同學(xué)節(jié)省時間，還能給我們 UI 設(shè)計師省去反復(fù)走查的痛苦，各種精美的設(shè)計效果也能被一一還原。
總結(jié)
以上就是和大家分享我使用「即時 AI」產(chǎn)出 UI 初版方案的全部內(nèi)容啦！
整個試下來，AI 生成的 UI 設(shè)計稿還比較初級，適合在前期探索階段用來獲取靈感、參考布局。但整體生成速度很快，且支持二次編輯，既能生成 APP 頁面，也支持生成 web 尺寸，覆蓋了大多數(shù) UI 設(shè)計場景。
平均 30～60s 的生成速度，也可以幫設(shè)計師們快速生成多張不同布局的高保真圖，提供除競品以外的頁面參考，試錯成本也大幅降低。搭配“發(fā)布上線”這個功能，快速生成可在線查看的預(yù)覽網(wǎng)頁，實用性大幅提升。
AI 工具發(fā)展很快，但我們也不必?fù)?dān)心被取代，因為 UI 設(shè)計需要考慮用戶交互的問題，而如何提升用戶體驗還是需要設(shè)計師去深入研究。但我很推薦大家用 AI 生成的 UI 界面來快速生成原型、設(shè)計初稿，以便進(jìn)行測試和驗證；又或者用參考 AI 作品來增強和改進(jìn)自己的設(shè)計。
總的來說，無論 AI 發(fā)展到什么程度，最終的設(shè)計決策仍需由設(shè)計師來做出。我們可以積極嘗試更多工具，讓 AI 成為最好的創(chuàng)作幫手！
希望以上內(nèi)容對大家有所幫助，如果感覺有用，請點個贊～
最后，感興趣的可以去試試「即時 AI」，復(fù)制鏈接到瀏覽器打開即可：
http://mtw.so/5LkTpb
標(biāo)簽：
