基于自定义规则的AI绘图逻辑构建实践

应用场景

在AI辅助绘图的实际应用中，由于缺乏统一的规则约束，AI在理解用户提示词、构建画面结构以及处理元素之间逻辑关系方面仍存在较大的不确定性。这种随机性通常会导致生成结果与用户预期存在偏差，影响使用效率和创作精度。因此，通常需要用户不断优化提示词，并通过多轮迭代调整，才能逐步接近目标效果，提升AI绘图在实际场景中的可用性与可靠性。

本实践以华为云码道IDE工具为例，介绍如何通过配置规则（Rule），对AI绘制sin(x)函数图像的过程进行规范约束，从而实现图像坐标精准、格式统一、结果可控的标准化生成。

操作流程

准备工作

在使用华为云码道前，您需要先创建一个项目，用于集中存放工程中的各类文件。

1. 参考IDE中操作，登录华为云码道。
2. 创建一个项目，用于存放工程中的文件。
   1. 在IDE工具顶部菜单栏中，单击“文件(F)”，选择“新建 > 新建项目”，进入新建项目页面。
   2. 选择项目存放位置，输入项目名称（如sin-test），单击“确定”。

      项目名称必须以字母开头，可包含字母、数字、中划线或下划线，且总长度不能超过64个字符。

      图1 新建项目

      

      项目创建完成后，在“资源管理器”中可以查看到已创建的项目。

      图2 查看已创建的项目

      

3. （可选）开启自动批准功能。
   

   开启自动批准存在操作风险，请在开启前充分评估风险，并在安全可信环境中使用。本实践不开启自动批准功能。

   1. 在华为云码道聊天界面的输入框下方选择“智能体”，切换到智能体模式。

      如果没有正常显示华为云码道的聊天窗口，请在顶部菜单栏的右上方，单击展开AI侧栏图标 ，即可打开华为云码道。

   2. 将鼠标放置在“智能体”这一行，单击右侧的智能体设置图标 ，进入设置页面。
      图3 单击设置图标
      
   3. 在“智能体 > 自动批准”中，单击对应操作后的 ，开启自动批准功能。
   4. 在“智能体 > 命令执行方式”中，设置智能体执行终端命令的策略。
   5. 单击顶部的返回图标 ，完成授权操作。

创建无规则约束的sin(x)图像

为了更清晰地展示规则绘图的效果，此处将首先展示未应用规则时的绘图结果。

1. 在聊天界面的输入框中，输入如下指令。

   在网页中画一个sin(x)的函数动态图像

   执行完成后，会在资源管理器的SIN-TEST目录下生成一个名为“sinx-animation.html”的文件。

2. 在“sinx-animation.html”文件上，单击右键选择“在浏览器中预览”，查看图像。
   图4 无规则的sin(x)函数图像
   
   

   当前展示的效果图仅是示例，请以最终实际生成的效果为准。

创建有规则约束的sin(x)图像

上文介绍了无规则约束情况下sin(x)图像的绘制效果。接下来将为您介绍基于绘图规范约束下sin(x)图像的绘图。请参考以下步骤，依次完成项目创建、规则文件编写以及绘图操作。

1. 编写绘图规范规则文件。
   1. 在IDE工具左上角，选择“文件(F) > 新建 > 新建项目”，创建一个名称为“sin-test-rule”的项目并在新窗口打开。
      图5 新建项目sin-test-rule
      
   2. 单击华为云码道聊天界面右上角的设置图标 ，进入智能体设置页面。
   3. 选择“技能与规则”，在“项目级”页签中单击规则后的 。
   4. 设置规则名称为“rule-pic”，适用范围保持默认选项“自动应用”，在内容中填写sin(x)的绘图规则，单击“确定”，即可完成规则的创建。
      图6 新建rule-pic规则
      

      # 绘图规范
      本文件包含了绘图过程需要遵守的规范
      
      ## 1.坐标系规范
      - 横轴为x轴
      - 纵轴为y轴
      - 原点O(0,0)必须清晰标注
      - 坐标轴箭头、刻度和单位长度要统一
      - 刻度线是细实线
      - 轴线是稍粗实线
      - 坐标不能和坐标轴交叉
      
      ## 2. 角度单位规范
      - 教学图像优先使用弧度制
      - 需要在坐标轴上标注的刻度：0,$\frac{\pi}{2}$,$\pi$,$\frac{3\pi}{2}$,$2\pi$

2. 根据规则文件生成规则限制的sin(x)图像。
   1. 在聊天界面的输入框中，输入如下指令。

      在网页中画一个sin(x)的函数动态图像

      执行完成后，会在资源管理器的SIN-TEST-RULR目录下生成一个名为“sinx-animation.html”的文件。

   2. 在“sinx-animation.html”文件上，单击右键选择“在浏览器中预览”，查看图像。
      图7 规则下绘制的sin(x)函数图像
      
      

      当前展示的效果图仅是示例，请以最终实际生成的效果为准。

总结

对比有无规则约束下绘制的sin(x)函数图像，可以明显看到：在引入规则后，函数图像的坐标规范和数学表达准确性都得到了显著提升，有效避免了坐标轴混乱等问题。充分体现了Rules在统一标准、约束行为、保证输出质量和稳定性方面的重要作用，使结果更规范、可靠、可预期。

本次实践带您了解了规则。除规则外，华为云码道还提供了技能和MCP Server，三者共同构建了智能体的多样化能力。各功能的差异对比如表2。