前言

设计的思考不仅要注重表象层面，也需要围绕信息传达这一设计的本质功能，以充满自省的精神深化和反思自己的设计意识，即做到“好看、好用”。在设计过程中，要站在公司的利益上，懂用户所想，在每一个关键点都要带给用户意想不到的惊喜，这些往往都是通过细节体现出来的。

2021 | 第01篇分享目录（001~015）

001.「夸克浏览器」首个页面-我的地盘我做主

002.「百度」为什么把返回按钮放在了左下角？

003.「优酷」弹幕中毫不违和感的广告推送

004.「QQ」发送图片-便捷的交互路径

005.「美团」减少一步操作、提升一级体验

006.「京东」搜索框-触发用户转化动机的占位符

007.「腾讯视频」付费片-试看6分钟的激进小心思

008.「高德地图」模拟现实事物运行规律的微交互

009.「网易云音乐」定制您的专属首页

010.「夸克浏览器」关键词-提前预知用户的需求

011.「快手」刚刚看多-贴心的用户提醒

012.「腾讯视频」VIP栏目-免费营销策略转化用户

013.「支付宝」城市天气-不仅仅是天气预报

014.「躺平」趣味化的下拉刷新样式

015.「滴滴打车」添加途经点-解决位置不统一的情况

001.「夸克浏览器」首个页面-我的地盘我做主

产品体验：

进入夸克浏览器的首个页面，除此必要的元素之外，看到的是一片纯净之美。长按搜索框下方的空白区域，点击“+”号，可根据用户自己的喜好从弹窗中将想要的站点入口添加到搜索页，便于快捷访问。

设计思考：

UC浏览器可能不是每个移动端用户都知道，但绝对是一方霸主，夸克与UC本是一家。昨天在网上看到一个帖子说“自从用了夸克之后就把别的浏览器全部删掉了，没有天气挂件、没有新闻推送、没有购物频道、没有游戏插件、没有精准广告、就是最原始的上网工具，仿佛在这看到了当年的塞班时代一心一意做用户体验的影子”。迄今为止，没有任何一个应用可以满足所有用户的需求，UC浏览器也是如此，夸克可以将那些视UC为粪土的用户给揽过来，表面上看似抢夺用户，实则是风险对冲，当一个出了问题不是还有另一个么？用户不管是在夸克还是UC，其实都在自家，一个独善其身，一个兼济天下。

用过手机浏览器的人都知道，在资讯爆炸的今天，夸克的画面干净得令人难以置信。在干净的同时，并非是缺少这些站点模块，而是放在了暗处，用户可以根据自己的喜好将站点咨询模块调用出来，自定义空白区域，寓意用户“自己的地盘自己做主”。众所周知，大多数浏览器都有站点推荐的功能，不过该功能都是给相应网站打广告的，内容沉杂，尤其是一些强制性的内容让用户产生了逆反心理，而夸克精选中的网站，则是一些价值很高的优秀站点，并非广告业务，这点可以从致用户的一封信和网站类型得出。这也是夸克被誉为最纯净浏览器的原因之一，不管是APP内容还是用户体验、易用性方面都能提升用户的忠诚度，深得广大用户喜爱。

002.「百度」为什么把返回按按钮放在了左下角？

产品体验：

进入百度APP，页面中80%以上的返回操作入口都放置在左下角，单手操作手机的用户触手可及。

设计思考：

Android智能设备的返回入口其实一直都在屏幕下方，只不过是根据品牌的不同，左右位置不同而已。根据后来大屏手机的普及，为了节约空间资源，使屏幕最大化的被使用，把原先硬件上的部分操作入口给隐藏了，但一直都存在。设计师都知道，iOS与Android的设计规范存在着差异化，比如返回入口就一直在左上角，虽然也有右滑返回的交互手势，但毕竟是隐藏的，而且对于部分页面的左右滑动，只能对tab导航起到作用，基于目前的趋势，手机的屏幕越来越大，单手操作的灵活性就成了难点。

