brand-landingpage
设计以品牌优先的落地页与互动访谈
大多数落地页之所以失败,是因为跳过了品牌定位环节。本技能引导用户完成结构化的品牌访谈,然后使用 Stitch SDK 生成包含匹配设计系统的精致落地页。
下载技能 ZIP
在 Claude 中上传
前往 设置 → 功能 → 技能 → 上传技能
开启并开始使用
测试它
正在使用“brand-landingpage”。 为我的 API 工具 DataPipe 创建一个落地页
预期结果:
技能会询问你的产品用途,然后引导你选择 3 个品牌形容词,如简洁、技术感和现代。确认采用靛蓝点缀的深色主题后,生成包含 Hero、代码片段、功能和页脚等版块的桌面端落地页。
正在使用“brand-landingpage”。 颜色感觉不对,你能改一下吗?
预期结果:
技能会询问颜色哪里不对劲:太亮、太暗还是色调不对。在你说太亮之后,它会生成一个色调更柔和的变体,布局不变但调整了颜色饱和度。
正在使用“brand-landingpage”。 我想比较不同的布局方案
预期结果:
技能会生成 3 个落地页变体:居中 Hero、左右分栏布局和全宽页头。三个版本会在浏览器标签页中全部打开,并询问你偏好哪个方向。
安全审计
低风险All 295 static analysis findings were evaluated against actual file content. All 'weak cryptographic algorithm' findings are false positives caused by hex color codes in brand design reference tables. All 'Ruby/shell backtick execution' findings are false positives from markdown code blocks showing SDK method names and CLI commands. The 'C2 keywords', 'system reconnaissance', 'Windows SAM database', and 'Windows cmd.exe' findings are all false positives resulting from design terminology, brand interview questions, and legitimate file-opening instructions. The 'environment file access' finding is confirmed but represents proper API key management with documented security practices. The 'hardcoded URL' findings are low-severity documentation links for the Stitch SDK. The heuristic 'dangerous combination' finding is a false positive reflecting expected SDK integration patterns (API key + SDK calls + documentation references). No prompt injection, data exfiltration, or malicious intent was detected.
低风险问题 (1)
风险因素
质量评分
你能构建什么
为副业项目创建落地页
正在构建 CLI 工具或开源项目的开发者需要一个落地页但缺乏设计经验。本技能执行品牌访谈并生成专业页面。
创建初创公司营销网站
早期阶段的初创公司需要为其 SaaS 产品创建落地页。本技能帮助定义品牌定位,并生成包含功能、定价和客户评价等版块的页面。
搭建开发者作品集页面
开发者或设计师想要一个个人作品集落地页。本技能进行品牌访谈,并生成包含精选项目和关于版块的页面。
试试这些提示
为我的项目 [Project Name] 创建一个落地页。它是一个 [description]。目标用户是 [audience]。
我想为我的产品 [Project Name] 设计一个落地页。让我先进行品牌访谈来定义视觉风格。
我落地页上的 Hero 区域感觉太单调了。你能生成一个布局更大胆、色彩对比更强的变体吗?保持配色方案不变。
我有一个昨天保存的设计会话。从我上次离开的地方继续,帮我完成部署包的最终制作。
最佳实践
- 即使想跳过也请完成品牌访谈。这些问题只需 5 分钟,却能决定最终页面是通用模板还是真正贴合你的产品。
- 通过在浏览器中打开 HTML 来审查生成的页面,而不是要求文字描述。视觉反馈能带来更好的设计迭代。
- 在开始前将你的 Stitch API 密钥保存在环境变量中,这样技能就可以不间断地生成和迭代设计。
避免
- 要求技能嵌入你的公司 Logo 或上传图片。Stitch SDK 仅通过文本提示生成内容,不接受图片输入。
- 提供 CSS 级别的反馈,例如添加 padding-top 40px。应将反馈转化为设计意图,例如在标题上方增加更多呼吸空间。
- 跳过移动端变体。桌面端布局通常需要针对移动端显示进行调整,同时生成两者可确保一致的体验。