网店装修项目三 设计店标、店招和导航条(上)

店招的制作
店铺招牌是旺铺所有版本通用模块。

所不同的是：
扶植版、标准版店招店招的高度可以调整，区间：100-150(px)相素。

宽度是950(px)相素。

拓展版、旗舰版店招的高度可以调整，区间：0-200(px)相素。

（拓展版、旗舰版店招可删。

用自定义区代替。

）
店招是店铺第一屏内容，是买家进入店铺看到的第一个模块，是打造店铺品牌的最好阵地，也是让买家瞬间记住店铺的最好阵地。

现在店铺的店招一般都是走两个路线，但比较好的店招都是和促销区呼应的，特别是风格、颜色。

第一个，就是传统性的店招，通过掌柜的用心装修而强调品牌，如下：
第二个，就是非传统性的店招，完全和促销区或者左侧栏融为一体，如下：
如何添加店招呢？
操作步骤如下：
点击“我是卖家”---“店铺装修”
在弹出的窗口中可以更换现有背景图，也可以直接点击“在线编辑”：
点击“在线编辑”后会自动跳转到banner maker 页面，挑选自己心仪的店招然后点击“开始制作”：
点击”预览/保存“按钮后便可以输出修改好的店招最后点击”应用到店招“：
页面会跳转到店铺装修后台，点击”发布“即可！。

大家好，又见面了，前几天发表的精华帖“学会“舍得”你就是下一个皇冠卖家”得到的大家的认同，不少朋友叫我尽快制作店铺装修的帖子，从昨天晚上开始我就为发帖准备图片了，今天早上六点就起来写这个帖子了，希望大家看完之后可以把自己的店铺装修得更漂亮哦！下面进入正题！为了避免广告嫌疑，下面的例子不是截图我自己的店铺！淘宝现在对新手卖家推出了扶植版的旺铺，这个资源我们要好好利用哦，下面就来说说怎么从普通版改成免费的旺铺：如果您是新注册的淘宝卖家，那么新开的店铺应该是下面这个样子的：要改成旺铺很简单，首先点开旺旺里面选择店铺管理会出现下面的界面选择升级到旺铺这个时候就会出现下面的界面了（ps：因为晴的小店之前升级到旺铺过，所以店标还在）1：店招装修：ps：帖子发了之后有朋友反应自己的店里没有店招，截图是这样的其实这个自定义内容区就是店铺促销，点击编辑按钮就可以改了！首先要装修的就是上面的通栏部分（淘宝叫做”店招“），先点击店招的右上角的编辑按钮。

会出现如下界面：然后点击”在线编辑“按钮，会出现如下界面再点击”店招“出现如下界面在这个界面里面有搜索的功能，在搜索栏里面输入您经营的东西，比如晴经营的是女装，那么就输入女装这时候会出现很多免费的店招哦，各种各样漂亮的都有，下面我就拿第一个做例子来编辑下点击上面的”开始制作“按钮下面进入了编辑的页面经过观察您会发现，整个店招里面就有两处需要改动哦，就是”牛牛人气设计品牌“还有下面的网址部分需要改动需要改动的部分要选中，选中之后这几个字的周围就会出现上面显示的一七个小的蓝色圆圈，这个时候在右边的部分就可以编辑了然后输入您要更改的店，点击下面的”确认修改“按钮修改后的样子就是下面显示的样子了，剩下的店铺的连接的也是同样的方法修改的，这里就不介绍了，所有的都修改好之后，点击右上角的”预览/保存“按钮然后再点击”确认保存设计“然后点击”输出，获取设计“这样一个属于您的漂亮的店招就做好了最后点击”应用到店招“按钮，OK了！2.店铺促销部分装修：店铺促销部分一般是有代码完成的，现在网上的免费代码有很多，在装修之前晴儿就已经找好代码了（ps：由于个人喜好不同，可以到搜索引擎里搜索“淘宝促销免费代码”）不过现在我自己装修也不找了，淘宝就有好多好的装修模版，价格便宜，还好用，我目前用的这套就是淘宝买的（中国红，高仿拓展版全套装修模版）先点击店铺促?疑辖堑谋嗉磁ィ鱿窒旅娴慕缑?这里可以直接编辑，根据您自己的需求，也可以用代码，下面介绍怎么使用代码：首先要点击下面的这个小按钮点击之后在空白的地方粘贴代码，然后再重新点击这个按钮就会出现下面的代码的样式了，因为每个店铺的宝贝不同，所以下面的这个代码里面的图片和连接需要修改一下就好了，修改连接和图片的办法就是双击选中需要修改的图片出现一个图片设置的对话框在”图片地址“的部分输入您的宝贝图片的地址，连接部分输入您宝贝的连接，然后把图片大小修改成合适的大小（140*140）点击确认就OK了！然后保存！店铺促销就做好了！下面是效果图！3.掌柜推荐宝贝：同样的道理，掌柜推荐宝贝也是点击右上角的编辑按钮，出现如下界面只要点击宝贝右边的推荐按钮就可以推荐了推荐部分我要说一下，这个推荐一定要好好利用，推荐宝贝应该选择快要结束的宝贝推荐，因为快要结束的宝贝在搜索的时候都是排名都是靠前的，再加上掌柜推荐排名就会更靠前了，这样别人搜到您的宝贝的机会就会增加哦。

