SuperAPI AI 工具集

stitch-ui-guide

智能体与模型

查看项目

更新于 10-15 21:48

技能介绍

用途:本技能是 Stitch 的用户体验设计(UED)参考,涵盖交互原则、视觉词汇与提示词工程策略。当用户询问布局或风格术语(如 Masonry、Glassmorphism、Sidebar)、设备约束(移动端与桌面端宽度、触控目标),或需要结构化、改进 Stitch 提示词(Context → Layout → Component → Content)时使用;也可在配合 stitch-ui-execute 时对齐 UED、无障碍与设计系统。将模糊想法转为完整提示词应使用 stitch-design-spec,两者可结合。

主要能力:提供设计模式选择建议——标准模式(Gemini 2.5 Flash)适合快速迭代、线框图、快速探索多种布局;实验模式(Gemini 2.5 Pro)适合高保真设计、复杂逻辑、图像转 UI(草图/截图上传)。提供提示词结构:[Context & Style] + [Layout Structure] + [Component Details] + [Content & Data],并给出各部分的写法要点与调用 generate_screen_from_text 前的检查清单。提供视觉词汇表,包括布局模式(Hero Section、Split Screen、Masonry、Sidebar Navigation)与风格修饰(Flat、Material、Neomorphism、Glassmorphism、Brutalism)。提供颜色与主题提示结构:[App type] + [Background hex] + [Primary hex] + [Secondary hex] + [Accent hex] + [Design system] + [Mood],可加语义色。提供设备指南(移动端约 375px、桌面约 1440px、平板混合)与无障碍建议(对比度、触控目标、焦点状态)。

使用方式:按需加载本技能,依据上述结构组织提示词,并在生成前核对检查清单。相关资源包括官方提示指南 https://stitch.withgoogle.com/docs/learn/prompting/ 及仓库内 docs/color-prompt-guide.md。

适用场景:Stitch 界面生成前的提示词编写与术语统一、设备与无障碍对齐、与 stitch-ui-execute 等技能协作。

限制:本技能为参考指南,不直接执行界面生成;具体生成由 Stitch 及相关执行技能完成。资料未提供收费、价格与平台细节。