淘宝店铺首页设计

合集下载
  1. 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。

五、淘宝店铺页尾设计技法
页尾设计三:返回首页、购物流程。什么叫 用户体验?这就是了!不是每一个用户都 了解网购流程,这么贴心的指引哪里能找 到。
五、淘宝店铺页尾设计技法
页尾设计四:友情链接。这个很好理解,什 么合作店铺,姐妹店铺,同盟之类的。
五、淘宝店铺页尾设计技法
页尾设计五:关于我们。讲解店铺的文化、 特色、内涵等;店铺加入哪些保障服务等 。
1. 海报要与大色调统一
• 在设计海报时,先观察大环境,海报设计尽量避 免与主色调产生强烈对比,必须要用对比色设计 海报时,要考虑降低纯度或明度
四、淘宝店铺首页海报设计技法
(一)海报设计思路:
2. 观察产品亮点定背景色
• 背景选择上不能单纯当海报设计,为了做出一张 比较漂亮的图片,最好要做到背景与产品的呼应 在海报设计中,大体分为两种风格:
四、淘宝店铺首页海报设计技法
1. 左文右图: 字体上粗 下细、上 大下小, 上下主次 分明,形 成对比。 文案四四 方方架构 非常稳重, 非常平衡。
四、淘宝店铺首页海报设计技法
2. 左图右文: 字体上粗 下细、上 大下小, 下面的价 格打折部 分排版很 稳重丶结 实。
四、淘宝店铺首页海报设计技法
3. 两边图中 间文字: 一般利用 近景、远 景的照片 产生对比 和呼应 (多见模 特海报)。
四、淘宝店铺首页海报设计技法
4. 背景为风 景图:利 用半透明 的底框, 然后再在 里面排文 案,避免 文字模糊 与混乱。
四、淘宝店铺首页海报设计技法
5. 展示多种产 品:当海报 上要放置过 多的促销产 品,可以采 用这种版式。 产品平行排 版,中间利 用半透明的 框展现文案。
三、淘宝店铺店招设计技法
(二)店招设计原则: – 要直观明确的告诉客户自己店铺是卖什么的, 表现形式最好是实物照片 – 要直观明确的告诉客户自己店铺的卖点(特点、 优势、差异化)。
三、淘宝店铺店招设计技法
(三)店招设计要点:
– 店铺名字
• 告诉客户自己是卖什么的,品牌店铺可以标榜自己 的品牌
– 实物照片
• 直观形象的告诉客户自己店铺是卖什么的
Байду номын сангаас
– 产品特点
• 直接阐述自己店铺的产品特点,第一时间打动客户, 吸引客户
– 店铺(产品)优势和差异化
• 告诉我的店铺和产品的优势以及和其他的店铺的不 同,形成差异化竞争
三、淘宝店铺店招设计技法
(四)店招制作规范、流程:
1. 确定风格:视产品而定 2. 布局:店招尺寸、店招构成、区块划分

• •
官方季节性活动:

店铺常规活动:换季、节日


符合当下季节或者节日、特殊日子的相关题材
周年店庆、清仓甩卖
店铺常规活动:
四、淘宝店铺首页海报设计技法
(二)常见海报主题方案
2. 单品推广
• 单品聚划算、爆款
– 适合店铺中推成爆款或者想要提高某款产品的转化率 适用于新品上市,并且打算全力推广的产品

新品上市、特价促销

四、淘宝店铺首页海报设计技法
(二)常见海报主题方案
3. 品牌宣传
• 品牌宣传适用达到一定认知度的品牌以及在行业 中有一定的知名度。
四、淘宝店铺首页海报设计技法
(三)海报设计原则: “3”原则
– 3元素:
• • • 背景 文案:名称、卖点、价格、其他 产品信息
– 3段文字:主标题、副标题、附加内容 – 3种字体:不能超过3种字体
四、淘宝店铺首页海报设计技法
6. 斜切式构图: 斜切式构图 会让画面显 得时尚,动 感活跃。但 是画面平衡 感不是很好 控制。一般 文案倾斜角 度不超过30°, 文字往右上 方倾斜便于 阅读 。
五、淘宝店铺页尾设计技法
五、淘宝店铺页尾设计技法
• 页尾的用处:让店铺页面的结构更加完整,页
尾模块相对页头会少,因此利用好页尾能为店铺 起到良好的分流作用,而且页头和页尾属于共同 展示页面,无论打开哪个详情页都会显示。
4. 合理板式突出主题
• 产品图片展示与摄影图片展示不同。摄影作品突 出原生态,添加文字是为了更好的突出画面。设 计作品是画面烘托文案主题的,应将主题文案放 在首位重点突出
模块式编排
四、淘宝店铺首页海报设计技法
(二)常见海报主题方案
1. 店铺活动:促销活动
• 品牌团:
– 官方活动聚划算,可提高品牌的曝光度 双十一/双十二活动/年中大促
• • • • 左边或者中间放LOGO,LOGO之下放品牌词或广告词 中间留空或放品牌的相关文字,或放其它 右边放收藏店铺等相关内容 之下是导航:首页,所有宝贝等
3. 配色方案:
• • • • LOGO提取颜色 产品本身提取颜色 产品联想属性提取颜色 颜色不超过3种
三、淘宝店铺店招设计技法
(四)店招制作规范、流程:
• 店铺页头
– 页头店招放什么内容,页头导航总共需要几个导航分类内容,是 否需要放品牌文案,是否需要着重表现收藏店铺,是否需要放活 动内容等等。
二、淘宝店铺首页设计思路
• 活动促销:
– 活动主题什么,内容是什么,文案的主次顺序,是否有需要重点 展示的产品等等。
二、淘宝店铺首页设计思路
• 产品分类:
– 将拍摄的图直接用作背景,板式排列活动文案 – 将产品提取出来,背景根据产品灵活变动,再配合板式

