← detail.back
通用 #简短 detail.difficulty_labelbeginner

创建图标

Create Icons

为跑步健身应用设计一个优质 iOS 应用图标,以抽象跑步者形象为特色,由充满活力的珊瑚色渐变到洋红色丝带构成,展现动感。

detail.target_platforms ChatGPTClaudeGemini
一个高级 iOS 应用图标,用于跑步和健身应用,图标中有一个风格化的抽象跑步者形象,由充满活力的珊瑚色渐变丝带过渡到鲜艳的洋红色构成,展现出运动中的姿态。该形象通过拖尾的运动元素暗示速度和向前的动量。背景是深海军蓝色,人物背后有微妙的径向渐变,颜色稍浅。整体感觉动态、充满活力、富有抱负。柔和的灯光,人物周围有微妙的光晕。圆角方形格式,1024x1024px。

请遵循以下规范和所附的示例图标设计:

这些规范定义了顶级 iOS/macOS 应用程序中高级、现代应用图标的视觉语言。目标是制作出精致、令人难忘、配得上旗舰产品的图标。

---

## 1. 画布与形状

### 基本形状
- **格式:** 带有连续圆角的正方形(iOS “圆角矩形”)
- **圆角半径:** 约为图标宽度的 22-24%(模仿 Apple 的超椭圆)
- **长宽比:** 1:1
- **推荐分辨率:** 1024×1024px(可清晰缩小)

### 安全区
- 将主要元素保持在画布中心 80% 的范围内
- 允许微妙的效果(光晕、阴影)接近边缘但不裁剪

---

## 2. 背景处理

