---
title: 小程序单设计UI组图生成|万维易源ShowAPI
canonical_url: "https://www.showapi.com/ai/skills/miniapp-single-canvas-ui-group-generator"
last_updated: "2026-10-14T06:55:30.891Z"
meta:
  description: "深度解析用户关于小程序UI组图生成的需求，规避拼接与风格不一致痛点，通过单画布排版坐标逻辑、全局样式锁定及精准英文提示词，在单一图像内直接生成包含多个UI界面的完整小程序设计稿组图，并执行一致性逻辑校验，确保高保真、排版规整、风格绝对一致的端到端交付。 免费在线使用，也支持 API / Agent 接入。"
  keywords: "小程序单设计UI组图生成, AI Skill, 万维易源, showapi, 大模型, ai技能, AI工具, 异步任务, Agent技能包, api接口, 在线使用, api接口, api接口大全, 免费api, 免费数据接口, 数据接口, api开放平台, 万维易源, showapi, 大模型, AI Skills"
  "og:description": "深度解析用户关于小程序UI组图生成的需求，规避拼接与风格不一致痛点，通过单画布排版坐标逻辑、全局样式锁定及精准英文提示词，在单一图像内直接生成包含多个UI界面的完整小程序设计稿组图，并执行一致性逻辑校验，确保高保真、排版规整、风格绝对一致的端到端交付。 免费在线使用，也支持 API / Agent 接入。"
  "og:title": "小程序单设计UI组图生成 AI Skill|万维易源ShowAPI"
---

# **小程序单设计UI组图生成**

深度解析用户关于小程序UI组图生成的需求，规避拼接与风格不一致痛点，通过单画布排版坐标逻辑、全局样式锁定及精准英文提示词，在单一图像内直接生成包含多个UI界面的完整小程序设计稿组图，并执行一致性逻辑校验，确保高保真、排版规整、风格绝对一致的端到端交付。

S**Serenoa** 2026-06-25 15:56 · 7 个步骤

约 ¥0.25/次调用，含模型推理价格

ID`6a3cd3673c51f2c209017efb`

### **能力组成**

**立即试一试** 在线体验此 Skill，输入参数即可看到实时效果

### **输出案例**

-
-
-

### **内部编排**

共 7 步 · AI 自动编排的执行流程与原始定义 收起

1意图深度解析

2页面结构与组件树规划

3全局样式与排版坐标定义

4单画布精准提示词构建

5单画布组图渲染生成

6轮询组图生成状态

7UI组图一致性逻辑校验

**完整定义 (JSON)**200 行

