作者：高金山
出版社：电子工业出版社
格式: AZW3, DOCX, EPUB, MOBI, PDF, TXT
电商逆袭移动端电商设计试读：
前言
互联网发展速度之快，令人叹为观止。我们知道电子商务是指不需要见面就可以进行的商贸活动，而移动电子商务与它的区别仅仅是商贸活动进行的方式不一样。传统的电子商务是通过PC进行沟通，而移动电子商务，顾名思义就体现在“移动”两字上，它的主要传播途径是手机、PAD、掌上电脑等手持移动终端。与传统的电商相比，移动电商在商贸谈判中又更上一层楼。
本书从移动电商设计的理念为出发点，配以专业的图形处理软件Photoshop做讲解，重点向读者介绍了Photoshop在移动电商设计方面的理论知识和相关应用。通过大量移动电商设计案例的制作和分析，让读者掌握实实在在的设计思想。
本书章节安排
本书内容浅显易懂，简明扼要，从移动电商的设计思想出发，向读者传达一种新的设计理念，专业的理论知识讲解与精美案例制作完美结合，循序渐进地讲解移动电商设计中的有关知识，让读者在学习欣赏的过程中丰富自己的设计创意并提高动手制作能力。本书内容章节安排如下。
Chapter01 认识移动电商，介绍了关于移动电商的相关基础知识，包括什么是移动电商、移动电商的优势、各移动终端的设计规范，以及移动电商的应用形式等，使读者对移动电商有更加深入的认识和理解。
Chapter02 移动端电商图标，主要介绍了移动电商界面中图标设计的相关知识及其设计表现方法，包括设计风格、应用类型、图标特点和设计要点等，并通过讲解移动电商界面中不同类型的图标制作，使读者快速掌握移动端电商图标的设计和表现方法。
Chapter03 移动端电商基本元素，主要讲解了有关移动电商设计基本元素的相关知识，主要讲解了导航和工具栏的设计方法，通过讲解不同类别移动电商基本元素的设计制作，使读者掌握移动电商基本元素设计的技巧及表现形式。
Chapter04 移动端电商广告，主要讲解了移动端电商广告的特点、类型、设计元素和要点等知识，为读者详细介绍了移动电商广告排版布局的技巧，最后通过对不同移动端电商广告界面制作过程的讲解提高读者对移动电商设计的认识。
Chapter05 移动端电商APP，主要介绍了移动端电商APP的设计要求和方法，还普及了有关电商APP的基础知识，也向读者介绍了电商APP的设计原则和注意事项，通过对多种不同APP页面的设计讲解，让读者明了电商APP在移动电商设计中所遵循的设计原则和要求。
Chapter06 移动端电商页面，主要介绍了移动电商页面布局设计的要点和设计趋势，并且依次介绍了对启动页、引导页、商品详情页、活动页的布局设计，通过讲解多种典型的移动电商界面的设计制作，使读者掌握移动电商界面的设计方法，并认识到移动电商界面的多种设计特点和风格。
本书特点
全书内容丰富、条理清晰，通过6章的内容，为读者全面、系统地介绍了各种移动电商的设计知识，以及使用Photoshop进行移动电商界面设计的方法和技巧，采用理论知识和案例相结合的方法，使知识融会贯通。
语言通俗易懂，精美案例图文同步，涉及大量移动电商设计的知识讲解，帮助读者深入了解移动电商设计。
实例涉及面广，几乎涵盖了移动电商设计中的各个领域，通过大量的设计讲解和案例制作帮助读者掌握各个领域的专业知识点。
注重设计知识点和案例制作技巧的归纳总结，知识点和案例的讲解过程中穿插了大量的软件操作技巧提示等，使读者更好地对知识点进行归纳吸收。
每一个案例的制作过程，都配有相关视频教程和素材，步骤详细，使读者轻松掌握。
参与本书编写的有高金山、张艳飞、鲁莎莎、吴潆超、田晓玉、佘秀芳、王俊萍、陈利欢、冯彤、刘明秀、解晓丽、孙慧、陈燕、胡丹丹、王明佳。书中难免有错误和疏漏之处，希望广大读者朋友批评、指正。Chapter01认识移动电商
移动互联网时代，各行各业的侵入和发展，都不可阻挡的将人们带入了移动互联的大潮中。近年来移动设备及移动互联网的发展和普及速度令人惊讶，随之也带来了全新的用户习惯和消费模式，电商在移动领域的应用也得到了很大的发展。在本章中将向读者介绍有关移动电商的相关知识，使读者对移动电商有更深入的了解和认识。1.1 了解移动电商
在移动互联网时代，随时随地浏览和操作成为用户体验最直接的要求，这也是电商模式发展的趋势之一。移动电子商务的深入开发和成熟应该早已成为可能，这大大增强了用户的体验效果。1.1.1 什么是移动电商
电子商务是利用计算机技术、网络技术和远程通信技术，实现电子化、数字化和网络化、商务化的整个商务过程。电子商务是以商务活动为主体、以计算机网络为基础、以电子化方式为手段，在法律许可范围内所进行的商务活动交易过程。电子商务中传统商业活动各环节的电子化、网络化，其最典型、最常见的代表就是淘宝网、京东商城等各大电商企业，如图1-1所示为淘宝网和京东商城的网站页面。图1-1
移动电商是指使用智能手机、平板电脑等无线终端设备进行B2B、B2C、C2C各O2O的电子商务。移动电商将因特网、移动通信技术、短距离通信技术及其他信息处理技术的完美结合，使人们可以在任何时间、任何地点进行各种商贸活动，实现随时随地、线上线下的购物与交易，在线电子支付以及各种交易活动、商务活动、金融活动和相关的综合服务活动等。如图1-2所示为移动端淘宝、京东商城和支付宝。图1-2
用户的需求决定了市场的走向。移动电商市场从用户体验上打破了传统的模式，给人以耳目一新的感觉，恰如其分地契合人们的体验需求，优秀的用户体验使之逐渐渗透到人们的生活之中。无须复杂的平台，不受时间的束缚，只需轻松触控，随时随地完成操作，将使其成为生活中一个不可或缺的消费方式。1.1.2 移动电商与传统电商的区别
电子商务包括了移动电子商务，只是我们平常狭义理解的电子商务就是在电脑上买卖东西，或者其他商务活动，但是随着移动技术的发展，很多需要在电脑上完成的工作，现在通过手机一样可以完成，这个就属于移动电子商务。
IDC（International Data Corporation，国际数据公司）认为，移动电子商务市场的发展不会是简单地由PC端向移动端迁移的过程，而将是一场以个人消费者为中心的产业模式重构。
移动电商市场吸引了许多竞争者，如PC互联网时代的电子商务巨头淘宝、京东等，跃跃欲试借助O2O转型的苏宁、国美、万达等传统零售巨头，甚至有海尔、联想等品牌厂商。在移动电商模式下，对个人消费者本身的争夺将逐步替代流量入口之争，成为产业各方获取竞争优势的关键。
各大企业需要注意的是，由于基于固定PC互联网的电子商务与移动电子商务拥有不同特征，移动电子商务不可能完全替代传统电子商务，两者是相互补充、相辅相成的。移动通信具有灵活、便捷的特点，决定了移动电子商务应该定位于大众化的个人消费领域，应该提供大众化的商务应用。1.1.3 移动电商的现状
近年来，我国移动通信业务发展迅速，无论是通信设备、基础设施还是用户规模都保持着较快的发展速度。随着移动通信业务的发展，移动互联网的商业价值正逐渐展现，得益于智能终端的普及和移动网络环境的改善，网民使用的服务从即时通信、手机阅读等相对简单的应用，拓展到移动办公、电子商务等对终端性能和无线网络环境要求较高的应用。
移动互联网因其可以为用户随时随地提供所需的服务、应用、信息和娱乐，同时满足用户及商家从众、安全、社交及自我实现的需求，使得人们对移动性和信息的需求急速上升，移动互联网已经渗透到人们生活、工作的各个领域，为移动电子商务的发展奠定了很好的基础。
传统零售业升级改造已经成为必然的发展趋势，体验式消费、生活中心增加线上体验，大数据的搜集、分析和应用将成为传统零售业新的经营利器。未来的市场必将经历一场经营体制和模式的变革，压缩中间环节，压缩经营成本，直接让利消费者，节约顾客的交通成本、时间成本、精力成本，方便消费者，才是商业经营的根本。移动电商会有更好的体现，在这样大趋势的驱使下所有的实体品牌不得不快速地打开自己的电商平台，现阶段有自己的电商销售渠道，不仅仅是为了解决实体品牌库存的问题、产品销量的问题，更是完善树立完整品牌形象的问题，实体品牌如何快速地建立起自己的电商平台，是每家实体品牌商迫在眉睫的事情。如图1-3所示为连锁服装品牌“优衣库”的移动端电商APP。图1-3
店商与电商完美结合，实现O2O最新经营模式是未来企业的首选经营之道；现在的电子商务不仅仅是某个品牌在天猫或京东上架一些产品，开个旗舰店这么简单的事情。
移动电商已经成为未来发展的必然趋势，线上线下相结合的O2O模式也将成为近期电商的主流发展方向。随着移动互联网的发展，不久的将来，移动互联网电商将逐步取代PC电商，成为电商的主流平台。1.1.4 了解移动电商的4种模式
现阶段根据移动电子商务产业链中主导者的不同，移动电商主要包括以下4种商业模式：电信运营商主导的移动电子商务、传统电子商务提供商主导的移动电子商务、设备提供商主导的电子商务，以及新兴移动电子商务提供商主导的移动电子商务。
以电信运营商为主导（如移动、电信、联通）的移动电子商务模式，拥有庞大的潜在消费用户群体这一明显的优势。
以传统电子商务提供商为主导的模式，则以品牌为导向，如淘宝网、京东商城、当当网、 阿里巴巴等广为人知的传统电子商务品牌。
以设备提供商为主导的模式，其中一个成功的例子就是苹果的App Store。
而最后一种模式，相对于其他三种模式来说，优势在于利用各种新技术结合各式各样的奇思妙想，提出完全区别于传统电子商务的“创新应用”， 通过应用来吸引用户，引导用户的消费模式。1.1.5 移动电商的应用形式
移动电商除了我们通常理解的购物外，还有许多不同的应用形式，概括起来主要包括银行业务、交易、订票、购物、娱乐、无线医疗等。
1.银行业务
移动电子商务使用户能随时随地在网上安全地进行个人财务管理，进一步完善因特网银行体系。用户可以使用其移动终端核查其账户、支付账单、进行转账以及接收付款通知等。如图1-4所示为交通银行的手机银行。
2.交易
移动电子商务具有即时性，因此非常适用于股票等交易应用。移动设备可用于接收实时财务新闻和信息，也可确认订单并安全地在线管理股票交易。如图1-5所示为移动端股票交易应用软件。图1-4图1-5
3.订票
通过因特网预定机票、车票或入场券已经发展成为一项主要业务，其规模还在继续扩大。因特网有助于方便核查票证的有无，并进行购票和确认。移动电子商务使用户能在票价优惠或航班取消时立即得到通知，也可支付票费或在旅行途中临时更改航班或车次。借助移动设备，用户可以浏览电影剪辑、阅读评论，然后订购邻近电影院的电影票。如图1-6所示为用于预定机票和酒店的“去哪儿”手机应用。
4.购物
借助移动电子商务，用户能够通过其移动通信设备进行网上购物。即兴购物会是一大增长点，如订购鲜花、礼物、食品或快餐等。传统购物也可通过移动电子商务得到改进。例如，用户可以使用“无线电子钱包”等具有安全支付功能的移动设备，在商店里或自动售货机上进行购物。如图1-7所示为团购电商“百度糯米”手机应用。图1-6
5.娱乐图1-7
移动电子商务将带来一系列娱乐服务。用户不仅可以从他们的移动设备上收听音乐，还可以订购、下载或支付特定的曲目，并且可以在网上与朋友们玩交互式游戏，还可以为游戏付费，并进行快速、安全的博彩和游戏。如图1-8所示为“网易云音乐”手机应用。
6.无线医疗
医疗产业的显著特点是每一秒种对病人都非常关键，在这一行业十分适合于移动电子商务的开展。在紧急情况下，救护车可以作为进行治疗的场所，而借助无线技术，救护车可以在移动的情况下同医疗中心和病人家属建立快速、动态、实时的数据交换，这对每一秒钟都很宝贵的紧急情况来说至关重要。在无线医疗的商业模式中，病人、医生、保险公司都可以获益，也会愿意为这项服务付费。这种服务是在时间紧迫的情形下，向专业医疗人员提供关键的医疗信息。由于医疗市场的空间非常巨大，并且提供这种服务的公司为社会创造了价值，同时，这项服务又非常容易扩展到全国乃至世界，我们相信在这整个流程中，存在着巨大的商机。如图1-9所示为无线医疗手机应用。图1-81.2 移动电商的特点图1-9
与传统电子商务相比，移动电子商务具有许多优点。例如，移动交易不受时间和地点的限制，移动交易效率高，大大节省客户的交易时间，而且移动终端的身份固定，能够向用户提供个性化移动交易服务，并且可以提供与位置相关的交易服务。移动电商将用户和商家紧密联系起来，而且这种联系将不受计算机或连接线的限制，使电子商务走向了个人。通过移动电商，用户可以随时随地获取所需要的服务、应用、信息和娱乐。1.2.1 全天候
移动交易不受时间和地点的限制，因而移动电商具有无所不在的特点，移动终端便于人们携带，可随时与人们相伴。这将使得用户能够更有效地利用空余时间来从事商业活动。移动用户可以在旅途中利用移动设备来从事商业交互活动，如商务洽淡、下订单等，这已经成为电子商务发展的新方向。移动电商市场从长远看具有超越传统电商的潜力，这是因为移动电商具有一些无可匹敌的优势，因为只有移动电商才能在任何地方、任何时间真正解决交易的问题。1.2.2 个性化
移动电商可以通过包含大量活跃和潜在用户信息的数据库（在该数据库中通常包含了用户的个人信息，如喜爱的体育活动、喜欢听的歌曲、生日信息、社会地位、收入状况、前期购买行为等），能够完全根据消费者的个性化需求和喜好来定制服务。因为移动终端用户的身份比较固定，所以能够为移动终端用户提供更加个性化的交易服务。移动电子商务的主要特点是灵活、简单、方便，移动设备的选择以及需要移动电商提供的服务与信息方式完全可以由用户自己控制。1.2.3 精准性
由于智能手机具有比微型计算机更高的贯穿力，因此移动电商的开发者可以更好地发挥主动性，为不同顾客提供精准化的服务。利用无线服务提供商提供的入口统计信息和基于移动用户当前位置的信息，商家营销可以通过具有精准化的短信服务活动进行更有针对性的广告宣传，从而满足客户的需求。要提供精准化服务，其内容传送模式的关键之处在于准确的个人信息，如用户的前期交易和偏好，与交互的时间及地点相关的当前选择。促进一位顾客进行在线预订餐厅的也可能是一个移动引导地图或吃饭前的一件事，所有这些都基于顾客的前期行为。然而，精准化将意味着顾客暴露自己的偏好及行为。如果对他们自己有利，顾客是十分愿意向公司提供个人信息的。1.2.4 安全性
尊重消费者隐私是移动电商的优势，由于智能手机具有内置的ID，在增加交易安全性的同时，也增加了消费者对隐私保护问题的关注。为了防止宣传活动在第一声手机铃声响起之前就被搞砸，商家必须强调保护消费者的隐私，要有配套的、详尽的自愿选择加入邮件列表计划。同时，为了发送定制化的信息，商家需要收集数据，这也会涉及消费者的隐私问题。因此，商家要在实现个性化和尊重消费者隐私之间进行权衡。定制化战略可以用于缓解移动交易中对安全及隐私问题的担忧。如消费者可以通过改变安全及隐私的设置来满足他们的个人需求。1.2.5 定位性
位置敏感的服务可以充分体现出移动电商的特有价值，移动电商可以提供与位置相关的交易服务，从而为用户提供相应的个性化服务。知道互联网用户的地理位置，给移动电子商务带来传统电子商务无可比拟的优势。利用这项技术，移动电商将能够更好地与特定地理位置上的用户进行信息的交互，将是今后移动电商领域比较有前途的产业化方向。当然，有的服务位置敏感，但是时间不紧迫，比如旅游景点移动广告地、自我定位服务等。这些移动电商的服务内容，根据其所处的环境不同，也都能体现出移动电商的价值。1.2.6 便利性
人们在接入电子商务活动时，不再受时间及地理位置的限制。然而，移动电商的接入方式更具便利性，使人们免受日常烦琐事务的困扰。例如，消费者在排队或陷于交通阻塞时，可以进行网上娱乐或通过移动电子商务来处理一些日常事务。消费者的舒适体验将带来生活质量的提高。移动服务的便利性使顾客更忠诚。为了使消费者享受方便快捷的服务，体验移动交易的魅力，移动电商可以从以下方面努力：提供友好的用户界面，只设定肯定及否定选项；为顾客自动地提供无处不在的计费交易服务；利用小额支付技术；提供实时的无处不在的在线拍卖活动；在任何时间、任何地点提供实时交易的便利性。1.2.7 辨识性
移动电商就是利用手机与差别化的个体进行“一对一”的沟通，以识别不同消费者之间的个性需求，以及同一消费者在不同地点、不同时间段的特定需求。例如，企业通过微信群组区分不同的消费群体。1.2.8 即时性
移动终端的便利性使得移动电商平台可以及时地与目标消费者进行沟通。要强调的是移动电商的即时性对于企业来说意味着广告发布是可以定时的。另一方面也要求在识别用户地理位置后即时触发商业行为，主动推送营销信息。如图1-10所示为商家通过手机APP主动推送信息给潜在用户。图1-101.3 移动电商与传统电商比较
移动通信技术的飞速发展、智能设备的快速普及，以及不同类型APP的迅猛增长，使互联网快速进入了双屏时代。对个人消费者而言，PC端的潜力几乎发掘殆尽，移动端已经成为了电子商务行业的下一个主战场。1.3.1 移动电商对传统电商的影响
移动端对电子商务行业的影响，主要体现在以下几个方面。
1.影响企业对多屏营销资源的投入决策
移动端和PC端有各自的优势和劣势，例如，在视频浏览方面，大屏的PC端优于移动端，而即时通信领域是移动端优于PC端。因此对不同的行业而言，要根据各自优势，在双屏时代平衡营销资源投入的着力点和比例，既不能忽略PC端用户的既有价值，又不能忽视移动端用户增长的潜力，如果能平衡营销资源，实现PC端和移动端的用户的自然过渡和平稳增长，是再好不过的事情。
2.推动企业实现用户的个性化服务
移动端有一些无与伦比的优势，第一是可以对用户的位置进行精确定位，从而对其推送所处位置周边的产品和服务；第二是可以有效利用用户的社交信息，包括用户的电话通讯录、好友信息、朋友圈等，这些信息的收集可以帮助企业对用户群体进行细分和价值判断，从而为其定制个性化的产品或者推送特定类型的产品；第三是移动端中有众多比价软件异军突起，可以让消费者随时比较各种商品的价格差异，这就逼着企业去开发更加个性化的产品或服务，使用户愿意为这种差异支付高价格。
3.移动支付发展刺激中小额消费快速增长
众多手机支付方式的出现，使得用户的中小额消费更加便捷和安全，而且使用移动端进行中小额消费，可以更加有效地碎片化时间，在消费能力高但时间资源宝贵的中高端群体中更加具有潜力，目前微信支付接入了飞机票、京东入口等，表明了这种消费趋势正在不断发展中。
4.使用户和企业的互动更加便捷，方便品牌传播
在移动端，企业可以开发自己的APP，向用户推送产品信息更加快速便捷，并且可以随时收集用户的反馈信息，更可以通过APP的优化，通过游戏参与等方式提升用户的参与度，并利用用户的社交网络进行品牌推送和宣传。也就是说移动端APP不仅可以承担销售功能，更可以通过不同形式的活动，承担品牌推广的功能。1.3.2 传统电商企业需要做什么？
面对移动终端的快速发展，传统电商企业需要做好以下对策。
1.维持PC端用户忠诚的同时，大力发展移动端，并培养PC端用户使用移动端的习惯，实现双屏模式的平稳过渡和持续增长。
2.深入研究用户行为，对用户进行细分，通过人口统计学信息、使用习惯等多维度的信息收集，实现用户细分，提供差异化的产品和服务。
3.接入不同的支付方式，方便用户购买，培养用户的消费习惯，并注重发展高消费能力人群的消费潜能。
4.电商APP设计要更加具有互动性，不仅承担销售功能，更要负责品牌传播、品牌塑造及用户态度数据收集等功能。1.4 移动电商与传统电商设计的差异化
通信技术的发展带动了无线通信技术的迅速崛起，智能手机和平板电脑等移动设备已经成为人们进行电子商务活动的首选。智能手机和平板电脑与传统的桌面设备有着巨大的差异，这种差异使得移动端电商的设计明显区别于传统电商网页。本节将向读者介绍移动电商与传统电商设计的差异。1.4.1 使用场景的差异
首先，移动互联网用户和桌面互联网用户在上网时间上有较大的区别，早上7点至10点，晚上9点至12点使用移动互联网的用户明显高于桌面互联网，移动互联网用户使用高峰期出现在晚上10点，而桌面互联网用户使用高峰出现在晚上8点。
用户利用桌面端设备登录互联网通常是在室内固定场所，环境相对安静和稳定，使用的目的多数是工作或学习。而移动电商的使用场景则呈现明显的移动化和多样化，如乘地铁、公交车时，走路时、等待时、健身时、睡前等各种场景，这些都属于用户日常工作、学习之余的零碎时间。
桌面设备通常是工作化的，大多用于完成工作、学习上的任务。智能手机是个人化的，大多用于执行微型任务，主要目的是获取信息，实现购物、娱乐和社交分享等。所以，设计者要清楚设备最适宜的使用场景，以针对这些场景中的用户习惯进行相应的设计。1.4.2 交互方式的差异
桌面设备的操作方式通常是使用鼠标、键盘进行交互的控制，这种通过鼠标、键盘的操作，精准度高，鼠标指针可以到达屏幕的任何一个部分，基本不会挡住操作对象；悬停时可以显示隐藏的对象，并帮助确认目标；同一时间只支持单一输入点；可以通过鼠标形态的变化暗示操作过程。而移动设备的交互方式要丰富许多，最常用的是手指通过点击、滑动、收缩和旋转等手势对触屏上的对象进行直接的操作，还可以通过语音的方式实现交互。移动设备的交互控制相对于桌面设备来说，支持手势操作，支持多点输入，但精准度会差一些，容易产生误操作；设备在单手操作的情况下，屏幕上的某些区域很难触摸到，手指或手掌可能会挡住操作对象；另外移动设备的交互没有悬停状态。
用户在使用手机时，多数情境下是竖屏状态下的操作，使用单手握住机器底部，使用同一只手或另一只手的拇指进行操作。其中同一只手持握并操作的情况占49%；一手持握，另一只手操作的情况占36%；双手同时持握并操作的情况仅占15%。当用户使用单手持握并使用一只手的拇指操作时，屏幕上有些区域是很难触及的。1.4.3 屏幕容量的差异
屏幕容量主要是指屏幕尺寸。传统的桌面台式机、笔记本等设备的屏幕尺寸多数大于13英寸，移动端设备常见的屏幕尺寸为2.8至10.1英寸，尺寸的不同带来了差异。传统电商网页的商品信息容量大，页面布局相对灵活，可以采用多栏的布局，导航的方式也更加丰富。而移动端电商页面，尤其手机端电商页面中商品信息容量小，在设计时除了需要提供清晰的导航、操作逻辑和引导来帮助用户了解当前在哪，以及接下来该做什么外，还应该考虑到控件之间的相互干扰。如图1-11所示为使用电脑和手机浏览淘宝网的效果。图1-111.4.4 信息组织的差异
对于传统的电商页面，用户使用时的专注度会比较高，同时屏幕容量大，交互操作容易，因此传统电商页面的信息组织相对比较灵活，可以针对电商本身的规模呈现宽而深或窄而深的层级关系。而移动端电商受到移动设备屏幕容量的限制，在内容的展示方式上会针对功能和用户需求进行细化和简化。同时，用户需要通过更多的页面之间的跳转实现信息的获取，而跳转的速度又限于设备本身的性能。因此，移动端电商的信息组织与设计更加重视提高单页信息传输能力，尽量减少跨页信息传递，通过压缩或拉宽信息组织结构来避免因反复切换页面而造成的用户流失。因此，在内容的层级组织上，通常会呈现出宽而浅或窄而浅的层级样式。如图1-12所示为电脑端的当当网首页，在页面顶部和左侧详细地列出了商品的分类。如图1-13所示为手机端的当当网应用，在首页中使用功能图标的方式列出重点商品分类，如果用户需要查看详细的商品分类则需要在底部单击“分类”选项，切换到分类页面中显示商品的详细分类。图1-12图1-131.4.5 导航系统的差异
导航系统关注的是如何浏览信息。导航的作用是告诉用户当前的位置，怎么返回原来的地方，它是信息架构的视觉表现。在传统电商向移动电商发展的过程中，要对原导航进行一定的删减、隐藏、组织，以更好地适应移动端屏幕的特性，特别要把握目标用户的本质需求，结合移动电商的使用场景、用户的使用习惯以及软件、硬件特性等进行导航的再设计。比如亚马逊移动端导航的设计进行了重新的组织规划，原来的分类导航改变为列表式导航，对商品的分类进行重新规划，并为用户提供热门分类，每个类里的内容不超过7项，这是一个逐步精简和重新规划的过程，如图1-14所示。图1-14
由于移动端特性，移动电商采用的导航主要有顶部扩展菜单、标签导航、列表式导航等，如图1-15所示。图1-151.5 移动端电商视觉设计原则
任何视觉设计的表达都具有一定的意图和要求，有明确的主题，然后按照视觉心理规律和形式将主题主动地传达给浏览者。诉求的目的是使主题在适当的环境里被用户及时地理解和接受，以满足用户的使用和需求。1.5.1 功能性原则
移动端电商的设计首先应该满足用户的实际需求，即传递商品信息，用户能够通过移动电商轻松、快捷地获取想要的商品信息。如果不能做到这一点，移动端电商的建立是没有意义的，也无法生存下去。也就是说，在进行移动端电商设计时，形式应该首先服务于功能，做到形式与内容的统一。
移动端电商首页通常会提供当时当季的产品推荐或最新的商品促销活动信息，引导用户购物。当用户进入商品详情页面时，则会将该款商品的详情充分展示出来，如图1-16所示。图1-161.5.2 可视性原则
可视性是信息本身的重要特征，也是提高移动端电商易用性的因素之一。用户在浏览移动电商页面的过程中，是将众多可视的符号通过人脑的认知而获取有效的信息，移动电商页面的视觉设计就是要利用这些可视的信息进行合理的设计。
1.简洁的形式
移动设备的特性决定了移动端电商页面的设计必须简洁。移动端电商页面要求在最短的时间内抓住用户的视线，吸引用户的注意力，并且能够做到一扫而过就能找到需要的商品，任何多余的无效内容都会影响商品信息传达的速度，这就是信息传达的高效性，要做到这一点，简洁是最有效的方式。
要做到简洁，就要删除不必要的因素，把必须留下来的信息进行合理的组织。当去掉页面中的装饰性元素的时候，商品图片和信息就成了主角，这便于用户浏览。如图1-17所示为设计简洁的移动端电商应用。
2.可阅读的文字
从功能性的角度来说，文字是最直接、最准确的视觉沟通及认知方式，是最能够准确表达信息的媒介。在许多移动端电商页面中都是以商品图片为主，而文字也起到至关重要的作用，从宏观的角度看其功能主要有两种，一种是传递商品信息，即描述商品的名称、价格及功能等信息内容；另一种功能是传递商品的情感，目的是通过文字传递情况，强化页面的视觉风格，这是文字的辅助功能。
提高移动端电商页面中文字阅读舒适度的重点是提高文字的易读性和可读性。易读性是指一套字型中由字母形状特征所决定的不同字母的可辨识度，而可读性是指文字在页面中是否便于理解。如图1-18所示为移动端电商应用中文字的处理。图1-17图1-18
3.有效的色彩搭配
色彩是人类认知事物的重要媒介之一，色彩设计同样是移动端电商设计中的重要组成部分。相对于文字来说，色彩对于用户视觉体验的影响更加强烈，合适、有效的配色能够起到提示页面主题、强化页面风格、吸引浏览者注意等重要的作用。设计者要理解色彩的本质和特性、色彩表现的规律、色彩的心理效应等，这样才能根据移动端电商页面的主题选择合适的颜色、提高色彩的使用效率。如图1-19所示为移动端电商应用中的色彩搭配处理。图1-19
4.清晰的视觉流程
通俗地说，移动端电商页面的视觉流程是用户在浏览页面时视觉流动的轨迹。用户浏览页面的顺序一般是视线水平方向稍上的位置，视线一般从左向右流动，垂直方向视线一般从上向下流动。
理论上讲，视觉的感知过程包括三个连续的阶段：
第一阶段为视觉第一印象，依靠视觉冲击力较强的元素获得；
第二阶段为对视觉信息进行全面的理解和接受；
第三阶段为留下印象和记忆。
而实际的浏览过程通常是这样的，一种情况是，用户的浏览不带有目的性，只想随便看看，在瞬间建立了对页面的初步印象后，如果看到自己感兴趣的商品会直接点击进入；还有一种情况是，用户打开该移动端电商页面时带有极强的目的性，用户并不会仔细看页面中的所有商品信息，而是通过搜索查找自己的目标商品。在这个过程中，用户如果遇到与搜索目标无关，却能够吸引自己的商品等，可能会放下目标转而点击自己感兴趣的商品，之后再回到原目标。
因此，如果能通过建立主次、先后的信息传递秩序，让用户在搜索的过程中接收到页面希望传递给用户的推荐商品信息，就能实现商品的有效传递，体现移动电商的设计本质。要做到这一点，就要在移动电商页面中建立清晰的视觉层次，组织设计形式完成对用户的引导。如图1-20所示为视觉层次清晰的移动端电商应用。图1-201.5.3 统一性原则
移动端电商视觉风格统一性原则包含三层意义：第一层是内容与形式的统一；第二层是整体形象的统一；第三层是各层级页面的统一。
所谓内容与形式的统一是指移动电商的视觉风格和表达形式应该符合该电商的定位，能够在用户第一眼看到页面时就形成与电商的核心目标一致的初步印象。如图1-21所示为移动端电商应用，使用非常简洁的设计风格，以纯白色为背景，在页面中规则排列相关的商品图片和文字内容，给人一种非常简洁、大方的印象。图1-21
所谓整体形象的统一，一方面是指移动电商中的各种视觉要素，以及各层级能够具有整体性和延续性。另一方面是指移动电商的视觉风格与品牌形象、企业文化的统一。如图1-22所示为移动端电商应用，运用中国传统元素、采用直排文字的方式，这些都与该品牌的产品形象相统一，给人一种复古、传统的风格。
移动端电商同样是由多个具有层级链接的页面构成的，移动电商的视觉风格不是仅体现在一个页面上，而是贯穿整个电商的所有页面，体现在用户使用该移动电商的过程中，保证用户对移动电商有一个统一的印象和使用习惯，如图1-23所示。图1-22图1-231.6 本章小结
相对于传统PC终端的电商，移动端电商显然有着更大的优势，传统互联网企业、PC端电商企业纷纷加入移动互联网布局。本章向读者介绍了有关移动电商的相关知识，以及移动电商设计原则等内容，通过本章内容的学习，可以使读者对移动电商有更加深入的了解和认识。Chapter02移动端电商图标
图标是在移动设备中启动电商应用的入口，设计精致的电商图标能够给用户留下深刻的印象，并且能够为用户在移动端的电商应用中提供更加便捷的操作，大大提升用户体验。在本章中将向读者介绍有关移动端电商图标设计的相关知识。2.1 图标设计风格
图标在移动电商中的应用非常广泛，是电商应用设计中非常重要的设计元素。随着科技的发展、社会的进步，人们对美、时尚、趣味和质感的不断追求，图标设计呈现出百花齐放的局面，越来越多精致、新颖、富有创造力和人性化的图标涌入浏览者的视野。2.1.1 拟物化图标
拟物化图标除了能够带给用户逼真的感觉外，还会带给用户华丽感。通常拟物化图标的效果要比真实对象更好，因为在设计图标时会将一些不和谐的内容进行美化处理，例如不均匀的颜色和阴影、不清晰的纹理等，通过处理使拟物化图标的效果看起来更加真实、细腻、美观，给人很强烈的视觉感受。
在移动电商的设计中，拟物化图标的应用并不是很多，因为手机屏幕尺寸有限，拟物化图标如果尺寸过小，则很难看到其精致的细节效果，反而会给用户带来识别上的困难，如图2-1所示。图2-1
但是一些电商应用的启动图标还是会通过使用拟物化的设计表现出精致的视觉效果。如图2-2所示为采用拟物化设计的移动电商应用启动图标。图2-22.1.2 扁平化图标
扁平化图标在软件界面设计中的应用越来越多，因其简洁、大方、直观和易用等特点，越来越受到人们的喜爱和欢迎。
扁平化风格图标设计的核心是在设计中摒弃高光、阴影、纹理和渐变等装饰性效果，通过符号化或简化的图形设计元素来表现。在扁平化设计中去除了冗余的效果和交互，其交互核心在于突出功能本身的使用。如图2-3所示为移动电商应用中的扁平化图标设计。图2-3
随着扁平化设计趋势的流行，一些设计师将某些细微的效果融入到整体的扁平化设计中，使其成为一种独特的效果，例如在图标设计中加入微渐变和阴影，从而使这种风格成为其特色，产生一种类扁平化的效果。如图2-4所示为移动电商应用中的类扁平化图标设计。图2-4
类扁平化设计比单纯的扁平化更具有适用性和灵活性。在类扁平化设计中，设计师可以为某些元素添加适当的阴影或微渐变效果，用户也很容易接受这种类扁平化的设计。2.1.3 简约图标
近年来，随着人们对美的认知发生改变，越来越多的设计向简约、精致的方向发展，通过简单的图形和合理的色彩搭配构成简约的图标，给人感觉简约、清晰、实用、一目了然。
简约软件图标的制作方法看似简单，但其蕴含的喻意却非常丰富，每一个象形图标都只能代表一个含义，否则会给用户带来错误的引导。如图2-5所示为移动电商应用中的简约图标设计。图2-52.1.4 线框图标
线框图标也属于简约风格的图标，随着扁平化设计风格的流行，在移动电商中的应用越来越多。在线框图标的绘制过程中，尽量只使用直线和45度细线条进行绘制，可以通过显示网格辅助图标的绘制。
线框图标通常只保留了需要表现的功能的外形轮廓，切记在线框图标的设计中细节不要过多，否则会导致图标意义的混乱。如图2-6所示为移动电商应用中的线框图标设计。图2-6
图标是一种小的可视控件，是界面设计中的指示路牌，以最便捷、简单的方式指引浏览者获取其想要的信息资源。图标是具有明确指代含义的计算机图形。例如，操作系统桌面图标是软件操作快捷方式的标识，而在移动电商应用中的图标是操作功能的标识。
试读结束[说明：试读内容隐藏了图片]