百度APP的大部分页面则是把返回按钮直接从左上角搬到了左下角，被较为激进的用户称为反人类的设计，其实并非如此。大屏幕尺寸已经是趋势，屏幕大意味着内容可以更大限度地得到展示，将返回按钮放在左下角能有效的解决的用户单手操作大屏幕手机操作的难点，更易于操作，提升便捷性。更有效的防止用户因操作困难而导致手机滑落（碎屏），增加安全系数。

003.「优酷」弹幕中毫不违和感的广告推送

产品体验：

在优酷观看视频打开弹幕后，每隔几分钟，系统会推送一条广告穿插在弹幕的内容中，点击可进入对应的页面。

设计思考：

在互联网产品中，花样广告的出场方式屡见不鲜，比如在看视频、看书之前/过程中，总是被突入起来的的广告打断，用户虽然很烦但别无选择，毕竟没有一款真正的既免费又免广告还很牛B的产品无偿提供给用户使用，即便用户觉得自己没有认真看过这些广告，但是只要它们在用户面前完成了播放，哪怕只是听到了，那就完成了品牌意识 的输出这个过程，可能会无形中就知道了这个品牌的存在和定位，在未来的某个场景中，用户会默许和遵从这个品牌的输出方式，乃至消费。广告作为企业盈利的一种方式，不可避免，只会在尽可能减少用户反感或抗拒的情况下自然出现。

优酷APP用了一种较为新奇的方式植入广告，基于很多用户在看视频时都有开弹幕的习惯，直接将广告穿插在了弹幕区域，每间隔几分钟就会推送一条，跟随弹幕一起流动，毫无违和感。虽然广告植入会引起用户的反感，但以弹幕的方式出现，并未占用额外空间及打扰用户观看视频，很大程度上降低了对用户的打扰及观看视频的沉浸体验，增加了用户对广告的接受程度，如果对某个广告感兴趣，点击后面的入口即可直接跳转对应的内容页面。

004.「QQ」发送图片-便捷的交互路径

产品体验：

在QQ聊天对话框，点击工具栏的图片入口调出相册，按住想要发送的图片并往上拖动，松手即可发送。

设计思考：

我们下载到手机的APP，大部分在首次打开时都会弹出一系列的系统权限，比如相册、相机、位置、网络...等，社交类型的更是不必多说，基于应用本身的性质，相册、相机及通讯录类型的权限都是必备开启状态，以便于在使用过程中的图片、视频交流。

QQ开启相册权限后在用户体验上更是举一反三，用户在聊天过程中如果有使用图片的需求，点击后，系统会将手机最近保存的50张图片，按照时间的先后顺序以完整缩略图的方式直接显示在聊天界面的工具栏下方，用户只需按住想要选择的图片并往上拖动，松手即可发送，非常方便，免去了常规的触发跳转页面调取相册的多步骤操作，且有效降低聊天过程中因页面跳转带来的沉浸式的视觉思路阻断，优化了操作路径，提升产品的易用性。

005.「美团」减少一步操作、提升一级体验

产品体验：

在美团订单列表页面，单击其中一个订单从右侧向最左侧滑动，即可出现弹出提示，点击删除完成操作。

设计思考：

删除操作，我们一点也陌生，大部分出现在列表类型的页面。早期智能设备的删除入口基本都是通过右上角编辑或单个内容区域明显的删除图标入口以完成对应的删除需求。后来，也不乏一些应用为了节省页面空间，去掉了明面上的删除入口，通过长按交互操作来完成删除流程，但时至今日，并不广为人知。

美团APP的订单列表，只需将单个内容从右滑至最左侧，从自动出现的弹窗中完成删除操作。其实这种交互方式在目前看来并不新鲜，基本普及了，但关注细节的用户会发现，大部分APP内容的删除，都是在左滑之后调出删除入口，需点击之后才弹出确认框，继而完成删除。美团APP则是在用户有明确删除需求的情况，从右至左大区域滑动并自动触发删除入口，省去点击触发弹窗的操作步骤，正所谓移动界面、体验至上，减少一步操作，就能提升一级体验。

（除了需要对用户的删除操作做出挽留、有营销的多功能隐藏入口外，如无明确需求，建议省略左滑后需要再次点击触发弹窗的这一步操作）

