新智元報道

【新智元導讀】AI辦公徹底變天了！阿里QoderWork重磅發布全球首個AI Native自定義工作臺，推出設計、PPT、寫作三大領域模式。AI辦公正式從「對話驅動」走向「領域驅動」。

AI辦公交互形態，從今天起徹底革新！

520這天，阿里QoderWork正式發布全球「首個AI Native自定義工作臺」。

首發上線「三大領域模式」：設計工作臺、PPT工作臺、寫作工作臺，一次性覆蓋AI辦公高頻場景。

如今，動動嘴做設計、說句話出PPT、圈一段文字讓AI改稿，這三件事，可以都在一款軟件里完成了！

更值得關注的是，這三個「工作臺」只是開始。

QoderWork「自定義工作臺」，是一個開放共建的擴展平臺——

基于同一份Agent底座與任務系統，每個工作臺擁有獨立的視圖、工具與產物標準。

未來，開發者與企業可以基于這一底座，搭建屬于自己領域的專屬工作臺。

這一刻，AI辦公正式從「對話驅動」走向「領域驅動」。

全球首個AI Native工作臺，2.0時代來了

這是一個需要被行業認真審視的節點。

過去兩年多，AI辦公賽道熱鬧非凡，但幾乎所有產品都在做同一件事：把聊天框做得更聰明。

無論叫AI助手、AI寫作、AI編程，用戶看到的始終是同一個界面——

左邊輸入框，右邊輸出區，中間一個大模型。

這個范式足夠簡潔，但它正在成為整個行業的天花板。

當任務復雜到需要專屬視圖、工具鏈、狀態管理和產物標準時，一個聊天框承載不了。

你不可能在一個對話窗口里完成一套設計語言的迭代，也不可能在一段文字回復里審校一份30頁的演示稿。

QoderWork自定義工作臺要解決的，正是這個問題！

技術上，它通過解耦UI組件、業務邏輯，以及工作區區塊來實現場景的獨立化。

每個工作臺擁有獨立的視圖、工具、狀態和產物標準，但底層共享統一的Agent底座與任務系統。

• 在設計場景里，它是一個擁有畫布、預覽、風格庫和畫筆標注的設計工作臺；

• 在PPT場景里，它是一個擁有11個可介入階段的演示稿生產線；

• 在寫作場景里，它是一個可批注、可回溯、可導出的文檔協作臺。

已上線的「三個工作臺」是同一個產品的不同「變形」，不是三個割裂的App。

底層能力共享，上層體驗專屬。

更重要的是，「擴展機制」是開放的，未來開發者和企業可以在這個底座上「長出」自己的領域工作臺。

聊天框是AI辦公的起點，但「自定義工作臺」，也許才是AI辦公該有的終局形態。

設計工作臺，終結十年「翻譯鏈」

三大工作臺中，「設計工作臺」是本次首推的核心重點。

它在5月18日率先上線，用一個徹底的結構性變革，直指設計行業最深層的痛點。

每一個做過數字產品的人，都經歷過這樣一幕：

設計師在Figma里精心調了三天的界面，交到研發手上，還原出來走了樣。

間距不對、圓角不對、顏色不對。設計師說「這跟我畫的不一樣」，研發說「標注就是這么寫的」。

于是開始了第一輪返工。接著是第二輪。第三輪。

一個頁面來回三五輪是常態，設計師超過30%的工時消耗在「盯還原」上——不是在創作，是在當翻譯官。

從Figma到代碼之間，存在一條漫長且有損的翻譯鏈，設計到代碼的還原度普遍不足70%。

然而，這條「翻譯鏈」存在了整整十年。

Design-to-Code插件試過了，生成的代碼不可維護；低代碼平臺也試過了，犧牲設計品質換速度，結果兩頭不討好。

行業一直在等一個真正的結構性解法。

QoderWork設計工作臺，直接跳過了這段距離。區別于傳統工具，它開辟了一條全新路徑——

不再讓設計和代碼作為兩種產物分別存在，在這里，Code as Design！

設計師在畫布上操作的每一個元素、產品經理在Preview中點擊查看的每一個交互、研發最終接手的那份文件.......

從第一步起，就是同一份可運行的工程文件。

不是先畫圖再翻譯成代碼，不是先出視覺稿再讓研發「照著做」。

設計產物即代碼產物，「翻譯鏈」不再存在，因為不再需要翻譯。

重構AI設計流程，不再「開盲盒」

當然，讓設計產物變成代碼只是結果。更關鍵的問題是：過程怎么走？

市面上，不缺AI生成設計的工具。輸入一句話，AI給你一個頁面——

看起來很酷，但實際用過的人都知道，這個過程充滿了「AI自作主張」的痛苦。

