简洁的单色作品集网站
Best for design studio, branding agency and etc.
指令
第一步——确定品牌并撰写内容（尽量减少询问）。
首先加载稍后需要用到的延迟工具：调用 toolSearch 生成图像和网页，以便在步骤 2 和 3 之前做好准备。
然后扫描用户的消息和任何 @引用，查找：品牌/工作室名称、品牌业务（重点）、标语、项目名称、服务列表以及任何上传/引用的图像（跟踪这些以进行步骤 2 — 不要重新生成它们覆盖的位置）。
提问规则（尽量简洁——用户更喜欢简洁的互动）：
- 如果品牌名称和品牌重点都缺失，则调用一次 askUserQuestion 函数，并批量提出两个问题：
Q1 “工作室/品牌名称？” — 选项包括“StudioNoir”、“Form & Field”、“Atelier 09”、“Object / Subject”。
Q2 “该品牌是做什么的？”——选项包括“设计机构”、“摄影工作室”、“建筑公司”、“时装品牌”、“个人作品集”。
- 如果只缺少一个，那就只问缺少的那个。
- 如果用户消息中同时存在这两项，则不要询问任何问题——直接进行下一步。
一旦确定了品牌名称和定位，其余部分就可以自行撰写，无需再问任何问题。语气：编辑风格，自信，简洁，高端。文案要精炼——这种风格注重留白，而非冗长。
草稿：
标语：两行简短的文字，读作一个短语，例如“设计/未来”、“构建/世界”、“打造/永恒”、“使其/持久”。每行1-2个单词。换行时使用衬线斜体+衬线常规字体。
- 关于文案：约80字，两段简短的文字。提及公司创立时期（例如“自80年代起”），介绍几项服务，并营造出拥有全球客户/行业奖项的氛围。
- 三个案例研究。每个案例研究：一个符合主题的自创项目名称（对于设计机构，可重复使用“Schematiq”、“Commercial Co.”、“Sprig & Sky”等名称；对于其他主题，选择感觉相似的名称），1-2 个服务标签，一个约 30 个字的背景说明，一个约 30 个字的解决方案说明。
- 六个与重点相关的服务标签（默认值：品牌激活、整合营销、网站开发、视频制作、品牌标识、品牌战略 — 可根据非代理机构的重点进行调整）。
- 结尾 CTA 标语（一行，约 10-14 个字），例如“提升您的品牌，在历史上留下您的印记”。
- 页脚项目：工作室名称、“条款与支持”、“隐私政策”。
将所有内容保存在内存中，以便执行步骤 3。暂时不要调用 generateWebpage 函数。
步骤 2 — 组合 6 张风格统一的单色图像。
插槽地图：英雄、关于、项目1、项目2、项目3、功能。
A) 如果用户已提供图片（上传的图片、@引用、消息中的URL），则按接收顺序将其分配到相应的槽位，并跳过这些槽位的生成。仅生成剩余的槽位。
B) 对于每个空槽位，调用 generateImage。尽可能在单个工具批处理中并行运行它们。
每个广告位都必须采用固定的图片风格：
纯黑白照片。无任何色彩晕染、棕褐色调或双色调处理。达到编辑/电影/高端杂志的品质。六张照片对比度和颗粒感一致。版面需要的地方留白充足。
槽位提示模板——将 [DISCIPLINE] 替换为步骤 1 中的品牌重点（例如“设计机构”、“摄影工作室”、“建筑公司”），将 [DISCIPLINE_SUBJECT] 替换为合适的主题（例如，设计：纸雕/字体特写；建筑：阴影几何；时尚：轮廓；摄影：静物）：
1. 主角（16:9 比例）： “[学科主题] 的电影级黑白照片，戏剧性的编辑构图，简洁的极简主义单色美学，柔和的顶部光线，充足的留白，高级杂志品质，无色彩，高对比度。”
2. 关于（4:3 比例）： “当代 [DISCIPLINE] 工作室内部的黑白纪实照片，大窗户透进柔和的日光，极简主义的桌子和工具，编辑报道风格，仅单色，高对比度。”
3. 项目_1（方面 1:1）： “品牌标识模型（名片、信笺、印刷文具）的黑白平铺图，置于干净的白色表面上，清晰的自上而下的编辑设计摄影，仅限单色。”
4. 项目_2（1:1 比例）：与[学科]相关的黑白极简主义静物画（例如电影场记板、比例模型、造型产品），电影摄影棚灯光，锐利的阴影，仅限单色。
5. 项目_3（方面 1:1）： “黑白编辑生活方式摄影，与[DISCIPLINE]相关的极简风格场景，高端杂志美学，仅限单色。”
6. 特色（16:9 比例）：“与[学科]相关的宽幅黑白抽象构图，戏剧性的视角，富有氛围的单色编辑，无色彩。”
拿到全部六个 URL 后，按槽位标记每个 URL，然后继续执行步骤 3。
步骤 3 — 构建网页。
调用 generateWebpage 函数时，请传递一个包含以下所有内容的详细指令提示——执行 generateWebpage 的代理必须严格按照该提示执行。
--- 网页提示符开始 ---
创建一个简洁的单色风格、可滚动浏览的长篇作品集网站。视觉效果必须严格遵循以下规则——不得偏离。
专属配色方案（独家——别处没有其他颜色）：
- 白色背景：#FFFFFF
- 黑色墨水和文字：#000000
- 一个深色区域可能使用接近黑色的颜色：#0A0A0A
- 对所有 应用 CSS `filter: grayscale(1) contrast(1.02)` 作为安全措施，以确保所有导入的资源都保持严格的单色。
字体排印：
- 显示：Google 字体“Fraunces”（使用字重 300 和 700，opsz 144）。强调的重点词语可使用斜体。
- 正文：Google 字体 'Inter'（字重 400、500）。正文宽度 16–18px，行高约 1.6。
- 标题字体很大：clamp(56px, 12vw, 180px)。在显示屏上跟踪 -0.02em。
- 导航、服务标签和页脚链接使用小型大写字母（`text-transform: uppercase; letter-spacing: 0.12em; font-size: 12px`）。
布局节奏：
- 部分垂直内边距：clamp(80px, 12vh, 200px)。
- 容器最大宽度：1280px，侧边槽夹紧（24px，6vw，96px）。
- 留白充足；不要过于拥挤。
相互作用：
- 顶部导航栏固定显示，滚动时背景略微模糊。
- 药丸按钮：1px 实线 #000，透明填充，边框半径：9999px，内边距 14px 28px。悬停时反转为背景色 #000 + 颜色 #FFF，缓动时间 200ms。
- 在每个主要块上实现微妙的滚动触发淡入效果 + 24px y 平移（交叉观察者）。
- 服务行：鼠标悬停滑动文本和箭头向右 ~12px，200ms 缓动。
响应式：
- 低于 768px：标题缩小到约 64–88px，双列网格折叠成单列，图像在其内边距内保持全出血。
各章节（按此顺序）：
1. 导航（固定）：左上角为小型大写字母的工作室名称；右上角为“与我们合作”按钮。
2. 主标题（全白）：分两行显示标题——第一行使用 Fraunces 斜体，第二行使用 Fraunces 常规字体——采用用户标语。字体较大。右下角可选择添加小型单色辅助图片（此处可使用主标题图片，或将其保留至下一部分）。底部有轻微的滚动提示。
3. 关于：标题为“关于[工作室]”，字体为700法文。六栏网格：左侧为正文（第1-3栏），右侧为4:3比例的图片（第4-6栏）。两个简短的段落。
4. 章节标题：'我们的工作'，法语 700，大写。
5. 案例研究 1：项目名称（Fraunces 字体），服务标签一行，采用小型大写字母（以中间点“·”或空格分隔）。名称下方：全宽项目图片（使用 project_1，1:1 比例裁剪为 16:9）。图片下方：两列网格——左列显示超大数字“01”（Fraunces 300，clamp(100px, 18vw, 220px)），小型大写字母标签“背景”，以及约 30 个单词的正文。右列相同，显示“02”和“解决方案”。
6. 案例研究 2：结构与 CS1 相同，但使用 project_2 图像。可以选择反转图像，使其位于带色调的灰白色带子上——颜色必须严格保持在调色板范围内。
7. 案例研究 3：结构相同，使用 project_3 图像。
8. 正片区域：全出血宽屏图像（使用 16:9 正片区域）。无文字叠加。
9. 我们的服务：标题“我们的服务”采用 700 号法文字体。下方是 6 个服务标签的垂直列表。每行：上方 1 像素细线分隔符 (#000)，左侧为服务名称（采用 36 像素、6 像素宽、80 像素宽的法文字体），右侧为“→”箭头。指针光标。鼠标悬停时向右滑动。
10. CTA：全出血深色区域，背景色为#000。标题为“Massive Fraunces”，居中对齐，颜色为#FFF，使用CTA结尾标语。内边距为clamp(120px, 20vh, 240px)。标题下方有“加入我们”按钮（白色边框，透明填充，鼠标悬停时反转为白色背景+黑色文字）。
11. 页脚：白色背景，小型大写字母。左侧为工作室名称，右侧为链接（“条款与支持”、“隐私政策”）。顶部极细边框（#000，1像素）。第二行显示极小的版权声明。
图片 — 将下方数据部分提供的 URL 插入到对应的插槽中。对每个 元素应用 object-fit: cover 和灰度安全滤镜。请勿添加额外的装饰性图片。
数据——请将以下内容替换到页面中：
- studio_name: <第一步中的工作室名称>
- 标语：<步骤 1 中的两行标语，用斜杠“/”分隔两行显示内容>
- about_copy: <关于步骤 1 中的段落>
- case_studies：包含三个元素的数组 { name, tags[], background, solution }，取自步骤 1
- services：步骤 1 中的六个服务标签字符串数组
- cta_tagline: <第一步中的结束 CTA>
- 图片：{ hero, about, project_1, project_2, project_3, feature } 来自步骤 2
- footer_links: ['条款与支持', '隐私政策']
--- 网页提示结束 ---
调用 generateWebpage 时，将 as_artifact 参数设置为 true。返回结果后，以用户首选语言提供一行摘要，并告知用户可以要求替换图片、更改文案或重命名项目。
描述
生成一个简洁的黑白编辑作品集网站。纯黑白配色，超大衬线字体标题，带编号的案例研究，以及大量的留白。如果没有提供图片，则自动生成六张风格统一的单色图片。
为什么我们推荐这个技能
这项技能可以创建高端的单色系网页作品集，非常适合设计工作室或代理机构。其编辑风格和极简主义风格展现出精致专业的审美。
简洁的单色作品集网站
Best for design studio, branding agency and etc.
指令
第一步——确定品牌并撰写内容（尽量减少询问）。
首先加载稍后需要用到的延迟工具：调用 toolSearch 生成图像和网页，以便在步骤 2 和 3 之前做好准备。
然后扫描用户的消息和任何 @引用，查找：品牌/工作室名称、品牌业务（重点）、标语、项目名称、服务列表以及任何上传/引用的图像（跟踪这些以进行步骤 2 — 不要重新生成它们覆盖的位置）。
提问规则（尽量简洁——用户更喜欢简洁的互动）：
- 如果品牌名称和品牌重点都缺失，则调用一次 askUserQuestion 函数，并批量提出两个问题：
Q1 “工作室/品牌名称？” — 选项包括“StudioNoir”、“Form & Field”、“Atelier 09”、“Object / Subject”。
Q2 “该品牌是做什么的？”——选项包括“设计机构”、“摄影工作室”、“建筑公司”、“时装品牌”、“个人作品集”。
- 如果只缺少一个，那就只问缺少的那个。
- 如果用户消息中同时存在这两项，则不要询问任何问题——直接进行下一步。
一旦确定了品牌名称和定位，其余部分就可以自行撰写，无需再问任何问题。语气：编辑风格，自信，简洁，高端。文案要精炼——这种风格注重留白，而非冗长。
草稿：
标语：两行简短的文字，读作一个短语，例如“设计/未来”、“构建/世界”、“打造/永恒”、“使其/持久”。每行1-2个单词。换行时使用衬线斜体+衬线常规字体。
- 关于文案：约80字，两段简短的文字。提及公司创立时期（例如“自80年代起”），介绍几项服务，并营造出拥有全球客户/行业奖项的氛围。
- 三个案例研究。每个案例研究：一个符合主题的自创项目名称（对于设计机构，可重复使用“Schematiq”、“Commercial Co.”、“Sprig & Sky”等名称；对于其他主题，选择感觉相似的名称），1-2 个服务标签，一个约 30 个字的背景说明，一个约 30 个字的解决方案说明。
- 六个与重点相关的服务标签（默认值：品牌激活、整合营销、网站开发、视频制作、品牌标识、品牌战略 — 可根据非代理机构的重点进行调整）。
- 结尾 CTA 标语（一行，约 10-14 个字），例如“提升您的品牌，在历史上留下您的印记”。
- 页脚项目：工作室名称、“条款与支持”、“隐私政策”。
将所有内容保存在内存中，以便执行步骤 3。暂时不要调用 generateWebpage 函数。
步骤 2 — 组合 6 张风格统一的单色图像。
插槽地图：英雄、关于、项目1、项目2、项目3、功能。
A) 如果用户已提供图片（上传的图片、@引用、消息中的URL），则按接收顺序将其分配到相应的槽位，并跳过这些槽位的生成。仅生成剩余的槽位。
B) 对于每个空槽位，调用 generateImage。尽可能在单个工具批处理中并行运行它们。
每个广告位都必须采用固定的图片风格：
纯黑白照片。无任何色彩晕染、棕褐色调或双色调处理。达到编辑/电影/高端杂志的品质。六张照片对比度和颗粒感一致。版面需要的地方留白充足。
槽位提示模板——将 [DISCIPLINE] 替换为步骤 1 中的品牌重点（例如“设计机构”、“摄影工作室”、“建筑公司”），将 [DISCIPLINE_SUBJECT] 替换为合适的主题（例如，设计：纸雕/字体特写；建筑：阴影几何；时尚：轮廓；摄影：静物）：
1. 主角（16:9 比例）： “[学科主题] 的电影级黑白照片，戏剧性的编辑构图，简洁的极简主义单色美学，柔和的顶部光线，充足的留白，高级杂志品质，无色彩，高对比度。”
2. 关于（4:3 比例）： “当代 [DISCIPLINE] 工作室内部的黑白纪实照片，大窗户透进柔和的日光，极简主义的桌子和工具，编辑报道风格，仅单色，高对比度。”
3. 项目_1（方面 1:1）： “品牌标识模型（名片、信笺、印刷文具）的黑白平铺图，置于干净的白色表面上，清晰的自上而下的编辑设计摄影，仅限单色。”
4. 项目_2（1:1 比例）：与[学科]相关的黑白极简主义静物画（例如电影场记板、比例模型、造型产品），电影摄影棚灯光，锐利的阴影，仅限单色。
5. 项目_3（方面 1:1）： “黑白编辑生活方式摄影，与[DISCIPLINE]相关的极简风格场景，高端杂志美学，仅限单色。”
6. 特色（16:9 比例）：“与[学科]相关的宽幅黑白抽象构图，戏剧性的视角，富有氛围的单色编辑，无色彩。”
拿到全部六个 URL 后，按槽位标记每个 URL，然后继续执行步骤 3。
步骤 3 — 构建网页。
调用 generateWebpage 函数时，请传递一个包含以下所有内容的详细指令提示——执行 generateWebpage 的代理必须严格按照该提示执行。
--- 网页提示符开始 ---
创建一个简洁的单色风格、可滚动浏览的长篇作品集网站。视觉效果必须严格遵循以下规则——不得偏离。
专属配色方案（独家——别处没有其他颜色）：
- 白色背景：#FFFFFF
- 黑色墨水和文字：#000000
- 一个深色区域可能使用接近黑色的颜色：#0A0A0A
- 对所有 应用 CSS `filter: grayscale(1) contrast(1.02)` 作为安全措施，以确保所有导入的资源都保持严格的单色。
字体排印：
- 显示：Google 字体“Fraunces”（使用字重 300 和 700，opsz 144）。强调的重点词语可使用斜体。
- 正文：Google 字体 'Inter'（字重 400、500）。正文宽度 16–18px，行高约 1.6。
- 标题字体很大：clamp(56px, 12vw, 180px)。在显示屏上跟踪 -0.02em。
- 导航、服务标签和页脚链接使用小型大写字母（`text-transform: uppercase; letter-spacing: 0.12em; font-size: 12px`）。
布局节奏：
- 部分垂直内边距：clamp(80px, 12vh, 200px)。
- 容器最大宽度：1280px，侧边槽夹紧（24px，6vw，96px）。
- 留白充足；不要过于拥挤。
相互作用：
- 顶部导航栏固定显示，滚动时背景略微模糊。
- 药丸按钮：1px 实线 #000，透明填充，边框半径：9999px，内边距 14px 28px。悬停时反转为背景色 #000 + 颜色 #FFF，缓动时间 200ms。
- 在每个主要块上实现微妙的滚动触发淡入效果 + 24px y 平移（交叉观察者）。
- 服务行：鼠标悬停滑动文本和箭头向右 ~12px，200ms 缓动。
响应式：
- 低于 768px：标题缩小到约 64–88px，双列网格折叠成单列，图像在其内边距内保持全出血。
各章节（按此顺序）：
1. 导航（固定）：左上角为小型大写字母的工作室名称；右上角为“与我们合作”按钮。
2. 主标题（全白）：分两行显示标题——第一行使用 Fraunces 斜体，第二行使用 Fraunces 常规字体——采用用户标语。字体较大。右下角可选择添加小型单色辅助图片（此处可使用主标题图片，或将其保留至下一部分）。底部有轻微的滚动提示。
3. 关于：标题为“关于[工作室]”，字体为700法文。六栏网格：左侧为正文（第1-3栏），右侧为4:3比例的图片（第4-6栏）。两个简短的段落。
4. 章节标题：'我们的工作'，法语 700，大写。
5. 案例研究 1：项目名称（Fraunces 字体），服务标签一行，采用小型大写字母（以中间点“·”或空格分隔）。名称下方：全宽项目图片（使用 project_1，1:1 比例裁剪为 16:9）。图片下方：两列网格——左列显示超大数字“01”（Fraunces 300，clamp(100px, 18vw, 220px)），小型大写字母标签“背景”，以及约 30 个单词的正文。右列相同，显示“02”和“解决方案”。
6. 案例研究 2：结构与 CS1 相同，但使用 project_2 图像。可以选择反转图像，使其位于带色调的灰白色带子上——颜色必须严格保持在调色板范围内。
7. 案例研究 3：结构相同，使用 project_3 图像。
8. 正片区域：全出血宽屏图像（使用 16:9 正片区域）。无文字叠加。
9. 我们的服务：标题“我们的服务”采用 700 号法文字体。下方是 6 个服务标签的垂直列表。每行：上方 1 像素细线分隔符 (#000)，左侧为服务名称（采用 36 像素、6 像素宽、80 像素宽的法文字体），右侧为“→”箭头。指针光标。鼠标悬停时向右滑动。
10. CTA：全出血深色区域，背景色为#000。标题为“Massive Fraunces”，居中对齐，颜色为#FFF，使用CTA结尾标语。内边距为clamp(120px, 20vh, 240px)。标题下方有“加入我们”按钮（白色边框，透明填充，鼠标悬停时反转为白色背景+黑色文字）。
11. 页脚：白色背景，小型大写字母。左侧为工作室名称，右侧为链接（“条款与支持”、“隐私政策”）。顶部极细边框（#000，1像素）。第二行显示极小的版权声明。
图片 — 将下方数据部分提供的 URL 插入到对应的插槽中。对每个 元素应用 object-fit: cover 和灰度安全滤镜。请勿添加额外的装饰性图片。
数据——请将以下内容替换到页面中：
- studio_name: <第一步中的工作室名称>
- 标语：<步骤 1 中的两行标语，用斜杠“/”分隔两行显示内容>
- about_copy: <关于步骤 1 中的段落>
- case_studies：包含三个元素的数组 { name, tags[], background, solution }，取自步骤 1
- services：步骤 1 中的六个服务标签字符串数组
- cta_tagline: <第一步中的结束 CTA>
- 图片：{ hero, about, project_1, project_2, project_3, feature } 来自步骤 2
- footer_links: ['条款与支持', '隐私政策']
--- 网页提示结束 ---
调用 generateWebpage 时，将 as_artifact 参数设置为 true。返回结果后，以用户首选语言提供一行摘要，并告知用户可以要求替换图片、更改文案或重命名项目。
描述
生成一个简洁的黑白编辑作品集网站。纯黑白配色，超大衬线字体标题，带编号的案例研究，以及大量的留白。如果没有提供图片，则自动生成六张风格统一的单色图片。
为什么我们推荐这个技能
这项技能可以创建高端的单色系网页作品集，非常适合设计工作室或代理机构。其编辑风格和极简主义风格展现出精致专业的审美。
发现下一个适合你的技能
继续探索更多精选 AI 技能，用于研究、创作和日常工作。