006.「京东」搜索框-触发用户转化动机的占位符

产品体验：

京东搜索框的占位符，会根据用户曾经搜索或查看过的商品关键词进行提示，每2秒钟切换一次，以便提醒用户再次查找之前可能想购买的的商品。

设计思考：

占位符就是在输入框中占住一个固定的位置，然后用户可以根据文案描述或提示语来明确每个表单输入框应当填什么内容，并且能够促进表单输入完成和提高转化率所存在的一个元素。最为常见的就是“请输入xxx”一段提示性质的文案，但如果把占位符的作用仅限于此，那就太浪费资源了。

京东APP搜索框的占位符开启了自动搜索建议机制，不仅展示了平台主推、热门等部分商品的关键词，还通过动态预测用户查询方向，曾经搜索或浏览过的商品关键词会替代占位符给予用户提示。比如用户搜索或购买过狗粮，后续进入APP，系统就以占位符的方式推荐跟小狗相关的商品，比如狗窝、驱虫药、罐头等，虽然不能直接进行搜索，但足以唤醒无目标用户的购物记忆，帮助用户明确购物需求，以便用于迅速作出决策、执行操作，起到提升下单转化的推动作用。

007.「腾讯视频」付费片-试看6分钟的激进小心思

产品体验：

观看腾讯视频付费影片，可免费试看6分钟，时间到了会自动暂停并弹出付费渠道弹窗，付费/放弃观看二选一。

设计思考：

广告和影片付费对视频类型的应用来说，是两个非常重要的盈利渠道。平台除了日常的维护费用外，且不说影片的质量怎么样，单是购买版权就是很大一笔费用，所以收费也是合情合理，用户通常可以通过购买单片或开通平台VIP观看付费影片。使用过腾讯视频的用户都知道，付费影片可以免费试看6分钟，那么为什么不是直接放在付费区域，只对付费用户开放呢？

腾讯视频的试看其实相当于打开用户的潘多拉魔盒，大部分影片6分钟基本已初入剧情，能吊足胃口，激发用户看下去的兴趣，如果用户不喜欢，也有自己选择的权利。通过一小段的试看把付费片的部分价值明确告知用户，用细节不断触达用户心智，达到吸引用户、引导用户转化目的。另外，很多用户都倾向于回报别人的好意，投之以木桃，报之以琼瑶，通过免费时间段的观看，碍于面子心理，也有可能触发用户的付费动机（这个不难理解，比如我们路过某个熟人的水果摊，每次都会叫我们去尝一下，久而久之，即使没有购买需求，碍于面子，多少也会买一点），从而形成转化，为平台带来收益。

008.「高德地图」模拟现实事物运行规律的微交互

产品体验：

高德地图规划路线后，选择出行方式时，用模拟现实事务的微动效图标+文案提示对应的出行方式，直观且趣味的表现方式更有代入感。

设计思考：

我们经常在网上看到这样的问题“高德地图与百度地图到底哪个好用”，准确的说是各有千秋，高德地图用户略多于百度地图，若论起用户使用体验，两家的应用一点都不含糊。在导航软件作为用户出行必备软件之一的今天，不仅仅是认路，更是用户在外吃、喝、玩、乐的一款综合体，其用户体验一直都是企业研究的重点。

使用高德地图选择出行时，出行方式图标以模拟现实事物的运行规律， 利用现有认知，帮助用户轻松掌握界面的使用方式，缩短对出行方式的理解时间， 的降低用户的学习成本。同时图标动效的展现方式，能增加趣味性、以及用户对于界面功能直接操纵的感知，降低操作难度，用情感化方式的表现，提升用户粘性。

009.「网易云音乐」定制您的专属首页

产品体验：

在网易云音乐首页，将页面向上滑至底部，进入自定义排序功能，即可定制用户自己喜欢的专属首页样式以及功能模块的先后顺序。

设计思考：

