- 主图1: 正面图放大,周围留白统一 - 主图2: 改为竖向排列,标题改为可选CPU和可选内存硬盘 - 主图3: 大图周围留白减少,右侧卖点填充满 - 主图4: 竖向排列,修改文案(包邮、详细教程、标配等) - 主图5: 调整底部间距,避免重叠
50 lines
753 B
Markdown
50 lines
753 B
Markdown
---
|
||
name: product-main-image
|
||
description: 设计电商产品的主图。当用户需要为产品生成主图图片或海报时使用此技能。
|
||
---
|
||
|
||
# 商品主图设计
|
||
|
||
## 概述
|
||
|
||
-为每个产品生成主图图片
|
||
-主图图片放到每个产品对应的`主图`目录下
|
||
## 使用场景
|
||
|
||
- 有产品主图需要更新
|
||
|
||
## 工作流程
|
||
|
||
### 步骤 1: 准备素材
|
||
- 根据产品详情页,归纳出主图要展示的信息
|
||
|
||
- 可以使用产品目录下`image`目录中的图片作为素材
|
||
|
||
|
||
|
||
### 步骤 2: 设计主图html
|
||
- 主图尺寸:800*800
|
||
- 一个主图一个html
|
||
|
||
|
||
### 步骤 3: 导出图片
|
||
|
||
使用 `image-tools` 技能的 `convert-html-to-png.js` 脚本:
|
||
|
||
## 主图规范
|
||
|
||
|
||
|
||
## 配色参考
|
||
|
||
|
||
|
||
## 字体规范
|
||
|
||
|
||
|
||
## 示例模板
|
||
|
||
|
||
|