要求「做一個SaaS后臺首頁」，它給你一個花里胡哨的Dashboard，但配色不對、信息層級錯了、關鍵模塊位置偏了。

于是你重新描述一遍，它又給你一個完全不同的方向。

來回三四輪，時間全耗在「糾偏」上了。

這一次，QoderWork設計工作臺通過三個機制，把「抽卡」變成了「協作」。

• Questions：先問清楚，再動手

輸入信息不足時，AI不會「猜著做」，而是先追問對齊意圖。

你想做什么類型的頁面？面向什么用戶群？核心信息模塊有哪些？意圖對齊在前，無效迭代降至最低。

這個設計看似多了一步，實際上省掉的是后面反復推倒重來的時間。

• Design Plan：先出計劃，確認了再執行

AI在動手之前，先輸出一份結構化的設計計劃——布局方案、風格方向、內容層級、視覺語言。

你確認了，它才執行。方向對齊在前，避免推倒重來。

• Nudge：參數化微調

生成之后，配色、間距、圓角等關鍵設計決策以可調參數的形式暴露出來。

不用重新輸入一大段prompt「藍色再深一點、間距再大一些」，直接拖動參數即可微調。

這三個機制串聯起來，構成了一條完整的AI設計生產鏈路：

先問清楚（Questions）→ 再確認方向（Design Plan）→ 然后精修細節（Nudge）。

每一步都有用戶確認的節點，每一步都在減少信息損耗。

設計即代碼，一手實測

光說不練假把式，接下來，我們就QoderWork「設計工作臺」開啟了全方位實測。

我們嘗試用同一個案例，測試設計工作臺的幾方面核心能力。

最開始，只給到QoderWork一個極簡而需求模糊的提示詞：

幫我做一個 AI 編程助手的管理后臺

這種提示詞更接近小白用戶實際會給出的情況。

這里需要考察的是QoderWork是否能通過交互來明確用戶需求：

• AI 是否拋出結構化問題(平臺？數據維度？用戶角色？)；

• 問題是否覆蓋關鍵決策(目標用戶、核心場景、數據周期)；

• 是否提供建議答案(降低用戶回答門檻)。

由于需求不明確， QoderWork提示了用戶先做好設計規劃。

如果你想偷懶，也可以選擇讓AI自行決定。

QoderWork也內置了上百種不同的整體風格參考，可以一鍵套用自己最喜歡的具有設計感的網站的風格。

思索了不到1分鐘，設計計劃出爐了，看起來像模像樣，讓我們不免對交付結果產生了期待。

設計計劃

本次將為 AI 編程助手交付一套面向開發者團隊 Leader 的高保真深色管理后臺，使用 React + Vite + shadcn 風格組件實現，主風格參考 Linear，并輔以 GitHub 與 Stripe 的代碼與計費排版靈感。后臺包含五個核心模塊：Dashboard 概覽（聚焦 Token 與成本、用量與活躍、代碼質量與采納、模型與延遲四類 KPI 與異常告警）、用戶與團隊管理、模型配置與計費、對話與代碼記錄、知識庫與 Agent。視覺上采用深空黑底 + Linear 冷藍主操作色 + 電氣青數據高亮 + 狀態綠/琥珀/玫紅，所有派生顏色通過 seed tokens + var()/color-mix() 派生，避免默認 AI 紫色調，數字使用 JetBrains Mono + tabular-nums。批準前請重點審閱：模塊范圍與命名是否完整、Dashboard 四象限 KPI 與圖表組合是否符合 Leader 視角、是否同意以 Linear 為主風格參考、以及 react-vite + 本地 shadcn 風格類（不安裝真實 shadcn 包）的實現路線。

【.design.json】

產物：admin dashboard

平臺：web, desktop

輸出：react-vite

組件庫：shadcn

保真度：high-fidelity

風格：primary: linear-app; inspiration: github, stripe；不引用既有品牌 logo，僅借鑒排版/密度/配色思路

【產物】

01

react-vite/src/App.jsx

創建

應用入口與路由殼，承載左側導航 + 頂部欄 + 主內容區，掛載 Dashboard / 用戶與團隊 / 模型與計費 / 記錄 / 知識庫與 Agent 五個模塊視圖。默認進入 Dashboard 概覽頁。

02

react-vite/src/components/Dashboard.jsx

創建

Dashboard 概覽頁，集中展示四類核心 KPI（Token 與成本、用量與活躍、代碼質量與采納、模型與延遲），并提供異常告警、Top 團隊/模型、最近會話快覽。

03

react-vite/src/components/UsersTeams.jsx

創建

用戶與團隊管理頁，提供成員列表、角色權限、團隊/工作區、邀請入口。

04

react-vite/src/components/ModelsBilling.jsx

創建

模型配置與計費頁，配置已接入模型、API Key、配額規則、計費策略。