很多设计团队都深知用户体验至上的道理，但一个应用界面的交互及展现样式不管以何种方式呈现，都不可能满足所有用户的需求，只能在不断追求细节的基础上来满足更多用户。首页自定义在一些部分较为个性化的APP上已经不足为奇了，即根据用户自身的需求，去修改系统、官方提供的页面内容及先后顺序。不过在众多APP的首页自定义功能的认知里，都是对页面的原有功能进行增减及自定义排序。

在网易云音乐APP版本的首页底部也增加了自定义排序功能入口，不同于其他APP页面自定义的是除了能对现有功能进行增减及排序外，还特别定制了三种不同设计样式的呈现以供用户选择，相当于用户随时都可以对首页进行改版。不用的用户都有不同的视觉浏览及操作喜好，比如大卡片、九宫格、操作热区的范围等，网易云音乐通过提供不同的首页样式可以满足更多用户的需求，提供更愉快的使用体验，增强用户的信任感，即多满足一个用户就可能多留住一群用户，降低了用户流失概率。

010.「夸克浏览器」关键词-提前预知用户的需求

产品体验：

使用夸克浏览器搜索相关内容时，系统会自动检索关键词，并将关键词对应的常见内容结果以卡片样式展示给用户，随着关键词的变化，匹配的内容也随之改变。

设计思考：

说到浏览器的作用，想必大家脑海里的第一印象就是搜索，将自己不明白的东西通过搜索引擎从互联网大数据中自动匹配出海量的相关数据链接，提供的信息量非常庞大，包含各色各样的新闻、问答、文章，可以说一应俱全，涵盖一切，其各种浏览器的搜索操作方式大同小异，基本都是通过输入关键词，然后点击搜索出结果。

夸克浏览器在用户搜索的操作（点击搜索之前）过程中，增加了一个细节，即“行为预判”，通过用户输入的关键词，提前预知用户可能想要查找的内容，以简介的方式呈现，给用户提供一个快捷通道，加深用户对此关键词条的认知，快速判断出是否满足自己的需求。系统所匹配的卡片式内容简介是通过数据库长时间的数据分析，提取其中较为共性、常见的内容来反映用户可能出现的兴趣与需求，并合理挖掘使用，通过引导便于用户快速识别并点击，缩短输入时间，还能解决用户对关键词组织不清晰、逻辑不清的用户给与指导，提升产品的易用性。

011.「快手」刚刚看过-贴心的用户提醒

产品体验：

从快手“精选”栏目进入用户主页，在作品列表将所浏览过的视频上标记刚刚看过，避免重复点击观看。

设计思考：

身处移动互联网浪潮之中，我们不难发现，如今的短视频把用户的卷入和参与推向了一个新高度，尤其是生活在大城市高度压力下的年轻用户群。学累了，就想刷个小视频放松下，真以为然后就能集中精力再去学习？其实都是在扯淡，总觉得接下来的某个视频会有种奇异的魔力，一刷就停不下来，就好比在无边无际的海洋中，越喝越渴，别说自身难以碎片化学习，就连老人和小孩都带进来了。抖音和快手作为目前短视频的代表，都有着庞大的用户群，在用户需求基本都能满足的条件下，其战略方向准确的基础上，谁的用户体验最好，谁就是最后的赢家。

快手APP虽然被后来者抖音赶超，但在用户体验上从未含糊过。细心的用户可能会发现，在用户主页的作品列表中，刚刚看过的短视频做作了提醒标记，告知用户少走冤路，避开已看过的短视频，可以避免用户因重复点击观看而浪费时间，且在非WiFi环境下，还能节约用户的数据流量，这个提示算是很贴心了。

012.「腾讯视频」VIP栏目-免费营销策略转化用户

产品体验：

腾讯视频VIP栏目中的电视剧，基本都可以免费看前面的几集，然后根据剧情的发展程度，从免费变成付费，未完结的电视剧还可以通过二次付费进行超前点播。

设计思考：

免费的东西人人都喜欢，古今中外大都如此，免费策略营销也因此有强大的生命力。但互联网应用如若完全免费，不具商业性，可能连基本的日常生活都难以维持。大家都知道，会员付费是影视类应用盈利的一大来源，但用户对付费造成自己财产损失有种天然的抗拒，通常电视剧都提供几集免费观看，然后才硬性要求开通VIP。

