使用提示词
添加你的项目需求
在下方添加背景信息。复制或下载时，这些内容将包含在提示词中。
使用 [PROJECT] 的现有项目技术栈，为 [AUDIENCE] 创建响应式 HTML 网站。任务是：创意工作室作品集。
必需内容和结构
展示三个项目及其专业领域、角色、年份和案例研究链接；使用富有表现力的字体和非对称图像网格。
将 [APPROVED_CONTENT] 作为名称、日期、数字、声明和目标地址的来源。替换任何内容之前，先列出缺失的输入。如需演示，请将其内容标记为虚构。不要编造客户评价、排名、合作伙伴徽标或产品能力。
设计方向
使用 [BRAND_RULES] 和项目中已选定的设计系统。如果未提供设计系统，请从以下方向开始：暖象牙色、炭灰色字体和一处克制的酸性绿色强调色；宽裕的留白和非对称网格。确保字体、间距和颜色角色保持一致。任务优先于装饰元素，并避免采用由无关卡片拼凑而成的通用设计。
项目内容
对于三个项目中的每一个，都应包含标题、一句话简介、专业领域、年份、工作室角色、协作者署名、主图和案例研究目标地址。以最出色的项目开篇；用另外两个项目展示多样性。最后提供指定的联系方式。对于缺少目标地址的项目，不要虚构案例研究叙事。
布局和行为
通过图像尺寸和位置营造不对称感，同时保持说明文字对齐一致。将项目名称和制作人员信息置于图像之外。除非裁切方案已获批准，否则保留所提供图像的原始比例。在移动端，按简介、主项目、辅助项目、联系方式的顺序纵向排列。
任务专项验收检查
- 检查长标题、竖幅图像和多位合作者的情况。
- 确保可通过键盘访问每个项目页面，并让所有制作人员信息无需悬停即可看到。
实施和审查
确保文本可编辑。使用语义化结构、描述清晰的控件、可见的键盘焦点以及适当的空状态和错误状态。检查窄屏和宽屏布局。遵循减少动态效果的偏好设置。保留现有项目框架和依赖项；不要擅自替换技术栈。返回可编辑文件，并说明任何未完成的行为或不支持的输入。提出额外功能前，先审查此项具体任务。
参考附件和重构目标
将此提示词下载包中的 reference.webp 与本提示词一起附加到 OpenDesign。构建构图和层级相似且可编辑的成果；不要将整张参考图像嵌入并用作最终界面。如果已批准的项目内容和品牌规则与虚构示例标签冲突，应保留前者。如果图像缺失或无法读取，应请求提供图像，而不是声称实现了视觉保真。
参考构图和内容
以随附的 reference.webp 作为创意工作室作品集的视觉参考。开始构建前，识别从上到下的主要区域、相对宽高、对齐方式、间距、字体层级、表面颜色、边框、图像和重复组件。保留这些关系，不要替换为通用模板。必需的任务内容：展示三个项目，并包含专业领域、职责、年份和案例研究链接；使用富有表现力的字体与不对称图像网格。将图像转化为可编辑元素时，请遵循以下任务专属布局指导：将一个项目设为主项目，另外两个用于展现业务广度。不对称感应来自图像尺寸和位置，而说明文字应保持一致的对齐方式与字号。将项目名称、专业领域和制作人员信息置于图像之外，确保其在明暗照片上都清晰可读。在窄屏上，恢复为经过明确设计的纵向顺序：简介、主项目、辅助项目，然后是联系方式。除非裁切方案已获批准，否则保留图像原始比例。
示例需求中的视觉方向
暖象牙色画布、超大号炭黑色瑞士无衬线字体、少量酸性绿色点缀、充足留白、不对称项目网格，搭配建筑感雕塑摄影与克制的钴蓝色面板。主视觉文字必须完全一致：'Good ideas. Carefully made.'；导航为 'Work'、'About'、'Contact'。项目说明为 'Objects / 2026'、'Spaces / 2026'、'Identity / 2026'。优雅、专业的编辑式艺术指导。
交互规范
该参考图是静态概念：以下行为是必须实现的要求，并不表示图片已经具备这些功能。将自定义提示词复制到你要构建作品集的项目中。先要求生成首页；案例研究页面应使用各自提供的内容，不要虚构项目叙事。确保可通过键盘访问每个项目页面，并让所有制作人员信息无需悬停即可看到。对于每个可见控件，明确其触发方式、受影响的状态和反馈；实现局部变更时，确保相关视图中的状态一致。让搜索和筛选返回真实结果，为选择控件提供明确的激活状态，并在适用时为保存操作提供清晰可见的等待中／成功／失败反馈。不要添加无关流程。导航使用正确的链接，操作使用按钮，并为图标控件提供无障碍名称。如果仅更改了本地演示，不要暗示后端操作已成功。
视觉比较和交付
- 以匹配的比例将成果与随附图像进行比较。在润色装饰细节前，审查主要区域的位置、图像的相对尺寸、换行、间距、字体层级、对比度、激活状态和内容密度。
- 然后测试窄屏布局，不要将桌面端文本挤压成过小的标签。
- 将徽标、照片和图标保留为独立资源，并确保所有有实际意义的标签均可编辑。列出所有不可用的字体/资源以及任何有意的偏离。返回可运行文件，并简要说明已实施的行为和剩余的集成工作；不要承诺仅凭提示词就能获得像素级一致的成果。
下载提示词 + 图像
包含完整提示词和全尺寸参考图。将两者都附加到 OpenDesign 中，以指导布局设计。
如何撰写创意工作室作品集设计提示词
使用这份创意工作室作品集设计提示词展示三个项目，并包含专业领域、职责、年份和案例研究链接；采用富有表现力的字体与不对称图像网格。
同一 AI 生成概念的局部裁切图；这些不是实际运行网站的截图。
先描述层级，再描述风格
“Good ideas. Carefully made.”占据简介左侧的大部分空间。工作室描述位于右侧一个小得多的文本区块中；Work、About 和 Contact 保持在顶部。象牙色背景和炭黑色字体强化了这一层级，少量绿色点缀则形成视觉焦点。
仅写“编辑式”会让构图存在过多解释空间。请明确主导元素、辅助文字的位置，以及哪些细节应保持低调。另行指定你的实际标题：示例中的文字是虚构的，更长的标题需要不同的换行方式。将一个项目设为主项目，另外两个用于展现业务广度。不对称感应来自图像尺寸和位置，而说明文字应保持一致的对齐方式与字号。将项目名称、专业领域和制作人员信息置于图像之外，确保其在明暗照片上都清晰可读。在窄屏上，恢复为经过明确设计的纵向顺序：简介、主项目、辅助项目，然后是联系方式。除非裁切方案已获批准，否则保留图像原始比例。
来自提示词
暖象牙色画布、超大号炭黑色瑞士无衬线字体、少量酸性绿色点缀、充足留白
按需定制
使用 [STUDIO_NAME] 和 [APPROVED_HEADLINE]。让标题成为左侧的主导元素；在右侧放置简短的工作室简介。将 Work、About 和 Contact 紧凑地置于其上方。使用暖象牙色和炭黑色，并搭配来自 [BRAND_RULES] 的一种克制强调色。让标题自然换行，不要为了适应空间而缩小。
将作品网格转化为内容契约
三张图像通过主题和色彩形成对比：浅色雕塑感物件、阳光照亮的室内空间，以及钴蓝色品牌识别面板。说明文字在图像下方共享同一基线。可见的一行接近三等分栏，并未呈现明显放大的主项目，尽管提示词要求采用不对称层级。
这句话明确了结果必须包含的内容，而不是寄希望于一个看似可信的图库会自动涵盖这些信息。小幅概念图并未清楚显示每项必需的职责或合作者署名。请在实现中保留这些字段，并使用你的真实项目记录进行核对。同时解决参考图与书面需求之间的差异：选择三等分栏布局以更贴近视觉参考，或有意放大其中一个项目。
来自提示词
为三个项目分别提供标题、一句话简介、专业领域、年份、工作室职责、合作者署名、主图和案例研究目标链接。
按需定制
仅使用以下三个已批准的项目记录：[PROJECT_RECORDS]。在桌面端宽度下，将其主图按三等分栏展示，以匹配参考图。将标题、专业领域、年份、工作室职责和合作者署名作为可编辑文字置于每张图像下方。为每个项目使用其提供的案例研究 URL。保留每张图像的比例；不要虚构缺失的署名或目标链接。
写明图像无法呈现的交互行为
“View case study”标签暗示导航，但静态图像无法确定它指向哪里、键盘焦点是否可见，或在手机上会发生什么。这些都需要写成明确要求。不要仅仅因为通用提示词提到搜索、筛选或保存控件就添加它们；这些并不属于此作品集的可见任务。
描述触发方式和结果：点击项目标题或其案例研究链接时，打开同一个已批准的目标地址。然后定义窄屏下的阅读顺序。不要要求模型根据这张桌面端图片自行推断移动端布局，也不要将关键项目信息隐藏在悬停交互之后。以潜在客户的视角阅读页面：你能否识别工作室的专长、看出作品由谁完成，并且无需悬停就能打开案例研究？测试长项目标题、竖幅图像以及包含多位合作者的项目。然后使用键盘并在窄屏上进行导航。如果首次结果像通用的代理机构页面，请先调整项目层级和说明文字，再添加效果或更多版块。
来自提示词
确保每个项目目标地址都可通过键盘访问，并让所有署名信息无需悬停即可看见。
按需定制
让每个项目标题和“View case study”链接指向同一个已批准的 URL。提供清晰可见的键盘焦点状态，并始终显示制作人员信息。在窄屏上，按简介、三个项目、联系方式的顺序纵向排列。允许长名称自动换行。如果缺少案例研究 URL，则显示项目信息但不生成无效链接，并报告缺失的输入。
先整合简报，再逐项调整设计决策
先明确任务和受众，加入真实的项目记录，描述视觉层级，再说明导航和移动端行为。将参考图与文本一并附上。上方三段“打造你的专属版本”内容用于替换完整提示词中的对应部分，不应不加判断地作为额外说明附加。特别是，如果选择等宽分栏方案，请替换关于非对称网格的说明。
- 将首个结果与参考图对比：应有意识地处理标题强调、图片顺序、说明文字对齐和背景色。
- 用你最长的真实项目标题和完整制作人员名单替换示例内容。检查在窄屏上是否有任何内容消失或重叠。
- 打开每个项目目标页面，并使用键盘进行导航。外观相似的截图并不能证明这些交互可以正常运行。
后续提示词
在获得初步结果后使用此提示词。它会将修改范围聚焦于此任务最重要的部分。
仅优化作品集项目网格。将主项目置于清晰的首位，然后展示另外两个辅助项目。确保每个项目的标题、专业领域、年份和贡献者署名无需悬停即可看见。保留图像比例，并让每个案例研究链接都可通过键盘访问。在移动端，以单栏形式保持相同的阅读顺序。已批准的页眉、字体和联系版块保持不变。
