Verdent Docs
建立

Design Mode

先用文字簡介選定視覺方向,再根據獲核准的方向打造可運作的應用程式。

Design Mode 是 Verdent Cloud 以設計為先的建立路徑,專為具備可見介面的全新應用程式而設。當你有文字化的想法,卻尚未完成設計、截圖、樣式指南或完整頁面規劃時,就適合使用它。

Design Mode 不會直接跳入程式碼,而是先協助你決定產品該有的外觀與感受,再將獲核准的方向轉化為可運作的應用程式。

何時使用 Design Mode

當你想從文字簡介建立全新的產品 UI 時,請使用 Design Mode,例如:

  • 全端應用程式
  • 網頁前端或著陸頁
  • 行動應用程式
  • 多畫面遊戲或互動體驗
  • 視覺方向尚未決定的從 0 到 1 產品構想

何時略過

在下列情況請略過 Design Mode:

  • 專案是簡單的單畫面工具,例如基本表單或非常小的玩具型應用程式
  • 你已具備完整的設計簡介,包含具體的樣式方向、配色、字型系統,以及頁面或畫面清單
  • 你已有應該直接遵循的設計檔案、視覺稿、截圖或樣式指南
  • 你明確想跳過設計,直接進入程式碼

如果你的簡介已經夠具體,Verdent Cloud 可將其作為選定的方向,直接進入頁面規劃與建置工作。

Design Mode 的運作方式

描述產品

從淺白語言的簡介開始:你想打造什麼、為誰打造、它應該做什麼,以及你已有的任何氛圍或樣式參考。

選擇視覺方向

Verdent Cloud 會探索不同的設計方向,讓你在撰寫程式碼前先挑選外觀與感受。

規劃頁面或畫面

對於多頁面、全端或更複雜的產品,Verdent Cloud 會將選定的方向轉化為頁面或畫面規劃,以及淺白語言的產品規格。

從獲核准的方向建置

在方向明確後,Verdent Cloud 會將設計還原為可運作的應用程式,並讓後續決策與獲核准的設計和規格保持一致。

預覽並繼續

在預覽中檢視應用程式,接著依需要繼續進行後端工作、測試、分析或部署。

如何在 Verdent Cloud 中使用 Design Mode

在 Cloud 的建立流程中,描述你想打造的應用程式,而不是選擇範本。如果你尚未有具體的設計方向,Verdent Cloud 可使用 Design Mode 協助你在建置前先挑選一個。

你可以讓簡介保持簡單,但要夠具體以引導品味決策:

  • 產品是什麼
  • 誰會使用它
  • 它應該幫助他們完成的主要工作
  • 你已知需要的頁面、畫面或狀態
  • 任何語氣或樣式參考,例如編輯風、活潑、實用、高級、極簡或大膽
  • 任何你不想要的元素,例如通用漸層、看起來像素材庫的圖像,或某種特定視覺風格

簡介範例

著陸頁

為自由工作者打造一個個人理財應用程式的著陸頁。它應呈現沉穩、值得信賴且具編輯風的感受,包含主視覺、功能區塊、定價與常見問答。

多畫面應用程式

為從職業倦怠中復原的人們打造一個行動優先的習慣追蹤器。它應呈現溫和且具觸感的感受,包含上手導覽、每日簽到、進度檢視與設定。

獲得更佳結果的訣竅

  • 說明產品是為誰打造的。
  • 描述你想要的感受,而不只是功能清單。
  • 如果你有已知的頁面或畫面,請提出來。
  • 如果參考或限制很重要,請及早分享。
  • 如果你已知道哪些元素會讓人感覺不對,請說明要避免什麼。
  • 對於複雜產品,請預期在完整建置繼續前確認頁面清單與產品規格。