关于首页的内容比较多，我分成两篇，文章有点长，希望大家能看完有点耐心，相信大家都会有所收获，我的努力也没有白费。老规矩，先来看看整体结构：△以下图片来自应用截图，仅供学习交流使用。1.进入首页前授权弹窗。授权弹窗或促销弹窗，这些授权弹窗的出现无可厚非，用户只能通过授权的产品才能正常操作和使用某项功能；授权弹窗也是操作系统安全机制的一部分，会涉及到用户的安全和隐私。近期，Facebook用户信息泄露事件频发。相信很多用户只会有更强的隐私保护意识。试想一下，用户还没有使用过产品，此时对产品的信任度较低，所以需要用户授权弹窗***具有更高的权限，也是必要的授权。比如常见的有：网络授权、消息通知授权、获取位置、相机/相册授权....不要弹尽脑汁让用户授权。会给用户带来不必要的麻烦，体验会很差。这个相信大家都知道，比如：麦克风，日历，蓝牙，通讯录等等，用到这个功能都会弹出。因为系统不同，授权弹窗也会有些不同。iOS相对来说更尊重用户。消息通知授权和网络授权都需要用户权限，而Android则不需要。与iOS相比，它要好一些。说到网络授权，之前有朋友跟我讨论过这个问题，就是有的产品有网络授权，有的产品没有。自iOS10推出以来，苹果提供了一个弹出窗口，要求用户授权允许中国大陆的“无线局域网和蜂窝移动网络”。它应该在用户第一次打开应用程序时出现，在注册和登录之前。相当高，因为没有互联网就无事可做。授权弹窗的设计可以直接使用系统模态弹窗的样式。iOS和Android弹窗的风格有些不同。iOS除了系统的固定文字外，还可以配备必要的说明文字，告知授权的重要性和重要性。授权的后果，而Android只能是固定文本的系统，相比iOS要好一点。现在大部分用户都非常熟悉这种弹窗的重要性，一次性授权的通过率也非常高。这里我还要提一下：iOS只能出现一个授权弹窗，而Android比较特殊，下次登录的时候也会弹出一个授权弹窗，也可以点击NoReminder。如果iOS用户第一次拒绝授权，产品还有机会获得第二次授权。比如电商商品消息通知的授权，我一般不授权，因为我不喜欢被促销信息打扰（这个只是我个人习惯了，不知道大家有没有同），但是这种授权对于电商产品来说是非常重要的。再次登录产品时，会弹出弹窗提醒用户打开消息通知，但这里不同的是，点击授权是使用深层链接（deep-link）直接跳转到系统设置开启相应的授权，会比较繁琐。还有一类情况是使用引导方式在页面开启权限，无关授权弹窗的内容这里不再赘述。当然，有些产品非常智能。在授权弹窗出现之前，会使用预授权机制（pre-permission）来测试用户是否会授权。或图示），点击按钮后，会弹出系统授权弹窗。这样可以避免繁琐的二次授权，运营成本会比较高。能做到这一点的产品比较少见。宣传弹窗的内容这里就不多说了。之前的文章中有提到，可以点击文章底部的链接查看。2.下拉刷新下拉刷新相信大家都是家常便饭了。几乎所有的产品都会有这个功能。这种互动起源于推特，逐渐流行起来。下拉刷新不仅在首页有。普遍存在于产品的许多页面中。下拉刷新过程：页面整体下拉，顶部出现提示文字“松开刷新”——松开后，显示旋转动画+“正在刷新”——刷新成功后，动画消失（toast提示刷新数据状态），页面自动Top/刷新失败，会给出toast提示。全程保持动态效果的可见性，在刷新结束出现数据后隐藏动态效果，用户在刷新过程中可以继续操作，不是说什么都不能在刷新过程中完成；刷新结果按照时间排序，即最新的数据排在最前面；如果用户在短时间内进行了多次下拉刷新，则需要toast提醒（比如“你的操作太频繁了”），防止出现页面卡顿或者服务器请求失败的情况。下拉刷新的动画设计越来越多样化。不再局限于早期系统的刷新样式。各大产品都设计了各具特色的刷新动画，融入自己的品牌基因，并加入有趣生动的文案，给人以惊喜感，加深用户对产品的印象。这种方法可以用于多种目的。这里也有必要提一下自动刷新。之前有朋友跟我说，为什么产品不能自动刷新？进入首页会自动刷新动态数据，方便阅读；还有数据常用的产品，比如实时查看数据增长，自动刷新是很有必要的。但是为什么一般的产品在使用过程中还是采用下拉刷新而不是自动刷新呢？想象一下，当你在刷朋友圈、微博、知乎等，系统在设定的时间段内自动刷新，你正在欣赏一条新闻，数据突然自动刷新，正在阅读的新闻可能被挤到谷底。相信这样的体验对于用户来说将是一场灾难。3.不断下拉进入产品二层。上面提到的是下拉刷新。这里要说的是，首页连续下拉会进入的页面是二楼活动页面或者其他功能页面。这是对下拉刷新基础的颠覆。相信这一功能的出现会让用户眼前一亮。在我的记忆中，最后一个这样做的是淘宝。好像京东搞活动的时候也是这么干的，记不太清了。目前淘宝首页的整体持续下拉是《一千零一夜》的一个活动，是一种短视频+相关商品+UGC的方式，给用户一个完整的购物体验。这种方法与广告行业的营销相同。我看了，每一个短视频的播放音量都是100%。视频体验非常好。基本上，它先讲一个故事。播放或点击暂停后，会出现相关产品。您可以单击以输入产品详细信息。进行购买。但是光有产品是不够的，用户评价也很重要，就像我们平时购物一样，我们一定会关注您的评价。此外，还将鼓励用户订阅和分享，也期待用户产出更多的UGC内容。总的来说，整体的方法更具有说服力，也更容易被用户接受。早期微信6.6.1版本更新后，首页下拉出现了小程序的快捷入口，可以更快捷的找到最近使用的小程序，省去不少步骤。如果继续下拉整个页面，会出现“这不是入口”的提示文案，也是不错的体验。记忆中的早期副本比较好玩，现在应该换掉了。还有一点值得一提的是，盒马二楼是专门销售成人用品的“禾尔萌”商家。当我第一次了解到这个模块时，我有点惊讶。毕竟，盒马是一家以生鲜为主的电商，居然玩跨界突然开始卖成人用品，规模是不是有点大了？可能市场对成人用品的需求比较大。毕竟，大多数成人用品都是在网上购买的。毕竟很多人在线下购买的时候可能会觉得有些尴尬。私密性得不到保证，价格也比较贵。盒马想和阿里、网易分一杯羹也无可厚非。Heermont的三大竞争力是：品质保证、30分钟送达、私密包装。我相信光是“30分钟内送达”就足够有竞争力了。为什么禾尔萌在二楼卖？也许盒马的主营业务毕竟是生鲜。总觉得生鲜和成人用品一起卖会有点奇怪。放在二楼可以保证两个模块。独立，不能互相打扰。可能有些产品主页也有二楼的功能。我就不一一举例了。如果您有兴趣，请自行研究。4.城市/地址定位定位功能相信大家都不陌生。在获得用户定位授权后，产品可以根据定位范围提供相应的服务。功能很常见，比如电子商务、团购、社交（做社区）等；每次用户进入产品首页，位置都会刷新，一般都是很准确的，除非需要更改位置，否则用户不会想到去点击。定位功能往往出现在首页搜索框的左侧，但对于一些产品的发展来说，首页是最好的，比如电商、社交类产品。用户一般会在个人信息中添加多个收货地址。下单时直接选择地址即可，用户无需经常更换地址，现在首页地址入口直接隐藏；对于团购或需要提供及时配送服务的产品，用户需要方便的查看和更改位置，因此该类目所有产品保留首页定位功能。下面举两个例子来说明：美团首页顶部保留了定位功能的入口。考虑到用户的使用场景，用户可以通过产品查看和定位全市范围内的所有团购服务。准确定位区/县/市等就够了，如果需要查看其他区域需求，方便用户点击切换。点击地点进入地点页面，组成结构：直搜城市（方便快速选择新城市）+国内/海外tab+当前城市+切换城市+热门城市+所有城市（按字母索引，按顺序排序）城市的首字母，可以快速找到选择字母下的所有城市）。美团外卖首页顶部的定位是精确到具体地址的，因为平台需要在用户定位范围X公里内做美食推荐。点击地址进入送货地址页面，其中包括：城市切换（比如给异地亲友订餐时）+搜索送货地址（搜索当前选择城市的具体地址）+当前位置+搬家+我的收货地址（地址标签）+附近地址（方便快速选择新地址）+新地址（这个功能很有必要，可以快速链接到新地址页面）。这种页面构成常见于要求及时发货的平台，因为需要考虑商品的时效性，需要当天/1小时内发货等。例如：饿了么、每日优鲜、盒马……不同的产品有不同的定位功能。诉求不同：电商首页顶部不保留定位功能入口；团购产品首页定位区/县/市等；外卖/外卖产品首页需定位具体地址；具体应用可根据产品需要进行。5.搜索模块搜索功能几乎是所有产品的标配，也是必不可少的功能之一，因为搜索不仅可以帮助用户方便快捷的找到自己要找的东西，还可以通过搜索进行相关的大数据分析用户的历史搜索，在“猜你喜欢”模块中，可以向用户推荐你可能感兴趣的商品，引导用户购买。搜索入口一般有两种形式，一种是搜索框，另一种是点击搜索图标进入搜索页面。先说说搜索框。这种形式是最常见的，因为搜索框是一种直观的形式。大多数产品都采用这种方式，因为用户一进入首页就可以看到。这种形式比较常见，它的组成是：搜索框+搜索图标+热搜关键词（+扫描/相机扫描识别），热搜关键词根据运营需要或数据推荐不定期更换，如果热搜词恰到好处如果用户感兴趣，可以点击搜索框进入搜索页面，直接点击搜索，省去了输入关键词的繁琐步骤；当然，也有相当多的产品使用了二次搜索图标，这在垂直电商中很常见。这类产品弱化了搜索功能，搜索内容可能不是用户的主要诉求，用户只想进来随便逛逛。进入搜索页面后，主要组成部分为：搜索框+搜索图标+热搜关键词（+扫描/相机扫描识别）+关键词关联+清除关键词按钮+返回/取消/搜索按钮（+分类标签）+历史搜索+清除搜索记录（+热门搜索）（+语音输入）+输入键盘（搜索按钮）；详细解释如下：扫描/相机扫描识别：通过扫描条码或商品进行识别，得到搜索结果和相似商品；关键词预测：这个功能很重要，可以减少用户输入，每输入一个字段，需要加载一次，并显示预测结果，方便用户快速找到目标搜索目的;清除关键字按钮：一键快速清除错误关键字或新关键字；返回/取消/搜索按钮：如果搜索框左侧没有返回按钮，右侧会有一个取消按钮；如果左边有返回按钮，右边的取消按钮可以变成搜索按钮；分类标签：搜索当前分类下的关键词，更快更准确；历史搜索+清除搜索记录：保留历史搜索记录，方便用户再次点击搜索，避免重复操作。当然，删除搜索记录也很方便。必要的，可以减少页面无用信息的比例，也可以有效保护用户的搜索隐私；热搜：可能是搜索热度高的关键词；运营中需要推广的关键词；大数据推荐猜你感兴趣的关键词；语音输入：用户直接通过语音说出关键词，省去输入步骤，方便老年人/残疾人或特殊场景使用搜索功能；输入键盘：进入搜索页面时默认弹出键盘；搜索按钮***设置在键盘上会更方便；关键词输入完成后，用户上下滑动查看搜索结果时，键盘会自动关闭；产品详情和搜索结果页内容的区别有很多功能。有机会再详细说。6.扫一扫相信扫一扫功能是几乎每天都会用到的功能。二维码支付已经充斥在我们生活的方方面面。微信/支付宝的扫一扫功能相信大家每天都会用到，而且这个功能越来越强大，不仅可以扫二维码，甚至可以识别手机相册中照片上的二维码；找几款比较有代表性的产品来分析扫一扫的功能：微信：扫码识别+相册二维码识别+书籍/光盘封面识别+街景识别（定位功能）+文字图片翻译+操作文字提示+手电筒（环境光暗时出现，用户体验很好）；支付宝：页面布局和交互与微信类似，不同的是页面底部的AR标签；AR扫描相信每个人都体验过。春节期间，AR扫描幸运字和红包也很受欢迎；淘宝：底部AR/扫码/图片识别标签（标签切换会有动态效果）+识别历史+相册图片二维码识别+手电筒+帮助+操作文字提示+广告；京东：顶部扫码识别/拍照识别/AR标签+识别历史+交易记录+输入条码+操作文字提示+手电筒+支付码/支付优惠/相册照片二维码识别/底部会员码；看不出页面底部放置支付码/支付折扣/会员码功能的用意，点击跳转到下级页面，是不是有点多余？相册照片的二维码识别功能不要与它穿插。个人感觉体验不是很好。对比以上四种扫描功能，可以看出用户的核心诉求是扫描二维码进行身份识别，其他一些功能可以作为自身特色和产品差异化。最重要的是做好核心诉求的交互体验，所以进入扫描页面，扫描二维码必须是默认页面，应该作为首要功能；操作过程中的文字提示和引导也很重要，及时告知用户如何使用，避免无法识别和长时间使用的挫折感；此外，当判断环境光线较差时，也需要及时提示打开手电筒，因为用户很可能会忽略。微信、支付宝、京东都做到了这一点。总结文章有点长，前半部分只讲了首页置顶的一些内容。可能有些功能不常用。这里我就不多说了。整体写的感觉内容挺多的。如有不足之处，可以留言讨论，总之希望能为大家有所收获，下半篇尽快更新。