视频类应用大都如此，这里以腾讯视频为例。不难发现，付费区不同的电视剧，其免费观看的集数不同，这并不是随意设定，而是根据剧情的发展程度，在某个“高潮”即将迭起的那一集开始收费，通过免费阶段的观看，对用户产生一定的吸引，勾起想要看下去的欲望，从而出现付费动机以促成用户开通VIP。这其中还有一部分互惠原则存在，即给用户免费一部分之后，降低用户付费的心理负担，提高对费用的接受程度，来而不往非礼也。针对未完结的电视剧，如果热度较高，在用户的观看欲望高涨之际抓住机会点，通过二次付费提供超前点播，用户也随之接受。不管是强制VIP还是二次付费点播，其都需要在合适的时间、合适的地点予以合理的出现，才有利于的转化用户。

013.「支付宝」城市天气-不仅仅是天气预报

产品体验：

支付宝首页左上角城市下方提供了天气状况，进入切换地区页面，会展示当前城市最近几天的天气情况。

设计思考：

随着支付功能的普及，几乎也成了每天都会打开的引用，它集合了我们的衣食住行，以前出门不能忘了带钱包，而现在只需要一部手机就能搞定一切。虽然功能众多，但对大部分用户来说，最主要还是归结于支付功能，除了部分线上支付外，就是线下支付了，顾名思义，线下即涉及用户的出行。

支付宝首页城市下方的天气预报，为用户提供了贴心的提醒，便于有出行需求的用户根据天气状况的程度决定是否必须出行或准备出行的必备物品。同时支付宝集合人们的生活服务，即使用户放弃出行，部分事情也可以通过支付宝线上解决，比如外卖、购物等。

014.「躺平」趣味化的下拉刷新样式

产品体验：

躺平APP在页面下拉刷新时，会出现一个倒挂俯冲的“小人儿”动效结合情感化设计，趣味且引人注目。

设计思考：

下拉刷新是APP不可缺少的功能，十分常见，主要从品牌、功能、惊喜、运营、反馈五个维度结合情感化设计。在页面下拉刷新的时候，整个页面也会跟着下移，待页面数据加载完成，页面会恢复到初始状态，在这中间就存在一个时间差，一个好的下拉刷新样式，能让用户通过时间差享受到趣味化的视觉体验及减少等待过程中的焦虑感。

躺平APP下拉刷新使用了品牌IP插图，从外观视觉上是给用户打造品牌印象，倒挂俯冲的“小人儿”动效结合情感化设计，趣味化的用户体验，能在产品特性上带给用户惊喜，勾起回忆，通过视觉跟用户进行情感互动。

015.「滴滴打车」添加途经点-解决位置不统一的情况

产品体验：

使用滴滴出行叫车，用户在行程前输入目的地时，点击右侧“+”符号添加最多不超过三个途经点。司机将按照乘客预先设定多个“途经点”，把多个乘客送达预定位置，每个途经点的停留时间不超过3分钟。

设计思考：

打车模式从之前的线下出租车转战到线上，诞生的了很多叫车平台，其用的最多、知名度最高的当属滴滴出行，线上叫车服务给我们的出行带来的极大的便利。不知道大家有没有碰到过这种情况，几个人一起叫车但下车点不同，等到需要时可能会跟司机发生不必要的纠纷或不愉快的出行。多个人的上车点不同，但终点一样，也会被迫每人都要叫车，因此需要付出更多的金钱成本。

滴滴出行APP的添加途经点功能，完美的解决的多个用户出行的这种烦恼。途经点旨在满足多人共同乘车、个人多点出行等场景下多目的地经停的需求，减少口头沟通带来的误解与不便。途经点可以为乘客停车3分钟，不用额外收费，如乘客需要在某个地点长时等待，则需与司机沟通达成一致即可，随着此功能的上线，滴滴出行为用户提供了更为便捷的打车体验。

文章来源：站酷  作者：大漠飞鹰CYSJ

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务