newsence
來源篩選

A Real Space to Design in the Age of Agents

paper.design

Agents are shipping faster than we can think so we need a space to zoom out more than ever. The canvas must evolve to embrace the new paradigm. It should connect design to code and back, and it should just work.

newsence

AI 代理時代下的真實設計空間

paper.design
4 天前

AI 生成摘要

AI 代理的開發速度快到讓我們反應不及,因此我們比以往任何時候都更需要一個能退後一步思考的空間。畫布必須進化以擁抱新範式,它應該將設計與程式碼雙向連結,並且能夠順暢運作。

在 AI Agent 時代,一個真正的設計空間

Agu Segui

在 AI Agent 時代,一個真正的設計空間

AI Agent(智慧代理)的發展速度快到讓我們措手不及,因此我們比以往任何時候都更需要一個可以「退後一步」觀察全局的空間。畫布(Canvas)必須進化以擁抱新範式。它應該將設計與程式碼雙向連結,而且必須運作順暢。

幾個月前,我們還在爭論設計師是否應該寫程式。現在,我們在爭論工程師是否還需要審核程式碼。老兄,這真是個瘋狂的時代。Agent 已經到來,希望它們不會戴著墨鏡追著我們跑(笑)。它們構建事物的速度快得驚人,可以成為我們心智的無限延伸。而令人恐懼的是,我們甚至可能不知道接下來會發生什麼。

為什麼需要新的畫布?

由於 Agent 的興起,Paper Desktop 應運而生。

桌面應用程式支援 MCP 伺服器,因此你可以與擁有應用程式存取權限的 LLM(大型語言模型)對話,它們還能直接連接到你的儲存庫(Repos)和檔案。

但為什麼?為什麼需要另一個畫布?當每個人都只是透過提示詞(Prompting)來創造事物時,為什麼還要動手調整像素?換個角度想:如果畫布是一個非常適合 Agent 居住的地方呢?

作為那些「會實作的設計師」之一,我一直在思考當 Agent 承擔大部分工作時,我們應該關注哪裡。現在流行的說法是,執行正變得純粹是對話式的:你描述一個東西,Agent 寫出程式碼,然後交給你一些很酷的東西。對某些人來說,這感覺像是舊時代的終結。不再需要畫矩形,只需下指令然後發布。

我一直密切關注這種論調,然後覺得……拜託。Agent 無法讀懂字裡行間的深意,也無法在更廣泛的流程意義上進行嚴肅的設計工作。有時我覺得,要麼是我們忘記了「設計」的真正含義,要麼是我們在 AI 行銷會議裡待得太久了。

Agent 可能會提供很大幫助,特別是在連接性和重複性任務方面。但如果你是一個認為 AI 會幫你完成設計的設計師,那你可能有點麻煩了——就像認為設計僅僅是畫 Mockup 和維護設計系統一樣。

我喜歡在設計工作流中使用畫布,就像我喜歡在開始瘋狂下指令之前先了解一下程式碼庫一樣。我觀察原型或 Mockup 的時間往往比實際迭代它們的時間還要長。我喜歡在螢幕上同時呈現同一個事物的多個版本,並排觀察它們,在做出決定前反覆思考。

你無法在對話框中擴展設計決策。你無法與一個只會為你的程式碼庫寫程式的 Agent 進行廣泛的探索。當「氛圍感寫程式」(Vibe-coding)的熱潮退去後,人們可能會意識到你也可以把 Agent 帶到其他應用程式中。有時你可能從程式碼開始,有時從畫矩形開始。對我來說,直接操作和 AI 運算是一枚硬幣的兩面,無論我是在設計檔案中還是在 JSX 中構建前端。我只希望兩者之間零落差。

因此,空間化思考做到了對話記錄做不到的事:它讓多個未來同時可見,讓你能在元素和方向之間建立更好的連結。AI Agent 每天都在變得更強大;它們不僅能閱讀,還能觀察和思考。如今與 Agent 協作不僅僅是生成程式碼。你現在可以將 Agent 帶到畫布上,而我們正是為了這個目的構建了 Paper。

視覺化工具不應取代程式碼。問題在於畫布從未學會說同樣的語言。過去沒有一種基於 HTML 和 CSS 的工具能讓 Agent 輕鬆協作。這就是 Paper 存在的原因。

我們需要重新思考基礎,最終構建出一個可以導出程式碼、導入 React 組件、獲取 API 並讓你快速迭代的工具——但 20 年的數位設計經驗應該與之結合,而不是重頭來過。從排版、顏色、向量、濾鏡,一直到多人協作、圖像生成以及與 Agent 對話。

我希望 2026 年是人們意識到畫布比以往任何時候都更重要的一年——不僅作為繪圖工具,更作為思考工具,最重要的是作為與他人、團隊及其個人 Agent 協作的視覺界面。

「老虎機」陷阱

我們正在學習一種新的反射動作:提示、等待、輸出、重複。