05

react-vite/src/components/Logs.jsx

創建

對話與代碼記錄頁，按會話查看 Prompt、補全、采納與審計追溯。

06

react-vite/src/components/Agents.jsx

創建

知識庫與 Agent 管理頁，配置代碼庫索引、自定義 Agent / Workflow。

07

react-vite/src/styles.css

創建

全局樣式與主題 token，定義 seed tokens、深色主題、字體、組件 token、shadcn 風格類。

08

react-vite/src/main.jsx

創建

Vite React 入口，掛載 App 到 #root 并加載全局樣式。

09

react-vite/index.html

創建

Vite HTML 殼，包含語言、標題、字體引入、畫布尺寸 meta 與根節點。

10

react-vite/package.json

創建

聲明 React/Vite 與 recharts、lucide-react 依賴與 dev/build 腳本。

11

react-vite/vite.config.js

創建

Vite 配置，啟用 React 插件并設置默認開發端口。

12

react-vite/canvas-design.html

創建

Canvas 設計預覽靜態殼：在不依賴 dev server 時也能讓 Canvas 加載結構化設計概要并跳轉到真實預覽。

資源選擇

技能

風格參考

必讀資料

結構

交互

質量

風險

修改意見

檢測到用戶需要React但并沒有安裝時，只需點擊「安裝并繼續」，一切QoderWork都幫我們搞定了。

你完全不需要理解React代碼的原理，甚至不需要知道React除了「反應」以外還有什么意思——零代碼Vibe Coding。

經過了10分鐘的等待，成果出爐！

左右滑動查看

快來訪問我剛做出來的網站吧：http://127.0.0.1:5173/（開玩笑）

可以通過瀏覽器訪問，與動態圖表進行交互。從視覺呈現效果上，完成了我們的需求。

沒有抽卡！一遍成！

該GIF動圖幀率由于微信限制僅為15，實際動畫完全流暢

但是，如果只是生成一個HTML網頁，其他模型也可以做到，雖然效果呈現上可能不如QoderWork生成的。

QoderWork真正的殺手锏，是Nudge面板和畫筆功能——哪里不好改哪里，所見即所得。

整體性的關鍵設計決策可以輕易拖動調整。

想要換成淺色主題？沒問題。

由于我們之前沒有指定我使用的模型，只是為了演示效果，隨便選了個版本；現在我想換成我實際使用的最新模型。

用畫筆功能圈出要修改的區域，通過自然語言提示詞直接修改對應元素。

QoderWork也是輕松完成了修改。

我們觀察QoderWork思考過程發現：最可貴的一點是，QoderWork并沒有只做表面功夫，而是將看板上的視圖背后的數據庫等其他地方對應的模型也一并檢索修改，避免了沖突，保持了高同步性，而這往往是小白用戶特別容易忽略的。

針對所有元素，QoderWork的Nudge功能，能根據不同元素類別，直接調整所有設計所需參數，所見即所得。

一鍵交付Qoder IDE，設計變成開發起點

但設計工作臺真正的殺手锏，藏在流程的最后一步。

生成的設計產物，可以一鍵交付至Qoder IDE等主流開發工具，直接進入研發流水線。

這是設計產物以完整的工程結構落地到開發環境中——

研發打開的就是一個可以繼續寫業務邏輯的項目，不需要拆組件、不需要重建模塊、不需要對比驗證。

設計與開發之間的代溝，在這一步被徹底抹平。

當然，任何新產品都不可能一步到位。在早期用戶的實際體驗中，有一個頗具代表性的問題被提了出來：

設計工作臺的產物一鍵交付到Qoder IDE后，默認打開的是一個新的workspace。

但在實際開發中，團隊往往已經有了一個現有的項目工程。

這個問題看似是一個文件路徑的技術細節，但它背后折射出的，是AI設計工具在走向工程化落地時必須面對的深層挑戰——設計產物如何真正融入已有的項目上下文？

QoderWork已經走出了最關鍵的第一步：讓設計產物從「圖片」變成「代碼」。

接下來的路，是讓這份代碼從「可以跑起來」進化到「可以長進去」。

PPT誕生39年來，首次被結構性重寫

「設計工作臺」打破的是「設計到代碼」的翻譯鏈，那「PPT工作臺」呢？

做一份能講的演示稿，痛苦程度不亞于設計還原。

AI生成PPT的方案早已有之，但痛點也出奇地一致：你只能看到最終結果，無法介入過程。方向偏了，推倒重來。

QoderWork「PPT工作臺」要改變的，恰恰是這一點。

把「做一份能講的演示稿」拆解為可監督、可干預、可回放的多階段的協作流程。

這是PPT形態，自1987年PowerPoint誕生以來，第一次結構性重寫！