### 纯色背景
- **深色/黑色:** 纯黑色 (#000000) 到深炭灰色 (#1C1C1E) — 营造戏剧感,使元素突出
- **鲜艳纯色:** 饱和的单色填充(电光蓝 #007AFF,暖橙色 #FF9500)
- **渐变背景:** 微妙的从上到下或径向渐变,增加深度

### 渐变类型(使用时)
| 类型 | 描述 | 示例 |
|------|-------------|---------|
| 线性 | 柔和过渡,通常顶部较亮 | 蓝色天空渐变 |
| 径向 | 中心发光效果,边缘较暗 | 聚光灯效果 |
| 角度 | 扫掠式颜色过渡 | 虹彩表面 |

### 纹理(微妙)
- 细微的垂直/水平线条,营造金属或织物感
- 1-3% 不透明度的噪点颗粒,增加有机温暖感
- 避免使用与主符号竞争的重纹理

---

## 3. 调色板

### 主要调色板特征
- **高饱和度:** 颜色鲜艳但不刺眼
- **浓郁深色:** 黑色和海军蓝色突出
- **选择性亮色:** 少量使用强调色以增强效果

### 推荐颜色系列

#### 冷色系
```
海军蓝/深蓝:    #0A1628, #1A2744, #2D4A7C
电光蓝:     #007AFF, #5AC8FA, #64D2FF
紫色/紫罗兰:     #5E5CE6, #BF5AF2, #AF52DE
青色/蓝绿色:         #30D5C8, #5AC8FA, #32ADE6
```

#### 暖色系
```
橙色:            #FF9500, #FF6B35, #FF3B30
粉色/珊瑚色:        #FF6B8A, #FF2D55, #FF375F
桃色/鲑鱼色:      #FFACA8, #FF8A80, #FFB199
```

#### 中性色
```
纯黑:        #000000
柔和黑:        #1C1C1E, #2C2C2E
白色:             #FFFFFF
米白:         #F5F5F7, #E5E5EA
```

### 颜色和谐规则
- 每个图标限制使用 2-3 种主导颜色
- 使用互补色或邻近色关系
- 一种颜色应占主导地位 (60%),次要颜色 (30%),强调色 (10%)

---

## 4. 光照与深度

### 光源
- **位置:** 左上角或正上方(一致的 45° 角)
- **质量:** 柔和、漫射 — 无刺眼阴影
- **效果:** 在上表面产生微妙高光,下方产生阴影

### 深度技术

#### 高光
- 3D 形体顶部边缘的柔和白色/浅色渐变
- 镜面反射作为小而亮的斑点(不压倒性)
- 面向光源的边缘的轮廓光

#### 阴影
- **投影:** 柔和、漫射,10-20% 不透明度,轻微 Y 轴偏移
- **内阴影:** 非常微妙,增加凹陷效果
- **接触阴影:** 物体正下方更暗、更紧密的阴影

#### 分层
- 元素应看起来浮在背景之上
- 使用大气透视(远处的元素略显模糊)
- 重叠的形状创造自然的层次结构

---

## 5. 符号与图示

### 风格方法

#### A. 立体/3D 对象
- 柔和、圆润的形体,具有清晰的体积感
- 微妙的渐变暗示曲率
- 示例:纸飞机、打开的书、球体

#### B. 平面带深度提示
- 简化形状,带有策略性的阴影/高光
- 干净的几何形状,带有轻微渐变
- 示例:火焰图标、指南针表盘

#### C. 抽象/几何
- 重叠的半透明形状
- 相互交织的形体,创造视觉趣味
- 示例:重叠的菱形、三角形构图

#### D. 玻璃拟态/半透明
- 磨砂玻璃效果,带有模糊
- 看起来具有透明度的形状
- 微妙的折射和颜色渗出

### 符号特征
- **简洁性:** 在 16×16px 下可识别
- **平衡:** 视觉重心居中或有意动态
- **原创性:** 避免通用剪贴画感
- **隐喻:** 符号清晰地与应用功能相关

### 推荐符号比例
- 主要符号:占图标画布的 50-70%
- 边缘留有呼吸空间
- 光学居中(可能与数学中心不同)

---

## 6. 材质与表面质量

### 哑光表面
- 柔和渐变,无锐利高光
- 可能有微妙纹理
- 颜色看起来坚实而沉稳

### 光泽/反射表面
- 明显的高光和反射
- 明暗区域对比度增加
- 暗示玻璃、塑料或抛光金属

### 金属表面
- 线性或径向渐变,模仿金属光泽
- 冷色调用于银/铬,暖色调用于金/青铜
- 可选细纹理线条

### 玻璃/半透明
- 降低不透明度 (60-85%)
- 背景元素模糊效果
- 带浅色边缘的彩色色调
- 微妙的内发光

### 纸张/织物
- 柔和、低饱和度颜色
- 非常微妙的纹理
- 柔和阴影暗示柔韧性

---

## 7. 效果与修饰

### 发光效果
- **外发光:** 亮元素周围的柔和光晕,5-15% 不透明度
- **内发光:** 微妙的边缘光照,营造体积感
- **彩色发光:** 与元素颜色匹配的着色发光(营造氛围)

### 反射
- 浮动物体下方微妙的地面反射(非常微弱)
- 光泽表面上的环境反射
- 镜面高光暗示光源

### 形状内渐变
- 多点渐变,用于复杂颜色过渡
- 径向渐变,用于球形外观
- 网格渐变,用于有机、流畅的着色

### 模糊与景深
- 分层构图的背景模糊
- 5-20px 的高斯模糊,用于大气效果
- 仅在暗示运动时使用运动模糊

---

## 8. 构图原则

### 视觉平衡
- **居中:** 符号位于光学中心(经典、稳定)
- **动态:** 轻微偏移创造能量和运动
- **不对称:** 有意的失衡,带有视觉配重

### 负空间
- 充足的留白/呼吸空间
- 背景是设计的一部分,而不仅仅是空白
- 负空间可以形成次要形状

### 焦点
- 一个清晰的对比度/细节最高的区域
- 眼睛应首先落在最重要的元素上
- 辅助元素在视觉上退居次要地位

### 比例对比
- 大小元素的混合创造趣味
- 主要符号占主导地位,细节微妙
- 避免用大小相同的元素堆砌

---

## 9. 风格变体

### 极简暗色
- 黑色或非常深的背景
- 单一亮色元素或单色符号
- 高对比度,戏剧感
- 示例:火焰图标、股票图表

### 鲜艳渐变
- 多色渐变背景
- 白色或浅色符号置于其上
- 充满活力、现代感
- 示例:Telegram、图书应用

### 柔和明亮
- 明亮、轻盈的背景(白色、柔和色)
- 彩色符号,带有柔和阴影
- 友好、亲切感
- 示例:Altitude 应用、手势图标

### 玻璃拟态
- 半透明、磨砂元素
- 具有不同不透明度的分层形状
- 现代、精致感
- 示例:快捷指令图标、重叠形状

### 3D 渲染
- 逼真的 3D 对象
- 复杂的光照和材质
- 高级、有形感
- 示例:球体、飞机、书