```
{
  "workflow_id": "miniapp_single_canvas_ui_group_generator",
  "input": {
    "brand_style_preference": {
      "field_name": "brand_style_preference",
      "default": "主色#1890ff，现代简约风格",
      "description": "品牌视觉基础要求（如主色调、风格定位），若无指定系统将默认采用Ant Design / Apple HIG 风格",
      "example": "主色#1890ff，现代简约风格",
      "required": false,
      "type": "string"
    },
    "layout_preference": {
      "field_name": "layout_preference",
      "default": "3列网格排列",
      "description": "用户指定的排版偏好（如3列网格排列、横向排列等），若无指定系统将自动采用等距网格布局",
      "example": "4列网格排列",
      "required": false,
      "type": "string"
    },
    "raw_requirement": {
      "field_name": "raw_requirement",
      "default": "",
      "description": "用户关于小程序UI组图生成的自然语言需求描述，包含业务类型、所需界面列表、排版偏好等",
      "example": "一个厨艺和美食分享微信小程序",
      "required": true,
      "type": "string"
    },
    "aspect_ratio": {
      "field_name": "aspect_ratio",
      "default": "4:3",
      "description": "最终生成组图的宽高比例，可选值：1:1、3:4、4:3、16:9、9:16",
      "example": "16:9",
      "required": false,
      "type": "string"
    }
  },
  "steps": [
    {
      "point_code": "",
      "id": "step_1_intent_analyzer",
      "result": [],
      "api_code": "intent_analyzer",
      "backend_type": "prompt_api",
      "status": "PENDING",
      "name": "意图深度解析",
      "action": "run",
      "params": {
        "raw_requirement": "{{@input.raw_requirement}}"
      }
    },
    {
      "point_code": "",
      "id": "step_2_structure_planner",
      "result": [],
      "backend_type": "prompt_api",
      "api_code": "miniapp_ui_structure_planner",
      "status": "PENDING",
      "name": "页面结构与组件树规划",
      "action": "run",
      "params": {
        "extended_requirements": "{{@step_1_intent_analyzer.result.data.extended_requirements}}",
        "structured_intent": "{{@step_1_intent_analyzer.result.data.result}}"
      },
      "depends_on": [
        "step_1_intent_analyzer"
      ]
    },
    {
      "point_code": "",
      "id": "step_3_style_layout_definer",
      "result": [],
      "backend_type": "prompt_api",
      "api_code": "global_style_and_layout_definer",
      "status": "PENDING",
      "name": "全局样式与排版坐标定义",
      "action": "run",
      "params": {
        "brand_style_preference": "{{@input.brand_style_preference}}",
        "success_criteria": "{{@step_1_intent_analyzer.result.data.success_criteria}}",
        "layout_preference": "{{@input.layout_preference}}",
        "structured_intent": "{{@step_1_intent_analyzer.result.data.result}}"
      },
      "depends_on": [
        "step_1_intent_analyzer"
      ]
    },
    {
      "point_code": "",
      "id": "step_4_prompt_builder",
      "result": [],
      "backend_type": "prompt_api",
      "api_code": "single_canvas_ui_prompt_builder",
      "status": "PENDING",
      "name": "单画布精准提示词构建",
      "action": "run",
      "params": {
        "global_design_tokens": "{{@step_3_style_layout_definer.result.data.global_design_tokens}}",
        "success_criteria": "{{@step_1_intent_analyzer.result.data.success_criteria}}",
        "page_structure_list": "{{@step_2_structure_planner.result.data.page_structure_list}}",
        "canvas_layout_parameters": "{{@step_3_style_layout_definer.result.data.canvas_layout_parameters}}"
      },
      "depends_on": [
        "step_2_structure_planner",
        "step_3_style_layout_definer",
        "step_1_intent_analyzer"
      ]
    },
    {
      "point_code": "1",
      "id": "step_5_generate_image",
      "result": [],
      "backend_type": "sys_api",
      "api_code": "3373",
      "status": "PENDING",
      "name": "单画布组图渲染生成",
      "action": "run",
      "params": {
        "prompt": "{{@step_4_prompt_builder.result.data.result}}",
        "aspect_ratio": "{{@input.aspect_ratio}}"
      },
      "depends_on": [
        "step_4_prompt_builder"
      ]
    },
    {
      "point_code": "",
      "id": "step_6_poll_image_status",
      "result": [],
      "backend_type": "sys_api",
      "api_code": "polling",
      "status": "PENDING",
      "name": "轮询组图生成状态",
      "action": "run",
      "params": {
        "result_url": "{{@step_5_generate_image.result.data.result_url}}"
      },
      "depends_on": [
        "step_5_generate_image"
      ],
      "polling": {
        "interval_seconds": 5,
        "timeout_seconds": 600,
        "success_condition": "{{@step_6_poll_image_status.result.data.task_status}} === 'SUCCEEDED'"
      }
    },
    {
      "point_code": "",
      "id": "step_7_consistency_evaluator",
      "result": [],
      "backend_type": "prompt_api",
      "api_code": "ui_consistency_evaluator",
      "status": "PENDING",
      "name": "UI组图一致性逻辑校验",
      "action": "run",
      "params": {
        "optimized_en_prompt": "{{@step_4_prompt_builder.result.data.result}}",
        "success_criteria": "{{@step_1_intent_analyzer.result.data.success_criteria}}",
        "canvas_layout_parameters": "{{@step_3_style_layout_definer.result.data.canvas_layout_parameters}}"
      },
      "depends_on": [
        "step_4_prompt_builder",
        "step_1_intent_analyzer",
        "step_3_style_layout_definer",
        "step_6_poll_image_status"
      ]
    }
  ],
  "output": {
    "refinement_suggestions": {
      "field_name": "refinement_suggestions",
      "description": "若校验发现风险，提供的改进建议或兜底降级策略",
      "value": "{{@step_7_consistency_evaluator.result.data.refinement_suggestions}}",
      "type": "array"
    },
    "evaluation_report": {
      "field_name": "evaluation_report",
      "description": "组图一致性逻辑校验评估报告（包含风格、排版、规范符合度评分及风险识别）",
      "value": "{{@step_7_consistency_evaluator.result.data.evaluation_report}}",
      "type": "object"
    },
    "consistency_score": {
      "field_name": "consistency_score",
      "description": "组图一致性各维度评分（风格一致性、排版一致性、规范符合度、整体就绪度）",
      "value": "{{@step_7_consistency_evaluator.result.data.consistency_score}}",
      "type": "object"
    },
    "page_structure_list": {
      "field_name": "page_structure_list",
      "description": "规划生成的页面结构清单（包含各页面ID、名称、核心组件、布局类型）",
      "value": "{{@step_2_structure_planner.result.data.page_structure_list}}",
      "type": "array"
    },
    "final_image_url": {
      "field_name": "final_image_url",
      "description": "最终生成的单画布多界面小程序UI组图URL",
      "value": "{{@step_6_poll_image_status.result.data.result_url}}",
      "type": "string"
    }
  }
}
```

介绍

在线运行

Skill与API