出品 | 51CTO技術(shù)棧（微信號(hào)：blog51cto）

今天凌晨，一款A(yù)gent工具意外出圈了。

一位熱衷 AI 攝影導(dǎo)演的 X 博主 @EHuanglu 分享了他試用一個(gè)名叫 HeroUI 的 AI 工具的經(jīng)歷，并放出了自己近日來生成的 6 個(gè)精美 App 或網(wǎng)站，精美程度堪比蘋果、迪奧。

“我只用文字 prompt，就在幾分鐘內(nèi)創(chuàng)建了一個(gè)完整的項(xiàng)目管理應(yīng)用。”“它可以模仿任意網(wǎng)站界面，只要你提供截圖。”“還能導(dǎo)入 Figma 文件繼續(xù)編輯。”“甚至 prompt 寫不清楚？它會(huì)幫你補(bǔ)。”

圖片

HeroUI，名字一聽就是一個(gè)超級(jí)能干的 AI UI 設(shè)計(jì)師。

這些帖子快速引來了超過 54 萬網(wǎng)友的圍觀，可以說是一起見證了「UI 設(shè)計(jì)師消失」的第一步。

雖然聽起來有些夸張，但相信各位體驗(yàn)之后，也會(huì)如同網(wǎng)友一般大為驚嘆。

一、HeroUI 究竟厲害在哪里？

我們先來看 @EHuanglu 的真實(shí)流程：

登錄這個(gè)網(wǎng)址：heroui.chat。沒錯(cuò)可以免費(fèi)使用。

圖片

1.一句話，一個(gè)可運(yùn)行的真·App

第一個(gè)，是一句話直接生成 App 的例子。用戶只需要輸入一句話，比如：

“幫我做一個(gè)項(xiàng)目管理工具，有任務(wù)面板、日歷視圖和團(tuán)隊(duì)協(xié)作功能。”

HeroUI 就會(huì)自動(dòng)生成對(duì)應(yīng)的界面和交互邏輯，像 Notion + Trello 的結(jié)合體。生成的頁(yè)面可以在瀏覽器中直接運(yùn)行，并不是靜態(tài)圖，而是真實(shí)代碼驅(qū)動(dòng)的產(chǎn)品原型。

來源：??https://h23yxt-5173.csb.app/

用 Agent 來生成 App 這個(gè)例子已經(jīng)有不少了。然而，目前市面上真正能做到的如此突出的使用效果的，小編認(rèn)為就這一家。

2.上傳截圖，直接「克隆」網(wǎng)站界面

如果你不知道怎么描述想要的頁(yè)面樣式，也可以直接上傳參考圖。比如把 Apple 官網(wǎng)、Notion 首頁(yè)截圖上傳，HeroUI 會(huì)自動(dòng)生成結(jié)構(gòu)相似的設(shè)計(jì)：

“想復(fù)制誰(shuí)的設(shè)計(jì)？截圖拖進(jìn)來，它來幫你模仿。”

用 EHuanglu  的原話來形容：「AI 幾乎 1:1 還原，只用了不到 2 分鐘。」

3.一鍵增強(qiáng) Prompt，AI 補(bǔ)全你沒想到的細(xì)節(jié)

當(dāng)然，更多的網(wǎng)友的需求則是——不太會(huì)寫 UI 設(shè)計(jì)的 prompt，這就是 HeroUI 的厲害之處，現(xiàn)在：

你輸入一句話，HeroUI 會(huì)自動(dòng)加上這些你可能遺漏的元素：

• 頁(yè)面布局結(jié)構(gòu)
• 動(dòng)畫和過渡效果
• 色彩搭配和按鈕樣式

這就像讓 AI 自動(dòng)“腦補(bǔ)”你的模糊想法，讓初級(jí)用戶也能生成高級(jí)結(jié)果。

4.導(dǎo)入 Figma，AI 繼續(xù)幫你改

你以為這就完了？當(dāng)然沒有。

HeroUI 并不是封閉系統(tǒng)，它還可以直接接入 Figma。如果你有設(shè)計(jì)師做的初版稿圖，上傳進(jìn)來后，AI 會(huì)自動(dòng)識(shí)別各個(gè)元素并繼續(xù)編輯優(yōu)化。

這意味著：

HeroUI 既可以成為設(shè)計(jì)師的副駕駛，也可能是創(chuàng)業(yè)者的第一位產(chǎn)品合伙人。

整體上看：

以前，我們需要三人團(tuán)隊(duì)來構(gòu)建一個(gè)原型：產(chǎn)品經(jīng)理 + 設(shè)計(jì)師 + 前端開發(fā)而現(xiàn)在，一句話 + 一個(gè)截圖 + 一個(gè) Prompt 增強(qiáng)器，就能完成 80% 的原型制作。

這里再給大家一個(gè)展示幾個(gè)相當(dāng)酷炫的例子，從科幻感滿滿風(fēng)格的AI初創(chuàng)公司的網(wǎng)站，再到高端奢侈品 Dior 的品牌官網(wǎng)，展現(xiàn)力十足。

二、網(wǎng)友：Prompt is All Your Need

評(píng)論區(qū)網(wǎng)友看罷炸鍋了：Prompt 的能量正在指數(shù)級(jí)爆發(fā)。

圖片

原來，我們只拿 prompt 寫段落、生成圖片，現(xiàn)在卻能“提示生成整個(gè) App”，甚至用 Prompt 推動(dòng)品牌上線（“Dior launch”）。

再加上“可以調(diào)用在線數(shù)據(jù)”，也就是聯(lián)網(wǎng)和插件/API 調(diào)用的結(jié)合，這已經(jīng)不是單純的“提示詞”，而是在變成一種新型編程語(yǔ)言、新型產(chǎn)品啟動(dòng)方式。