這很快,很神奇。你現在可以擁有一支 Agent 大軍。但瓶頸必然會出現在某處。流行的說法是「品味」……我會說更多是關於「在乎」(Care)。引用 Gabe 的話:「如果 AI 能思考得更好,軟體能擴展得更廣,那麼稀缺的東西就是人類心靈對某事投入的那種獨特、混亂的在乎方式。」

當執行變得廉價時,我們往往會跳過思考的「空間」階段。瓶頸已經上移了,現在是我們的大腦。寫程式現在很容易;難點在於維持整體的上下文和連貫性。有些人可能會說「品味是新的核心技能」,但這實際上更多是關於你在乎你正在構建什麼以及為什麼。

我們現在需要更多的透視感。我們需要一個表面,讓我們能在正在構建的路徑旁邊看到「未被選擇的路」。一個可以更多協作、自由混搭並連接孤立團隊與工具的空間。我們需要在收窄之前先擴張。在構建之前塑造願景會更好。

為什麼「舊畫布」在生產環境中失敗了

既然畫布對空間化思考如此重要,為什麼它在生產環境中失去了地位?畫布贏得了探索的權利,但往往沒有贏得發布的權利。答案在於「抽象」。

在過去的十年裡,我們的設計工具一直是美麗的謊言。設計師們拋棄靜態 Mockup 是有原因的。如果你曾花費數小時繪製尚未存在的產品,結果交付後得到的卻是略有不同的東西,那麼你當然會想在更接近現實的環境中設計。

最終,程式碼贏了。在第一個 Commit 提交的那一刻,畫布就死去了。傳統的設計工具受限於其抽象層——無論 Agent 截圖的技術有多好,你仍然是在設計一個 div 的圖片,而不是 div 本身。

是否有另一種未來?移動矩形的樂趣會消失嗎?我們不這麼認為。我們相信我們需要獲得更廣闊的視野,並更多地在「紙上」(Paper)思考。這是一語雙關。

用連接的畫布彌合差距

我們需要一個新標準。一個更具連接性的環境,讓你可以隨時在設計與程式碼之間切換,而不會有太多波折。

如果畫布是建立在與產品相同的標準(HTML、CSS、DOM)之上,那麼你就不再是在繪製 UI 的隱喻,而是在媒介中工作。

我們需要與真實事物相連的工具。我們希望將畫布的空間力量帶回生產循環中,停止在轉換過程中丟失上下文。

畫布需要由與產品相同的材料製成。想像一個表面,「設計」不僅僅是畫出組件的圖片,而是可以導出的實際 React 程式碼。一個 HTML 和 CSS 既是媒介也是輸出的地方。

這是改變整個動態的部分:它是雙向的。當你需要廣泛探索時,可以將現實拉到畫布上;當你需要收窄決策時,可以將決定推回程式碼中——而不會讓任何一方走入死胡同。

這是我們在 AI 出現之前就應得的工具——而因為 AI,這個工具變得強大 100 倍。當雙向差距消失時,畫布就變成了地圖:人類在其中提供空間推理、意圖和方向。

我們不想用視覺工具取代程式碼。這是要承認程式碼對於空間問題是一個糟糕的界面,而聊天對於系統性決策也是一個糟糕的界面。

槓桿,而非魔術,拒絕粗製濫造

我們的賭注是,我們正走向一種雙向工作流——你可以將動態應用程式的一個區塊拉到畫布上,在空間上進行迭代(可能藉助 Agent 的幫助),然後將其作為程式碼推回。不是變更的圖片,而是變更本身。

這開啟了真正的 Agent 協作時代。畫布是人類完成 Agent 所不擅長部分的地方:處理模糊性、比較路徑、決定什麼才是重要的。Agent 成為你手的延伸:處理樣板程式碼、重構和繁瑣的響應式調整。

當你的畫布與你的程式碼說同樣的語言時,LLM 終於可以在沒有偏差的情況下連接各個環節。Agent 可以獲取即時數據、連接你的 API 並讀取你的本地環境。這不再是盲目的交付;而是一個設計、程式碼和數據共存的共享上下文。

粗製濫造(Sloppy)的輸出並非因為 Agent 失敗,而是因為缺乏理解和指令。你現在可以交給 Agent 一個完整的網站去構建,並附上你想要的所有註釋。「計畫模式」(Plan mode)變得更好了。它是與 Agent 協作構建的活生生的規範。

回到 Paper

我們透過 Paper 來測試這個假設。Paper 建立在 Web 標準之上,因為我們相信要修復工作流,就必須尊重媒介。

是時候停止將設計和實作視為兩項獨立的工作,並開始將它們視為同一現實中重疊的層級。除此之外:既然 Agent 已經到來,我們需要更多空間來退後觀察全局、放大查看細節並釐清意圖——無論是在人與人之間,還是人與 Agent 之間。

沒有地圖的無限力量就是混亂。畫布給了我們那張地圖——去連接各個環節並讓 Agent 發揮所長。我們構建的速度可能比以往任何時候都快,但我們需要記住最初構建的原因。我們希望 Paper 能成為你真正的空間,貼近程式碼,並對你的實際思考方式保持友好。