UizardAI设计文件可导出为HTML、React组件、交互原型、SVG资产包及Figma兼容JSON五种格式，分别对应网页部署、前端开发、原型演示、矢量资源提取和设计协作场景。
如果您已完成uizardai生成的设计模型，但无法将成果保存为可用文件，则可能是由于导出路径未正确选择或格式设置不匹配。以下是导出uizardai设计文件的具体操作步骤：
一、导出HTML代码
该方法适用于需快速生成可运行网页的场景，UizardAI将设计自动编译为语义化HTML、CSS与JavaScript文件，保留基础交互逻辑和响应式结构。
1、在UizardAI项目编辑界面右上角，点击Export按钮。
2、在弹出菜单中选择HTML选项，进入导出配置页。
3、确认页面尺寸（如Desktop、Tablet、Mobile）及是否启用默认交互脚本（如导航切换、表单验证）。
4、点击Generate & Download，等待编译完成，系统自动触发ZIP包下载。
二、导出React组件
该方法面向前端开发团队，UizardAI将设计图层映射为可复用的React函数组件，包含Props定义、状态占位符及内联样式支持。
1、确保当前设计已通过Autodesigner生成完整多屏结构，并完成所有画板命名（如“HomeScreen”、“ProfileScreen”）。
2、点击Export → 选择React Components。
3、在导出设置中勾选Include TypeScript definitions（如需TS支持）与Use CSS Modules（启用模块化样式）。
4、点击Download React Package，获取含src/components/目录结构的ZIP文件。
三、导出可交互演示文件
该方法用于向非技术人员展示原型流程，导出文件为自包含的HTML包，内置路由跳转、点击反馈与动画过渡效果，无需服务器即可本地双击运行。
1、在项目预览模式下，点击右上角Share按钮旁的下拉箭头。
2、选择Export Interactive Prototype选项。
3、设置是否包含Offline Mode Support（启用本地缓存资源）与Hide Uizard Watermark（去除平台标识）。
4、点击Export & Save，下载名为“prototype_interactive.zip”的压缩包。
四、导出SVG资产包
该方法用于提取设计中的图标、插图等矢量元素，UizardAI按图层分组导出独立SVG文件，保留原始ID、class命名及路径精度。
1、在画布中选中目标页面或单个组件组（如导航栏、卡片容器）。
2、右键调出上下文菜单，选择Export Selection as SVG。
3、在导出面板中设定导出倍率（1x / 2x / 3x）、是否转换文本为路径、是否嵌入外部图像。
4、点击Export All Selected，系统生成按图层名称命名的SVG文件集合。
五、导出Figma兼容JSON
该方法适用于需将UizardAI设计无缝迁移至Figma进行协作细化的场景，导出文件包含完整图层树、约束关系、字体映射与颜色变量定义。
1、进入项目设置页（Settings → Project Settings）。
2、滚动至Advanced Export区域，点击Enable Figma Sync开关。
3、点击Export to Figma JSON，系统生成符合Figma Plugin API v2规范的JSON描述文件。
4、在Figma中安装“Uizard Importer”插件，导入该JSON文件，自动重建图层结构与样式系统。