圖片

一句話，現(xiàn)在的 Prompt 不只是創(chuàng)意語(yǔ)言，而是正在演化成一種產(chǎn)品構(gòu)建工具。

三、這一次的 Agent，與 Manus 們有何不同？

正如上文所提及的，進(jìn)入2025以來，市面上越來越多的 Agentic AI 產(chǎn)品問世。AI 可以自主調(diào)用工具完成任務(wù)的能力，正在被眾多創(chuàng)業(yè)者們盯上，開啟了新一輪的創(chuàng)業(yè)浪潮。

雖然說，如今提供類似功能的 Agent 已經(jīng)涌現(xiàn)出了不少優(yōu)秀的產(chǎn)品，比如 Manus、Fellou、Lovart ，甚至 Google 的 Gemini、Anthropic 的 Claude 都在做“一句話生成一個(gè) App” 的功能。

那么 HeroUI 究竟有何不同？ 這里有兩點(diǎn)。

先來看最明顯的一個(gè)例子。我們可以對(duì)比下 Manus 和 HeroUI 的界面。

圖片

圖片

這兩款的產(chǎn)品界面非常相像。但 Hero UI 更進(jìn)一步的做到了一點(diǎn)：貼近實(shí)際用戶的使用場(chǎng)景，比如：為不太懂如何設(shè)計(jì) Prompt 的用戶提供了“增強(qiáng)/補(bǔ)全 Prompt”的能力，再比如面向生產(chǎn)場(chǎng)景，可以導(dǎo)入 Figma 文件來搞定 UI 原型的產(chǎn)出。

這是一個(gè)非常細(xì)節(jié)的地方。在實(shí)際生產(chǎn)環(huán)境中，用戶是怎樣的需求？能不能達(dá)到生產(chǎn)的效果？往往是注定一款產(chǎn)品能否長(zhǎng)期走下去的動(dòng)力。

現(xiàn)在不少 AI 產(chǎn)品發(fā)布還沉迷在酷炫的 Demo 功能演示上，而 HeroUI 似乎正在從實(shí)際使用場(chǎng)景中的訴求靠攏。

第二點(diǎn)，對(duì)比其他產(chǎn)品，在小編看來，Hero UI 展現(xiàn)出了前所未有的產(chǎn)品 sense。

之前打造 AI 產(chǎn)品的一個(gè)邏輯是，以 AI 代碼生成的能力為基礎(chǔ)，進(jìn)而衍生出各種用途的 AI 工具產(chǎn)品，但很明顯，這條思路雖然可行，但造出來的工具實(shí)在猶如雞肋，比如 Devin，實(shí)際體驗(yàn)起來，讓人有種如芒刺背的感覺，缺少一款真正的產(chǎn)品該具備的“懂你”的靈魂。 

HeroUI 的可怕之處在于，它不只是個(gè)代碼生成器，而是具備一定“產(chǎn)品感知力”的 Agent。

• 可以根據(jù) prompt 理解“項(xiàng)目管理工具”是什么樣子
• 能自動(dòng)加動(dòng)畫、風(fēng)格
• 接入 Figma 實(shí)現(xiàn) AI + 人類協(xié)作

從某種程度上說，HeroUI 這類工具，似乎正在模糊「設(shè)計(jì)師」「開發(fā)者」「產(chǎn)品經(jīng)理」之間的邊界。

甚至，你或許不是其中任何一種身份，但只要你懂產(chǎn)品想法 + 會(huì)寫 Prompt，你就能生成一個(gè)界面+邏輯都完整的產(chǎn)品雛形。

而且，如果你表達(dá)不出來想法或沒有時(shí)間，可以用“圖像上傳 + Prompt Enhancer + Figma 導(dǎo)入”的方式，使得生成結(jié)果更精細(xì)、更自動(dòng)化。

相較之下，Manus 則似乎顯得冷冰冰的樣子，同樣是生成一個(gè)項(xiàng)目管理的App，不僅耗時(shí)長(zhǎng)，而且最后也只是給到了一個(gè)項(xiàng)目包，讓我部署運(yùn)行看看。

圖片

四、寫在最后

通過 HeroUI，小編越來越感到一種強(qiáng)烈的信號(hào)：Agent 產(chǎn)品未來將會(huì)呈現(xiàn)出“職業(yè)化”的特質(zhì)，它或許通用能力很強(qiáng)，但其本身的“職業(yè)”屬性能否真正 hold 用戶的實(shí)際使用場(chǎng)景，才是未來持續(xù)成功的關(guān)鍵。

正如 OpenAI 的 Sam Altman 在一次采訪中所言，目前他對(duì)現(xiàn)在的AI產(chǎn)品，包括 ChatGPT 的 UI 并不滿意。甚至上周還宣布聯(lián)手前 Apple 首席產(chǎn)品設(shè)計(jì)官 Simo，揚(yáng)言要打造下一代消費(fèi)級(jí) AI 產(chǎn)品。

從這個(gè)層面上看，AI 原生應(yīng)用、Agent、又或者說 Agentic AI 產(chǎn)品，真的只是剛剛開始，各位破局的創(chuàng)新機(jī)會(huì)，可謂多多！

期待以后更多優(yōu)秀的 AI 產(chǎn)品問世！

最后，想體驗(yàn)一把 HeroUI 的朋友，可以去官網(wǎng)體驗(yàn)一番。

參考鏈接：

??https://heroui.chat/??

??https://x.com/EHuanglu/status/1927257377864044975??