四、淘宝店铺首页海报设计技法
(一)海报设计思路:
3. 文案策划排版式
• 要明确自己的海报是给中国人看的,过度使用英 文是不合适的,可将英文作为中文的辅助元素
四、淘宝店铺首页海报设计技法
(一)海报设计思路:
淘宝店铺首页设计
讲师:寇老师
认 识 淘 宝 店 铺 首 页
一、淘宝店铺首页构成元素
• 店铺页头(页头区) :
– 店招、导航
• 活动促销(内容区) :
– 全屏海报、全屏轮播、优惠券
• 店铺产品(内容区) :
– 产品分类、主推产品
• 店铺页尾(页尾区) :
– 客服中心、购物保障、发货须知等
二、淘宝店铺首页设计思路
8. 上传图片至淘宝图片空间 9. DW添加图片超链接 10. 上传网页文件 11. 发布
四、淘宝店铺首页海报设计技法
这是1920PX*500PX的全屏海报
这是1920PX*600PX的全屏海报
四、淘宝店铺首页海报设计技法
这是950PX*400PX的普通海报
四、淘宝店铺首页海报设计技法
(一)海报设计思路:
三、淘宝店铺店招设计技法
(一)店招设计思路:
– 以品牌宣传为主的类型:一般有着雄厚的实力, 给力的产品,想要打造自己的品牌。
• 名称、LOGO、关注、收藏等
– 以活动促销为主的店铺:薄利多销,店招风格 视活动主题来定,营造出一个活动氛围。店招 上适当的加入一些红包或者优惠券领取的按钮。 – 以产品推广为主的店铺:增加店铺主推产品的 销量,通常在店招上放上两三款推广的产品。
– 店铺产品总共有几大分类,页面从上至下的摆放顺序是什么样的, 每个分类模块里面放几个产品,产品是否需要主次区分,是用方 格矩阵还是更灵活的展示方式,单个产品是否需要突出展示价格 或折扣等等。
二、淘宝店铺首页设计思路
• 主推产品:
– 主推产品有哪些,它们有怎样的区别和定位,它们的推介顺序是 什么样的,它们的核心卖点是什么,是否需要突出价格和折扣等 等。
4. 规范字体:
• • • 一般不超过3种字体 重点部分加粗突出 字体大小使用得体
5. PS排版:
• 越是简约大气的页面,元素务必不要太多,清爽 舒适的页面多留白
6. 修改定稿:
三、淘宝店铺店招设计技法
(四)店招制作规范、流程:
7. 图片切割优化:
• • Photoshop切片 Dreamweaver热区切割优化
二、淘宝店铺首页设计思路
• 店铺页尾:
– 页尾模块一定要符合店铺风格和主题,色彩要一致;内容上可添 加消保、7天无理由退换货等保障服务、客服联系方式、商品购物 流程等。
三、淘宝店铺店招设计技法
天猫店招990PX*120PX(不含导航)
天猫店招990PX*150PX(含导航)
淘宝店招950PX*150PX(含导航)
五、淘宝店铺页尾设计技法
页尾设计一:客服联系方式。客服联系方式 很多店铺会设置在左右两边,而设置到页 尾的目的就是页头和页尾属于共同页面, 增加展示机会,方便顾客咨询。
五、淘宝店铺页尾设计技法
页尾设计二:购物保障以及发货须知。目的 让顾客对店铺增加信任,而且发货须知是 一定的,淘宝店铺发货时间由店长定的, 因此统一的发货时间让店长节省更多时间 。


主标题可用粗大字体,副标题略小
70%主色,25%辅助色, 5%点缀色
– 3三种颜色:
– 30%以上留白:高端、大气、上档次多留白 – 0.3秒读完:
四、淘宝店铺首页海报设计技法
(四)海报常见构图板式:
1. 2. 3. 4. 5. 6. 7. 左文右图: 左图右文: 上文下图或上图下文: 多栏分布:常见两边图中间文字 背景为风景图: 展示多种产品: 斜切式构图:
相关文档
最新文档