摄影作品集
指令
＃＃ 指示
### 核心任务
**背景：** 创作者（摄影师、插画师、设计师、艺术家等）需要一个专业的在线作品集来展示他们的作品，并吸引潜在客户或雇主。传统的作品集网站制作成本高昂、耗时费力，而且难以根据个人审美特点进行定制。本技能旨在快速生成一个兼具视觉美感和功能完整性的作品集网站。
具体目标：
- 创建一个完整的作品集网站，包含作品展示、类别筛选和作品详情。
视觉风格与创作者的审美定位和工作气质高度契合
- 流畅的交互体验，支持多种浏览方式（网格/瀑布流/轮播图等）
- 响应式设计，适配桌面和移动设备
- 可选：包含个人简介、联系方式和其他辅助模块
**主要限制条件：**
美学是核心竞争优势；必须避免千篇一律、平庸的设计。
作品展示方式应突出作品本身，避免过度设计而掩盖内容。
加载速度和浏览体验必须流畅。
**正式开始任务前，请先与用户确认他们是否已提供作品样本。只有在确认材料齐全后才能开始任务。**
### 第一步：了解创作者的定位和审美偏好
**目标：**深入了解创作者的风格定位、目标受众和审美倾向，为后续设计确立明确的方向。
操作：
- 分析用户提供的**"{作品样本}"**（图像/视频链接或文件），识别视觉风格特征（色调、构图、氛围、主题等）
- 仔细阅读用户提供的“审美偏好描述”，提取关键词：
- 整体氛围（例如，极简主义、复古、前卫、温暖、冷峻、艺术、商业等）
- 参考风格（例如，日式清新风、欧美时尚风、包豪斯风、野兽派风、赛博朋克风等）
- 颜色倾向（例如，黑/白/灰、莫兰迪色彩、高饱和度、渐变等）
- 布局偏好（例如，留白充足、密集拼贴、对称、不规则等）
- 如果用户提供**"{参考网站链接}"**，则访问并分析其设计语言、交互方式和布局特征。
- 全面评估目标受众类型（潜在客户、艺术机构、普通爱好者等），确定专业性和亲和力之间的平衡点。
**输出：**内部形成清晰的“美学概况”，其中包含 3-5 个核心设计关键词和具体的视觉方向描述。
**输出完成后，请与用户确认交付成果是否令人满意。如果不满意，请根据用户反馈进行调整，直到用户满意为止。**
### 第二步：规划作品集结构和互动方式
**目标：**根据工作量、类型和用户需求，设计最合适的信息架构和浏览体验。
操作：
- 统计作品数量，并根据**"{作品类别}"**（例如，肖像/风景/静物，或按项目/系列/年份等）规划分类系统。
- 确定首页布局方式：
- **网格布局：** 适用于尺寸统一、需要整齐有序的工作环境
- **砌筑布局（瀑布式）：** 适用于各种规模的工程，强调视觉上的丰富性
- **全屏轮播：** 适合作品数量较少但每件作品都需要沉浸式展示的情况。
- **混合布局：**结合多种布局方式，例如主图+下方网格。
- 设计类别筛选交互：
- 顶部/侧边栏导航，用于切换类别
标签云点击筛选
- 下拉菜单选择
- 计划工作详情页面显示方式：
- **模态叠加层** 显示，无需页面导航
- **独立的详情页面**，支持左右导航
- 请提供以下信息：作品名称、创作描述、技术参数（可选）、相关工作建议（可选）
- 确定辅助模块：
- **关于页面：** 创建者照片、个人陈述、经历
- **联系模块：** 电子邮件、社交媒体链接、合作咨询表单（可选）
**输出：**清晰的网站结构图（包括页面/模块列表）和交互流程描述
### 第三步：设计视觉系统（核心步骤）
**目标：** 根据美学理念，设计一套完整的视觉语言系统，确保网站的每个元素都服务于整体美学。
操作：
**色彩系统设计：**
- 根据**“{审美偏好}”**和工作色调，确定主色、强调色、背景色和文本颜色
- 如果作品本身色彩丰富，背景应使用中性色（白色/灰色/黑色）以突出作品。
如果作品是黑白或冷色调，可以考虑使用暖色调的背景色或点缀色来增加层次感。
- 提供具体的颜色代码（十六进制）和使用场景描述
**排版系统设计：**
- 选择与风格相符的字体组合：
- **标题字体：**可以更具特色，体现风格基调（例如，衬线字体表示优雅，无衬线字体表示现代，手写体表示温暖）
- **正文字体：**优先考虑可读性，通常选择简洁的无衬线字体。
- 请指定确切的字体名称（例如，Playfair Display、Helvetica Neue、Noto Serif SC 等）。
- 定义字体大小等级（例如，标题 32-48px，副标题 18-24px，正文 14-16px）
**版面布局与留白原则：**
- 根据审美偏好确定留白比例：
- **极简风格：** 大量留白，每屏显示作品数量较少（2-4幅）
- **丰富的风格：**紧凑的布局，每屏显示更多作品（6-12幅）
- 定义边距和间距的具体值（例如，页面边距 80px，工作间距 24px）
- 确定对齐方式（居中对齐、左对齐、不规则偏移等）
**视觉细节设计：**
工作卡片样式：圆角/锐角、阴影/无阴影、边框/无边框
- 悬停效果：缩放、叠加、信息弹出、颜色变化等。
- 过渡动画：淡入/淡出、滑动、缩放速度和缓动曲线
- 导航栏样式：固定/隐藏、透明/实心、下划线/块状高亮
**整体氛围营造：**
- **如果是艺术风格：**添加微妙的纹理、不规则的元素和创意字体
- **如果是商业风格：**保持克制、专业，强调工作质量和信息清晰度
- **如果是个人风格：** 添加手绘元素、独特图标和别具一格的互动彩蛋
质量标准：
- 色彩搭配和谐，主色不超过4种
字体组合不超过2-3种，层级结构清晰。
- 视觉元素风格统一，避免杂乱无章的感觉。
整体设计应有“令人印象深刻的亮点”，但不要过于抢眼。
**输出：**一份详细的“视觉设计规范文档”，其中包含颜色、字体、布局和细节的具体参数和使用说明。
### 第四步：整理工作内容和元数据
**目标：**将用户提供的作品样本整理成结构化数据，为网站生成准备内容。
操作：
- 提取/整理每件作品的以下信息：
- **作品文件：** 图片 URL 或视频链接（来自**"{作品示例}"**）
- **作品标题：** 如果提供，请使用“{作品标题列表}”；否则，请生成简洁的描述性标题。
- **工作类别：** 根据 **"{工作类别}"** 进行标记（支持多个标签）
- **工作描述（可选）：** 如有提供，请使用“{工作描述}”**；否则留空或生成简要描述。
- **创建时间/项目信息（可选）：** 如果用户提供，请添加
- 按类别或时间顺序排列作品，确定显示优先级（以便在首页突出显示）
- 如果工作量较大（>20 件），建议使用分页或延迟加载，以避免初始加载速度慢。
- 准备个人简介内容：
- 创作者姓名/艺名（来自**"{个人信息}"**）
- 个人陈述/创作理念（摘自**"{个人简介}"**，如未提供，建议用户补充）
- 联系方式（电子邮件、Instagram、Behance 等，来自**"{联系方式}"**）
**输出：**包含所有必需字段的结构化工作数据列表（JSON 或表格格式）。
---
###
### 第五步：生成作品集网站
**目标：**将视觉设计和内容数据转化为交互式网站。
操作：
- 编写详细的网站生成说明，包括：
- **整体结构：**页面布局（首页、关于我们、联系我们等）和导航方式
- **视觉系统：**完全参考步骤 3 设计的颜色、字体、布局和细节参数
- **交互逻辑：**
- 实现了类别筛选功能（点击标签即可筛选）
- 点击后的工作详情显示方式（模态或导航）
- 悬停效果和动画细节
- 响应式适配规则（移动设备如何调整布局）
- **内容填充：** 参考步骤 4 整理工作数据和个人信息
- **性能优化：** 图片懒加载、平滑滚动、加载动画等。
- 在说明书中明确规定审美要求，例如：
- “整体氛围应体现{美学关键词}，避免模板化设计”
“工作卡片悬停效果应该微妙而精致，不要过于夸张。”
- “颜色过渡应该自然，动画应该流畅（建议缓动时间300-500毫秒）”
- 调用 generateWebpage 工具，传递以下参数：
- **说明：**以上详细说明
- **参考资料：** 如果有参考工艺/材料 ID，请提供它们以提供上下文信息。
质量标准：
网站加载和交互正常
视觉呈现符合设计规范，无明显风格错误
工作显示完成，类别筛选功能正常
移动端适配性好
**输出：** 生成的作品集网站（在对话中自动显示）。
---
## 输出规格
**交付成果：**
1. **个人作品集网站（主要交付成果）：**
- 包括首页作品展示、类别筛选、作品详情、个人简介、联系方式及其他模块
视觉风格与用户审美偏好高度契合
- 流畅的交互体验，响应式设计
- 可直接分享的网页链接
2. **视觉设计说明（辅助说明）：**
- 设计思维简述：为什么选择这些颜色、字体和布局。
- 列出核心设计参数（颜色代码、字体名称、关键尺寸）
- 帮助用户理解设计逻辑或进行未来的调整
格式要求：
该网站是一个交互式 HTML 页面，会在对话中自动显示。
- 设计说明以简洁的文本形式呈现，可能包括关键参数列表
质量标准：
- **美学水平：**网站呈现专业、精致、令人印象深刻的视觉效果，避免了模板化和庸俗的感觉。
- **功能完整性：** 工作显示、类别筛选、详情查看等核心功能运行正常
- **用户体验：**加载流畅，交互自然，移动端适配性好
- **内容准确性：**所有作品和文本信息准确无误，无遗漏或错误。
---
## 风格与呈现（核心部分）
### 美学哲学
作品集网站设计必须遵循“作品为王，设计为辅助”的原则。所有设计元素（颜色、字体、布局、动画）都应服务于作品的展示，而非喧宾夺主。同时，设计本身也应具备足够的品味和细节，体现创作者的专业水准。
### 视觉设计要点
**色彩应用：**
背景颜色通常使用中性色（白色/浅灰色/深灰色/黑色），使作品色彩突出主角。
- 强调色（按钮、链接、高亮显示）应谨慎使用，并与工作色调协调一致。
避免使用过于鲜艳或冲突的颜色组合
- 可根据工作主色动态调整界面颜色（高级技术）
字体选择：
- 优先选择具有设计美感但又不至于过于花哨的字体。
- **英文字体推荐：** Playfair Display（优雅）、Montserrat（现代）、Lora（经典）、Raleway（简洁）
- **中文字体推荐：** Source Han Serif（优雅）、Source Han Sans（现代）、LXGW WenKai（温暖）、Zcool QingKe HuangYou（有力）
字体组合应具有对比性（例如衬线字体+无衬线字体，或粗体+细体），但字体种类不得超过3种。
布局美学：
- **极简风格：** 大量留白，每屏显示 2-4 幅作品，居中对齐，强调呼吸空间
- **杂志风格：**网格布局，统一的字号，整洁有序，强调专业性
- **艺术风格：**不规则的布局，作品尺寸各异，可以打破网格，强调创意。
- **沉浸式风格：**全屏轮播，一次展示一件作品，强调视觉冲击力。
无论风格如何，都要保持视觉平衡和节奏。
互动详情：
- **悬停效果应该微妙而精致：**
- 轻微图像缩放（比例：1.05）+ 半透明叠加层 + 标题淡入
或者：饱和度/亮度变化 + 边框高亮
- 避免使用过于夸张的动画效果（旋转、翻转、闪烁）
- 过渡动画持续时间建议为 300-500 毫秒，使用缓入缓出效果
滚动体验应流畅，可添加视差效果以增强景深。
加载动画应简洁优雅，避免使用花哨的加载图标。
响应式设计：
- **桌面端：**充分利用宽屏优势，支持多列网格或大图像显示
- **平板电脑：**调整至 2-3 列，保持视觉平衡
- **移动端：** 单列或双列，增加点击区域，简化导航
- 关键信息（标题、导航、联系方式）应在所有设备上清晰可见
### 常用风格参考
- **极简主义：**大量留白，黑/白/灰三色主色调，无衬线字体，简洁图标，去除所有装饰
- **日式清新：**柔和的色调（米白色、浅木色、朦胧的蓝色）、手写字体、温暖细腻的细节
- **时尚编辑风格：**高对比度、粗体字体、非对称布局、黑白摄影风格
- **复古风格：**做旧的纹理、温暖的黄色调、衬线字体、颗粒感、胶片质感
- **科技/未来主义：** 深色背景、荧光色点缀、几何图形、动态效果、赛博朋克元素
- **艺术画廊：**纯白色背景，超大留白，作品居中展示，极简导航，模拟实体画廊体验
### 需要避免的设计陷阱
- ❌ 过度使用渐变、阴影和特效，显得廉价。
- ❌ 字体过多或过于花哨，影响可读性
- ❌ 色彩冲突或过度饱和，导致视觉疲劳
- ❌ 布局拥挤，作品之间缺乏留白。
- ❌ 动画过于复杂或缓慢，影响体验
- ❌ 移动端适配性差，文字太小或按钮难以点击
- ❌ 过度设计，让设计喧宾夺主
描述
推荐自
nene@YouMind
为什么我们推荐这个技能
此技能可创建令人惊艳的个性化作品集网站，真正展示您的作品。它精心设计每一个视觉细节，确保您独特的美学风格毫无妥协地展现。
为您的摄影作品创建在线作品集。通过定制设计、完美布局和流畅交互展示您的艺术，确保您的作品优雅地闪耀。
摄影作品集
指令
＃＃ 指示
### 核心任务
**背景：** 创作者（摄影师、插画师、设计师、艺术家等）需要一个专业的在线作品集来展示他们的作品，并吸引潜在客户或雇主。传统的作品集网站制作成本高昂、耗时费力，而且难以根据个人审美特点进行定制。本技能旨在快速生成一个兼具视觉美感和功能完整性的作品集网站。
具体目标：
- 创建一个完整的作品集网站，包含作品展示、类别筛选和作品详情。
视觉风格与创作者的审美定位和工作气质高度契合
- 流畅的交互体验，支持多种浏览方式（网格/瀑布流/轮播图等）
- 响应式设计，适配桌面和移动设备
- 可选：包含个人简介、联系方式和其他辅助模块
**主要限制条件：**
美学是核心竞争优势；必须避免千篇一律、平庸的设计。
作品展示方式应突出作品本身，避免过度设计而掩盖内容。
加载速度和浏览体验必须流畅。
**正式开始任务前，请先与用户确认他们是否已提供作品样本。只有在确认材料齐全后才能开始任务。**
### 第一步：了解创作者的定位和审美偏好
**目标：**深入了解创作者的风格定位、目标受众和审美倾向，为后续设计确立明确的方向。
操作：
- 分析用户提供的**"{作品样本}"**（图像/视频链接或文件），识别视觉风格特征（色调、构图、氛围、主题等）
- 仔细阅读用户提供的“审美偏好描述”，提取关键词：
- 整体氛围（例如，极简主义、复古、前卫、温暖、冷峻、艺术、商业等）
- 参考风格（例如，日式清新风、欧美时尚风、包豪斯风、野兽派风、赛博朋克风等）
- 颜色倾向（例如，黑/白/灰、莫兰迪色彩、高饱和度、渐变等）
- 布局偏好（例如，留白充足、密集拼贴、对称、不规则等）
- 如果用户提供**"{参考网站链接}"**，则访问并分析其设计语言、交互方式和布局特征。
- 全面评估目标受众类型（潜在客户、艺术机构、普通爱好者等），确定专业性和亲和力之间的平衡点。
**输出：**内部形成清晰的“美学概况”，其中包含 3-5 个核心设计关键词和具体的视觉方向描述。
**输出完成后，请与用户确认交付成果是否令人满意。如果不满意，请根据用户反馈进行调整，直到用户满意为止。**
### 第二步：规划作品集结构和互动方式
**目标：**根据工作量、类型和用户需求，设计最合适的信息架构和浏览体验。
操作：
- 统计作品数量，并根据**"{作品类别}"**（例如，肖像/风景/静物，或按项目/系列/年份等）规划分类系统。
- 确定首页布局方式：
- **网格布局：** 适用于尺寸统一、需要整齐有序的工作环境
- **砌筑布局（瀑布式）：** 适用于各种规模的工程，强调视觉上的丰富性
- **全屏轮播：** 适合作品数量较少但每件作品都需要沉浸式展示的情况。
- **混合布局：**结合多种布局方式，例如主图+下方网格。
- 设计类别筛选交互：
- 顶部/侧边栏导航，用于切换类别
标签云点击筛选
- 下拉菜单选择
- 计划工作详情页面显示方式：
- **模态叠加层** 显示，无需页面导航
- **独立的详情页面**，支持左右导航
- 请提供以下信息：作品名称、创作描述、技术参数（可选）、相关工作建议（可选）
- 确定辅助模块：
- **关于页面：** 创建者照片、个人陈述、经历
- **联系模块：** 电子邮件、社交媒体链接、合作咨询表单（可选）
**输出：**清晰的网站结构图（包括页面/模块列表）和交互流程描述
### 第三步：设计视觉系统（核心步骤）
**目标：** 根据美学理念，设计一套完整的视觉语言系统，确保网站的每个元素都服务于整体美学。
操作：
**色彩系统设计：**
- 根据**“{审美偏好}”**和工作色调，确定主色、强调色、背景色和文本颜色
- 如果作品本身色彩丰富，背景应使用中性色（白色/灰色/黑色）以突出作品。
如果作品是黑白或冷色调，可以考虑使用暖色调的背景色或点缀色来增加层次感。
- 提供具体的颜色代码（十六进制）和使用场景描述
**排版系统设计：**
- 选择与风格相符的字体组合：
- **标题字体：**可以更具特色，体现风格基调（例如，衬线字体表示优雅，无衬线字体表示现代，手写体表示温暖）
- **正文字体：**优先考虑可读性，通常选择简洁的无衬线字体。
- 请指定确切的字体名称（例如，Playfair Display、Helvetica Neue、Noto Serif SC 等）。
- 定义字体大小等级（例如，标题 32-48px，副标题 18-24px，正文 14-16px）
**版面布局与留白原则：**
- 根据审美偏好确定留白比例：
- **极简风格：** 大量留白，每屏显示作品数量较少（2-4幅）
- **丰富的风格：**紧凑的布局，每屏显示更多作品（6-12幅）
- 定义边距和间距的具体值（例如，页面边距 80px，工作间距 24px）
- 确定对齐方式（居中对齐、左对齐、不规则偏移等）
**视觉细节设计：**
工作卡片样式：圆角/锐角、阴影/无阴影、边框/无边框
- 悬停效果：缩放、叠加、信息弹出、颜色变化等。
- 过渡动画：淡入/淡出、滑动、缩放速度和缓动曲线
- 导航栏样式：固定/隐藏、透明/实心、下划线/块状高亮
**整体氛围营造：**
- **如果是艺术风格：**添加微妙的纹理、不规则的元素和创意字体
- **如果是商业风格：**保持克制、专业，强调工作质量和信息清晰度
- **如果是个人风格：** 添加手绘元素、独特图标和别具一格的互动彩蛋
质量标准：
- 色彩搭配和谐，主色不超过4种
字体组合不超过2-3种，层级结构清晰。
- 视觉元素风格统一，避免杂乱无章的感觉。
整体设计应有“令人印象深刻的亮点”，但不要过于抢眼。
**输出：**一份详细的“视觉设计规范文档”，其中包含颜色、字体、布局和细节的具体参数和使用说明。
### 第四步：整理工作内容和元数据
**目标：**将用户提供的作品样本整理成结构化数据，为网站生成准备内容。
操作：
- 提取/整理每件作品的以下信息：
- **作品文件：** 图片 URL 或视频链接（来自**"{作品示例}"**）
- **作品标题：** 如果提供，请使用“{作品标题列表}”；否则，请生成简洁的描述性标题。
- **工作类别：** 根据 **"{工作类别}"** 进行标记（支持多个标签）
- **工作描述（可选）：** 如有提供，请使用“{工作描述}”**；否则留空或生成简要描述。
- **创建时间/项目信息（可选）：** 如果用户提供，请添加
- 按类别或时间顺序排列作品，确定显示优先级（以便在首页突出显示）
- 如果工作量较大（>20 件），建议使用分页或延迟加载，以避免初始加载速度慢。
- 准备个人简介内容：
- 创作者姓名/艺名（来自**"{个人信息}"**）
- 个人陈述/创作理念（摘自**"{个人简介}"**，如未提供，建议用户补充）
- 联系方式（电子邮件、Instagram、Behance 等，来自**"{联系方式}"**）
**输出：**包含所有必需字段的结构化工作数据列表（JSON 或表格格式）。
---
###
### 第五步：生成作品集网站
**目标：**将视觉设计和内容数据转化为交互式网站。
操作：
- 编写详细的网站生成说明，包括：
- **整体结构：**页面布局（首页、关于我们、联系我们等）和导航方式
- **视觉系统：**完全参考步骤 3 设计的颜色、字体、布局和细节参数
- **交互逻辑：**
- 实现了类别筛选功能（点击标签即可筛选）
- 点击后的工作详情显示方式（模态或导航）
- 悬停效果和动画细节
- 响应式适配规则（移动设备如何调整布局）
- **内容填充：** 参考步骤 4 整理工作数据和个人信息
- **性能优化：** 图片懒加载、平滑滚动、加载动画等。
- 在说明书中明确规定审美要求，例如：
- “整体氛围应体现{美学关键词}，避免模板化设计”
“工作卡片悬停效果应该微妙而精致，不要过于夸张。”
- “颜色过渡应该自然，动画应该流畅（建议缓动时间300-500毫秒）”
- 调用 generateWebpage 工具，传递以下参数：
- **说明：**以上详细说明
- **参考资料：** 如果有参考工艺/材料 ID，请提供它们以提供上下文信息。
质量标准：
网站加载和交互正常
视觉呈现符合设计规范，无明显风格错误
工作显示完成，类别筛选功能正常
移动端适配性好
**输出：** 生成的作品集网站（在对话中自动显示）。
---
## 输出规格
**交付成果：**
1. **个人作品集网站（主要交付成果）：**
- 包括首页作品展示、类别筛选、作品详情、个人简介、联系方式及其他模块
视觉风格与用户审美偏好高度契合
- 流畅的交互体验，响应式设计
- 可直接分享的网页链接
2. **视觉设计说明（辅助说明）：**
- 设计思维简述：为什么选择这些颜色、字体和布局。
- 列出核心设计参数（颜色代码、字体名称、关键尺寸）
- 帮助用户理解设计逻辑或进行未来的调整
格式要求：
该网站是一个交互式 HTML 页面，会在对话中自动显示。
- 设计说明以简洁的文本形式呈现，可能包括关键参数列表
质量标准：
- **美学水平：**网站呈现专业、精致、令人印象深刻的视觉效果，避免了模板化和庸俗的感觉。
- **功能完整性：** 工作显示、类别筛选、详情查看等核心功能运行正常
- **用户体验：**加载流畅，交互自然，移动端适配性好
- **内容准确性：**所有作品和文本信息准确无误，无遗漏或错误。
---
## 风格与呈现（核心部分）
### 美学哲学
作品集网站设计必须遵循“作品为王，设计为辅助”的原则。所有设计元素（颜色、字体、布局、动画）都应服务于作品的展示，而非喧宾夺主。同时，设计本身也应具备足够的品味和细节，体现创作者的专业水准。
### 视觉设计要点
**色彩应用：**
背景颜色通常使用中性色（白色/浅灰色/深灰色/黑色），使作品色彩突出主角。
- 强调色（按钮、链接、高亮显示）应谨慎使用，并与工作色调协调一致。
避免使用过于鲜艳或冲突的颜色组合
- 可根据工作主色动态调整界面颜色（高级技术）
字体选择：
- 优先选择具有设计美感但又不至于过于花哨的字体。
- **英文字体推荐：** Playfair Display（优雅）、Montserrat（现代）、Lora（经典）、Raleway（简洁）
- **中文字体推荐：** Source Han Serif（优雅）、Source Han Sans（现代）、LXGW WenKai（温暖）、Zcool QingKe HuangYou（有力）
字体组合应具有对比性（例如衬线字体+无衬线字体，或粗体+细体），但字体种类不得超过3种。
布局美学：
- **极简风格：** 大量留白，每屏显示 2-4 幅作品，居中对齐，强调呼吸空间
- **杂志风格：**网格布局，统一的字号，整洁有序，强调专业性
- **艺术风格：**不规则的布局，作品尺寸各异，可以打破网格，强调创意。
- **沉浸式风格：**全屏轮播，一次展示一件作品，强调视觉冲击力。
无论风格如何，都要保持视觉平衡和节奏。
互动详情：
- **悬停效果应该微妙而精致：**
- 轻微图像缩放（比例：1.05）+ 半透明叠加层 + 标题淡入
或者：饱和度/亮度变化 + 边框高亮
- 避免使用过于夸张的动画效果（旋转、翻转、闪烁）
- 过渡动画持续时间建议为 300-500 毫秒，使用缓入缓出效果
滚动体验应流畅，可添加视差效果以增强景深。
加载动画应简洁优雅，避免使用花哨的加载图标。
响应式设计：
- **桌面端：**充分利用宽屏优势，支持多列网格或大图像显示
- **平板电脑：**调整至 2-3 列，保持视觉平衡
- **移动端：** 单列或双列，增加点击区域，简化导航
- 关键信息（标题、导航、联系方式）应在所有设备上清晰可见
### 常用风格参考
- **极简主义：**大量留白，黑/白/灰三色主色调，无衬线字体，简洁图标，去除所有装饰
- **日式清新：**柔和的色调（米白色、浅木色、朦胧的蓝色）、手写字体、温暖细腻的细节
- **时尚编辑风格：**高对比度、粗体字体、非对称布局、黑白摄影风格
- **复古风格：**做旧的纹理、温暖的黄色调、衬线字体、颗粒感、胶片质感
- **科技/未来主义：** 深色背景、荧光色点缀、几何图形、动态效果、赛博朋克元素
- **艺术画廊：**纯白色背景，超大留白，作品居中展示，极简导航，模拟实体画廊体验
### 需要避免的设计陷阱
- ❌ 过度使用渐变、阴影和特效，显得廉价。
- ❌ 字体过多或过于花哨，影响可读性
- ❌ 色彩冲突或过度饱和，导致视觉疲劳
- ❌ 布局拥挤，作品之间缺乏留白。
- ❌ 动画过于复杂或缓慢，影响体验
- ❌ 移动端适配性差，文字太小或按钮难以点击
- ❌ 过度设计，让设计喧宾夺主
描述
推荐自
nene@YouMind
为什么我们推荐这个技能
此技能可创建令人惊艳的个性化作品集网站，真正展示您的作品。它精心设计每一个视觉细节，确保您独特的美学风格毫无妥协地展现。
为您的摄影作品创建在线作品集。通过定制设计、完美布局和流畅交互展示您的艺术，确保您的作品优雅地闪耀。
发现下一个适合你的技能
继续探索更多精选 AI 技能，用于研究、创作和日常工作。