新手指南

欢迎使用 UXbot！本指南将助你快速上手，即便你是第一次做产品也完全没问题。跟随以下步骤，你将顺利完成从首次登录到创建第一个可运行网站的全流程。

1. 账号设置

• 注册或登录

访问 UXbot平台，创建免费账号，或使用已有账号直接登录。

• 熟悉工作台

先熟悉一下你的工作区 —— 这里是你所有项目进行管理的地方。

2. 开启你的第一个项目

UXbot提供三种方式来创建新项目，按需选择即可：

• 描述创建： 从零开始，直接描述你的产品及其核心功能。

• 截图创建： 有灵感图了？上传截图，UXbot会为你生成初始设计。

• 模版库： 浏览现成的模板，复制一个到你的工作区进行快速定制。

选择最适合你的方式，然后跟着提示操作即可。

3. 设计与编辑

3.1 描述创建：

• Step1 输入信息： 填写产品信息和需求。你可以简单罗列核心功能，也可以像写产品需求文档一样详细描述。

• Step2 梳理流程： UXbot会帮你梳理出产品的用户旅程，你可以根据具体需求进一步调整和优化。

• Step3 生成界面： 系统会为你自动选中的关键节点，直接生成对应的界面。

• Step4 选择风格： 选择预置风格，或描述你的设计风格偏好，也可以直接使用 AI 推荐的风格。

• Step5 编辑原型： 生成并编辑界面原型，支持AI 助手与精准编辑器之间轻松切换。

3.2 截图创建：

• 上传素材： 上传截图或图片，并添加备注说明你的需求。

• 获取设计： 系统会根据你的参考图，自动生成设计方案。

• 自由编辑： 调整布局、区块和元素，让设计符合你的构想。

3.3 模板库创建

选用模板：选择一个模板复制到项目中，先查看其整体结构，再根据你的产品需求进行修改。

4. 前端代码生成

UXbot可为你设计好的网站或移动端应用，生成可直接使用的前端源代码。

5. 预览与分享

5.1.1 预览模式

• 测试你的设计，模拟用户交互，像真实用户一样体验产品流程。

• 点击「预览」按钮，将跳转至预览模式：

5.1.2 协作与分享

通过复制链接的方式，分享你的项目。可为团队成员或相关方，设置 “仅查看” 或 “可导入” 等不同权限。

6. 导出成果

可将完成的设计导出为 Sketch、HTML格式文件，同时支持导出网站（Vue.js）、安卓（Kotlin）或 iOS（Swift）的项目前端源代码。你可以将文件导入 Sketch、Figma（支持导入Sketch文件的工具） 等常用设计工具，进行进一步的精细化编辑。

最后，将项目前端源代码导入你的 IDE（集成开发环境）中完成开发，实现端到端的全流程交付。

7. 新手建议

• 大胆尝试： 有 AI 支持，迭代非常容易；且平台自带版本追踪，你的进度绝对安全。

• 找不准方向： 不妨先试试模板或截图创建项目，快速获取灵感。

• 反复打磨： 设计可以随时调整，直到你完全满意为止，没有所谓的 “最终版”。

立即开始

打开 UXbot，启动你的第一个项目，让想法照进现实，UXbot将强大的产品构建工具置于你指尖 —— 祝你创作愉快！

小贴士：无论你从哪种模式开始，都可以随时微调区块、自定义 UI 元素或更新设计风格。