下载文档原格式
1、目前公司淘宝首页的布局方式（从上至下）1）店铺标志2）店铺招牌3）宝贝分类以及关于我们4）全屏海报5）营销重点（分三块）6）店铺公告和商品分类7）活动预告及活动促销图片8）畅销关键字9）客服服务10）分享有礼11）立体轮播12）分类橱窗13）宣传图片（5张）14）宝贝展台15）多屏展示16）放大镜17）相册功能18）热点大图19）新品展示20）店长推荐21）宣传图片（5张）22）掌柜推荐23）店铺交流区（通过审核的买家留言）24）宝贝排行榜2、模板备用的一些模块上述模块都可以反复调用，另外还有背景音乐、图片轮播、宝贝推广模块等模块可以添加。
3、公司淘宝首页要实现的功能从不同的家居公司装修风格来看，90%以上的店家都把精美的商品图片大批量的摆在首页，文字性的叙述很少甚至没有。
综合不同店家的装修风格以及公司需要，列出以下几点淘宝首页需要实现的功能：1）商品要让买家看到（商品要醒目）；2）优惠要让买家看到（促销活动要醒目，让买家感到实惠）；3）品质要让买家看到（宣传图片一定要精美，突出拥有爱丽屋的时尚生活）；4）服务要让买家看到（客服的联系方式要让买家较容易找到）参考资料（店家地址）：/?spm=a220o.1000855.3.3.779512（主页摆了31个商品，11.5个页面长度）/?spm=a220o.1000855.3.1.a7a9ad（主页摆了65个商品，22.5个页面长度）/shop/view_shop.htm?spm=a220o.1000855.7240061.1.88eaba（主页摆了93个商品，22个页面长度，不过主页显得比较拥挤，不建议采纳这样的风格）/?spm=a220o.1000855.3.2.7ebc44（主页摆了36个商品，9个页面长度）/shop/view_shop.htm?spm=a1z10.1.7453514.1.19c02d（主页摆了24个商品，8个页面长度）根据上述淘宝店家的布局方式，一个页面3个商品对买家来说是比较好的浏览方式，大部分店家也遵循这个原则。
淘宝页面装修教程淘宝页面装修教程不要标题为了使淘宝页面更具个性化和吸引力，您可以使用以下装修技巧。
1. 使用图片和商品展示：在页面中添加高质量的产品图片，并确保它们清晰可见。
您还可以展示产品的不同颜色和规格。
2. 制作个性化的广告横幅：使用Photoshop或其他图像编辑软件设计一个独特的广告横幅，用于突出您的品牌和特色产品。
3. 设计独特的商品分类：为了方便顾客查找所需的产品，您可以设计独特的商品分类。
使用图标和文字组合来突出不同的分类。
4. 添加店铺动态：对于有活动和促销的店铺，您可以通过添加店铺动态来吸引顾客的注意。
例如，在首页上展示最新的促销活动或限时折扣。
5. 突出店铺特色：如果您的店铺有某些特色产品或独特的卖点，确保在页面中突出展示。
使用图标或特殊的字体来增加突出效果。
6. 设计友好的购物车页面：确保购物车页面简洁明了，让顾客可以清楚地看到他们选择的商品和总金额。
添加清晰的结算按钮，方便顾客进行下一步操作。
7. 页面配色和背景：选择适合您店铺风格的配色方案，并确保背景不会干扰顾客浏览商品。
避免使用过于花哨或闪耀的背景。
8. 使用大字体和清晰的字形：确保页面上的文字清晰易读，使用大字体突出重要信息。
选择易于阅读的字形，例如Arial或微软雅黑。
9. 良好的页面布局：确保页面布局整齐有序，不会让顾客感到混乱。
将不同区块分开，并留出足够的空白空间，让顾客能够轻松浏览页面。
10. 提供详细的商品描述和规格：在商品详情页提供清晰详细的描述和规格，帮助顾客更好地了解商品。
确保描述内容准确、简洁并且易于理解。
希望以上信息对您有所帮助，祝您成功装修您的淘宝页面！。
电子商务创业实训教案第17讲装饰店铺
首页
一、背景介绍
本次课程旨在指导学生如何设计美观、引人注目的店铺首页，以吸引潜在客户的注意力，促进销售。
二、研究目标
- 了解店铺首页的重要性和作用
- 掌握设计店铺首页的基本原则
- 学会使用电商平台提供的模板和工具装饰店铺首页
三、教学内容
1. 店铺首页的定义和作用
- 店铺首页是展示店铺形象和商品信息的重要页面，也是吸引访客的第一印象。
- 通过店铺首页，我们可以让潜在客户更好地了解我们的品牌和产品，增加他们的购买欲望。
2. 设计店铺首页的基本原则
- 简洁明了：主题鲜明，层次分明，一目了然。
- 突出重点：将重要信息放在页面突出位置，增强其可见性。
- 体现特色：突出店铺的特色和个性，以吸引目标客户。
- 呼应品牌：店铺首页的设计应与品牌形象相一致，增强品牌感知度。
3. 使用电商平台提供的模板和工具装饰店铺首页
- 许多电商平台都提供了丰富的页面模板和图形工具，学生可以选择其中的模板和工具自行进行设计。
- 此外，学生可以通过研究竞争对手的店铺首页，了解他们的设计风格和特点，从而进行完善和提升。
四、教学方法
课前讲解理论知识，结合实际案例分析；课堂中使用电商平台的模板和工具，让学生亲自体验设计过程，课后可以交流和分享设计成果。
五、教学评估
学生可以根据所设计的店铺首页，结合课程要求和教学目标进行自我评估，同时可以分享给同学和老师进行点评和建议。
六、延伸阅读
- 《电子商务设计艺术》
- 《电子商务网站设计与制作》
- 《网页设计与制作从入门到精通》。
首页版面构思
首页版面构思：
1. 页面顶部：一个简洁明了的网站标志，浅色调的背景，加上简单的欢迎语。
2. 导航栏：在视觉上进行分隔，只包含主要内容页面链接，如首页、关于我们、产品、新闻、联系我们等。
3. 幻灯片/横幅：在首页上方提供一个幻灯片或横幅，以迅速吸引访问者的注意力，展示最新的优惠活动、特别产品或其他更好的内容。
4. 重点内容区：在下面设计一个大一点的重要内容区，可以用图片和文本混排，以介绍公司和产品。
在这个区域里可以列出当前最热门的产品或服务等。
5. 最新动态：在页面底部，放置一些新闻稿或者其他有用的信息。
设计成一个滚动条，方便浏览的人获取最新的消息。
6. 底部栏：在页面底部放置一些基本联系信息，如地址、邮箱和社交媒体链接等。
以上设计，可以满足绝大部分网站的页面需求。
简洁明了，页面内容整洁，有一个明确的主题和设计风格，非常有利于吸引和留住访问者。
同时，也容易实现和操作。
店铺首页设计方案店铺首页设计方案一、设计理念和目标：店铺首页是店铺的门面，也是客户了解店铺的第一印象，因此设计方案的核心理念是简洁、美观和易用。
目标是通过首页的设计吸引用户，提高用户留存率和转化率。
二、设计布局：1.顶部导航栏：设置店铺的Logo和店铺名称，并添加易于导航的菜单栏，包括首页、产品展示、特色服务、关于我们、联系我们等，方便用户浏览和查找信息。
2.轮播广告位：在首页顶部的中央位置设置一个轮播广告位，展示店铺的最新产品、促销活动或重要信息，吸引用户的眼球，并提供点击链接跳转到相应页面。
3.产品展示：在首页的中间位置设置一个产品展示区域，突出展示店铺的核心产品或特色产品，每个产品设立点击链接，方便用户查看详情和购买。
4.特色服务：在产品展示区域的下方设置一个特色服务区域，展示店铺的特色服务和优势，例如免费送货、售后保障等，以增加用户对店铺的信任和购买意愿。
5.用户评价：在特色服务区域的下方添加用户评价模块，展示用户对店铺的评价和好评，增加用户对店铺的信任度和购买决策的信心。
6.品牌故事：在用户评价模块的下方添加品牌故事的链接，通过文字和图片介绍店铺的品牌故事和价值观，增加用户对店铺的认可度和品牌忠诚度。
7.联系方式：在页面底部设置联系方式模块，包括电话号码、邮箱地址、微信二维码等，方便用户联系店铺咨询和沟通。
三、设计原则：1.简洁明了：通过布局的合理排列和信息的简洁呈现，使用户在短时间内获得所需信息，提高用户的浏览体验。
2.美观大气：运用合适的颜色、字体和图片，使首页整体效果美观大方，符合店铺的品牌形象和用户的审美需求。
3.用户导向：注重用户的需求和习惯，在设计中考虑用户的点击逻辑和行为路径，提供清晰的导航和便利的购买渠道。
4.易用性：确保页面布局清晰，操作简单明了，用户能够快速找到自己想要的信息和功能，提高用户的使用便利度和满意度。
四、设计工具和技术：1.平面设计工具：使用Photoshop、Sketch等平面设计软件进行页面布局、颜色搭配和图片处理。
设计系统主页1、让http://127.0.0.1:8000可以直接访问首页添加一条urls.py配置：urlpatterns = [.....re_path('^$', views.index), # 访问http://127.0.0.1:8000 可以直接访问首页]2、应用bootstrap快速编写index首页导航条（1）引入bootstrap核心文件和jquery<head><!-- 引入Bootstrap 核心CSS 文件--><link rel="stylesheet" href="/static/blog/bootstrap-3.3.7/css/bootstrap.css"><!-- jQuery (Bootstrap 的所有JavaScript 插件都依赖jQuery，所以必须放在前边) --> <script src="/static/js/jquery-3.3.1.js"></script><!-- 引入Bootstrap 核心JavaScript 文件--><script src="/static/blog/bootstrap-3.3.7/js/bootstrap.js"></script> <!--依赖jquery--></head>（2）拷入bootstrap导航条模板代码拷贝这些代码到index页面的body标签内。
（3）对导航条代码做适当调整由于我们的页面导航栏用不上，删除模板中的form标签和<li class="dropdown">标签的内容。
网店装修，淘宝店铺首页应如何布局？实体店铺给人的第一感觉往往是它店铺装修好坏，而淘宝店铺则是它的首页布局决定了它在顾客心里的第一印象，一个好的店面装修及布局不仅能让顾客拥有好感，还能让他们在购物过程中获得更好的购物体验。
想要了解淘宝首页布局的朋友可以参考下下面的关于布局的基础知识，希望能帮到你们。
把网店装修好不仅能够提高店铺的整体形象，还能够提高店铺的转化率，一个合理的装修风格和布局能够给买家很好的购物体验，在视觉和操作上都能够给买家留下良好的印象，下面就和大家说说店铺首页该如何去布局吧。
1、首页的第一屏淘宝店铺首页第一屏是点击率最高的一个区域，因为买家来到店铺第一眼看到的就是这个地方，如果这块地方设计得不够出色那么买家就会迅速的下拉页面。
现在很多店铺的首页都实现了在1024px下能完整的看到这个轮播图片。
在这个重要区域就要展现出店铺的重要信息，比如热销的宝贝、商品的分类、促销活动等等。
还有一点是要保证这个区域在不同的屏幕分辨率下都能够清晰的展现出来。
2、首页下半部分整洁统一，要有层次感（1）整洁统一。
每个楼层布局是一样的，你可以看看天猫首页，电器城，还有其他外站以及网店系统的精美模板，他们每个楼层布局都是一样的，为什么呢?考虑到客户浏览的时候总是很快的，这样他就知道他想要的在哪，不用花时间去找。
（2）每个楼层色调又是不一样的，这样能刺激浏览者的视觉，让他能够分开不同的楼层快速定位到他想要的哪一个楼层中。
3、要学会做活动页首页第一屏那么重要的区域，如果轮播图片只是链接到某一个宝贝是在太浪费了，如果客户不喜欢这个宝贝，跳出率就很高，你可以新建一个活动页，列出多个相关产品，让客户有的选择，成交率就会大大提高，建立活动页的好处：1.减少首页的高度，加快首页加载速度;2.给客户以选择，提高成交率。
店铺首页就好比一个人的外貌，你把首页做好了，别人才会有想再看一眼的欲望，所以在装修网店时，千万要做好首页的布局与装修，这样才能保证你比别家网店更胜一筹。
商品首页布局设计方案商品首页布局设计方案一个好的商品首页布局设计方案能够吸引用户的注意力，提升用户的购物体验，并且促进用户发现更多的商品。
下面是一个700字的商品首页布局设计方案。
1. 页面布局设计页面的布局设计非常重要，要能够简洁清晰地展示商品信息，同时也不要给用户造成压迫感。
我建议采用三栏布局，左侧是商品分类导航，中间是商品列表，右侧是推荐商品和用户购物车。
2. 导航栏设计导航栏设计一般放在网页的顶部，要包括主要的商品分类和搜索框。
我建议将主要的商品分类以下拉菜单的形式展示，这样可以节省页面空间，同时也方便用户查找到他们感兴趣的商品。
3. 首页轮播图首页的轮播图是吸引用户注意力的重要元素。
我建议将轮播图放在页面的上方中央位置，展示最新推出的商品和促销活动。
轮播图要设计成简洁大气的风格，图片要具有高清晰度，吸引力和信息量。
4. 商品列表设计商品列表是页面的核心内容，要通过简洁的形式展示商品的图片，名称，价格等信息。
我建议采用网格视图的形式展示商品列表，每个商品卡片之间要有合适的间距，方便用户点击和浏览。
同时，在每个商品卡片上也要加入用户评价和购买按钮，方便用户了解和购买商品。
5. 推荐商品设计右侧的推荐商品栏目是引导用户发现更多商品的重要方式。
我建议将推荐商品分为不同的分类，比如热销商品，新品推荐，用户购买最多等。
每个推荐商品可以展示商品的图片，名称和价格，同时也要加入购买按钮。
6. 用户购物车设计用户购物车放在页面的右侧，可以方便用户查看他们已经添加到购物车的商品。
我建议购物车的设计要简洁明了，包括商品图片，名称，价格和数量，以及结算按钮。
同时，购物车要及时更新，显示最新的商品数量和总价钱。
通过以上的布局设计方案，用户可以轻松地找到他们感兴趣的商品，了解每个商品的详细信息，并且方便地加入购物车。
同时，推荐商品的设计也能够让用户发现更多他们可能感兴趣的商品。
综上所述，这个商品首页布局设计方案将会极大地提升用户的购物体验，增加网站的用户黏性。
店铺首页设计流程
店铺首页设计是一个重要的过程，它直接影响着顾客对店铺的
第一印象和用户体验。
设计一个成功的店铺首页需要经过以下流程：
1. 确定设计目标，首先需要明确店铺首页的设计目标，比如吸
引顾客、提高转化率、突出品牌形象等。
这有助于确定设计的方向
和重点。
2. 研究目标用户，了解目标用户的年龄、性别、兴趣爱好、购
物习惯等信息，从而确定设计风格和内容。
3. 制定页面结构，根据目标用户的特点和设计目标，确定店铺
首页的整体结构，包括导航栏、banner、产品展示区域、推荐内容等。
4. 设计页面布局，根据页面结构，设计页面布局，包括排版、
色彩搭配、图片选择等，确保页面整体美观、清晰，并且符合品牌
形象。
5. 内容策划，根据目标用户的需求和购物习惯，策划店铺首页
的内容，包括文字描述、产品展示、活动推广等，吸引用户留下并进行浏览和购买。
6. 用户体验优化，考虑用户在店铺首页的浏览和购物体验，设计友好的交互方式和页面响应速度，确保用户能够方便快捷地找到他们需要的信息和产品。
7. 响应式设计，考虑不同终端设备的适配，确保店铺首页在PC端、移动端等各种设备上都能够提供良好的浏览体验。
8. 测试和优化，设计完成后进行页面测试，收集用户反馈，发现问题并进行优化，确保店铺首页能够达到预期的效果。
以上就是店铺首页设计的流程，通过这个流程，可以设计出符合用户需求、吸引用户注意力并且提高转化率的店铺首页。
淘宝店铺首页设计资料课件 (一)淘宝店铺的首页设计是卖家展示商品、吸引消费者的重要途径，良好的首页设计能够提高店铺的曝光率和销售额。
本文将介绍淘宝店铺首页设计的资料课件，帮助卖家制作出吸引消费者的设计，提高店铺的竞争力。
一、淘宝店铺首页设计的意义1. 对消费者的吸引：首页设计能够让消费者更容易找到自己感兴趣的商品，提高了浏览淘宝店铺的质量。
2. 增加曝光率：强大的首页设计能够增加淘宝店铺在搜索引擎和内部推荐系统中的曝光率，提高店铺的流量。
3. 增加信任感：优秀的首页设计能够体现店铺的专业性和信任度，提高消费者的购买率。
二、淘宝店铺首页设计的要素1. Logo：展示店铺的品牌，提升店铺的专业度。
2. 导航菜单：突出店铺的核心商品，提高消费者的浏览体验。
3. Banner：用图片和文字展示店铺的优势和特色，吸引消费者的注意力。
4. 商品分类：分门别类地展示商品，方便消费者查找。
5. 推广位：放置促销和新品信息，增加销售量。
6. 客服信息：提供全面的客服支持，增强消费者的信任感。
三、淘宝店铺首页设计的实现技巧1. 精简布局：简明扼要地展现店铺和商品信息，不要让消费者感到繁琐和混乱。
2. 突出重点：醒目地展示特价商品、精品推荐和店铺的优惠方式等，给予消费者正面的心理暗示，增加消费者的信任度和购买欲望。
3. 照顾移动端：在设计过程中要充分考虑移动端的使用，避免复杂的Flash和大量图片等，加快加载速度。
4. 准确的关键词：通过使用相关的关键词来确保店铺在淘宝搜索引擎中的排名更高，增加曝光率和流量。
5. 不断改进：通过不断地试错和用户反馈来改进店铺首页的设计，提高店铺的竞争力。
在进行淘宝店铺首页设计时，卖家应该根据自己的经营特色和产品属性，有针对性地安排布局和优化关键词，提高店铺的曝光率和销售额。
同时，定期进行店铺首页的优化，并及时了解消费者的需求和反馈，提高店铺的品质和服务水平，让店铺成为消费者首选的购物平台。
天猫店铺首页设计方案天猫店铺首页设计方案一、首页整体布局设计1. 导航栏设计：将导航栏置于页面的顶部，包括店铺名称、店铺简介、商品分类等模块，提供简洁清晰的导航功能，方便用户快速找到想要的商品。
2. 轮播图设计：在首页的头部设置一个带有自动轮播功能的大图展示区域，用来展示店铺的特色商品或促销信息，吸引用户的注意力。
3. 搜索栏设计：在页面的顶部或导航栏下方设置搜索框，方便用户查找想要购买的商品。
4. 热门商品推荐设计：在首页的合适位置展示一些热门商品，通过图文结合的方式吸引用户的注意力，并提供快捷购买入口。
二、商品展示设计1. 商品分类展示设计：将店铺的商品按照类别进行分类展示，方便用户浏览。
每个分类下应展示一些热门或推荐的商品，并提供查看更多的入口。
2. 活动专区设计：针对店铺的促销活动或特殊场景设计一个独立的展示区域，突出店铺的特色和优惠信息。
3.商品详情页设计：点击某个商品后进入商品详情页，该页面应包含商品的详细信息，包括商品名称、价格、规格、库存、商品描述、商品评价等，以及购买按钮。
三、用户交互设计1. 注册登录入口设计：在首页的适当位置设置一个注册登录入口，方便新用户注册或已注册用户登录。
2.购物车入口设计：在页面的顶部或侧边栏设置购物车入口，方便用户随时查看购物车内的商品以及购物车的结算入口。
3. 活动倒计时设计：对于特定的促销活动，可以在首页设置一个倒计时模块，显示活动的剩余时间，增加用户的购买欲望。
4. 搜索框联想设计：在搜索框下方设置一个搜索联想功能，根据用户输入的关键词自动提示相关的商品信息，提高用户的搜索效率。
四、页面美化设计1. 色彩搭配设计：根据店铺的定位和品牌形象，选择适合的颜色来进行搭配。
可以使用店铺的主打颜色作为主导色，再搭配一些相近或对比的颜色，创造一个舒适、美观的视觉效果。
2. 图片处理设计：对店铺的商品图片进行统一的处理，包括尺寸大小、背景统一、图片质量等，确保展示出的商品图片清晰、美观。
网店装修(第二版)教案(5)店铺首页任务一店铺首页策划一一、教学目标1、知识目标（1）了解店铺首页装修的基础理论知识。
（2）掌握店铺首页装修的创作方法。
2、技能目标（1）能正确理解首页的作用。
（2）能熟悉首页每个模块的制作方法3、情感目标（1）培养学生美感审美的能力，美的情操。
（2）培养学生积极思考、大胆探索的能力。
（3）培养学生自主研究、协助研究的能力。
二、教学内容分析网店首页的美观程度，直接决定进店顾客的主观感受，可以延长顾客进店停留时间，关系到顾客能否在店铺下单购物。
美观的店铺装修会给客户好的第一印象，顾客会更愿意多花时间浏览店铺的商品，增加顾客下单的概率。
教学重点：1、电脑端首页的规范。
2、首页的主要模块。
教学难点：1、首页的组成模块。
2、首页的布局。
三、讲授过程设想教学步教师活动骤1、创设思考什么是首页？首页的作用？情景引入课题一、一个正常营业的店铺首页主要由店招、导航、海报、产品分类、客服旺旺、产品展示、店铺页尾、店铺背景以及满返、满减、红包、购物券等营销模块。
店铺首页的标准布局图：学生活动看展示的首页，思考问题。
了解电脑端首页的布局设计意图引出首页装修的重要性。
让学生先行了解电脑端首页的基本知识2、新课讲解1店铺首页讲授步骤教师活动学生活动能熟习首页主要由哪些模块构成，每一个模块的内容可为哪些？设想意图让学生对首页的整体布局有系统的了解，便于后面的策划2、首页布局内容解析1、店招顾名思义是店铺的招牌，店招的尺寸为950*150PX含自界说导航部分，950*120PX其导航为系统自带。
店招一般展示的内容是店铺的称号、logo标志、标语等，具体一些的也可以展示1-2款主推的产品，还有领取优惠券的设计，收藏店铺的图标。
店招是店铺上唯一各个页面都能展示呈现的模块，所以一些重点推广息可以设计在店招上。
2、导航条导航条可分为淘宝系统自带和自界说导航条设想，主要功能是能够快速链接到相应的指定页面。
第4章店铺首页视觉设计店铺首页在电商店铺所起到地作用就好像实体店地店面,作为品牌地门脸,它地主要作用是向消费者做展示,通过视觉,氛围,商品与服务地综合感受让消费者对品牌有初步地了解与接触。
首页设计得是否有新意直接关系到商品信息地转化率,因此在进行店铺首页视觉设计时要尽可能地让设计能够聚集消费者地注意力,提高商品信息地转化率,这才是首页视觉设计要达到地重要目地。
首页视觉水平地四大指标4.1目录CONTENTS店招视觉设计4.2首焦轮播区视觉设计4.3商品陈列区视觉设计4.4茶叶店铺首页视觉设计案例4.5首页视觉水平地四大指标4.1判断一个店铺首页设计是否合格要从四大指标来评判:首页跳失率,首页点击率,首页均点击次数与首页平均停留时间。
首页跳失率首页跳失率是指消费者通过某种渠道进入店铺,只访问了一个首页就离开地访问次数占该入口总访问次数地比例。
针对不同地店铺规模与所售商品地类型,可以参照地判断标准是:如果是心级店铺,那么跳失率在 70% 及以下都属于正常,不需要进行优化。
如果是钻级店铺,那么跳失率在 60% 以上就需要考虑是否是海报设计与商品信息地问题了,需要根据具体地数据做出相应地优化与调整。
首页点击率首页点击率是商品在首页展现后地被点击比率,即首页点击率 = 首页点击量 ÷ 首页展现量。
店铺地首页大致可以分为两类:店铺首页罗列出各种光彩夺目地商品,希望有一款商品能够吸引消费者。
店铺首页没有单品展示,以全屏商品海报形式引导为主。
两类店铺首页排版4.1.3首页均点击次数首页均点击次数首页均点击次数是指在一段时间内均点击了多少次。
均点击次数4.1.4首页平均停留时间首页平均停留时间首页平均停留时间为访问店铺首页地所有访客总地停留时长除以访客数（单位:秒）,多天地平均停留时间为各天均停留时长地日均值。
行业性质不同,每个访客在不同行业店铺停留地时间差异很大。
在进行分析时,可以以一段时间内访客在店铺首页地平均停留时间作为基数,并记录下这段时间地销售量,以后再拿新数据进行对比就知道平均停留时间内销量是提高了还是下降了。
做设计别本末倒置——首页设计实操呆电商这个设计行业里面已经很长的时间了，花了大半年的时间沉下心来好好的看了看设计，思考设计到底是在做什么，什么是设计，核心到底是啥等等问题。
天朝的电子商务说白了已经从1.0的随便卖货时代——2.0的视觉营销时代——现在现在到底是一个什么样的时代，不太好界定。
有人说是品牌化营销的时代，也有人坚持视觉营销至上，还有人说是微商的天下等等。
当然，这东西搞不搞得清楚其实无所谓，因为压根对你的电商经营没有什么用。
入正题之前有看到一篇关于设计回归本质的一个分享，感觉有必要拿出来讨论一下。
大概是这样的：13年底，Intercom 的产品VP Paul Adams 在Intercom 官博发表了一篇博文。
文章讲述了网络上设计社区里普遍存在的一种现象，大意是“许多设计师在社区中分享的作品往往是为了炫技，而产品的逻辑通常都经不起推敲的，真正优秀的设计应该从更高的层面出发，而不只是做表面上的工作”。
（比如这些天气app中，只有一个试图解决用户的实际问题。
就是最后一个告诉你，今天要带伞）这里说到一个“真正优秀的设计应该从更高层面出发，而不是做表面上的工作。
”确实颇为值得深思，就像苹果那时候带起了一波扁平化设计风潮的时候，一大群设计师跟着屁股后面开始扁平化，而事实上，扁平是扁平了，但是扁平了到底有什么用，其实压根没看出来。
无非是把原来复杂一点的页面变成了干净简洁一点的东西，但实质上并没有思考扁平化的目的到底是啥。
说到这里，不得不提一个概念——design thinking即“设计思维”。
设计思维的核心是以人为核心。
那说白了基本可以理解成更加符合用户体验的设计。
这个设计思维大部分是引用在工业设计上的，产品设计的设计标准应该更加方便消费者所使用。
我们引带入页面设计中其实完全OK。
网页设计的根本目的到底是什么，或者说是客户需要什么样的体验，另外一方面不要忘了从我们商家角度来出发我们需要什么，这个是作为一个页面设计师最需要思考的一个问题。
客户要的是知道怎么解决问题,就如同前面那个APP界面一样，你手机上更新了无数的天气软件，其实晴天我们压根不关心，我们需要的只是想知道突然降温了能够多加一件衣服，天热了不要穿太多，下雨下雪的时候能够带伞，当然能有橙色红色警报这些告诉你今儿可以名正言顺的翘班啦，那就最好不过了。
一个产品如果不能解决客户需要解决的问题，那就没有价值。
就好像最近这段时间到了年中大促一样，我翻了2个小时会场页面愣是没有找到我想要的东西。
最后还是通过自然搜索找到了我想要的东西，当然，顺便瞄一下那个天猫年终大促的标对我会有更大的吸引力。
所以我一直疑惑的一点是，为什么在活动大促页面没有类似于个性化推荐这种东西出现。
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~上面扯的远了点，来切正题，这里还是引用一下前面有提到的那个社区贴产品设计总是与使命，愿景以及架构息息相关从广泛的构思到像素级的细节，设计师应该始终思考公司的使命丶愿景和产品架构。
他们在设计中所做的每件事都需经历这个过程。
设计始于公司最顶层的使命，其次是公司的愿景。
在一个没有清晰和可执行的使命与愿景的团队中，很难开展设计。
不要低估这个问题的重要性，如果你所在的公司缺少清晰的使命，那就将缔造它作为你工作的一部分。
在使命和愿景之后的，则是产品的架构。
不是指技术层面上的东西，而是产品内各部分之间彼此的关联，是一个总体的系统。
我在Facebook 上班的第一天早上，Chris Cox（产品VP）做了一个绝妙的演讲（你可以点开感受一下）。
下面的听众来自公司各个部门，C hris 侃侃而谈，然后着重阐述产品的架构，以及它是如何与公司的目标关联的。
对Facebook 来说，架构里有联系人丶好友丶兴趣点，上至世界名牌下到街边小店，还有一个能够显示所有这些事物关系的示意图。
这是一个非常清晰简洁的产品，直击目标需求点。
以我的经验来说，在没有一个清晰明了的构架想法前是很难在这团杂七杂八的玩意下做出一个超赞的设计的。
在很多情况下，就像这个项目一样，作为设计师应该去解决问题并改进架构。
比如谈到Facebook跳转其他应用的时候，我通常会在白板上画些类似这样的概念图：产品的架构不是信息堆砌，它不是一个页面连着这个那个模块和空间，或者一堆死板的演示告诉你点这里是干嘛的，一个交互原型通常就可以很好地处理这些信息。
一个更深层次的表达方式，这就是产品的架构图。
它能表现出各个模块在整体系统中所处的位置以及它们的联系。
而在intercom我们是用这种方式进行架构设计的：我甚至没有印象在追波上有看到过类似上图这种表述设计思路的架构图。
很少能看到设计师讲述他的作品如何匹配需求目标，如何驱使产品的视野向前，或是在整个架构中发挥了什么作用等等，以呈现这些设计的重要度。
这应当是设计的基本，而非特例。
这上面提到这么多的东西其实就是我很早以前在如何制作详情页设计里面会特别着重说的一个点，强调思维的一个过程，也可以说是一个逻辑架构的问题。
我们在做页面设计的时候其实要考虑的是流量进来的去留问题，客户的兴趣点的问题，流量跳转以后的闭环问题，商家期望的消费者浏览线路问题等等。
为什么有的店铺访问深度很高，而有的店铺很低，我相信看完上面那块的说明，应该会理解很多。
当然，这里之后会有人问的主要的两个问题：问题1：我的SKU很少那我应该怎么去做店铺设计？问题2：我的SKU多的无法想象，应该怎么去做店铺设计？如果从设计的根本出发点来说，而不是只是做的炫酷的角度来说，这两个问题都不难解决。
比如说问题1，SKU很少一般来说需要的是更加了解客户，因为客户不太会遇到找不到我要找的产品的问题，因为一目了然，而更多的是想知道我要这个产品有什么用，或者能给我带来什么东西。
而问题2其实无非就是问题1的升级版，一方面要解决问题的需要解决的问题，另外一方面要解决客户如何找到自己需要的产品。
（一般情况下，我对搜索框的需求量远远大于左边打的那几个字的作用，因为能够更加准确的找到我所需要的东西，并且可以多条件筛选。
而左边那种大类的分布实际上看过页面数据的人基本都知道，只有首页和所有宝贝的点击率高一点，另外几个，只是凑数而已。
）（一个店铺的首页做成这样类型的形式，除了浪费寸土寸金的页面前三屏位置以外，全部在展现商家想要表达的东西，而不是满足客户的需求，跳失率高能怪谁呢？要我我连1秒钟都不想多看）搜索本店这个功能，我相信除了经常使用的人真心没多少人有概念，所以还是给自己添加一个搜索吧。
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~恩，这里继续引用一下思考一下设计的四个层面设计是一个多层面的过程。
以我的经验而言，如何依次经过这几个层面来思考是有一个最佳顺序的。
最简单的一种就是回想一下这四个层面：我看见一个又一个的设计师单单专注于第四个层面而完全忽视了其他因素，这样自下而上的方式做出来的设计当然不如至上而下。
如果其他三个层面的问题还没有解决好，那么诸如栅格丶字体丶色彩丶美感等方面的深入都是无用功。
许多设计师说他们这样考虑过而没有付诸行动，是因为有时候只是觉得画一些好看的图片，和把自己掩埋在像素中比处理一些复杂的商业决策和人际关系要更加有趣。
只关注第四个层面的因素，这无伤大雅，但这只是画画而不是设计。
这样的话，你是一个数字艺术家，但并不是一个设计师。
针对这个问题我们来看看实际应用（选自顾家家居旗舰店）大促不可避免的，你家的导航肯定会打上牛皮癣，而且比你的店招更加醒目，所占位置绝对猥琐，天生的高你一等，这个时候怎么办？打破横版导航的界限，竖型构图，改变形状。
从用户体验的角度而言，消费者希望能够看到有区块的重点，有重点的重点，有顺序的重点。
而鼠标悬停的变化触发了和消费者的简单交互模式，提示他正在看这个。
至于轮播不说了，节省空间，多维展示，千万不要浪费了这寸土寸金的页面首屏！同事营造夸张的视觉张力，促销感觉杠杠的！搜索栏位置搜索一定要明确，前期打算直接放置在左侧导航的位置，搜索中预置内容直接表现你要推荐的东西，客户不喜欢的时候就让他自己更改吧。
单模块多页面展现活动促销机制，节省空间，鼠标悬停效果。
产品成列，右上增加触发模块，可查看更多，节省页面空间。
原先有构想过变成猜你喜欢这样的文字表现，来增加为客户定制的感觉。
中间圆形标签直接表现促销利益点，简单直接。
促销位置别忘了增加点口味清淡的，区别开一点，可以更加吸引眼球（下文有解析）不一样的模块可以满足客户所需的个性化需求。
当然还有很多页面设计的小细节，这里不多做阐述，可惜结合实际做详细分析。
实际上这里面也有很多没有深入推敲的部分需要去一点点的改进，进一步深化页面设计。
如果大家喜欢，可以加群123735798，有更好的修改方案会实时更新。
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~说到页面，不得不说页面的整体框架结构的问题，上文已经提到过在设计过过程中需要思考的几个问题，下面接着来拆解。
相对早期或者说现在还有很多商家正在使用的一个页面特点基本是这样的这个模式基本算是在2.0时代是个主流。
但是面向于现阶段流量的细化程度更高，客户对购买体验的要求提高，流量获取成本更高的这个大环境下面，视觉突出是在浪费空间，均衡展现变成了没有重点，单页呈现变成了无聊宠物，静态呈现变成了毫无特色，全分流的导向型则是浪费流量入口和页面空间。
基于这个基础上，我重新拟定出了一套新的页面呈现模式，这个呈现模式在顾家家居旗舰店的现有页面上有一定的呈现，并且在数据上和过往的相比较有较大的提升。
当然，考虑到后期针对客户群体的个性化页面设计，仍然需要花比较多的心思去深入研究。
在这个思路上，重新划分页面的框架结构，这里贴出一部分供大家参考红色区域为主点击区域：以大场景的模式展现产品1 2再分主次（场景）橙色部分为次点击区域：以个性化导购分类+核心促销产品的成列刺激点击（悬停效果，G IF动画）黄色部分为最次点击区域：以“猜你喜欢”的伪定向推荐模式成列产品（白底，轮播）事实上，通过这样的框架解构以后，分清主次关系以后，做有重点的突出，流量基本流向和预估流向基本一致。
当然，针对不一样的类目和客户群体需要有不一样的结构模式，研究好客户习惯和给予优质的用户体验这个无疑是页面设计的重中之重。
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~当然，不得不说的一个，既然有模块设计的大解构了，肯定会有整个页面的解构，而页面的解构必然要深入到跳转的问题。