教学课题任务一活动1 确认风格课题类型理论课时安排1上课时间教学目标1. 理解网店店标的作用2.了解淘宝网店店标的规格3.了解淘宝网店店标的种类技能目标4. 能根据需要制作网店店标教学重点2、3教学难点4辅助资源课件、多媒体、网络、实训室复习引入1.网络搜索店标，欣赏店标2.店标包括哪几种？教学手段教学过程师生互动活动设计课件讨论实作1．了解店标的分类（1）店标的分类：从表现形式分为以下几类：(1)中文或英文店标，如教材图3.1.3所示。

(2)中英文混合店标，如教材图3.1.4所示。

(3)图形店标，如教材图3.1.5所示。

搜索：网络搜索店标。

提问或讨论：店标可以分为哪几类？课件举例讨论(4)图形加文字店标，如教材图3.1.6所示。

2．了解颜色搭配以及颜色表达的情感（1）颜色的表达：通常而言，不同的颜色对应不同的心理感受，而且每种色彩在饱和度、透明度上略微变化就会产生不同的感觉。

（2）颜色说明颜色表达的情感红色喜庆的色彩，具有刺激效果，容易使人产生冲动，是一种雄壮的精神体现，能表现出愤怒、热情、活力的感觉。

橙色一种激奋的色彩，具有轻快、欢欣、热烈、温馨、时尚的效果。

黄色亮度最高，有温暖感，具有快乐、希望、智慧和轻快的个性，给人感觉灿烂辉煌。

绿色介于冷暖色中间，显得和睦、宁静、健康、安全。

和金黄、淡白搭配，产生优雅、舒适的气氛。

蓝色永恒、博大，最显凉爽、清新、专业的色彩。

和白色混合，能体现柔顺、淡雅、浪漫的气氛，给人感觉平静、理智。

紫色女孩子最喜欢这种色，给人神秘、压迫的感觉。

黑色具有深沉、神秘、寂静、悲哀、压抑的感受。

白色具有洁白、明快、纯真、清洁的感受灰色具有中庸、平凡、温和、谦让、中立和高雅的感觉。

思考：英文与中文店标各有什么好处。

搜索：颜色对视觉造成的影响。

讨论：颜色的搭配对店标的影响。

作业布置作业：确定店铺店标，并简要描述店标。

教学后记教学课题任务一活动2 搜集素材课题类型理论+实作课时安排2上课时间教学目标1.掌握如何利用网络搜索素材2.了解素材的使用3.具有初步的素材归类技能教学重点1教学难点1辅助资源课件、多媒体、网络、实训室复习引入①检查作业：确定店铺店标，并简要描述店标②你认为完成一个店标需要哪些材料？教学手段教学过程师生互动活动设计课件互动讨论实作确定店标的组成复习上节课内容，引入本节课内容。

《网店设计与装修》课程标准学时数：32学时 ___________________课程性质：专业选修课 ________适用专业：电子商务专业 ______一、本课程的性质、地位、作用以及与其它相关课程内容的联系本课程是电子商务专业的一门主干专业技能课程。

通过本课程的学习，要求学生掌握网店装修的基本概念，学会使用常用的PhotoShop和dreamweaver来实现各种功能和表现，解决在网店美工中装修网店时遇到的各种专修效果问题，能够设计装修出常见的各种店铺风格的店铺首页以商品详情页，具备表达恰当、美观大气并能够体现商品的网店装修和美工的能力。

同时通过本课程的学习，培养学生成为技能全面，实战能力超强的“能手”型人才。

二、本课程的教学目标1.知识教学目标1）认识电商、认识美工重要性2）了解美术基础及强化素描、色彩、手绘等；3）熟练操作PhotOShop、Dreamweaver；4）初步理解专业图像处理、图片的修复与合；5）初步认识店招设计；6）初步认识海报设计；7）深入理解详情页制作；8）深入理解店铺装修的构思的作用；9）深入理解美工实践课店铺装；10）深入理解认识专业美工。

2.能力教学目标1）会使用PhOtoShop、DreamWeaVer网页设计工具制作网页；2）掌握网页与平面构成、色彩、版面设计的关系；3）熟练掌握颜色值的配置和背景图案的设置方法，熟练掌握字符、链接颜色的设置方法；4）熟练掌握掌握重复、渐变、发射的构成练习；5）掌握特异、肌理、图与底、对比、韵律等平面使用方法；6）掌握使用滤镜对现成的图像进行处理；7）掌握熟练掌握图窠填充的技巧；8）掌握相关工具和技巧的混合运用，绘制出各种图案效果；9）熟练掌握PhotOShop、Dreamweaver设计网页版面与制作的方法和技巧,使学生能够运用美术思想来设计制作具有观赏性的网页页面；10）掌握Photoshop图案填充作品不仅局限于对象的简单叠加，而且具有五彩缤纷的渲染效果表格的使用方法，会用表格布局并设计网页。

