选择从首页开始向大家分享电商的设计实战，主要是因为电商的首页通常是大家最直观接触到产品，无论PC端的网站首页还是手机端的Wap首页或App的首页，这都是大家首先认识一个电商网站的开始，然而别轻视这样一个独立的页面设计，看似是简单的一个页面的构建，却往往在背后有着更复杂的设计思维融合其中，在整个电商系统单页产品设计中，电商首页是最有挑战的一个，首页是一个大多数人都能设计但却难以设计好的一个产品。首页设计为什么难一个电商系统做的好不好，通常评价的第一感知都来自于对首页的印象，第二才是后端运作的商业体系与系统生态，这是有一定道理的。因为后端的商业体系大家不容易感知到，而首页通常是一个电商平台的战略和业务的缩影，从首页就能初步判断出这个电商平台的大概运作体系。在大多数电商系统中，PC端首页的流量通常会都占到全网入口流量的10%~20%左右，这在所有入口页面中，是流量最大的一个单一页面，而且首页又承载了各类用户需求入口和企业品牌宣传与运营的诉求，使得首页的价值体现需要多方面支撑。首页设计的难，正是在于需要用一个页面去满足海量用户需求的同时，又要满足企业经营的需要，它不同于商品详情页（Detail页），虽然全网的商品详情页流量占比可能是最高的，但这些流量通常都是被百万个产品所分流，每一个商品详情页在全网流量中的占比都可以忽略不计，很难会有一个页面像首页一样这么聚焦用户的需求与企业的需求，你没有办法、也不可能同时满足所有的利益相关方的需求，就像每个人都会有自己的审美价值观一样，对于你的首页设计，总会有人持反对的态度，你不能要求大家的审美水平与认知保持高度一持，所以在首页的设计过程中，需要更多的抉择，更多的碰撞，在这过程中，又要尽量避免使最终的解决方案变得平庸，否则很容易就失去了其本应要体现的价值性。所以说，看一个电商网站的发展史，可以看其历次首页改版的变化，每一次的变化都会反映出这个电商在战略和运营、用户策略上的变化。大多数成功的首页设计，都是经历过多次的淬炼与碰撞而形成，在设计过程中，设计人员需要与各利益方进行博弈，以期在用户需求满足、优质体验、品牌宣传、运营诉求中达到最佳平衡。而移动互联网的发展，也对电商首页在各类型终端上的表现与作用提出了新的要求。移动端交易从过去的占比不到20%达到当前占比50%甚至于超出50%，未来的电商交易场景将会是更加碎片化的基于地理位置的实时交易场景，智能移动终端设备将会是未来趋势所在，所以做为设计人员，你不能单纯的将手机APP与平板APP的首页简单设计为PC首页在移动终端的品牌或服务的价值延伸，而应将移动终端的首页设计等同于独立的首页设计过程，从移动端消费者购物行为差异特征以及移动技术的发展趋势上去重新构建适应这类移动化的实时交易场景。首页是企业需求与用户需求融合的结果在多数电商网站中，首页是一种特殊的服务存在。所以我一般不会把首页归入任何一个产品线中，对于电商网站的首页，我通常会单独设定一个产品线，由一个独立产品经理负责对其进行规划设计与日常产品运营。对于首页来说，其“需求”主要来源于消费者与企业本身的经营要求，所以首先我们需要先识别企业与用户的主要需求是什么。企业需求有哪些作为运营主体，电商企业通常会将首页当作一个关键的营销工具来应用，对于货架的管理，活动的推广以及用户的导流，电商通常都会要求在一定程度上通过诱导用户来达成运营的目标。那么，一般会在首页上有怎样的企业运营需求呢？由于PC和无线的差异定位，我们会分别来分析，先来看一下PC上对首页的需求状况。基于前面的分析，电商企业也意识到了首页做为用户品牌访问的流量入口的关键性。因而，在企业方面，会将追求运营效益最大化做为首要目标。通常会有以下几方面的考虑：如何降低这些首页访问用户的流失率，让更多的用户产生深度的访问，去尝试使用更多的网站提供的服务，这样才能带来后续的商业价值转化。如何让用户记住这个电商网站的品牌特征，包括网址、网站的Logo、网站的业务特色、网站的可信任度等等，为未来的口碑传播打下坚实的品牌基础。如何充分利用首页的高曝光度来让一些产品获得更好的销售额，让更多的用户知晓并购买。如何让用户参与一些市场营销活动，增强用户的活跃度，吸引用户与网站进行互动。如何给网站一个最佳的定位，吸引更多的目标用户前来，并留下成为忠实会员。如果是移动端的APP首页，由于信息展示空间的变化与场景的差异，企业的运营策略与要求则会有所不一样。对于企业来说，首先希望用户能下载并安装APP，同时对于APP的图标有第一直接的品牌印象，这将增加消费者存留（不卸载）APP的可能性。而在消费者打开APP访问首页过程中，由于流量来源前移至APP下载环节，所以首页无需考虑流量来源的差异，唯一需要区分的就是用户的特征，是不是一个潜在的消费者，如何让用户通过APP首页快速对电商的服务与特色形成印象，并快速促成用户在APP端成功订购第一单，APP端首单预订的意义要远较PC端要重大的多。APP上屏幕尺寸更小，虽然可以通过滚动扩展到分屏，但还是依然有首屏设计原则，因此不可能承载过多的企业运营要素，所以企业第一要素是为用户提供合理的分类导航与搜索导航，帮助用户深度使用APP，同时加大对促销区块的运用，通过新用户引导，强化销售卖点，扩大优惠力度来实现企业对用户存留率与APP打开率的要求。这些都是企业做为需求方通常会重点考虑到问题。用户需求有哪些作为消费者，在电商首页通常会有怎样的消费思维与行为？从消费者来源来说，PC端电商的消费者通常来自于几大类网络渠道：“直接访问”、“引荐”、“搜索引擎”。直接访问的用户通常是由于口碑传播或媒体广告获知了电商的网址，在访问站点之前可能已经从口碑和广告中掌握到一定的电商平台信息，所以这类用户可能会有更直接的消费目的，希望验证广告所言非虚，了解更多品牌信息，尝试购买商品。引荐来源的用户，有可能是一些媒体、导航网站、论坛的某篇帖子或者一个新闻文章中，或者一些推广活动，这类用户通常都是被推荐的信息吸引而进入电商网站首页，往往带着好奇，逛逛，不信任的心态，对网站首页的第一印象尤其在意。而搜索引擎来源的用户，大多数则由于一些特定的关键词进入到了电商网站的首页，相较于前两者，这些用户的行为不确定性更强，有部分是直接奔着电商品牌来的老用户，比如一些记不住网址的用户，经常会通过搜索引擎来查找网站，还有一部分是由于一些长尾的关键词而无意识的被动进入电商网站首页，往往第一眼带着陌生感与不安全感，我要找的是这个关键词，为什么搜索引擎将我带入了这个网址？而在移动端上，用户通常会通过应用商店，论坛社区，社交圈分享，媒体报道，推广活动等渠道获知电商的APP信息，并通过扫描二维码或直接从应用商店下载和安装APP，在这过程中，与前面PC端所分析的尝试用户的目的性相类似。由于用户下载与安装APP的代价较大，因而用户对打开APP所看到首页要求会更高，否则第一印象较差的情况下，很可能APP就会被立即卸载或以后长期都不再使用。在有限的无线首屏空间（因移动设备而有所差异）内，用户希望能快速获知这个电商APP能提供的服务范围，服务特点，当前促销卖点。在界面体验上，虽然当前3G/4G网络较普遍，但还是有大多数用户只有很小的流量包（<100M），因此对于流量消耗有着特别的关注，对APP的要求来说，希望访问速度足够快捷，信息呈现更加简洁丰富。首页功效设计综合上面的基础需求信息，我会从将电商首页按模块功效进行一定的归类划分，在PC端与无线端同样适用，但在具体策略上两者会有所差异：品牌认知类：包括用户的传播口碑、视觉品牌力、服务特性等；简单说就是用户在访问你的首页时，是否能快速识别出你的品牌特征，这将有助于留住更多的用户，并获得用户足够的信任与拥戴。流量导流类：前面谈到首页是承载了一个网站10%~20%的庞大流量入口；但首页就一个页面，在有限空间条件下，需要合理有效的将流量导流至符合用户需求的着陆页（LandingPage），所以导流模式的设计是首页的一大关键；服务入口类：在首页要突现出电商核心的服务特色，通过导航、功能模块等进行有效的识别；一方面满足了品牌的定位，另一方面，首页也是用户使用各类服务的首选入口，所以服务的引导设计将会变得更加重要；活动促销类：有一部分用户，访问网站首页的目的是很明确的，针对这部分用户，我们通过展示高频的市场营销推广活动，来提升首页的活力，所以对于活动的导流与销售的转化是一个关键指标；商品陈列类：陈列是电商货架管理的核心，但做为流量着陆页来说，首页在货架陈列上，应该要弱化其表现力，尽量用最小的空间管理来提升商品的转化率，所以在首页最适宜打造爆款商品或爆款系列。显然，要融合企业的的诉求与用户的需求，需要设计人员对目标用户有更多、更深入的了解，展开调研是进一步了解用户的最有效手段。首页的需求调研调研是产品设计永恒不变的前提所以首页设计最重要的启动工作是调查目标用户与企业自身需求，而不是先设计方案。虽然行业里有许多企业习惯拿原型代替调研报告，但我个人认为两者不应该相互替代，没有严谨调研的前提，通常会产生错误的决策与带来糟糕的结果，我比较推崇“详实的调研+敏锐的商业直觉”相结合的决策模式（当然新产品与原有产品改进会有一定的差异），所以我们都会采用类似RTPA设计框架的方法来推进首页的设计工作。每次首页的设计或改版都会基于某些特殊的目的和目标，比如是设计一个全新的网站，或者是希望进行品牌形象的升级，或者是认为原有的模式无法适应新的业务发展的需要，所以我们会基于这样的“提案”反向确认现状与预期的差距，对于已有的首页，对现状的调查将有利于修正下一阶段的设计目标；而对于全新的首页，对用户场景和企业需求的「经营假设」，是可以在设计实施过程提供有效参照的关键手段。首页调研报告框架首页调研报告框架如果是“从0到1”的首页设计，调研的基础更多是基于预期目标和对未来的经营状况的假设而展开。关于「经营假设」的应用经营假设并非是凭空的幻想或臆想，对于假设的提出，也需要经过严谨的逻辑梳理与推论，同时要在团队内形成广泛的探讨与论证，以进一步降低其假设不完善性的缺陷。通俗点来说，“经营假设”是用来提升“拍脑袋”水平的。大家都知道“拍脑袋”通常是靠着直觉比较随意性的决策，这样对产品的设计会产生更大的不可知风险，而“经营假设”则强调逻辑推论，更强调严密的系统思维，其推论大都建立在团队达成一定共识性的假设上。「经营假设」应用的技巧是用户场景与商业需求结合的逻辑假设举例来说，如果我们要构建一个全新的旅游电商（OTA）首页，并且这个首页将会与整个电商平台同期发布上线，而我们在之前都没掌握到目标用户的实际特征与消费场景，那么我们将如何设计这样的一个首页？OK，通过「经营假设」来虚拟构建一些逻辑性合理的用户场景，并将之在即将设计的首页方案中进行验证，以确保假设的准确性以及可行性。要注意，经营假设不是空想，不是随意的YY，它是一种严谨的「推论——论证」方法论，你必须对你所拟定的经营假设在后续推进过程中进行有效的论证。首页调研实战报告（示例）由于篇幅关系，整篇报告就不在这里详细赘述。优秀首页的衡量标准要构建一个优秀的电商首页，前面提到的对各方面的深入调研是关键，即使因为条件限制而没有充分的调研基础，也应该利用“经营假设”为设计提供结论参考，这项工作开展的好坏直接决定了首页是否符合商业价值的预期，我认为一个优秀的电商首页，首要是产品服务上的成功，其次才是视觉、技术等产品质量上的成功，而这两者又是相辅相成的，但关注的焦点应首要在服务设计上。产品服务上的成功，关键要识别清晰潜目标用户的需求与企业自身经营的需要，让二者有效的在首页这个有限的空间内进行整合，在为用户带来好的服务的同时，也为企业带来巨大的商业效益，从而达到双方共赢的目的。而技术与设计上的成功，则来源于首页技术质量上的保障，持续的稳定性与高的访问速度，优秀的视觉表现力，贴合用户习惯与行为的互动体验……这些都为首页的商业成功提供了有效的助力。由于每一个电商平台的定位与用户状况、商业诉求各不相同，我们无法也不可能提供一个完整的首页设计解决方案来确保每一次的设计都能达到优秀的结果，但在设计中确实有一些积累的经验可以用来借鉴。首先要明确首页的核心定位，这将为首页的后续设计及调研设定基调。首页做为一个电商平台的门户窗口以及关键LangdingPage页，通常会承载三个方面的作用：品牌价值传递：向用户传递品牌价值是首页关键的用途，也是最佳的路径。用户流量分流：首页是优质的着陆页面，其承载的流量通过合理的引导，可以为整个电商平台带来巨大的价值转换。促销引导：做为海量流量的入口，其促销的作用将会被几何级的放大，所以各利益方会不断抢夺首页的促销展示空间。首页定位如何进行首页的品牌设计我们都知道品牌形象对于新用户的吸引和老用户的忠诚都有关键的作用。但是为什么我们大多数时候设计首页都无法详细的感知到品牌设计的套路呢？核心点在于你没有把品牌设计结构化，你应该尝试将品牌设计从感性的设计转变成理性的设计上。品牌联系着用户与企业产品两端，首页的品牌设计则将用户——首页——企业品牌联系在一起，在“首页”这个场景下，双方都会有各自的诉求，识别这些诉求并一一匹配，就可以结构化品牌设计。一个新用户，第一次访问一个首页，他有什么样的心理感知？他关注哪些跟品牌相关的信息？这是我们在调研阶段的用户研究过程中应该去深入了解的。大多数情况下，用户会有这样的行为：首先会看到网站的Logo形象与网站名称，产生了第一个品牌认知，然后会看到网站的主体导航，了解到网站提供了什么样的服务与经营范围，接着看到了网站的各种广告、促销活动、品类导航，进一步对网站的详细服务产生了兴趣，而当用户试图尝试网站的服务时，可能会对网站的安全性产生疑问，这个网站提供的服务是否真实？交易过程是否安全？是否有保障？网站是否值得信赖？这些都对品牌信任度提出了质疑。当品牌设计消除了这些用户的顾虑，用户就会愿意尝试接受网站的服务。而对于电商企业来说，面对这样的用户群体，企业希望最终达到什么样的目的？也许希望用户在第一眼看到品牌Logo时候，就能记住它的形象与称呼，同时希望用户将来会爱上这个品牌，而成为未来的忠诚客户；而要吸引用户尝试网站的服务，必须首先告诉用户我们提供什么样的服务，并且这些服务有什么特色，所以会重点在导航上进行关键设计，突现核心服务。而企业要让用户使用网站的服务，最大的门槛是在首单交易上，也就是用户对网站服务的不放心，不信任。企业必须在用户产生购买兴趣时，试图通过一些技巧来清除用户的顾虑。比如，在首页上放置最近一段时间用户的购买记录并更新它，使得用户认为这个网站已经有很多用户在使用了，应该可以放心；又或者在网站首页上公布企业获得的政府或机构的正规认证，给用户传递“这是一个合法经营的网站”的形象，也可以展示一些知名的合作伙伴，暗示用户“嘿，这个网站是***企业的特约伙伴，它们有着紧密的联系”，用户也许熟知那个企业，进而降低对网站这个新品牌的不信任感。方法和手段有很多，但做为设计人员，你必须拥有这样的结构意识。概括起来，电商首页的品牌设计，有一些常用的技巧：而对品牌的设计，应该体现在首页的各块关键位置。电商app首页品牌元素设计如图所示，首页的品牌设计应该作为一个品牌宣传要素进行规划，基本可以采取“Z”形品宣布局，自上而下，向用户传递出品牌的形象、品牌的优秀口碑、品牌特色服务、品牌的服务保障与安全等信息，品牌的影响大多数情况下是隐性的、长期的持续作用，首页对品牌形象的设计，追求的不是短期的运营转化效益，而是关注用户对品牌长期的满意度与信任度、忠诚度。在移动端（图），由于屏幕尺寸限制，通常都采用瀑布流布局的方式，理论上没有所谓的页面底部的限制，所以基本不用考虑用户在滚动到屏底应该显示什么品牌要素。核心还是在手机屏的前2~3屏的空间内，图示的示例设计的是首屏，品牌经营范围（分类导航）将是首页的重心，第二重要的是品牌促销，这是保持用户访问热度的关键。第三重要的是首页的品牌视觉表现，在移动端要特别关注品牌主色的运用。首页的品牌设计，更加强调用户首次访问的品牌印象！首页导流模型设计首页做为网站的关键着陆页（LangdingPage），其必然承担着海量的流量落地的作用，对消费者而言，进入首页仅仅是使用电商网站的一个开始，后续还需要通过浏览路径转化到相对应的目标页上，比如购买预订，交易管理等，如何有效的引导用户了解并进入后续的转化路径，是首页设计中很重要的一个环节，所以我们可以利用好首页的导流设计来主动引导用户进入我们期望的理想路径。图3-4 首页流量分流示意图图3-5 首页导流模型设计电商首页的导流设计并没有统一的设计方案，应根据每个电商网站自身的定位及发展阶段的战略来规划。比如我曾负责的一个OTA首页的设计，在改版之前的导流70%全导到单品详情页上，而这些单品又缺乏成为爆款的潜力，导致大量用户进入详情页后流失跳出。所以在设计导流模型时，我们定了一个策略，单品的导流比例要大幅缩减，重点导流至Search List（商品列表）页面或专题活动页面，通过这样的引导方案，使得用户在消费过程中拥有更多的选择，而不会因为单品的需求匹配性低而放弃交易。图3-6 导流实际案例效果引流合理化是相对性的合理设计，这里面需要糅合进更多的运营思路，同时要符合用户的消费决策过程思维。首页的服务入口设计电商网站为用户提供了丰富的各类在线服务，包括商品搜索，商品比较，购买预订，在线支付，客服咨询等，而大多数情况下，用户都习惯于直接从首页选择各类服务，所以如果网站推出一些创新的服务，在首页投放关键入口是个比较有效的推广手段。而首页的服务入口设计上，应遵循一些体验性的原则。如果按电商首页的用户类型来分析，首页用户为通常分为卖方（B端）和买方（C端）两类，而其中买方是主体，卖方是辅助。所以在服务入口设计时，应以C端服务入口设计为主，兼顾到部分B端的入口需要。什么样的服务入口最适合放在首页？这个并没有唯一的解决方案，还是要根据平台的发展时期及策略重心差异化设计。对于服务的设计，首先要追问几个关键问题：你的电商平台共提供了多少种服务？这些服务中哪些是属于核心的关键服务？哪些服务是属于用户经常使用的？除了首页，用户还有哪些途径可以较快速的获取到这些服务？首页常见的服务入口（图）：图3-7 电商首页常见服务大致上首页的服务分成以上几类：导购类、帮助类、资讯类、账户管理类、反馈类、工具类，其中，导购类是整个首页的核心服务入口，整个电商用户访问首页首要就是使用导购服务，其次是账户管理类，主要提供用户注册、登录以及进入“个人中心”管理账户及交易信息；再其次是帮助类，包括了在线帮助以及电话服务等，这块对用户在遇到交易问题时获得及时帮助很重要；然后是其它几类。首页促销导购设计首页做为电商全网的流量汇集地，做为关键的LandingPage，其天然具有导购的价值转化优势，前面的分析我们曾提到首页放置单品的详情页，转化效果不佳的状况，那主要是从整体流量的引流上来评估，但在部分关键布局位置上，运用一些巧妙的设计，可以打造出爆款的销售转化效果。通常来说，首页的促销导购通常会遵循几个策略：基于季节性或节假日的大促，比如国庆、五一等；基于活动类的大促，比如会员特惠、新品上市等；基于地域性的热销商品等；首页的促销导购设计，要考虑在2屏（2倍屏幕高度）范围内适当露出，可以应用广告图进行有效的引导，或以图文方式展示爆款单品，满足这两者的情况下，通常会有一定的转化价值。首页的效益评估体系优秀的电商首页，通常可以从三个维度进行价值效益的评估：「品牌传递」、「流量分流」、「导购效果」。图3-8 电商首页的效益评估要素做为电商产品的关键入口，品牌的形象与价值传递是首页的首要任务，尤其对于一些新推出的电商平台，用户通过首页来感知品牌背后所呈现的经营范围、服务特色、品牌知名度、品牌信任度等。而做为一个单一的页面，其必然无法承载为用户提供服务最终环节的用途，合理的提供服务入口与通道路径，通过有效的推荐、引导用户进一步接受平台的服务是其核心的价值，所以首页的分流设计及运营是首页持续保持其竞争力的关键。而促销引导则是电商企业运营和营销服务部门主要的诉求，一方面部分用户有着这类的诉求：对网站的优惠活动和促销有着高敏感性与关注度，希望能找一些物美价廉的商品；另一方面，企业营运部门急需一个快速的通道能尽快的将积压的商品甩卖出去，或者希望推出一个新品提高用户知晓度，又或者希望通过首页为活动带来足够高的人气。总而言之，促销引导是从企业经营需求的角度去构建符合用户需求的重要手段，所以对企业内部经营部门尤其关键。但我们要注意，首页不单单是这样一个定位，它的核心定位还是前两者：「品牌」与「分流」，我们在设计首页时要避免把首页设计成一个热闹的具体活动卖场。对于首页的效益评估，可以用下面的表来量化：每一个首页的设计，都应该应用效益评估工具在前期进行项目价值预测以及在后期进行实际效益的评估与追踪。