Verdent Docs
创建

Design Mode

先用文字描述选定视觉方向,再从确认的方向构建可运行的应用。

Design Mode 是 Verdent Cloud 针对具有可见界面的新应用所提供的设计优先创建路径。当你有一个用文字表达的想法,但尚无完整的设计稿、截图、样式指南或完整页面规划时,请使用它。

Design Mode 不会直接跳入代码,而是帮助你先决定产品的外观和感觉,再将确认的方向转化为可运行的应用。

何时使用 Design Mode

当你想从文字描述创建新的产品 UI 时,请使用 Design Mode,例如:

  • 全栈应用
  • Web 前端或落地页
  • 移动应用
  • 多屏游戏或交互体验
  • 视觉方向尚未确定的从零到一产品创意

何时跳过

以下情况请跳过 Design Mode:

  • 项目是一个简单的单屏实用工具,例如基础表单或非常小的玩具应用
  • 你已经有一份完整的设计说明,包含具体的风格方向、调色板、字体系统以及页面或屏幕列表
  • 你已经有设计文件、原型图、截图或样式指南,并希望直接遵循
  • 你明确想跳过设计,直接进入编码

如果你的描述已经足够具体,Verdent Cloud 可以将其直接作为选定方向,直接进入页面规划和构建工作。

Design Mode 的工作原理

描述产品

用简单的语言描述:你想构建什么、面向谁、它应该做什么,以及你已有的任何风格或氛围参考。

选择视觉方向

Verdent Cloud 探索不同的设计方向,让你在编写代码之前先选定外观和感觉。

规划页面或屏幕

对于多页面、全栈或更复杂的产品,Verdent Cloud 会将选定的方向转化为页面或屏幕规划,以及简明的产品说明。

从确认方向进行构建

方向确定后,Verdent Cloud 将设计还原为可运行的应用,并将后续决策与已确认的设计和说明保持一致。

预览并继续

在预览中审查应用,然后根据需要继续进行后端工作、测试、分析或部署。

如何在 Verdent Cloud 中使用 Design Mode

在 Cloud 创建流程中,描述你想构建的应用,而不是选择模板。如果你还没有具体的设计方向,Verdent Cloud 可以使用 Design Mode 在构建之前帮你选定一个。

描述可以保持简洁,但需要足够具体以指导品味决策:

  • 产品是什么
  • 谁会使用它
  • 它需要帮助用户完成的主要任务
  • 你已知需要的页面、屏幕或状态
  • 任何风格或氛围参考,例如编辑感、活泼、实用、高端、极简或大胆
  • 你不想要的内容,例如通用渐变、库存感图片或某种视觉风格

示例描述

落地页

为一款面向自由职业者的个人理财应用构建落地页。风格应沉稳、值得信赖且具有编辑感,包含 hero 区、功能介绍区、定价和常见问题。

多屏应用

为正在从倦怠中恢复的人创建一款移动优先的习惯追踪应用。感觉应温柔、有触感,包含引导页、每日签到、进度视图和设置页面。

获得更好结果的建议

  • 说明产品面向谁。
  • 描述你想要的感觉,而不仅仅是功能列表。
  • 如果已知页面或屏幕,请列出来。
  • 如果有参考或限制条件,尽早说明。
  • 如果你已知某些方向会感觉不对,请说明需要避免什么。
  • 对于复杂产品,预期在完整构建开始之前需要确认页面列表和产品说明。