《网店装修》课程标准课程类别：专业拓展课适用专业：平面设计专业总学时：64理论学时：18实践学时：46一、课程概述（一）课程性质《网店装修》是我中等职业教育电子商务专业的一门核心课程，主要介绍了网店美工设计及装修的基本理论、基础知识和基本技能。

（二）课程设计思路本课程以网店装修的工作过程为导向，以项目任务式为编写结构，突出教师的主导作用和学生的主体地位以教师的引导和学生的感知体验和实践操作为主，注重培养学生对专业的兴趣和爱好,提高学生的专业技能操作能力和设计创新能力，拉近学生和现实网店装修的距离。

二、课程任务与教学目标（一）课程任务本课程的主要任务是通过学习网店装修的基础知识和技能应用以网店装修的工作岗位为依据，体现理论与实践相结合，使学生对网店装修的基本知识和技能有一个较为全面的掌握，为今后的网店装修工作打下扎实的基础。

(1)知识目标明确定位店铺风格，掌握店铺配色、字体规范掌握商品主图的主题、背景、配色字体、版面布局设计。

学习优秀海报的设计方法，学习店铺首页布局内容，分析展示案例，掌握店铺首页包含的模块。

1.构思大体框架2.在纸上画出草图3.整理出电子文档4.修改框架并定稿。

学习店标的定义及作用，店招的定义及作用、大小、分类、注意事项。

学习网店详情页的尺寸、内容模块。

1.进行买家定位2.产品形象3.进行同行调查4,撰写详情页策划方案。

掌握活动专题页装修的基础理论知识和创作方法。

掌握手机店铺首页设计的基础理论知识和创作方法。

了解手机店铺宝贝详情页设计的基础理论知识和创作方法。

(2)能力目标培养和提高各方面综合素质，增强观察力、表现力和审美能力。

在学习过程中注意理论联系实际,注重实际技能的培养。

掌握商品主图设计的制作流程,完成伊米生活馆主图设计。

掌握海报的选材、排版、字体和配色选择，并最终完成海报的制作。

掌握商品分类导航设计、热销商品陈列区设计，完成伊米生活馆的首页装修。

掌握详情页切图了解活动专题页设计流程并完成活动专题页装修。

二、网店的LOGO设计要点3连连看——LOGO 设计方法4、任务实施任务2：LOGO 设计制作一—乐乐包袋(1) 设计尺寸：淘宝官方的建议尺寸为80PX*80PX 或100PX*100PX (正方形)，大小V80KB,格式:jpg、gif、pngo(2) Log。

的设计技巧(3) logo设计中的色彩运用技巧三、常见设计思路(1) 以对象全名进行字体设计。

(2) 以对象名称字首为主的创意设计。

(3) 以对象性质进行象征设计(4) 抽象符号。

(5) 以历史、典故、社会特性、地域性特征等进行创意设计任务一、根据LOGO设计方法选择恰当的LOGO案例，进行连线。

乐乐效果图任务二、乐乐包袋LOGO设计制作。

微课视频：观看“乐乐包袋LOGO设计制作”视频，完成LOGO设计制作设计思路：以对象性质进行象征设计。

通过适合公司的性质、经【师】1. 讲解LOGO的设计尺寸要求，提炼设计的技巧要点和色彩运用技巧。

2. 通过案例分析，展示5个LOGO常见的设计创作思路。

引出要进行的实训任务。

【生】1. 学习优秀LOGO设计，掌握5个常见的LOGO设计创作思路。

2. 认真聆听老师对于相关知识的巩固讲解【师】1. 设置i博导平台“连连看”拖拽题目，引导学生完成任务一。

2. 实训完成后，老师进行题目讲解。

【生】1. 学生登录i博导平台，完成任务2. 查看答案，分析答案。

【师】1. 布置实训任务二。

2. 根据学生的学习情况，实时的点拨、引导启发学生遇到的因难问题。

注意尽量让学生独立自主的完成学习任务。

3. 实训完成后，老师结合操作过程中的问题进行总结和知识点讲解。

通过优秀案例分析，了解LOGO设计的方法，归纳总结了解logo设计的要点，解决教学的重点。

(10分钟)通过连连看的题日，强化学生对LOGO设计常见方法的理解和运用，吸引学生学习的兴趣。

信息化的手段可以辅助教师及时掌握学生对重难点掌握程度，突破重点。

(5分钟)I.店铺Logo是结合内容做创意，内容是基础，创意作为加分项。