LOGO

子任务 2店铺标志制作与设计

主讲：唐晓双

LOGO

LOGO教学目标 制作店标。

内容：网页 LOGO 进的制作重点：路径工具组、钢笔工具组的使用难点：文件存储为 web 格式

LOGO店标的制作 纲要一、店标的设计原则与要求二、店标设计的基本流程三、制作动态店标四、发布店标

LOGO

店标是淘宝普通店铺的标志，一个个性小店，都应该拥有自己的店标，通过店标的设计可以使用户了解店铺的名称、商品特色等相关信息。

本节主要介绍店标的制作要求，以及不同类型店标的设计与制作方法。

LOGO

一、店标的设计原则与要求 店标是淘宝店铺的标志，在淘宝店铺中主要以两种形态表现：静态图像和动态图像。

由于淘宝规定店标的尺寸为 100×100 像素，仅支持 GIF 和 JPG ，因此店标图片大小建议限制在 80KB 以内。

LOGO 店标是普通店铺的“脸面”，能够代表店铺的基本形象，好的店标可以吸引更多客流，因此店标的设计是非常重要的。

LOGO

设计一个好的店标，首先必须了解店铺产品属于什么行业，根据产品所属行业，通过输入关键字在网站上找到相关的素材，然后从颜色、图案、字体、动画等方面着手，在符合店铺类型的基础上，使用醒目的颜色、独特的图案、精心设计的字体，以及强烈的动画效果都可以给人留下深刻的印象。

LOGO店标出现的位置1 、店标显示在普通店铺首页的左上角

LOGO店标出现的位置2 、店标显示在店铺列表左侧，这里的尺寸

为 80×80 像素，系统会自动将原图显示为适合的尺寸。

LOGO

首页

聊天窗口

LOGO

店标

设置您的店铺信息

LOGO 1 、静态店标 文字形式

3 、动态店标 2 、静态店标 图文形式

LOGO思考与设计

※ 请为窗帘店铺设计一个店标。（静态、动态两种） http://kgzy.taobao.com

参考资料：1. 店铺面向客户：中、低端客户2. 产品类型：简约风、西域风情、典雅型3. 店铺目标：以学校创业团体的形式，将店

铺做成一个品牌，将来有自己的设计部门，生产部门，成品展示厅，客服团队，品牌推广团队。

LOGO

由于尺寸的限制，所以店标画面元素必须简洁、突出重点，本节以制作静态店标为例讲解店标设计的基本流程。

二、店标设计的基本流程

LOGO

网络中有大量的图片素材，我们可以直接从网络上下载相关素材进行修改，从而制作出满意的店标。

LOGO

在百度中搜索下载相关的素材。

LOGO

由于网络上下载的图片尺寸是不固定的，而店标的尺寸限制为 100×100 像素，因此需要调整图片的尺寸。

可以使用的工具： PS ACDsee

LOGO

背景制作完成后，就需要添加一些文字信息，可以直接使用【横排文字工具】 进行文字输入，也可以制作一些文字图片，将其与背景合成。

使用工具： Photoshop

LOGO

LOGO

动态店标需要使用制作 GIF 动画的软件，这类软件有很多种， Ulead GIF Animator就是其中一款专业的 GIF 动画制作软件。

内建许多现成的特效可以立即套用，而且还能将动画 GIF 图片最佳化，能将放在网页上的动画 GIF 图片减肥，以便让人能够更快速地浏览网页。

三、制作动态店标

LOGO

1 、首先从网络中收集一些与店铺主题相关的素材，并保存到同一目录下

2 、使用 Photoshop软件将各个素材图片缩小到 100×100 像素，并分别进行保存

LOGO

1 、打开 Ulead GIF Animator 软件

2 、单击工具栏中的【新建】按钮 ，打开“新建”对话框，在对话框中“宽度”文本框和“高度”文本框中分别输入 100

3 、选择菜单【文件】 |【添加图像】命令，添加多张图片。导入到软件中。

LOGO 4 、在软件下方的帧面板的空白区域中单击鼠标右键，从弹出的菜单中选择【添加帧】命令

LOGO 5 、可以看到，在帧面板中添加了一个空白帧

LOGO 6 、在“对象管理器”面板中单击需要显示的图片缩略图后面的方框图标，其图标变为眼睛形态，表示显示该图层

LOGO 7 、同样的方法，添加第 3 帧的图片

LOGO 8 、单击“帧”面板中的图标，预览效果， 可以看到图片的变化效果，但默认的速度显然太快了，因此需要对其进行调整，选中第 1 帧， 单击鼠标右键，从弹出的菜单中选择【画面帧属性】命令

LOGO 9 、在打开的“画面帧属性”对话框中设置延迟为“ 200”

LOGO10 、单击【确定】按钮，使用相同方法， 修改其他两个帧的延时时间

LOGO 11 、选择【文件】 |【另存为】 |【 GIF 动画】命令，将文件保存为 GIF 动画文件

LOGO 12 、这样，一个简单的动态店标就制作完成了

LOGO

LOGO

设计好店标后，需要将店标上传到店铺中才能让买家看到

四、发布店标

LOGO 1 、登录淘宝店铺，单击“我是卖家”超链接

LOGO 2 、在左侧的“店铺管理”列表中单击“店铺基本设置”超链接

LOGO 3、 “ ” 进入店铺基本设置窗口，在 淘宝店铺中可以设置店铺名、店铺类别、主营项目、店

“ ”铺介绍等内容，在下面 店标 区域单击【更换店标】按钮

LOGO 4 、打开“更换店标”对话框，单击“浏览” 按钮，在打开的“ 选择要加载的文件”对话框中选中制好的店标图片

LOGO5 、单击【打开】按钮后图片路径显示在“更换店标”文本框中，此时单击【确定】按钮

LOGO 6 、返回“淘宝店铺”区域，店标图片已经显示出来

LOGO7、 “ ”单击 查看我的店铺 超链接，打开店铺的首页，店标已经显示在店铺左上角

LOGO

感谢您的关注