演示稿從一份圖形文件，升格為「可編程、可審計、可累積」的結構化內容資產。

具體來說，它一共包含了三大核心能力——

• 全流程可介入

從上下文采集、主題鎖定、大綱確認到內頁生成、雙重審校，PPT工作臺將制作過程拆解為11個階段。

用戶在大綱、主題、圖像、內頁四個層級都能介入，方向對齊永遠在執行之前。

• HTML即源文件

每一頁演示稿以獨立HTML文件落盤，Theme JSON是視覺真值。

內容可讀、可diff、可手改、可離線分發，內置中文字體，斷網也能完整渲染。

支持PDF/ HTML/PPTX三種格式離線導出，PPTX保留可繼續編輯的真實組件，還能自動生成150–300字演講備注。

• 模板沉淀與團隊復用

此外，它還內置了30+官方預制模板，開局一鍵套用。

更關鍵的是，任意成稿可一鍵抽取為團隊模板，在成員間共享流轉，讓品牌調性與匯報體例形成可累積的組織資產。

在實測中，我們讓它生成一個大學課件，課題是李白與杜甫——盛唐詩歌的兩極。

這里，選用了一個canvas-pop（畫布彩章）模板。然后，QoderWork開啟了深度思考模式。

下樓買一杯咖啡的功夫，它便完成了上下文采集、主題鎖定，接下來需要確認的就是「大綱」。

不一會，一個精美的PPT課件完成了。

而且，你還可以將其保存為「模板」，方便未來再次復用。還可以把模版下載下來，分享給你的同事和朋友。

AI寫作從代筆，成為被審稿的合作者

接下來，「寫作工作臺」解決的問題更加日常，也更加普遍。

過去，AI寫作的交互模式是：你給一句話，AI給你一篇文。寫得好，直接用；寫得不好，重新來。

AI是獨自交付的代筆者，你是甲方，關系就是「下單—>驗收」。

問題在于，真實的寫作從來不是這樣運轉的。

QoderWork「寫作工作臺」要改變的，正是這個協作關系。

進入寫作模式，主頁對話框下方提供「四種預設語氣」，包括正式、輕松、技術、創意。

接下來，給到它一個任務——

請以資深科技自媒體編輯視角，硬核拆解Claude Code的核心顛覆力，撰寫一篇關于深度稿件。

QoderWork立即進入寫作狀態，右側打開了一個專屬的文檔工作區。

正如「設計工作臺」Questions一樣，它沒有盲目地開始一通輸出，而提出了一系列問題。

確認了篇幅長度、切入主軸、立場傾向，才會開始調研、輸出。

這里，我選擇了「創意」語氣，可以看到QoderWork輸出的整篇稿件，都帶有一絲靈動與網感。

而「寫作工作臺」最具差異化的能力，是「選中即批注」——

可以像審稿一樣，圈出其中某段文字，直接批注「改得更正式」，AI就可以圍繞被選中的文本定向修改。

與此同時，它還提供潤色、重寫、擴寫、縮短、修復語法、中英互譯等快捷動作。

從一句話生成框架，到逐段打磨收尾，全部在這同一個工作臺內完成。

此外，「寫作工作臺」還支持人機接力。

個人在編輯器中，調整完文章結構、細節后，QoderWork會以最新文檔為準繼續處理。每一次重要修改，都有歷史版本可回看，完成后還可一鍵導出PDF。

「寫作工作臺」重新定義了AI與人在寫作場景中的協作關系——

從「聊天里的長答案」到「一份可編輯、可批注、可導出的文檔」。

這，才是AI辦公該有的樣子

回過頭看，QoderWork這次發布的自定義工作臺 + 三大領域模式，指向的是同一個趨勢：

AI正在從「工具」進化為「工作環境」。

過去兩年，AI產品的主流敘事是「AI是你的助手」——幫你寫文案、幫你改代碼、幫你做PPT。

AI是錘子，用戶是拿錘子的人。

這個邏輯沒有錯，但它有一個隱含的前提：工作流程本身不變，AI只是讓某些環節變快了。

但QoderWork設計工作臺做的事情不是「讓設計變快」，而是改變了設計的工作方式本身。

「擴展機制」的意義則更加深遠。它讓AI辦公產品的形態從「千人一面的聊天框」變成「千人千面的領域工作臺」。

這意味著，未來的辦公AI不必再讓所有工作，都擠進一個對話窗口里。

它可以根據不同場景，「長出」最適合的交互形態和工具集。

設計、PPT、寫作，是首批落地的「三個領域模式」，但不會是最后三個。

當AI不再只是「幫你做事的助手」，而是「你工作其中的智能環境」——

這或許，才是AI辦公真正該有的樣子。

參考資料：

https://qoder.com/qoderwork