AI時代的界面設(shè)計已來臨,一鍵生成UI/UX設(shè)計系統(tǒng),讓我驚嘆不已!

上周看到國內(nèi)新出了一款設(shè)計工具：Motiff， 主打 AI 幫助 UI 設(shè)計師提效 。很幸運的拿到了內(nèi)測資格，來簡單分享一下對這款產(chǎn)品的使用體驗。

通過官網(wǎng)的介紹有了解到 Motiff 是一款深度集成 AI 的設(shè)計工具，但和目前已知的文本生成圖像類的 AI 工具不同，Motiff 是給 UI 設(shè)計師提效的。有三個比較有意思的版塊，「AI 設(shè)計系統(tǒng)」「AI 魔法框」和「AI 布局」。

使用 AI，一鍵生成設(shè)計系統(tǒng)

團隊中建立一套完整的「設(shè)計系統(tǒng)」眾所周知這是一個比較復(fù)雜而且長期的工作。而 Motiff 的「AI 設(shè)計系統(tǒng)」這部分很有意思，讓「建立設(shè)計系統(tǒng)」這件事更輕松。

我通過實際案例體驗了一下，導(dǎo)入了一份只有設(shè)計圖的文件，使用 Motiff 來自動生成。生成結(jié)果是基于我設(shè)計圖配色和內(nèi)容的比較全面的設(shè)計系統(tǒng)文件，包含，顏色、字體、效果、圖標(biāo)等設(shè)計規(guī)范。

除了『設(shè)計規(guī)范』之外還包含了「組件」的部分，按鈕、徽標(biāo)、列表、標(biāo)簽、輸入框、導(dǎo)航欄等信息。有了自動生成的『設(shè)計系統(tǒng)』團隊設(shè)計小伙們可以根據(jù)該內(nèi)容再做整理，形成可用性高、持續(xù)迭代的組件庫。

這部分整體體驗下來對于當(dāng)前還沒有設(shè)計系統(tǒng)的團隊可以起到一定的幫助，根據(jù)設(shè)計生成的顏色、字體、效果 這些基本能直接使用。更完整的組件需要提供更多的設(shè)計圖信息，但希望 Motiff 可以根據(jù)少量設(shè)計圖就能生成更多可用性高的組件。

AI 布局，使設(shè)計內(nèi)容快速結(jié)構(gòu)化

「AI 布局」這部分是真的能幫我立即提效的。 在設(shè)計初期我是基本不用自動布局的，自動布局之后會一定程度上影響排版，影響發(fā)散思維。所以在頁面的構(gòu)建階段基本完全是比較隨意的。

Motiff 的 AI 布局功能非常方便。它在不影響設(shè)計圖內(nèi)容的前提下，將原本沒有結(jié)構(gòu)的圖層自動進行結(jié)構(gòu)化處理，也就是自動加「自動布局」，結(jié)構(gòu)化之后整體調(diào)整板塊的排序或者新增組件都會更方便，讓圖層的層次和整體性更結(jié)構(gòu)化。

設(shè)計圖圖層結(jié)構(gòu)化之后，團隊多成員一起協(xié)作也會更方便。

新學(xué)到的用法 ?AI 魔法框

「AI 魔法框」這個功能是個新的嘗試，類似 AI 可以輔助開發(fā)者寫代碼（產(chǎn)品名：GitHub Copilot），隨時根據(jù)輸入的內(nèi)容提示下一步可能用到的命令一樣，AI 魔法框是以設(shè)計師的角度，在設(shè)計圖上畫個區(qū)域，輸入你想要的內(nèi)容，AI 會提示出你可能此時需要的信息，這個信息可能是 按鈕、對話框、列表等類型，并且已經(jīng)將插圖、文案、配色根據(jù)你當(dāng)前的場景自動進行了匹配。

AI 魔法框的功能出發(fā)點非常棒，期待后面更完善的迭代。

Motiff 與 Figma Sketch 對比的優(yōu)勢

Motiff 是新工具所以免不了和已有工具進行對比，Motiff 支持導(dǎo)入 Figma 文件，并且組件關(guān)系能完美的對應(yīng)過來不會有丟失或者錯位的情況。Sketch 導(dǎo)入后的圖層還原度很高（包括一些復(fù)雜的布爾后的圖形也能還原），比 Figma 的效果好很多。這部分還是非常棒的 ??

還有目前主流 UI 設(shè)計工具都有的功能，Motiff 對這部分也做的很完善，完成度也不錯。

• 設(shè)計系統(tǒng)：團隊共享設(shè)計系統(tǒng)，跨文件調(diào)用同一套設(shè)計規(guī)范，保證設(shè)計一致性；

• 團隊字體：本地上傳字體與團隊共享，方便團隊統(tǒng)一字體資源；

• 插件生態(tài)： 目前支持常用的傾斜、圓弧文本、旋轉(zhuǎn)復(fù)制、循環(huán)變化、導(dǎo)出到 AE，后續(xù)陸續(xù)開放插件社區(qū)。

專業(yè)的 AI 團隊給 Motiff 技術(shù)加持

Motiff 是「猿輔導(dǎo)」團隊研發(fā)的， “我們堅信在AI時代，Motiff是能夠發(fā)揮很大AI價值的，也會在生產(chǎn)力上面有本質(zhì)提升。因此無論在技術(shù)、團隊、還是資金方面，我們都做好了長期投入的準(zhǔn)備” 。 能看出他們的決心和勇氣，作為一個用戶我是充滿期待的。

在使用過程中，我與 Motiff 的產(chǎn)研同學(xué)有過一些交流，對方給到我的反饋很專業(yè)，也很能體現(xiàn)他們想要把產(chǎn)品做得更好的決心，整體的產(chǎn)品體驗非常好。

目前該產(chǎn)品在內(nèi)測階段，感興趣的可以了解一下他們官方的聯(lián)系方式報名。