Stitch 网站设计 Prompt:SaaS 与作品集需求
Stitch 是 Google 的 AI 设计工具。先明确网站概念,再区分视觉设计和实际业务行为。下方虚构页面是建议输入,不是 Neruve 集成结果或 Stitch 实测输出。
2026年10月8日核对。具体工具行为请以所用版本的官方文档为准。
从可用的页面开始
先预览可用的 HTML 页面,再让编程智能体结合源码和配套 Prompt,练习这些方法。
Skills 继续免登录免费阅读和复制。模板可公开预览;源码下载和配套 Prompt 需要账户及相应购买权益或套餐。 查看源码权限和价格
给 Stitch 一个具体网站任务
先写受众、页面目标、区域顺序与主要操作,再考虑装饰。提供真实文案和有权使用的素材,缺失素材标为占位。明确要做落地页、作品集还是配套页面,避免一个请求混入多个不相关流程。
用 SaaS 落地页 Prompt 讲清产品
说明问题、具体产品示例和使用步骤,仅采用核实过的功能与商业事实。Fieldnote 练习用虚构研究笔记和工作流程链接,不虚构客户评价、用户数量或可用注册表单。
用项目证据写作品集 Prompt
每个项目写角色、约束和示意结果,手机上让说明靠近对应图片。缺素材时保留占位标识。Mira 是虚构的网站作品集,不是简历、Notion 模板或真实设计师的推荐。
先改手机布局,再检查实现
指定一个区域修改,其他部分保留既定方向。检查窄屏阅读顺序、换行和操作名称。概念进入网站项目后,再验导航、表单、响应式布局和内容;视觉概念本身不能证明生产行为。
可自行改写的原创练习
以下 Neruve 原创示例保留英文,是建议输入,不是工具实测输出或付费模板 Prompt。使用前请替换虚构事实。
SaaS 网站概念
Design a website concept for Fieldnote, a fictional research-notes workspace.
Audience: small product teams. The page explains collect → compare → decide.
Create a warm-paper and ink direction with one realistic, clearly fictional note.
Sections: compact introduction, note specimen, three-step workflow and a final
link to the workflow. The primary action reads “Explore the workflow”.
Keep typography and button treatments consistent across the screens.
Create desktop and narrow-screen variants with readable copy and no horizontal
overflow. Do not add signup forms, prices, logos, testimonials or user counts.
This is a visual concept. Identify which interactions need implementation later.作品集网站概念
Create a website concept for Mira Chen, a fictional product designer.
Show three explicitly fictional projects. Each explains role, constraint and
illustrative outcome without fabricated business metrics or employer logos.
Use a restrained warm-neutral direction, clear project hierarchy and readable
image captions. The primary action is “View selected work”.
Show desktop and narrow-screen layouts; on mobile, keep project details near
their corresponding image. Use placeholder media labelled as placeholder.
Do not invent real contact details, awards or working application forms.限定范围的手机布局调整
Refine only the mobile project section in this concept.
Keep the selected palette, typography, project order and desktop direction.
At 390 px, stack each project image, title and supporting text in reading order.
Keep controls easy to distinguish from captions. Do not shorten the project facts
or add new sections. Show the changed section and list what still needs to be
implemented and checked in the exported website.真实练习:用 Codex 生成 Fieldnote
Fieldnote 保留了原创输入、未经改写的 Codex HTML,以及桌面和手机检查记录。该次运行没有提供 frontend-design Skill,也不是 ChatGPT 或 Claude Design 实测。
真实练习:用 Codex 生成 Fieldnote常见问题
Neruve Prompt 会自动接入 Stitch 吗?
本指南不声称自动集成。原创练习可自行改写并输入自己的工具。付费配套 Prompt 仍按资源与套餐权限提供,兼容性和最终网站要分别验证。
浏览设计与配套 Prompt
Neruve 的公开目录提供网站设计、可用的配套提示词和 Skills 目录。交互预览无需登录;配套提示词按条目与套餐权益获取。本工作流使用你自己的编程工具,无需公开的 Neruve 网站生成器。
官方参考资料
第三方工具和 Skill 属于各自作者。链接用于参考,不表示合作关系或已包含相关使用权益。