前言¶
在多端产品开发中,设计规范往往分散在不同平台,从 iOS 到 HarmonyOS,从 Material Design 到 WeUI,手动适配成本高且容易出错。一个 Skill 如果能覆盖主流设计系统,按规范输出高保真 UI,就能大幅减少重复工作。
是什么¶
ui-design-aitool-plus 是一个基于 SkillHub 的设计类 Skill,由社区用户 user_76c74409 发布。它覆盖 11 大平台设计系统,支持手机 App、桌面端、小程序三端,通过一条指令即可输出原厂级高保真 UI 方案。该 Skill 评分 100000,分类为 design-media,适用于需要多平台 UI 设计的团队或个人。
核心功能¶
- 11 大平台设计系统支持:Apple iOS HIG、Google Material Design 3、Samsung One UI、华为 HarmonyOS、小米 HyperOS、荣耀 MagicOS、OPPO ColorOS、vivo OriginOS、魅族 Flyme、Windows 11 Fluent Design、微信小程序 WeUI。
- 三端适配:支持手机 App、桌面端、小程序三个终端。
- 输出内容:原厂级高保真 UI 方案,包括设计规范文档、组件库、可交互 HTML 原型。
- 触发词:iOS、苹果、Android、Material Design、One UI、三星、鸿蒙、HarmonyOS、华为、HyperOS、小米、澎湃、MagicOS、荣耀、ColorOS、OPPO、OriginOS、vivo、Flyme、魅族、Windows、Fluent、桌面、微信、WeUI、小程序、UI设计、界面设计、App设计、组件库、设计规范、毛玻璃、服务卡片、多平台适配。
安装与启用¶
SkillHub 社区提供的安装方式如下:
skillhub install user_76c74409/ui-design-aitool-plus
安装后,该 Skill 会集成到 SkillHub 的 Skill 管理列表中,可通过触发词或目录调用。
典型用法¶
在对话中直接使用触发词即可触发 Skill,例如:
请为 iOS 设计一个电商首页生成 Material Design 3 风格的设置页输出 HarmonyOS 风格的个人中心组件库
Skill 会根据触发词中的平台名称和页面类型,生成对应的设计方案,包括高保真 UI 原型、设计规范说明和组件代码。
适用场景与注意¶
适用场景包括:
- 电商首页、设置页、个人中心、表单页、列表页等多端适配设计
- 多风格横向对比
- 设计规范文档整理
- 组件库搭建
- 可交互 HTML 原型制作
注意事项:
- 该 Skill 依赖 SkillHub 的 SkillHub 环境运行
- 需要确保网络环境可访问 SkillHub 服务
- 输出结果需要根据具体项目进行微调
总结¶
ui-design-aitool-plus 通过覆盖主流设计系统,为多端 UI 设计提供了统一的生成方案。对于需要频繁适配不同平台的团队,它能够减少重复工作,提高设计效率。如需使用,请访问官方地址:https://api.skillhub.cn/user_76c74409/ui-design-aitool-plus