如何让自己的产品在保证基本的可用性和易用性的同时，还能让界面看起来柔和、更富有亲和力？一个产品能留住用户的虽然是内容本身的质量与吸引力，但一个小小的细节却能够阻止用户的流失，成为内容转化的最后一道防线，让人眼前一亮，值得借鉴。
076.「百度地图」出行前的“极端”天气预报
077.「搜狗输入法」“跨界”复制/粘贴
078.「支付宝」蚂蚁森林/庄园-模拟现实世界的自然规律
079.「躺平」趣味化的“击掌”点赞
080.「QQ音乐」导入外部歌单-不同的设备/账号歌单无缝对接
081.「微信」简便且高效的图片翻译功能
082.「橙」不一样的的登录方式
083.「高德地图」桌面一键导航-出行更高效
084.「爱奇艺阅读」性别选择-更明确的指引和提示
085.「饿了么」合适的时间、合适的提醒
086.「搜狗输入法」教你少打字、多开挂
087.「美团」垃圾分类-解决餐后垃圾分类之忧
088.「优酷」个性化弹幕设置-看剧调侃两不误
089.「随便走」AR导航-“傻瓜”式操作，老少皆宜
090.「微信读书」模拟现实的行为动作
076.「百度地图」出行前的“极端”天气预报
产品体验：
使用百度地图，导航路线规划后，会出现当日的天气提醒，点击进入即可查看每个时段的天气预报。
设计思考：
“赌博看运气，出行看天气”，任何时候，大家如果优先知道天气情况就可以提前做好准备，这对人们的生活方便起到很大的作用。尤其是出行，天气的变化是影响我们是否携带雨伞、交通工具选择、保暖问题的重要因素，所以提前预知天气的重要性可想而知。
使用百度地图APP，导航路线规划后，出行方式的下方会提示最近可能影响到出行问题的天气变化，便于用户选择更合理的出行方式及交通工具，避免受到恶劣天气变化的影响。还可以通过点击进入，查看每个小时的天气详情，对于时间不是很敏感的用户来说，为了错开恶劣的天气，提前或延迟出行也是一种不错的选择。
077.「搜狗输入法」“跨界”复制/粘贴
产品体验：
电脑和移动端都使用搜狗输入法，且在同一个账号登录的情况下，电脑端出现文字复制的操作后，可在移动端设备任何位置的输入框内直接粘贴，非常便捷。
设计思考：
输入法给大部分用户的第一感觉就是用来输入文字的，哪个好用用哪个，一旦习惯了使用某个输入法，基本就成了忠实用户，不会随意去改变。不过有时候输入法只是辅助作用，并不需要直接使用，比如：我们在电脑网页看到自己喜欢的文案语录时，想发个朋友圈，就需要先复制，再用电脑端微信发到手机微信，最后从手机微信复制再到朋友圈粘贴，虽然很麻烦，用户还是可以接受的，不然通过自己码字就会浪费大量的时间。
搜狗输入法的黑科技一直都很多，比如图片英文翻译、智能助手、文字扫描提取等，都是非常实用的功能。最近发现了一个新的设计细节，让人惊呼。当电脑和手机端都使用搜狗输入法且登录同一个账号时，在电脑端复制文字后，打开手机端任何输入窗口，即可看到在电脑上复制的文字，直接粘贴即可，由被动辅助变为主动摄取，再也不用通过聊天工具发送到手机端进行二次复制的繁琐操作了，实现“跨界”复制/粘贴，非常方便。可以看出团队站在用户体验的角度上，对于输入法使用场景的串联考虑是非常贴心的，不仅能再次俘获一大批新用户的芳心，也能提升老用户的使用忠诚度。
078.「支付宝」蚂蚁森林/庄园-模拟现实世界的自然规律
产品体验：
在支付宝蚂蚁森林/庄园里，白天和夜晚分别使用了不同的场景，模拟现实世界中的自然规律，白天晴空万里、且有阳光照射，夜晚满天繁星、且有流星划过，颇具真实感。
设计思考：
几年前QQ牧场养殖、农场偷菜，如今演变却变成了支付宝的蚂蚁庄园养小鸡、森林偷能量，将以前的纯游戏思维转变成了如今的游戏+公益的形式，不仅满足了用户小游戏的需求，还能促进公益事业的发展，同时用户也会得到心理上的满足和成就感。蚂蚁森林/庄园小游戏对用户产生的粘性除了其模式的新颖，也离不开产品团队日夜刻苦钻研所提升的用户体验。
蚂蚁森林/庄园的视觉场景跟随着白天、夜晚的环境变化，产品遵循现实世界惯例来呈现信息，更具真实感，便于用户在使用中将现实中的体验不经意间带入到游戏场景，可使其更加投入，通过用户的现有认知，以促成情感化的体验，使产品更具亲和力。
079.「躺平」趣味化的“击掌”点赞
产品体验：
在躺平APP对其他用户的发表的动态推荐时，使用了击掌图标，且有光彩线条围绕着掌心向四周扩散的动效样式，趣味性十足。
设计思考：
推荐是对其事件/事务认可的一种表达行为，最早可追溯到上古时代的尧舜禹时期，那时候如果对某件事或人，高度认可时就使用鼓掌（慢速且有节奏）的方式来表达；到后面慢慢演变成了简单的一个字“彩”；再到如今皆可用鼓掌、竖大拇指或直接言语...表达。基于互联网的发达，为了让更多人发现其内容资源的优质性，80%以上直接沿用了竖大拇指样式来表达对内容的认可及赞许，即使有区别于其他产品，也是在局部或动效样式上做出一点改变。
躺平APP的点赞样式较为新颖，使用了击掌的图标，并且使用了光彩线条围绕掌心向四周扩散的动效样式，相比竖起大拇指则更加强烈，意味着喝彩，表达了对内容的高度认可，相较于同质化严重的情况下作出了创新， 在过渡的时间差中，进行了趣味化的表达，更具视觉冲击力。
（“击掌”的点赞方式适合用于类似躺平、动漫、B站等二次元或个性化的产品中，如果用于工具、新闻、电商等类型产品，可能会对用户产生干扰，慎用）
080.「QQ音乐」导入外部歌单-不同的设备/账号歌单无缝对接
产品体验：
在QQ音乐我的页面，使用“导入外部歌单”功能，根据提示，即可把其他音乐应用里歌曲添加到QQ音乐歌单。
设计思考：
现在听歌早已不像以前，一张内存卡或一根数据线就可以把手机里的歌曲转移它处。基于人们生活水平的提高，数据流量套餐相比以前更是翻了百倍不止，WiFi基本人手普及，所以大家更倾向于在线听歌，无需下载（除非深山老林或地洞没有信号）占用手机内存，创建一个歌单，把自己喜欢的收藏起来，即时听歌，非常方便，如果没有特别的情况，成为了一款音乐应用的忠实用户后，基本不会频繁转移。
QQ音乐的导入外部歌单功能，可将其他音乐APP的歌单添加到QQ音乐自己的歌单里。对于导入外部歌曲，很多用户没有什么概念，感觉自己用不上，别忘了虾米音乐“尸骨未寒”，很多事情不是没有可能发生，当一旦需要时，这个功能就是“救命稻草”，可以想象，如果通过手动把以前的几百首歌曲一首一首的添加到歌单，不知道会不会“抽筋”。除此之外，还可以将歌单在朋友之间相互分享添加，这也是一种不错的音乐交友方式，实现不同设备、账号的音乐歌单无缝对接。
081.「微信」简便且高效的图片翻译功能
产品体验：
在微信的聊天对话框中打开英文图片，点击下方的翻译功能按钮，即可翻译图片上的外文，并以中文显示。
设计思考：
在我们的生活中，有时候多多少会遇到一些英文，比如进口食品包装、药物说明、护肤品等，其中就有一部分是纯英文说明，无论自己多么博学多才，但不见得都能理解英文。记得之前有一次，我自己的电脑蓝屏，出现的全是英文，虽然自己也是一直提倡用互联网解决问题，且也有一些拍译软件，但一想着需要下载注册，没准儿还要先看广告或收费，且天生对英文有一种与生俱来陌生感，还未开始便放弃了，于是成了伸手党，去请求别人帮助。
微信的图片翻译功能就是专为解决这一问题而生。通过在对话框中点击图片直接翻译，看到一道绿色的光由上而下扫过之后，图片中的英文就变成了中文，着实方便，比起以前通过第三方或先提取图片中的文字来翻译，操作简单且效率还提升了很多，可以说是一个非常实用的小功能。
082.「橙」不一样的的登录方式
产品体验：
在橙APP的登录页面，区别了常见的登录界面样式，使用对话聊天的方式按流程提示用户完成登录，界面流程方式新颖，浓厚的社交行业属性。
设计思考：
在任何应用中，要想有自己的“私密”领地，都绕不开登录/注册的流程，但凡手持智能手机又想玩的开的用户，对登录的流程是非常熟悉的，比如手机号+验证码、一键登录、第三方登录，无外乎这几种常规的登录方式，如果想来点“刺激”的，无非就是加个logo、贴个插图、来点动效等，见怪不怪了。
橙APP的登录方式虽然同样是手机号+验证码登录，但在流程样式上却非常新颖。鉴于应用本身属于社交行业，通过对话询问的方式让用户按照流程输入了手机号和验证码，给用户造成这不是对使用该APP设置门槛的错觉，降低用户的防备心理（很多产品用户量的增长都被挡在了登录之门外），让用户不知不觉在聊天过程中完成了登录流程操作，其方式非常友好且登录的过程是愉快的，同时还兼带了浓浓的社交行业属性，通过更直观的登录场景感受，拉近用户跟产品之间的距离，使用户的印象更加深刻。
083.「高德地图」桌面一键导航-出行更高效
产品体验：
通过高德地图的收藏夹，点击收藏地址右侧的功能菜单，在弹窗中将该地址“添加快捷导航到桌面”，后续就不用每次输入常用的目的地了，直接通过桌面的图标入口即可一键导航。
设计思考：
对于在外的工作人员，导航算是手机必备的软件，以前只是纯粹的导航认路，而随着汽车量的增长，各地交通逐渐开始变得紧张，那么不管我们是否知道路线，驾驶之前都会习惯性打开地图导航，随时观察路线拥堵情况来思考是否有更换更优路线的需求，于是就按照惯例打开导航、录入目的地、选择路线......等一系列的常规操作，日复一日，似乎没有觉得什么不妥。
高德地图的桌面一键导航功能，为长期有驾驶需求的用户提供了更为便捷的操作，将经常使用的目的地添加的收藏夹，再添加到桌面以生成目的地导航便捷入口，有需要时桌面点击即可，系统将自动规划最优路线，通过最便捷的方式一键导航，再也不用日复一日的重复之前的操作了。站在设计师的角度，在解决用户需求时，操作越复杂、步骤越多，用户的选择条件、视觉负担及时间成本就越多，出错的情况也越多，故而用户流失的可能性就越大。高德地图通过一键导航简化操作流程，通过合理的操作路径，降低用户时间成本，有效提升了使用频率及粘性。
084.「爱奇艺阅读」性别选择-更明确的指引和提示
产品体验：
首次进入爱奇艺阅读APP，在性别选择页面中，男生和女生的头像通过动画的形式反复左右替换，用强视觉提醒的方式推动用户进行选择操作，以便于提供更匹配的内容资源。
设计思考：
大部分新闻或阅读类型的APP，在用户首次进入应用时，都有类似性别、行业、爱好之类的选择，其主要目的是确定用户的属性，并提供更加匹配该属性的内容资源来提升用户的满意度。其流程也是千篇一律，以建议性的提醒用户去做选择，如无需要直接跳过即可。
爱奇艺阅读首次即进入APP时，以动态的性别头像插图反复左右切换的动效方式来提示有用户选择性别，相比常见的静态按钮直接显示在那里会更加友好，不会过于生硬、冷冰冰，其动画视觉样式给予明确的指引和提示，更能引起用户的注意，通过强烈的视觉提醒促使用户更高效的完成当前任务。
类似这种选择且非强制性的前置页面，很多设计师只是按部就班当做一个流程，其实要想做好并非仅仅如此，可以通过趣味化、情感化、动效等方式增强用户去选择的欲望，以提高操作几率，用户一旦选择，进入应用之后所看的内容定然更符合自身的需求，也能提高用户的满意度，其满意度的高低能决定用户的去留及转化，所以应用中，用户的前置选择对产品的重要性可想而知。
085.「饿了么」合适的时间、合适的提醒
产品体验：
如果在饿了么有正在进行中的订单，再次进入应用时，右下角会提供一个查看的快捷入口，点击可快速进入该订单查看进度或骑手配送状态。
设计思考：
随着外卖行业的普及，给我们的生活带来了很大的便利，尤其是一日三餐，我们只需花几分钟的时间在外卖平台上下单，其他的事情交给商家和外卖小哥，很大程度上缩短了我们去店途中和店里的等待时间，特别是对上班族来说，真的是太便利了。不过外卖平台不像京东淘宝-人们可以无忧无虑的逛上几个小时，通常都是目标明确的用户，在短时间内完成自己的需求，要么下单、要么查看配送进度。
如果在饿了么有订单存在，再次进入首页，右下角会提示配送信息，点击直接进入查看详情。从表面上看，右下角的入口虽然提供了快捷通道，但似乎不太友好，总是会遮挡部分内容。其实并非如此，是因产品根据用户的使用场景进行行为预判而设计的快捷入口，在正常情况下，从下单到完结一般在30分钟左右，如果用户存在未完结订单且在短时间内再次进入平台，80%以上的用户此时需求为查询配送进度，因此，右下角的进度提示正是在合适的时间给予用户合适的提醒，根据用户的场景需求提供了最为便捷的解决方案，由此可见、利大于弊。
086.「搜狗输入法」教你少打字、多开挂
产品体验：
进入搜狗输入法的设置中，可开启开挂模式，里面的三连发、回声、重要的事情说三遍分别对应不同的效果。
设计思考：
搜狗输入法在业界虽不敢说是最牛，但一定是数一数二的存在，发展至今，不仅仅是在满足用户的基本需求，还提供了让用户感到惊喜的功能，而现在更是研发了很多“黑科技”。
从搜狗输入法左侧的logo中进入工具选项，在设置中即可选择开挂模式（真实效果见上图）。正如字面的意思，搜狗输入法通过智能帮助用户自动完成一些列的复制粘贴工作，瞬间让打字刷屏的手速快到逆天，且操作简单、轻松完成，方便用户在开怼、卖萌、刷屏过程中直接碾压对方的打字速度。开挂功能可谓是实用性与趣味性兼备，让我们在日常中，面对不同的社交需求时带来贴心的改变。
（凡事有一个度，刷屏如果没有用对场景，可能会遭到对方的反感，事在人为。就像之前的“拍一拍”功能面世，却有人在上班时间拿去拍领导、拍老板，后果就不说了，刀可切菜亦可伤人）
087.「美团」垃圾分类-解决餐后垃圾分类之忧
产品体验：
美团我的页面，推荐工具的“垃圾分类”功能，能帮助我们进行识别因外卖产出的垃圾类型，便于跟线下对应的垃圾桶“对号入座”，减少不必要的垃圾混合而增加清洁工人的工作量。
设计思考：
外卖平台的兴起，给我们的生活带来了很大的便利，同时也产生了一些危害，首当其冲就是环境的污染。比如包装盒、包装袋、餐具等大量生活垃圾的产出，确实在外卖行业普及后，乱扔垃圾的情况跟随着疯速增长，虽然这些属于个人情况，但也有部分用户因不知垃圾如何分类，而将所有垃圾聚集在一起，然后就成清洁工的事情，最终无端增加垃圾分类的工作难度。
美团的“垃圾分类”功能对卫生环保方面增添了一份力量，当用户不知道自己产出的生活垃圾是何种类型时，可通过查看常见垃圾类型提示或搜索来确定类型，方便用户按类型将垃圾丢入对应的垃圾桶，解决餐后垃圾分类之忧，帮助养成良好的垃圾分类习惯，助力垃圾分类落地。还能消除用户对“外卖垃圾分类麻烦”的顾虑，利用线上垃圾类型的普及，为绿色发展及环境保护贡献自己的一份力量。
088.「优酷」个性化弹幕设置-看剧互动两不误
产品体验：
在优酷APP开着弹幕看片时，可通过弹幕设置调整字体的不透明度、行数、大小及速度来设定最适合自己样式。
设计思考：
弹幕，用户非常熟悉的一个词，很多时候在看影片时，弹幕里面的内容远远要比影片带来的乐趣多很多，除了能从中获得群众的陪伴增加愉悦感外，还可以带动视频的观看氛围，让活跃的用户有了表达自我的动力和热情。但对于“键盘侠”来说，仅仅在上方显示的几行弹幕根本无法满足自己看影片互动及调侃的需求。
优酷的弹幕设置中，可以根据自己的实际需求对弹幕字体大小、透明度、区域等参数进行设置，针对喜好调侃互动的用户来说，使用满屏半透明度字体样式的弹幕无疑是最好的选择，互动看片两不误。
089.「随便走」AR导航-“傻瓜”式操作，老少皆宜
产品体验：
使用随便走导航，全程利用AR实景，通过3D立体形式的方向引导，帮助我们找到周边的任何一个地方。
设计思考：
导航是我们出行必备的工具，目前高德和百度在该领域各自独霸一方，看似很牛叉，但并不是万能的。比如老人操作起来有一定的难度，经常各种功能找不到还说不好用；又比如我们在陌生的重庆市，可能你从这南面1楼进去，北面就在20楼，毫不夸张，如果通过常规的地图导航去找人，我建议你最好吃个早餐再出去，等找到人之后就可以吃夜宵了；再比如......不比了。
随便走APP是一款便捷式轻量导航工具，主打“让生活乐趣一目了然”。利用“AR全息实景”的展现方式，改变了必须要有地图的模式，对于我们找周边的美食、酒店、公交、厕所、景点等需求，进行穿透式3D立体指引，操作简单，不管前、后、左、右、上、下都有非常明显的视觉引导，只有你想不到，没有它找不到，对于长期生活在大城市的用户，交通复杂、道巷纵横，很可能我就在你“隔壁”，你却找不到我“老王”。此外，随便走APP操作简单，学习成本基本为零，对家中老人而言，也是一款不错的导航工具。
090.「微信读书」模拟现实的行为动作
产品体验：
在微信读书的书架页面，点击书籍以及书本翻页，都使模拟了现实生活中较为自然且真实的从书架拿书、及各个角度翻页的效果。
设计思考：
看书APP虽然众多，但真正能坚持下去、养成习惯的没有几个人能做到，站在平台的角度思考，毕竟书本的内容是平台无法修改的，除了提供优质的资源并给予方向指引外，其他便是通过设计体验来提升用户的好感度了，
微信读书APP从书架的拿书动作到书本的翻页，都模拟了现实生活中用户看书的行为动作，大家都知道，真正喜欢阅读的人，是不会在意这些所谓的横竖及交互效果的，但前面都说了，这种人毕竟在于少数。因为受众的差别，模拟现实其最主要的作用就是为了吸引眼球，模拟用户的实际行为，将其代入真实的情境中，使用户对产品产生深刻的认同感，则看着更加舒心，待用户提升忠诚且养成看书习惯之后，这些作用就会慢慢变得微不足道。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请加ben_lanlan，报下信息，蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系
作者：大漠飞鹰CYSJ 来源：站酷
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务、UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司
大家可以观察到做交互设计或者用户研究经常会借鉴心理学/社会学的研究方法去应用成熟的理论模型甚至建立模型、去“玩概念”，但可惜的是咱这一行大多数设计师都没有这样的教育背景，就算是所谓的“大厂公众号出品”，也难免会有思虑不周的时候（对，我说的就是ISUX那篇熵减思维）。
但是从另一方面来讲，现在的这个越来越卷的行业形势，也的确在不断地要求交互设计师提升自己的思考维度，往更系统化、更结构化的方向去走。虽然我经常说我不是一个喜欢玩概念的人，我也非常不鼓励不推荐大家一点小破事就上纲上线去整模型做PPT，但客观来讲，学会玩概念是交互设计师的一个高阶能力，是思维逻辑的技能化体现。
那么，如何能够合理地、有理有据地玩概念？什么情况下需要我们去玩概念？本篇文章将解决你的这方面疑惑。
社会学教科书会告诉你：“理论是以一种系统化的方式，将经验世界中某些被挑选的方面概念化，并组织起来的一组内在相关的命题。”但咱们不用这么文绉绉，简单来讲理论就是抽象地、高度概括地解释一些在生活中的现象。
比如说你是一个猫奴，在和你的猫朝夕相处之后，你觉得养猫好像有助于你的身心健康，于是你提出来一个概念叫“小猫可爱度”，这个“小猫可爱度”受三个因素影响：猫的毛色、猫的眼睛大小、猫的性格，并且假设小猫可爱度越高，对人的心理健康正面影响越大。那也可以说你就创建了一个理论叫“小猫可爱论”。
而什么是“模型”呢？这个问题比较难说明，咱不搞学术研究也没有必要展开来讲。这个词汇和“理论”有一定的重叠，但一般我们在工作中讲“模型”时，往往指的是构成某个概念的因素之间的关系，以及其测量方式。比如我们设计师酷爱搞的体验度量，也可以算作是一种模型的建设。
图片来源：https://www.xiaohongshu.com/discovery/item/6285d9360000000021034b22?share_from_user_hidden=true&xhsshare=WeixinSession&appuid=5bcbe6f0f8462700015da647&apptime=1654249488
研究一个问题时我们会用到两种最基本的思路：归纳和演绎。前者是自下而上的、由具体现象抽象形成理论假设，后者是自上而下的、由抽象理论具像化到个例。
比如我们刚才的“小猫可爱论”，就是基于日常的观察抽象得出的结论，使用的是归纳的方法。而假如现在已经有一个成熟理论，叫做”地球猫猫论“，它发现猫对于人类社会有方方面面的影响。而基于“地球猫猫论”的已知研究结论，我们着重去关注猫咪外观造型对人身心的影响，猜测外观越可爱的猫猫可能对人心理的正面影响越大。那么这就是使用了演绎的方法来推导假设。
当我们应用一个模型或理论时，就是在基于这个抽象的理论做演绎推导。我们期待这个理论能够对我们的设计问题作出解释、对设计方案给出指导方向，这是最最重要的。有很多刚入行的设计师容易被一些花里胡哨的文章晃了眼睛，误以为做设计和写八股文似的，非要在具体设计之前拽一些大词、拉出来一些貌似很厉害很科学的高深理论才能体现自己的逻辑性，并不是这样的。我们使用的理论在多大程度上能解释当前面对的问题、它对于问题解决是不是不可或缺，这才是衡量设计师思维能力的标准。
另一方面，当我们面对的问题非常聚焦、非常情景化的时候，单纯靠演绎推导就没有办法支持了。比如B端设计的领域差异都特大，有人设计仓库货架动线，有人设计钻井钻头。这些千奇百怪的场景都有各自特性的问题，不是拿出来一个尼尔森的可用性十原则就能尽数解释的。因此为了提炼出整个业务的运行方式、为了表现出当下设计发力点，或者为了拆解影响体验的构成要素，就需要进行观察和归纳，从而构建模型。
构建模型是一个很麻烦的事情，本篇不打算展开，下次一定吧。
咱们做设计对理论的要求其实很低。以下两点是我觉得重要、最基础的：
1.贴合设计问题
在我的其他文章里里提过，理论它有理论层次和对应的解释范围，只有理论贴合设计问题，才能完美地解答设计问题。不是说名气越大的理论就越好用，也几乎不存在从鸡毛蒜皮到家国大事都能完美解释的理论。
比如有些互联网从业者很喜欢拿“人是贪婪的”说事，只要讲个啥和促销/转化沾点边的事情，就必要讲“因为人性是贪婪的，所以我们这里要这样……”，先不提这个“人性贪婪论”它能不能证伪、是不是科学，它首先是在讲人类、人的本性这个层面的事情。你怎么就知道这个用户在用你这个软件的时候，他贪婪的人性就会占领理智的上风呢？可能他本性是贪婪，但他在使用你这款软件的时候，更多地受软件好不好用、折扣看起来真实不真实、像不像诈骗这些因素影响。就算他贪婪，他也不是傻子，不可能看见个金币/红包就去点。这就是“理论”和研究问题风马牛不相及。
那么如何叫理论贴合问题？我今天准备拿一篇google发在USENIX Security 21年的会议文章来介绍，这篇文章叫“嘘，安静！减少在chrome浏览器中的非必要信息提示”（“Shhh...be quiet!” Reducing the Unwanted Interruptions of Notification Permission Prompts on Chrome），有兴趣的同学可以在Google research上下载到PDF，链接：https://research.google/pubs/pub49767/
各位在用Chrome浏览器（桌面端或安卓端）的时候，应该都见过这个通知提示。当网站准备给你弹窗的时候，chrome会弹出来一个这样的非模态小提示窗口（学名叫prompt）询问你是否愿意被弹窗，假如你无视这个弹窗、没做出任何表示，那么下次你进入这个页面时还会再弹。
但这个提示窗口对体验有没有影响呢？是不是会很烦人？怎么样能迭代这个窗口的样式和生效逻辑，从而减少对用户的打断，提升用户体验呢？——这篇文章就研究这个。
这个问题显然是一个芝麻大点的问题，恐怕在座各位做需求的时候遇到这种问题都懒得写设计分析。也因此，如此微观的研究问题，就应该搭配微观的、着眼于用户具体行为的理论。
这个项目要研究的是三个主题：权限控制、弹窗提醒和打断、移动端和PC端差异，所以它首先引用了心理学和人机交互交叉领域的期刊上最直接相关的研究成果：之前的研究发现，在PC或移动端场景下当用户在完成主任务时被打断会非常焦虑、难受，此时对用户进行触达也没什么效果，而当用户在任务之间的间隙被打断时则没那么难受，触达有效程度也会提升。
这些研究通过实验的形式去探讨几个概念之间的关系：打断、工作流、心理感受或工作表现。非常微观、简单，甚至可能无法形成一个我们普遍理解的、带名字的“理论”。但它们非常贴合这个研究的主题，基于这些研究结论可以合理地推导出这篇文章的后续设计策略：针对不同场景、任务，做差异化的权限触达体系——这不比拿着马斯洛需求层次模型往自己的设计上生搬硬套强多了。
2.对设计有指导
咱们做设计不是做纯粹研究，最终所有的研究和推理，都要落到对设计行为的指导性上。不要一通分析猛如虎，最后得不出有价值的结论，或者只能得到解释性的结论，而无法对未来行为做出建议。
在这里我们又要请出ISUX的新文章做例子：
「互动仪式」一词最早来源于美国社会学家戈尔曼，是指一种表达意义性的程序化活动（大到特殊节日举行的大型庆典，小到定期的家庭聚会、公司团建等活动）。这类活动对个体在群体中的参与感及群体生活的团结性来说具有重要意义。「互动仪式」理论给出了一个分析社会活动的理论模型，帮助我们具体观察群体活动的现象，观察群体从聚集到产生情感符号的整体过程。那么如何将「互动仪式链」理论转化为具体可执行的设计方法？
——ISUX设计，公众号：腾讯ISUX 互动仪式链 | 直播情感化互动体验设计
这篇文章用一个传播学的经典理论“互动仪式链”来解释腾讯的直播场景的产品服务链条。文章本身是很规范的，使用“互动仪式链”来解释直播也很符合这个理论的解释范围。
但是，“互动仪式链”更偏向于解释一个现象的成因。也就是说假如我们是一个传播学的学者，你老板让你去解释为什么直播间那么火爆、里面的观众那么多那么活跃、他们为啥要组成家族要打榜，你用“互动仪式链”来解释，这很合理。但现在我们是设计师，我们要解答的问题不仅是直播间作为社会现象为什么会火，而是腾讯直播之后直播要往哪里发展？我们要做哪些具体的设计动作来增强这个群体之间的共鸣？从这个图里面是看不出来的，太抽象了。
当然本文是很希望读者相信腾讯直播的产品搭建是基于理论有理有据地去构建的，比如下面这个图就是“「互动仪式链」理论中引申出的设计方法”，但是话说，我觉得非常有以果推因的嫌疑，难道没有“互动仪式链”，腾讯直播会不搞粉丝团/家族，会不办主题赛事？假如这些产品动作都是我们已知的或者行业常规的，那贴上一个「互动仪式链」的皮，对设计的帮助和指导就很小了。
当然，ISUX为了建立自己的品牌影响力可以写这种文章，但咱自己做作品集的时候还是要心里有数，注意你采纳的、特意提到的所有理论都要和最终的设计手段有紧密的因果推导关系。
那话说回来，我们能从哪里获得这些和人机交互直接相关的研究成果？我建议大家多关注人机交互本领域的期刊，或者和心理学相关的期刊/会议。比如google这篇文章援引的CHI，就是人机交互领域下最知名的、影响力最大的期刊。根据google scholar的统计，HCI（人机交互）领域下的前10期刊排名如下：
地址：https://scholar.google.com/citations?view_op=top_venues&hl=en&vq=eng_humancomputerinteraction
除了CHI和上述排名的期刊之外，我们还可以关注ACM（美国计算机协会）旗下的其他相关会议和期刊。比如google的这篇论文就援引了另一个会议MOBILEHCI的文章。最后，除了人机交互领域，我们也可以多去关注心理学和人机交互的交叉期刊，比如本篇引用的Computers in Human Behavior，其他和心理学相关的研究可以从美国心理学会（APA）的数据库中检索。
ACM协会：https://dl.acm.org/journals
APA协会：https://psycnet.apa.org/
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请加ben_lanlan，报下信息，蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系
作者：白话说交互 来源：站酷
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务、UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司
首先要说明一点：模态modals和模式modes尽管都有个“模”字，但在界面设计上指的是不一样的东西。前者是我们一般说的“带黑色遮罩的弹窗或者页面”，后者则指“同一个操作在不同的情况下，带来不同的效果”，比如Photoshop提供的各种工具就是模式切换的隐喻式说法。
在photoshop中，用户点击一下“套索工具”然后按住鼠标左键，就可以在画布上勾选一个范围，点击鼠标右键则可以对这个范围进行操作。而点击一下“画笔工具”，尽管同样是在画布上按住鼠标左键，效果则变成了使用笔刷在画布上画出痕迹，这就是“共用同一个操作但效果不同”的模式切换。
此外，界面设计中还有一个和“模式”有点像的概念“视图”view。通常来说，同一个界面与操作产生不同效果的称为模式；同一套数据展示方式有差异的称为视图。这个就下次再聊了。
尽管在图形化用户界面的发展中，模式这个概念曾经被各路交互/界面设计师充分讨论过，但实际上它并不是一个人机交互原生的概念，我个人推测“模式”的产生恰巧与非界面的产品设计有脱不开的关系。许多生活中的产品出于安全性、效率或者成本的考量会把屏幕设计的很小或者干脆没有屏幕，人和机器进行交互的方式也很简单（一般是通过按钮），这就导致这些产品能够展示的信息很有限。那么为了能够区隔用户的不同任务/意图，用有限的按钮实现不同功能，就采用了“模式”这种设计方式。
比如很多多功能的手表既可以展示当前时间也可以拿来当闹钟或者计时器，那么为了能在这么小一点的屏幕上实现这么多的功能，就需要一个“模式”按钮来进行功能切换。切换模式后点击调整时间按钮，则可以达到选择闹钟时间/调整计时时长/调整当前时间等不同的效果。
除了上述手表的例子以外，“模式”还广泛存在在各种简单或复杂的民用/商用产品中，比如汽车的速度控制，就是一种速度与档位协同完成的模式；而飞机的驾驶舱里也有一个“模式操纵面板”，能让飞机驾驶员在高度保持/垂直导航等模式中切换，对飞机的飞行高度/速度等作出调整。总之在产品设计的世界中“模式”的应用案例又多又复杂，相比之下界面交互中的“模式”就非常精简好理解了。
02模式在界面设计的兴衰
在图形化界面发展之初“模式”这个概念就被带入了界面设计领域。也许是没有跳脱产品设计的影响，此时的“模式”倾向于用硬件按钮来解决问题，而没有完全转向界面操作。比如我们上次讲过的Xerox Star就设计了一个奇怪的“移动模式”，假如用户想要移动一个文件到另一个文件夹，那么他需要做以下几步：
现在来看这个“模式”设计真是既反直觉效率又低下，因当时此很多设计师也在思考界面设计是否真的需要“模式”这个东西。和屏幕有限、交互方式有限的产品设计不同，电脑有鼠标有大屏幕，一方面用户在同一个场景下可做的事情大大增多，另一方面设计师也可以通过拆分界面、增加功能入口的方式来让用户聚焦当前任务而没必要采用模式。因此苹果在1992年发布的Macintosh人机界面指南中开始将“无模式”modelessness作为苹果产品的一大卖点。用户能在任何情况下完成任何行为，而不必要进入某个特殊的“模式”。比如我们上面提到的“移动”操作，在Mac中就变成了我们熟悉的按下拖动，简单快捷。
然而“模式”是不是完全过时了、完全不适合界面设计？也不尽然。首先，在一些和实物产品相关的地方，模式还是留下了它的痕迹。比如我们现在电脑键盘上的大小写锁定按钮也是个“模式”设计。当用户按下这个键的时候，电脑进入大写模式，键盘打出来的字都是大写的；再次按下这个按钮则退出此模式。另外在界面设计领域也有设计师对模式持不同态度，比如写可用性十原则的那个尼尔森，就在1996年写了一篇文章谈到他对“模式”这个东西不一样的观点。在他看来，“模式”这个东西的本意是“聚焦用户的注意力、减少用户可以做的操作，以便于用户能更快捷地找到在当下具体场景中所需的操作与信息”，并且模式思维其实天然存在在人的日常生活中，比如一个人在厨房里做的事肯定和在游泳池里做的事不一样。
这篇文章有兴趣可见：https://www.nngroup.com/articles/anti-mac-interface/
尽管如此，尼尔森也承认当时的“模式”具有一个很讨人厌的问题：模式的切换很麻烦，用户也总是忘记自己身处某个模式下，因此可能会做出此模式无效的错误操作。所以为了解决这个问题，尼尔森觉得采用弹簧模式（ spring-loaded modes ）作为普通模式的替代品更好。这种模式最广泛的应用就是键盘上的shift键：按下shift时多选模式生效，此时可以点选多个文件，一旦松开shift则马上退出多选模式，这样一来用户就不会忘记自己身处某个模式下了。
03作为模式的批量操作
尽管模式在界面设计中存在感越来越弱，但除了PS“工具”之外，仍然有两个非常广泛存在的模式设计：查看/编辑模式、批量操作模式。今天咱们会主要聊批量操作模式。严格来讲“批量操作”即同时对多个对象进行操作，它可用多种方式实现而并不局限于“模式”，但是现在市面上比较通行的处理办法或多或少还是采用了模式的思路，因此我把这两个东西放在一起说。
我这里举个例子：比如说你是一个卖海鲜的小店主，为了让自己店里的海鲜卖的好点，你决定上抖音给你的海鲜打广告。但打广告这个东西得多试，哪条广告语、哪个产品能火很难说，所以你在抖音的广告系统上新建了60条广告，每条用的广告视频和标题都有些差异，这样最后哪条广告火你就继续投哪条，不火的就下掉不烧钱了。
但是这么多的广告管理起来很不方便。比如经过你的一番研究，发现抖音的受众好像都比较喜欢大虾的广告，对螃蟹图片不怎么感冒，转化数据很难看。所以你打算把所有带了螃蟹图片的20条广告都关闭投放。那我们能怎么做呢？
1.隐式模式
按照传统的模式思维，我们可以像Xerox Star一样，通过某种办法让用户进入多选模式，在这个模式下用户可以进行一些特定的操作，比如批量删除。然后在批量模式打开的状态下，出现多选模式需要用到的组件：多选框与多选操作栏。此时其他和多选模式无关的操作，比如“新建广告”则被置灰，除非用户退出模式，否则不可点击。
这样设计相信很多同学能马上看出问题：操作效率太低了。打开模式按钮以后，还需要进行多选操作，然后选择对应批量操作。其实假如用户选择了多个项，我们就可以预判这个用户是想要对这多个项进行操作，没必要要求用户先打开一个批量模式开关
因此，为了解决这个问题，在保持表格复杂性可以容忍的条件下，大多数平台会将模式的进入方式设计得比较含蓄：只要用户选中了多选框，就进入多选模式——我把这种设计叫做隐式模式。比如最近比较火的产品cubox，就采用了这样的模式设计。除去进入模式的方式不同，其他的设计点和60年前的Xerox Star差异不大。
同样的隐式模式，google mail就做得更加精简一些。用户仍然通过点击多选框进入多选模式，但是只禁用了“刷新”这个会清除所有多选状态的操作，其他的大部分操作仍然可用。同时也不再提供退出模式的选择。
那是不是隐式模式相比起来就更好，模式按钮就不能再用了呢？也不是。咱们之前提过，“批量操作模式”之所以可以做成隐式的，是因为当用户选择多个项时，其意图就已经很明确了。但某些时候，我们无法清晰捕捉到用户的意图，所以还得用户自己手动把模式打开。比如假如这个广告投放的列表是有优先级排序的，在页面中排序越高的广告就能得到越多的用户预算（这句话我瞎说的，知道什么意思就行）。但之前的广告表格已经非常复杂了，再插入一套排序组件会让整个页面的复杂程度再上一个台阶，那此时应该怎么办？
此时我们的“排序功能”仍然是用模式实现的，但要求用户先点击一下排序触发模式。这样做虽然操作效率上不如隐式模式，但有效降低了页面复杂度，并且也能让新用户意识到这个功能的存在，保证功能的可见性。
2.弹簧模式
我们上面介绍过了，电脑的设计本身自带了一个弹簧模式设计：shift键。按下shift键之后用户可以选中列表中的一个范围，而不需要一个个地去点选。因此我们在做表格批量操作的时候也可以考虑支持这个键控，方便有批量操作诉求的用户批量进行选中。
3.不使用模式
虽然我们全篇都在讲模式，但实际上批量操作不用模式也能做。不用模式的时候一般有两种情况：第一，尽管使用模式区隔使用场景、隐藏一部分功能的设计方式保证了页面的简洁，但也带来了另一个问题：可见性低。在没有进入批量操作模式之前，用户不清楚自己能做什么多选操作。在咱们抖音投广告的案例中只有“删除”、“下线”两个操作，所以这个问题体现的不太明显。但有些场景下，列表中的项有非常多的属性，所以可能可做的批量操作很多。比如用户可能会需要批量改广告标题、改出价、改投放时段等等。因此用户思考的顺序是：我需要做某批量操作->我观察到系统提供了这个操作功能->我开始进行这个操作。
因此，对于一些注重操作效率、用户专业程度高的系统来说，为了能够让用户能够在进入本页面时就能进行所有操作，愿意牺牲一部分页面简洁性去换取更高的操作效率。这样的系统往往选择直接将批量相关的操作直接暴露在页面中，因此对于设计师的排版技能有更高的要求。
在上面两种样式中，多选/批量操作都直接放在页面中，不再使用模式呈现。因此当页面上按钮比较多的时候，一般会将所有批量操作收起来做成下拉菜单。
第二，注意到我们上面所有说的批量操作都比较简单，比如“删除”、“下线”一步即可完成，因此用户主要的心理成本和操作成本都压在多选操作上，也就是操作本身不难，只是操作的对象很多。但有些批量操作本身非常复杂、需要花费很多时间，那么再通过为一个管理列表添加模式来解决问题，就不太合理。比如假如我们的“抖音广告”新出了一个功能，允许用户自己创作新的图片，然后把创作出来的图片批量应用在已经有的广告上。此时显然我们再要求用户先从广告列表中选择广告，就不现实了。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请加ben_lanlan，报下信息，蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系
作者：白话说交互 来源：站酷
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务、UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司
从纸质阅读到屏幕阅读，通过理解用户从纸质到屏幕阅读行为的转变，我们从传统中文排印经验中吸取对字体、间距、标点的处理方式，跨越平面与UI不同终端的设计规范和实现手段。在UI设计的语境中调整中文排版策略，优化手机百度图文阅读场景设计，提升手百用户的阅读体验。
· 屏幕阅读与纸质阅读不同
人的阅读习惯会根据阅读环境而改变，包括文本的书写格式、文本的媒介、语言符号等。基于屏幕的阅读行为，往往表现了如下特征：很少人会一字一句阅读页面，更多的是在浏览、关键词确认、非线性阅读、有选择性的阅读。
· 设计差异点
UI设计与书籍排版不同之处在于：
第一、屏幕上可以实现更多的交互功能，增强了阅读的沉浸感和交互体验。
第二、UI设计不可控因素更多。平面排版纸张和内容固定可控，可以保证设计的精准展示。但在UI设计中，想让页面达到和原本设计一模一样的效果几乎是不可能的，显示屏幕尺寸的碎片化、内容的灵活可变，都让最后的展示效果多了很多不可预期。这就是为什么会有很多排版优秀的印刷品设计，但UI中优秀的排版设计却特别少。
因此，针对屏幕阅读的设计要注意：不能照搬文字排版规则，更要充分考虑屏幕与内容的灵活可变，确保设计方案可实际落地。
· 明确设计目标
本次设计改版主要针对手机百度——图文落地页部分，希望通过优化文字展现、内容排版提升阅读体验。
CEA阅读体验模型将用户的阅读体验分为舒适、效率、吸引三个纬度。
舒适（Comfort)：视觉负担低，信息适量，看着不累、没有信息压迫感
效率（Efficiency）：重点信息突出，直观性强，容易识别
吸引（Attraction）：页面设计美观，有吸引力
基于此模型，此次优化方案中我们确定的设计目标是：优化内容可读性；提升阅读效率；提升页面美观度。
· 优化内容可读性
· 选择屏显友好字体
屏显字体与印刷用字体最大的不同在于，屏显字体受限于分辨率，无法做到印刷字体那么多细节的设计。目前屏显汉字的设计方式一般是：
1、从字体的结构入手，扩大中宫的设计，字形设计看起来舒适放松，提升辨识度，相较于中宫内缩的字体，呈现现代的明亮感。
2、字形简洁，平直少细节的笔画有助于提高字体本身的辨识。
遍历手百用户常用手机的默认字体，系统默认字体都是使用屏显友好字体。
· 选择字重更全的字体
与纸质阅读相比，用户在在屏幕阅读中，会经常进行扫读、关键词确认，而不是像在纸质书上一字一句的读。
目前我们提供给作者的能够做重点信息区别的方式包括：文字加粗、风格化二级标题。但我们发现目前在一些安卓手机上，一些字体在增加字重后出现沾粘情况，不能保证可读性。
字重，即字形的重量，字重的等级用来标明同一字体家族不同粗细笔画的字形。
但通常一个特定的字体家族仅会包含少数的可用重量。若一个指定的字重不存在时，CSS会就近匹配其他字重：较重的字重映射到更重的重量、较轻的字重会映射到更轻的重量。
目前落地页代码中字体的设置，安卓使用的第一顺位的字体字重仅2档字重，所以在小字场景和分辨率较低的安卓机型上，会匹配到更粗的字重，出现文字沾粘的情况。
我们调整了font-family中的字体适配顺位，在安卓端优先适配字重更全的字体，保证安卓端加粗字体的展现，优化内容可读性。
· 提升阅读效率
· 优化字间距和行间距
阅读场景下，文字的间距是影响阅读效率的关键。文字的间距包括两部分，第一是横向字与字的间距；其次是纵向行与行的间距。
根据当前现状，再结合行业设计经验，我们选择了字号与行高倍数组合的一系列方案，进行了眼动实验和用户访谈，确定用户可接受的行间距为1.50-1.70的范围，再通过对比不同机型下的屏幕显示效果，以及不同档位字体显示效果、阅读效率，最后确定了图文落地页正文文字在当前方案基础上缩字间距为0，扩大行间距1.70倍行号的设计方案。
· 段落间距适配字号
图文落地页的定位是长文阅读场景，作者发文长度的中位数是600-700字的范围，以目前用户使用量最多的iPhone11举例，600-700字的文章长度为2屏（纯文字，无图情况）。
对于长文阅读，用户往往是缺乏耐心的。为让用户减少对长文的“畏惧感”，调整文章段落间距，一篇长文通过合理的分段，成为一段一段的短文，每结束一段短文，用户都有机会进行休息并获得满足感。
出于屏效考虑，当前图文落地页段落间距不论用户使用哪一档字号，都为一个固定值。所以在调大字号的模式下，段落间距小，用户难以区分；在小字模式下，段落间距又太大，降低了屏效。
优化段落间距的设定，段落间距应随着字号的变化对应做出变大或变小的调整。调整后的最大字号与最小字号段落间距都更合适，阅读节奏更好。
· 页面美观，提升吸引力
书籍排版中“微观字体排印”中一直都关注字距、行距、标点符号等排版调整，这些排印规则大部分源于文字本身的规律，排版风格和规范，并不随着设计潮流而轻易改变，是需要在所有媒介上都应遵循的规则。但是现在的UI排版中几乎都没有遵循，这也是我们经常觉得UI页面上的中文排版看起来不精致的原因。
通过学习W3C《中文排版需求》《中华人民共和国国家标准-标点符号的用法》等中文排版规范文档中对标点等微观排版的调整思路，并结合UI场景落地，希望从细节处提升页面美观度和吸引力。
· 优化标题，突出内容
在标点使用规范中对标题中标点符号的使用有严格的定义：标题的作用是概括表明文章内容，一般标题中除书名号、引号等表示专用名词的符号外，不应该出现标点符号，题中停顿可用空格表示。如确实因需要表明语意而必须使用标点符号时，应使用同号的半角标点，标题末尾除问号或叹号外，一般不使用其他标点符号。
但在实际UI界面中，我们无法在生产端对作者使用的不规范标点符号进行逐一的确认、修正。UI需要的是展示规则，保证多种内容最后都能有良好的视觉呈现。
在不修改作者不规范标点使用的前提下，优化标题中标点符号的宽度：将标题中引号、书名号使用半角标点；连续标点将前一位标点使用半角标点，其余标点不变，目的是在保持标题基本阅读节奏感的同时，减少标点在标题中的占位，突出标题内容。
· 标点首尾禁则
在中文排版规则中，为了保持阅读顺畅、体例一致，多数标点符号的位置有限制，通常一个标点符号依其性质，禁止出现在行首或行尾。这项规则自活字排版时代开始通行。在中文排版里面这项标点规则叫“标点首尾禁则”。
如何执行这种标点规避，平面排版中处理遵守“先推入，后推出”原则，即不希望标点符号出现在行首时，应在已经标点挤压的基础上再次检查是否有机会将其挤到前一行，如没有挤压机会再从前一行取最后一个字至下一行。前行多出来的空间需按照优先顺序拉伸，最后没有拉伸机会再按平均拉大字距的方式处理。
但“先推入，后推出”原则在UI场景中实现难度太大，意味着在判断每个标点位置的时候，还需要进行多次逻辑判断，技术成本太高。因此我们以效率优先，将“先推入，后推出”原则修改为“推出式标点避头尾”，即从上一行推出一个字排在下行的行首，避免行首、行末出现禁排的标点符号。
虽然由“先推入，后推出”退阶为“仅推出式标点避头尾”，但整体文章还是避免了标点出现在行首尾情况，遵循了中文排版基础规范。
· 连续标点挤压
中文的标点符号通常占1个字符宽度，便于识别、配置和排版，但当页面中连续出现2个及以上的标点符号的时候，文章上会出现一块空白，这些空洞会使在阅读时候增加文字间距，使文字过于跳跃，增加读者理解内容的时间，造成脑眼劳累；同时会造成版心灰度的不均衡，影响视觉美感。
标点符号字面分为“可调整”和“不可调整”两类，“可调整”的标点符号标点本身在字面左、字面右、字面居中，可缩减掉标点不占位部分的空间。
不可调整的标点包括：半字连接号、间隔号、分隔号，因为这几个标点固定半个字宽。
在《中文排版标准》里面说明：当文中出现连续标点符号排列时，为了使文字更加紧凑、易读，应该对标点符号的宽度进行调整。如果两个符号占用2个字宽，应当缩减成1.5个字宽。在此原则上，允许排版风格进一步调整让两个符号只占1个字宽。挤压方向应该是标点符号紧靠内容，挤压掉离内容远的空间。
根据这一原则，我们在代码中设置当连续出现两个及以上的标点时，挤压第二位及以后的标点为半角，缩减连续标点时的占位，减少阅读时候的视觉跳跃，减少文章中出现的“空洞”。
· 完整设计方案
回顾整个设计方案，包括了3个部分：
1、对比屏显字体与印刷字体，结合字体的字重，优化字体家族选择范围与展示顺位，优化内容可读性。
2、通过眼动实验、可用性测试调整字间距、行间距和段落间距，优化阅读节奏，提升阅读效率。
3、学习W3C《中文排版标准》等规范，吸取中文排印优良传统，通过对内容中标点符号等微观细致的调整。使正文区页面能够保持字距均匀，版面齐整、灰度均衡。从标点细节提升页面美观度和吸引力。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请加ben_lanlan，报下信息，蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系
作者：百度MEUX 来源：站酷
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务、UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司
当我们设计Web表单时，往往用最直觉的设计经验本能驱动我们去解决一些看似在界面设计中最简单的问题，但每每到细微之处，又会有无数疑问从细节中冒出来给我们的设计造成困扰。
例如：在表单界面Label（标签） 和 Input（输入框） 上下还是左右排列合理、Label要不要加冒号、输入框到底多宽合适等等......
以上这类问题看起来并不影响用户完成任务，很久以来也少有人关心这些细微之处会不会对用户有什么影响。
以至于，我表达想写一篇探究这些细节的文章时，同事会偷笑说：你都开始研究标签末尾要不要加冒号了吗......，太冷了——真是个冷知识！
确实如此，这些偏门、细碎的内容，鲜少有人会去留意和思考。因此我在写下这些分享内容时期望可以达到目标是：“冷知识虽然冷，但有用”。用我了解的这些表单设计冷知识：启发你的冷思维、引出你的热思考。
话不闲聊，我们开始讨论第一个问题：
///
01.标签末尾要加冒号吗
有个表单细节不知道你有没有想过，标签末尾是否要加冒号？
这个问题在我前团队发生过激烈争论，有同事说：“不要加，占用间距，而且没人会留意它......”,也有人说：“要加，从含义上讲，冒号的作用就是提示上下文或总结上下文的停顿。加上之后能更好表示标签与输入域的关联......."。
听起来好像都有些道理，那到底谁更对呢！
首先，我们追溯一下 Web 发展史，早期可访问性核对清单中通常坚持要标签带冒号，因为屏幕阅读器一度必须依赖各种技巧才能理解标记不明的表单。
而随着技术发展，Web表单使用“label”标签（tag）可以做正确的标记，那么屏幕阅读器就能通过标记（markup）把标签（label）和相应的字段对应起来则无需再借助冒号。
不过在客户端又有些意外！曾经 Windows Vista 指南中明确要求使用冒号， Mac Aqua 也有此要求但规则会稍灵活一些。这种情况是因为某些情况下屏幕阅读器在桌面环境与可阅读源代码的网页标记相比会遇到一些困难，桌面环境不会直接显示代码。也是这个历史原因，造成 Vista 和 Aqua 各自都有大量其标签包含冒号的历史表单。因为实在没有必要把它们全部改掉，直到今天客户端的表单依旧延续这一规则。
通过Web发展史我们明白表单标签带冒号的产生是为了解决早期屏幕阅读器的识别，如今的屏幕阅读器技术已转变为识别标签的底层代码，无需借助这种形式了。所以从这点来看要求标签带冒号已经站不住脚了。
那从情感角度分析标签带冒号的是否对用户体验有影响呢？
回到最开始，我和同事们的争论……
先简单说下答案，无任何影响！
在《Web表单设计·创建高可用性的网页表单》中，作者（卡罗琳·贾雷特）曾经做过大量的表单测试，最终证明从未有一名用户谈论冒号是否出现，即使是有些在其他环境中很介意标点符号的人似乎在线上表单中也未曾注意到。
从以上两个角度不难发现，无论是从技术发展还是情感体验，都证明可不必要求表单带冒号；因为可用性访问清单不再有这样的要求，用户研究也证明几乎没有人会留意表单冒号是否出现。
这样的结论，看似表单带冒号是失败了……，但这并不妨碍它作为一种习惯或传统延续至今，无论在客户端还是Web设计系统中仍然常见。例如：苹果电脑的Mac系统，国内阿里的Ant Design Web设计系统。
因此，得到以下几点建议：
如果你希望自己的网页表单与流行的桌面环境保持一致，请使用冒号。
如果你已有大量使用冒号的表单，请保持继续使用下去。
如果你在建立一个新的系统，你也可以索性抛硬币决定，不过要严格遵循一种方法。
///
02.哪种标签对齐方式更好
在表单中标签与表单域的对齐方式，如果你的团队已有明确的规范和使用场景，你只要拿来主义即可。可如果某天由你主导定义一个新的表单规范时，不知道你会不会重新考虑哪种标签对齐方式更好，怎样区分使用场景！
通过科学实验发现，无论是在眼动仪的热图，还是在许多可用性测试的观察结果中，用户在填写网页表单时视线主要集中在输入框的左侧。他们的视线几乎不会落到输入框的右侧，甚至都不会瞟上一眼。
以此为基础，我们在网页表单设计中有3种最常见的标签对齐方式：顶对齐标签、右对齐标签和左对齐标签。你可能会说还有混合对齐标签、内联标签、图标标签等，这些确实存在但并不是最核心的几种对齐方式，它们基本是在这3种形式上变化，不脱离本质。
下面我们逐个分析一下：
1.顶对齐标签：
马泰奥·彭佐从2006年7月进行眼动研究发现，从标签移动到输入框只需50毫秒。比左对齐标签快了10倍，后者需要500毫秒；比右对齐标签方式快2倍，后者高达240秒。能迅速填完顶对齐标签表单的原因之一，是因为眼球只需要在标签和输入框之间进行上下单向运动。
优势：
最利于减少表单填写时间（标签和输入框位置最为靠近）；用户视线固定，动线一直向下（清晰的完成路径）；节省大量横向空间（可用于以多种方式组合的相关输入框）。
劣势：
占用额外的垂直空间（如果可提供使用的垂直屏幕空间较小，应当谨慎使用顶对齐标签）；建议使用输入框50%至75%的高度作为相邻输入框间距。
适用场景：
希望用户快速填写表单，完成任务；同时，当输入项存在主次之分时，对标签扩展性要求高。
2.右对齐标签：
如果要尽量减少表单占用垂直屏幕空间，右对齐能提供快速完成时间。马泰奥·彭佐的眼动研究发现，专家用户和新手用户扫视（眼睛运动）右对齐标签表单的标签和输入框的平均时间分别在170毫秒和240毫秒，而填写完成时间比左对齐快2倍。
优势：
标签与输入框相邻（方便快速填写）。
劣势：
右对齐布局造成左侧不齐，影响了快速游览表单的效率问题；若标签文字宽度变宽，右对齐还存在灵活度问题。
适用场景：
既要减少垂直空间，又要加快填写速度的场景。
3.左对齐标签：
在顶、右、左三种方案中，左对齐表单填写速度最慢。因为左对齐表单解析问题时眼球定位次数最多，用户一般情况下都能将左对齐布局中的标签和输入框联系起来，只是花费时间较长。根据马泰奥·彭佐的研究，典型扫视时间为500毫秒，很长说明用户经历了沉重的认知压力。
优势：
容易游览标签；占用垂直空间较少。
劣势：
标签和输入框的相邻间距增大；适合于用户不熟悉表单要收集的数据或问题无法分成易处理的内容组，左对齐标签游览表单问题会更容易。用户只要上上下下阅读标签左栏，不会被输入框打断。
适用场景：
表单中存在较多的复杂或敏感信息，希望用户放慢速度、仔细思考（在一些注册类表单中较多使用）。
单从效率角度看，顶对齐标签>右对齐>左对齐，但是根据应用场景，效率快并不是我们选择标签对齐方式的唯一的指标。
因此，得到以下几点建议：
如果你希望用户放慢速度，仔细思考表单中每个表单项，左对齐标签是个好选择，特别是含有大量可选输入框或高级设置的陌生数据时；
而顶对齐标签在一些国际化产品的表单设计时，会有更好的延展性；
至于，右对齐标签虽然与表单域联系紧密，便于用户填写，但是要考虑好标签的长短不齐如何解决。能否精简标签内容，以及确定好表单与界面的边距。
///
03.标记必填与可选字段的困惑
许多表单设计中，有个常见问题：是否应该标记必填字段？如果表单中的大多数字段或全部都是必填的，我们是否仍然应该标记它们？
先简单回答：是肯定的，用户有时需要通过必填标记来评估工作量，了解输入信息量的最低限度。我会在下面具体解释原因。
了解不标记必填字段的诱惑
通常，设计师会觉得每个必填字段都有一个标记是重复的、丑陋的、占空间，而且干扰界面，甚至可能看起来很扰乱（有认知负担！）。因此通常采取以下一种或两种策略：
1.在表单顶部显示说明，说明中除非另有解释，否则所有字段都是必填；
2.只标记可选字段，因为它们通常较少；
3.在某些特殊情况下，也会什么都不做：相信用户会神奇地知道需要填写什么字段；如果不知道，那么只需要点击提交报错即可。
这些方法有什么问题？如果你这样想，我来告诉你
1.用户一般不喜欢阅读表单顶部说明。不难想象，用户不太可能阅读表单顶部的说明。表单字段需要自给自足，毕竟，每个字段都有特定指令——它的标签，为什么用户需要阅读其他任何东西来填写它呢？
2.即使用户阅读了说明，也可能忘记。你可能会说：用户阅读了顶部的说明，怎么就会忘记——这么简单的事情？
的确容易忘记，特别是当表单很长或填写表单被打断时（这种情况在移动端很常见）。即使用户记得，但这占用了工作记忆，增加了认知负荷。换句话说，你让用户完成任务更难了。填写表单本身对用户来说就相当有挑战性——为什么要让它更具有挑战性？
3.用户必须扫描表单以确定是否为必填字段。不难发现，无论是否在表单顶部包含说明，结果都可能相同，用户会忽略或忘记。他们会扫视表单，找到一个标记为必填或可选的标识。
而且有些用户甚至不会费心去环顾四周，他们只会做出假设。他们会想——“嗯，邮箱——不需要我的邮箱吧？先空着呢”。即使用户没有留空，也不得不暂停来思考一个字段是否需要填写，减慢交互速度并使过程看起来更长、更乏味。
想要解决以上问题很简单：标记所有必填字段。尽量明确和清晰展示每个必填字段，并标记它。当然，就像有些设计师所说：界面出现大量必填标识（红色星号*）确实会增加视觉噪声。甚至重复的星号 * 会带来一些认知恐慌。但相比之下，两害取其轻，这些负面因素是轻微的。
如何标记必填字段？
这里包含至少有两种方式：星号*（红色）和“必填”提示。星号*在网页上已经很常见，用户熟悉其含义。优点是它不占用太多空间，也看起来与标签文字足够不同，所以使用它。
可以使用其他标记形式吗？当然可以，但是最好遵循市面上常见的形式（雅各布定律），这样更符合用户认知。
星号应该在字段标签之前还是在字段标签之后？
这不一定有实际影响，但将其放在标签之前的一个原因是，只需扫视标签的最左边字符，就能轻松定位必填哪些字段。
星号*是一种视觉标记，应当仔细考虑表单中的标识位置。标识在标签左边能指引用户迅速浏览界面，并判断出必填项。如果在右侧由于输入框形式、长度各不相同，标识和输入框对齐会导致难以浏览和判断。
是否也应该标记可选字段？
虽然这不是强制性的，但标记可选字段确实减轻了用户思考：如果没有这个标识，用户要环顾四周，并根据其他标记字段推断该字段是可选的。如果“非必填”在字段标签旁边，那该任务会变得更容易。不描述可选字段，这没问题，但这样做会是一个很好的额外帮助。
为什么登录表单没有标记必填？
登录表单很短，一般由两个字段组成：用户名和密码，这两个字段总是必填的。如果使用星号*，标记这些字段的成本很低，并不会出错。但是，绝大多数用户都使用过很多登录表单，他们是知道要登录需要输入邮箱/用户名和密码的。所以，在登录表单中，可以省略这种形式。
而在注册表中不标记必填字段是危险的。注册表单因产品而异——不同公司在创建帐户时需要不同类型的信息。它不仅仅包含用户名和密码，所以请标记所有必填字段（包括用户名和密码）。
因此，提出以下几点建议：
基础前提，尽量去除任何不需要回答的问题，特别是涉及到用户隐私的内容。可以更容易让用户填完表单。
为了增加表单填写的机会，请尽量减少用户需要付出的努力和他们需要记住的信息。有很多方面有助于解决这些问题，但标记必填字段（以及可选字段）是最容易的方法之一。
///
04.表单域提供一些默认值有必要吗
先给出答案：这是肯定的！
在《选择的悖论》一书中，作者巴里·施瓦茨讨论了生活中选择过多的影响。并提出策略应付无处不在的过多选择。他特别叙述了智能默认的能量——即在满足多数人需要的地方放置选择——来帮助人们做出明智的选择。
而在Web表单中也有很多地方能利用智能默认减少不必要的选择次数或输入，加速表单完成过程。所以，只要合适就在表单域中预先为用户填写你认为他们想要的输入值。
通过提供合理的默认，能有效节省用户时间，就是这么简单。应用分担了用户思考或输入答案的工作。填写表单永远不是一件有趣的事情，如果这个模式能把表单填写的时间减少一半，用户会非常感激。
你可能会问：默认值不是用户想要的，误导用户怎么办？
在设计有默认值的表单域时，你要思考默认值是否是大多数用户可以接受的答案，如果不确信可以先去做一下用户调研，了解用户的心声。
就算默认值真的不是用户想要的，至少你也为他提供了一个示例来告诉用户答案应该是什么样子的。这一点也可以节省用户几秒的思考时间——或避免一条错误信息。
但并不代表所有的表单域都要给出默认值，我们只是尽可能的让用户节省时间。
如何使用：
在第一次向用户显示表单时，用一个合理的默认值预先填写文本框、组合框或者其他控件。也可以使用用户之前提供给应用的信息来动态地给出默认值（例：通过身份证自动识别出生日期；利用邮编，推导出对应省/市）。
如果只是因为你觉得不应该留下空白的输入域，那么不要使用默认模式。只有当你有理由确信绝大部分用户，在绝大多数情况下，不会修改这个取值时才提供默认值——否则，这将会给用户带来额外的工作！
///
05.输入框的宽度如何设定
有一个容易被忽视但实则举重若轻的问题，表单中输入框宽度如何设定？
在表单设计中，对于 Checkbox、Radio 等控件，很明确必须跟随内容自适应处理。但对于Input、Select等你会不会产生困惑，是定宽处理还是跟随内容更好。
不知道你是否试图这么理解过？输入框作为用户填写信息的主要方式，其表现形式是否可以提供给用户填写表单的有用线索。
唐纳德·诺曼的著作《设计心理学》中详细讲解过心理暗示方面的内容。而宽度的变化就是一种有效暗示。
在真实场景中，大部分输入框是存在理想长度的，那么就应该向用户暗示所需输入内容的长度来减轻判断负担。
下图就是典型案例，一个实际不需要花多少钱的金额输入框在左图中进行等宽处理，反而容易误导用户对输入金额的判断，造成一种不安全感。
表现形式要为用户填写提供有用线索，采用不同长度的文本框提供了暗示；这种暗示是一种有用线索，当输入框长度长短不定时，用户会很自然地思考为什么这样；填写输入框时会自然考虑这些线索。
请注意！保证暗示效果的同时，不要设定太多的宽度，反而会让表单显得凌乱；太少又会让表单看起来都像四四方方的盒子。最佳方法是找到适合产品的最佳模度值和数量。
什么是模度值和数量呢！
落在具体设计上要先梳理产品中常见的表单类型，然后设置一个默认宽度。以此为基础来有规律的增加长度，并考虑清楚它们的适用场景；从而定义出不同的模度，最终制定出整洁有序的模度规范。这样就可以让一线的设计师们跳过部分繁琐磨人的细节思考，快速搭建出合适的表单宽度并合理有效。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请加ben_lanlan，报下信息，蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系
作者：百度MEUX 来源：站酷
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务、UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司
设计语言最底层是项目设计语言，具有典型特征和主题，比如医疗项目凸显专业冷静，节日项目凸显热闹氛围。往上一层是产品设计语言，强调个性品牌，比如小视频的设计深色更沉浸，电商从结构到色彩都凸显热闹。很多产品随着发展，形成一些系列平台服务，平台设计语言确保服务“统一规范”。最顶层是生态设计语言，跨设备跨平台和硬件呈现的设计语言。
设计动手前，按照风格基调具象化拆解分析必不可少，每一个元素的表达手法都要定位清晰。
图标体系化，多场景验证一致性，发现方案一不够极致，造型复杂；方案二具备良好的一致性，但破坏了物体固有的结构，影响识别度。
在一致性的前提下，尝试简化、提高识别度。巧妙的将光影和结构交汇，极简到2个图层呈现主体；语义清晰识别度高；角度渐变光影带来舒适亲和感，15°x角度的精准把控传达专业的品牌特性。因此总结出图标绘制要遵循的法则为识别性、品牌性、愉悦性、一致性。
初期直播品牌色继承百度App品牌色，随着业务逐渐中台化，需要专属直播色。运用色彩心理学传递给人不同的情绪及心理感受，寻找直播的专属色相，而活力、温暖的红色色调，更能体现亲和有力的产品气质。
红色也有冷暖之分，此时提高色相、饱和度的颗粒度，H色相以350°为起点，以2°递增或递减，S饱和度以5°为阶梯，生成更多色阶（保持相同B明度100），在多界面和真机验证，得出直播专属红（H350 S80 B100），冷暖适中符合平台属性。
这种量身打造的稀缺材质运用在运营玩法上，如红包雨玩法，即能凸显平台专业用心的态度，又能强化用户消费行为转化，助力变现增长。
用户激励体系，采用3D玉石润泽质感+动态折射光影，体现有内涵不张扬的泛知识调性，凸显用户独特身份感。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请加ben_lanlan，报下信息，蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系
作者：百度MEUX
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务、UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司
伴随短视频平台的崛起，移动互联网的主流内容消费形态向短视频视听语言转变，视频信息流广告的时代已经来临。如何通过设计提升转化，是视频信息流广告所面临的挑战。
为了提升广告转化效果，我们结合实际项目，通过大量的实验与思考，梳理并总结了一套适用于视频信息流广告的转化组件呈现原则，我们将其命名为“延迟增强”。涵盖了沉浸式竖视频流、图文混合信息流、横视频列表流等各类常见信息流场景。
///
延迟增强是什么？
视频信息流广告有三要素：内容、框架、转化组件。其中广告内容来源于广告主投放的物料，基础框架需对齐宿主保持一致性，所以仅有承载转化信息和行为的转化组件，是可设计部分。
而“延迟增强”就是针对“转化组件”的一种伴随视频内容分阶段/渐进式的呈现方式。它由消费者决策时的理想心理动线，结合广告行为推导得出，并经过实验验证了其对于转化提升的有效性。
“延迟增强”包括两个阶段：1.广告展现初始阶段，延迟展现广告意图，通过内容吸引潜在用户；2.广告内容逐步呈现阶段，转化组件渐进式增强，辅以增益信息，不断强化，引导转化行为。
它指导了转化组件从“呈现”到“增强”的全流程，从时机（出现&增强时机）/引导（动效&互动引导）/前置（信息&转化前置）三个部分，帮助提升广告转化效果。
///
时机-延迟增强如何呈现？
转化组件的呈现时机包含“何时展现”与“何时增强”两个部分，前者帮助增加广告接收率，后者提升广告转化率。
01/ 出现时机：
延迟展现广告意图，可以提升广告卖点的展现机率
互联网的快速发展使得受众被动卷入爆炸式增长的资讯信息体中，广告借助这一媒介迅速发展，但也因为部分商业广告的过度宣传与其降低用户信息获取便捷性的本质，不可避免的使受众产生了心理上的逆反与抵触情绪，从源头拒绝了广告信息。
所以对广告来说，在广告展现初始，延迟展现广告意图，融入内容，可以缓解受众的抵触情绪，提升广告卖点的展现机率。
02/ 增强时机：
通过用户行为和视频特征动态决定增强时机，可以有效提升转化
对广告来说，搭配广告内容进行增强，通过内容积累购买欲/信任感，然后通过阶段性的增强来提示操作，对比一成不变能起到更好的转化效果。
我们首先尝试了程序化的增强时机，在不增加技术成本的前提下，根据历史经验，面向不同的广告均采用固定时段的阶段性增强。
但不同的广告物料内容不同，不同的用户偏好也不同，固定的增强时机并不能很好的满足所有广告需求。所以在技术能力可以承载的时候，我们采用了动态时机策略，通过用户行为和视频特征动态决定增强时机，在程序化增强时机之后，再次实现了转化提升。
///
引导-延迟增强如何引导转化行为？
转化组件如何引导转化，则可分为基础的视觉引导与进阶的互动引导，前者帮助抢夺视觉注意力，后者则能够在互动体验中植入部分帮助决策的“小心思”。
01/ 视觉引导：
适当增加视觉吸引点，可以有效引导点击
延迟增强需要通过阶段性的增强来提示操作，而如何增强能有效吸引注意则需要琢磨，已有实验表明转化按钮增加扫光动效与智能取色，能有效吸引注意，引导点击，对转化提升有良好效果。
02/ 互动引导：
让用户主动选择，可以增加广告曝光，辅助转化决策
互联网产品设计对于用户交互体验的追求越发极致，如影视行业走向可交互网剧，本质上是从用户接收转变为用户主动参与，用户本身对于获得优质体验的意识逐渐觉醒。商业化产品也需要紧跟“体验”与“互动”，将广告变为互动体验或具备使用价值的信息，让用户从被动浏览到主动参与，掌握对广告的选择权。
以互动投票为例，我们通过用户与用户之间的观点表达，以投票选择的形式诱发群体性选择，引起好奇心与同侪压力。
若用户选择符合群体选择，则带来群体性背书，增强信任感；若用户选择不符合群体选择，基于从众心理，用户极有可能对群体选择产生好奇，从而浏览两种选项的内容，有效的增加了品牌曝光。
///
前置-延迟增强如何帮助转化达成？
转化组件的前置主要包含信息前置与转化前置，前者辅助转化决策，后者帮助便捷操作，更好更快的完成转化。
01/ 信息前置：
增加增益信息或前置落地页信息，可以辅助转化决策
购买/转化一定是需要足够的信息积累信任感才能达成的，在前卡适当的增加卖点信息能够更好的帮助用户决策。针对下载类广告可增加评分与星级，二电类广告可以增加价格信息，甚至可以前置优惠劵、图片banner等信息，均能实现转化的正向提升。
02/ 转化前置：
缩短转化路径，可以帮助转化行为更便捷的达成
在信任感积累与阶段性的增强都达成的时候，在当前转化对比跳转落地页再进行转化，链路更短，用户流失概率更小。比起实验尝试，更像是延迟增强的基础能力配置。
首先，我们针对表单/咨询/电话/安卓下载都进行了转化前置，具有用户明确意向的按钮点击会直接在当前进行反馈。
除了直接将操作前置外，针对不同细分场景的需求，还可以通过交互形态的优化在感官上缩短路径。
这里以百度的视频MAX广告为例，我们针对重落地页的商家，将MAX首屏（视频页）与H5落地页的关系变拼接结构为双层结构，通过浮层面板承载落地页，延时自动弹出，强引导下方内容，激发用户上滑浏览兴趣，解决了落地页隐藏较深，转化链路过长的问题，同时增加了落地页曝光从而提升转化。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请加ben_lanlan，报下信息，蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系
作者：百度MEUX 来源：站酷
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务、UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司
常规工作中，需求往往由PM发起，UE团队到底如何跟PM、FE等团队成员协同，达成目标共识，是我们值得讨论的。
因此建立一套科学的模型，通过对目标的设定来倒推过程，结合定性和定量研究，与项目组就目标可以达成共识，并且更加准确的反应出产品目标中的用户体验质量，这套模型就是GSM模型。
///
GSM模型的简介与定义
“GSM”是Google提出的一种自上而下度量用户行为的方法，通常用于衡量产品/项目目标的实现程度。通过对目标的设定来倒推过程，精准设定指标体系的一种量化研究方法。适用于产品设计中的各个角色。
目标：需要解决的问题，通过对产品（项目）目标拆解推导出用户体验目标，体验目标辅助产品目标达成；
信号：设计目标实现后所产生出的现象，设计目标是信号的必要条件；
指标：是对用户现象的量化，也就是信号所得出的可衡量的数据化现象。
///
GSM模型的使用场景
GSM模型可适用于产品设计中的各个角色，对交互设计师尤为重要，交互设计师作为连接产品、用户、设计的中间一环，不断在业务和体验之间博弈，寻找平衡点。
通过GSM模型对产品目标进行分析，结合业务目标与用户需求，找到改进机会点，在设计中帮我们斧正设计思路，对方案不断优化，上线后进行方案效果回收。
GSM模型带来的价值
综上所述，GSM模型基于项目目标，找出设计目标。并且可以辨别设计的优良。
///
GSM模型的具体实施步骤
通过对目标的设定来倒推过程，并精准设定指标体系。
| step 1 识别并明确目标（Goal）
业务目标、用户目标、设计目标是什么？
用户要完成什么任务？我们希望他们按照什么路线走？希望他们执行什么操作？
这里以手机百度APP智能小程序业务端——创建小程序表单项目改版为例，提高表单审核通过率是整个项目目标，通过拆分项目，设计目标为表单填写更快速和表单填写更准确。通过确定设计目标继续推到用户表现。
| step 2 推导目标对应的表现（Signal）
什么用户行为/态度指示了目标达成？什么样的感受与目标失败/成功相关？
从目标——信号可以是一对多的关系，根据用 户行为在不同的行为阶段会有不同的信号表现，以用户不同阶段观测用户的不同行为表现。
进入 —— 通过各种途径进入页面
发现 —— 在该页面中浏览、查找自己所需要的信息
辨别 —— 然后通过图片、标题等内容以及设计形式来识别有效信息
行动 —— 找到后用户想了解详情，点击链接进入
这里还以手机百度APP智能小程序业务端——创建小程序表单项目改版为例，将设计目标转化为用户行为。
| step 3 找出关键的数据指标（Metric）
依照用户的行为表现，观测对应的数据指标，通过这些可量化、可衡量的数据指标进行数据分析并指导下一步的优化迭代。
1. 进入 —— 作为用户进入的页面，在这一步经常发生的问题是退出，往往会产生两个对应的指标
a. 作为用户在网站或APP的着陆页，用户离开为跳出
b. 非网站或APP的着陆页，用户离开为退出
往往，在这一行为中“跳出”指标可以衡量页面内容传达与用户目的匹配程度，是否符合用户的心理模型，这也是绝大多数网站首页最重要的数据指标之一。
2. 发现 —— 用户来到页面中都要先浏览的过程
在这一步，设计师关注的问题是页面中的用户视觉流，关键信息能否被用户快速锁定。
关于识别性的指标，归纳出3点来进行衡量：
c.人均点击次数（适用特殊控件，如筛选器等）
4. 行动 —— 用户在站内内容的点击
在首页的分流数据中，作为设计师主要关注两个指标：
a.不同内容的点击占比
b.其后续路径中的目标转化质量
再次回到我们的工作案例中，根据用户行为表现拆分成数据指标。
综上所示，通过表单可视化、精准引导、组件升级的方式，完成项目与设计目标，最终改版成功。
///
结语
GSM模型是一种综合数据验证模型，在使用过程中可以结合头脑风暴、市场调研、可行性测试等方式共同使用。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请加ben_lanlan，报下信息，蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系
作者：百度MEUX 来源：站酷
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务、UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司
业务性强，内容复杂度高是To B产品的典型特征。新用户需要快速认知平台能力并顺利上手，老用户则需感知信息的变化、功能的拓展并迅速响应。体系化的帮助是通过在操作的不同阶段提供差异化的引导及反馈，助力用户在应用中成长。
通过大量的案例积累及系统调研，发现“帮助”并不是单一的某个功能，而是一种体系化的能力，需要通过不同手段来实现。概括来说就是“在产品使用不同阶段为用户提供恰当的提示与指引，通过组件的灵活应用及能力创新，帮助用户降低认知成本，提升操作效率。”
用户对产品的应用周期经历前、中、后三个阶段，每个阶段的设计目标都各不相同：操作前注重提升用户的全局认知，深化理解，助力精准触达；操作中助力提效，让用户知道做什么，怎么做；操作后明确反馈，帮助用户明确结果。
用户有新老之分，对系统的熟悉程度及应用诉求不同。因此针对不同用户各阶段的使用诉求进行场景化的拆分，提供差异化帮助。
我们到陌生的地方会找导视标识或者找人寻求帮助，新用户到平台内也会面临同样的困境，遇到问题无从下手时会寻找含有【帮助】【客服】字样的内容，那么帮助中心、智能助手这类有明显特性的功能则会成为用户遇到问题时的第一选择。通过业务思考及行业调研，以简洁、高效、情感化为目标最大化的发挥其属性优势，让用户在使用过程中更易理解和接受，平稳有效的帮助用户渡过新手期。
1、帮助中心
帮助中心，一个时常被忽略并被严重低估的功能。它是平台全量信息集合地，不仅能帮助用户系统了解平台概况，也能引导用户行为，树立品牌形象。为保证用户高效、便捷的获取帮助信息，在页面表现上需突出内容本身，忌过度装饰。从设计角度来看，一个好的帮助中心应该符合以下条件：框架简洁清晰、信息突出并辅以锚点定位。在框架设计上一般将页面分为导航区、内容展现区两部分，导航与帮助内容对应性强，层级简单，能让用户在短时间内了解平台能力构成；帮助文档内容一般复杂冗长，锚点定位可以充当文章大纲，辅助用户精准定位。
2、智能助手
通过内置的帮助和指导性说明来解答用户使用产品过程中遇到的简单、共性问题，降低人工客服响应成本。智能助手包含两部分：入口与悬浮窗口。入口一般悬浮于页面右下角，点击后触发悬浮窗口。
市面很多助手能力较单一，仅能机械处理通用问题，无法提供多样化帮助，很容易让人觉得是个没啥用的摆设，对它慢慢失去信任。为重新唤起用户的信任，需要在设计上注入一定的生命力，让用户觉得易接受、有选择、有温度，从而真正用起来。
1）悬浮窗口能力多元化。作为承载智能助手核心能力的悬浮窗口，优化方向有以下三点：首先，智能助手与用户的交流不再局限于单纯的问答，而是根据账户属性向用户提供高频问题集合，并根据用户的回应拓展更多问题，提供多维化的帮助。这个主动性的帮助不仅让用户感受平台的温度，无形中也降低了用户的思考成本，更快的熟悉平台能力。
其次，每个问题旁边都提供“是否有用”的按钮供用户评判。此功能不仅为平台答案提供了优化空间，也强化了用户对平台建设的参与度，让助手与用户共同成长。
最后，对话窗口也可拓展辅助能力，例如常见问题、快讯、快捷入口等，为用户所想的同时也提供更便捷的站内流动通路。
2）入口形象IP化、情感化。除了自身能力外，入口的设计则会提升功能的存在感，从而吸引用户的关注。首先品牌ip形象的植入会让入口更生动，在唤起用户注意的同时强化品牌印象。其次拟人化的主动问候能提升平台的亲切感，拉近与用户的距离。
新用户对平台相对陌生，恰当的引导能让他们快速关注重点。老用户对平台的定位及能力相对熟悉，目标性更强，但在应用同时也抱有更高期待。因此恰当的引导能帮助他们快速了解平台变化并精准触达。作为产品设计者，也希望对用户行为进行有意识引导，让用户能发现、探索平台新能力，或能够按照我们的希望使用产品。公告弹窗、新手引导、全局提示这三类方法可帮助用户高效获取信息并助力精准触达。
1、公告弹窗
常用于系统升级告知，以模态弹窗表达，让用户聚焦当前内容并支持跳转了解详情。公告样式根据内容细分为三类：版本更新提示、重点升级告知、常规通告，不同类型需根据信息量多寡差异化表达。设计时可辅以插图或其他视觉元素烘托氛围，并在文案上注入情绪化的表达，从而提升用户的关注度。
1）「版本更新提示」承载简单介绍内容，让用户关注且快速获取变更信息。
2）「重点升级」当有若干重要功能更新或新增时，可用此形式突出重点。
重点内容露出建议2-4组为佳，弹窗宽度可根据内容适配。
3）「常规通告」常用于文案较多的场景。设计上需要弱化视觉氛围，突出内容本身。
2、引导类
针对局部功能升级的提示说明，一般与元素绑定关系较强，可让用户直观了解关注点，提升功能触达率。虽然此类引导轻量便捷，容易帮产品提升数据指标，但要注意适度应用。根据功能重要度、操作复杂度将引导总结为分步式、气泡、闪点、操作示意4类。
1）「分步式引导」常用于页面多个功能升级的引导组。当页面有多个升级点，直接平铺会让页面臃肿不聚焦。为了让用户高效获取信息，建议一次仅显示一条，通过「下一步」操作，逐步唤出剩余引导。为避免步骤过多导致用户疲劳，建议最多不超过5步。
2）「气泡式」相对轻量的引导，有足够的提示性但不影响其他功能操作。
3）「闪点提示」微辅助型提示，常与气泡引导配合使用。在需要关注的地方闪烁，点击闪点后唤出关联气泡提示。不对用户造成视觉干扰，又能引起一定的关注。
4）「操作示意」当无法用图文清晰描述操作路径时，以动态形式表达。
3、全局提示
重点信息的汇总或提示。此类提示完美融合于页面，醒目且对操作无干扰，用户可根据披露内容判断是否处理。通过警示、徽标的应用向用户传达信息的变化并提供快速触达的能力，无形中提升用户响应效率。
1）「警示」不同颜色的提示条。常作为前置提示存在于页面或模块顶部，为用户顺利操作提供指引性帮助。既不打断用户当前操作，又足够明显，一般需手动关闭或事件结束后自行消失。不同颜色属性不同：一般蓝色代表消息通知、绿色代表成功、橙色代表警示、红色代表错误或异常等情况。另外，也可作为反馈应用在一些需要明确指示的操作后场景，此处暂不展开讨论。
2）「徽标」形态各异的小红点。常出现在图标、按钮右上角的红色圆点、数字或文字，简单且醒目。表示内容更新或有待处理的信息，此类提示符合用户心智，无需教育就能向用户精准传达提示意图。
使用时注意无数字与有数字的应用场景。有数字的徽标给用户带来的心理压力会更大，也会更吸引用户注意力，同时需注意数字长度控制。
存在于操作的具体任务中，通过提示、推荐、预置信息等方式降低用户的认知及操作成本，提升填单效率。
1、文案提示
平铺在元素附近，对重点或复杂功能提供直观描述或建议。带有引导性的文案处理，会促进用户优化填写方案，输入更合适的内容。应用类型有三：重点提示、辅助说明、占位提示。重点提示与辅助说明使用户无需猜测；占位提示可使用户能够快速明确输入规则。因表达侧重不同，表单设计时三者搭配效果更佳。
2、工具提示
此类信息作为文本解释层级较低，无需直接展示。通过悬浮或点击元素触发对应说明，以气泡形式出现。触发式的展现既能避免非必要信息堆叠导致的页面臃肿，又能保证需要的时候有迹可循。
当一个系统背后的产品设计者考虑足够全面，能够预判用户的预期，那么它就能主动的给用户提供建议和帮助，甚至帮助用户自动执行一些任务，最大化减轻用户的决策压力。但值得注意的是，“智能化”需要一定的产品能力及丰富的数据作为支撑，设计时需结合实际情况应用。
1、信息预置
系统根据账户属性自动为用户预置内容。如下左图可见，仅需要填写一条内容，其他对用户利益无损的内容可通过预置选项来提升填单效率。
2、智能推荐
此类设计的前提是平台有足够的数据积累，通过大数据或业务特色为备选内容打标签建标识。常用的设计方法有两种-为用户提供可视化标签，助力用户快速决策；交互手段简化，由多信息录入变为直接选择，强化推荐内容展示性，从而降低操作中的思考和录入成本。
场景一：「帮助决策」
表单中有大量需要用户录入的字段，在无任何参考的情况下用户用于决策的时间及输入内容的合规性无疑对填单效率造成一定影响。下图可见推荐标签能帮用户提供方向及边界，辅助用户决策，降低思考成本。
场景二：「提升填单效率」
以单元创建为例，传统路径如下：新建>填写表单>保存>再次新建>再次填写表单…以此往复。用户每建立一个单元均需要把同类型的内容填写一遍，耗时费力。而智能推荐将常规表单输入变为模版选择，仅需2步就可完成多个内容创建：输入关键词>选择模版。选择和浏览的成本远远低于数据的频繁输入，模版设计则通过简洁的样式及内容层次化的展现提升信息获取效率。通过路径及交互方式的转变，上线后数据反馈操作效率大幅提升。
3、预览能力
当操作过程较为复杂或结果难以预测时，可视化的预览可及时展现结果样式，方便用户实时调整，提升操作安全感。
及时响应操作成果，将功能的运行情况、数据的对错反馈给用户，及时有效的帮助修复输入中的问题。常见的反馈有以下四类：toast、表单错误校验、模态弹窗、独占式页面，每种样式因干预强度不同而适用不同的场景。
1、Toast：一般3s左右消失，因体积小、展示位置靠上、自动消失等特点时常被用户忽视。常用于操作结果、系统性等等无明确后续指引的反馈，例如“提交成功”、“操作失败”、“服务器无反应”。
2、错误校验：当表单出现输入错误时，按照就近原则在错误附近为用户展示明确的提示性消息，纠正和引导用户的输入内容。
3、弹窗提示：提示性和阻断性都很强，能够让用户聚焦信息本身。通常提示内容可为用户提供指向性引导，需要强关注。
4、独占式反馈：提交后页面切变为独立展示的页面级状态反馈。比弹窗的阻断性更强，信息获取更沉浸。在设计时建议搭配状态插图强化氛围，并提供操作按钮为用户提供通路。
帮助体系的出发点就是在尽量降低人为干预的基础上，减少用户在不同使用阶段中的刻意思考与寻找，从而提升操作的顺畅性及用户的认可度。综上就是在不同操作阶段可用到的设计方法，尽管有些手段并不起眼，但也正是这些点滴的聚集和系统的应用为用户带来无声的帮助，让B端产品使用体验变得高效且富有温度。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请加ben_lanlan，报下信息，蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系
作者：百度MEUX 来源：站酷
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务、UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司
设计师在接触一个新的业务领域时，会习惯性地通过竞品研究快速地了解行业，通过对比竞品快速地找到体验优化机会点。但B端产品具有专业性强、功能复杂度高和操作链路长的特点，即便有竞品可以对照，B端设计师也很难在短时间内深刻理解业务逻辑，做出超越性的设计。
应该如何去打破这个困局呢？除了深耕业务和修炼基本功外，本文尝试从预判设计、表达清晰、操作可控 三个方面提供了一些助力B端产品体验提升的小妙招。
在团队活动时，从搭档的一个眼神我们就能预判他接下来的动作，相互的默契配合能让我们顺利地完成任务，在产品设计中的预判设计也可以得到事半功倍的效果。
我们可以从历史记录、效果预知、智能辅助和行为惯性4个方面进行设计，辅助用户决策，提升操作效率。
1.历史记录
a.用户操作行为记录
广告优化师通常会管理几十至上百个账号，需要在多个账号之间频繁切换去盯盘和新建广告，频繁的操作难免会造成信息遗忘和决策卡顿，从而会影响操作效率。在管理后台的设计中可以通过记录用户最近操作行为，恰合时宜地为用户提供帮助。
案例：在新建计划环节，标识出本账号上次的选择记录（最近一次的投放目标），辅助优化师快速做决策。
b.基于操作习惯的系统预测
平台系统可基于个体操作习惯和大数据分析来预测用户需求，提供高概率的操作建议，给予用户贴心指导。
案例：针对广告平台表格信息密集，不易快速获取关键指标的问题，Google提供了用户自定义栏，而Facebook的表格栏会根据用户列操作习惯和自定义栏行为进行大数据分析，预置一些高频意图的组合栏，一键切换即可查看关键指标，操作更便捷。
2.效果预知
a.效果预览
表单页对填写的物料内容进行映射，展示真实效果预览，降低用户心理的不确定性。
案例：在进行广告创意创建的过程中，优化师填写完标题和上传完物料后很难知道广告投放到手机端用户看的真实效果。而所见即所得的可视化编辑方法支持创意样式实时预览，可以辅助优化师更好地进行创意优化。
b.效益预估
针对一些需要效力评估的页面，平台通过预置好的算法对用户内容的表达及时给出估算值，给出建议，从而提高内容填写质量，降低填写的盲目性。
案例：Google广告平台在新建创意环节，对广告素材资源的组合方式和数量进行估算，呈现当前广告与高质量广告设置的差距，辅助用户进行高质量的广告制作。
3.智能辅助
用户在进行输入等操作时可以提供智能辅助，例如表单填写时对需要录入信息的区域提供辅助提示，通过自动补全或联想词来帮助用户快速录入信息，在保持用户的操作自由度的情况下提效。
4.行为惯性
在一些场景里，用户的行为具有很强的关联惯性，例如上班时间进到办公区域打开办公APP首要目的一般是打卡签到。通过梳理主线任务或整理用户体验地图可以挖掘出很多基于行为预判的设计机会点。
案例：预判用户在工作台内截屏后大概率是去反馈遇到的问题，适时将反馈入口透出，可以提高反馈的效率和用户体验。
现实生活中，在与他人交往时，清晰的表达尤为重要。同样是演讲，有的演讲者“词不达意”没有重点，或者内容晦涩难懂让听众感觉索然无味；而好的演讲者则会用场景化的方式将逻辑复杂的事情讲给听众，让听众有身临其境的画面感。
好的设计也应该是清晰好用的，能让用户沉浸其中轻松高效地完成自己的任务。
如何让用户通俗易懂地了解产品功能，并能快速上手？我们可以从功能易理解、内容强吸引和选择无负担三个方面来降低用户的操作门槛。
1.功能易理解
a.术语转换
将一些晦涩难懂的词汇转化表达方式，转化为更贴近用户视角的文案描述，传递细节感受；
b.信息有效展示
透过需求背后的真实意图分析和高效率的信息展示可以让用户更方便地获取更多信息，提升产品的服务效益。
案例：服务器预警平台从传统的表格形式优化成拓扑图。将所有的云服务器都抽象成一个个矩形，矩形的颜色代表服务器监控指标的状况。当方块颜色显示为黄色，则表示该云服务器内有监控指标出现了异常，这个时候目标用户就需要重点关注。
2.内容强吸引
对于老用户来说，从之前习惯的平台迁移到新的平台一般会有很大的抵触心理。迁移前用户考虑的关键点包括：不迁移是否有影响？新平台有什么优势吗？迁移起来麻烦吗？
以百度营销客户中心迁移引导页方案为例，初期方案首屏只告诉用户平台升级了，但是不能快速了解到升级后的核心优势有哪些，同时迁移按钮设计得很弱，传达的信息是迁移可能会很麻烦，很容易让用户止步于此。
所以在进入迁移导流页面时，首屏首先要讲清楚新版平台的能力和迁移方式。对于当下想迁移的用户，明确迁移方式和入口；对于徘徊不定的用户，告知迁移后的好处并做好最后下线时间的提示。这些信息不仅能够消除用户迁移前关于成本的顾虑，也能吸引用户立即开始迁移行动。
3.选择无负担
B端产品操作链路通常比较长，用户很容易迷失其中。对于逻辑复杂的功能在做页面设计时需要突出主次和流程引导，尽可能提供一个主要触发的主按钮，让客户不用过多思考就知道模块和操作的隶属关系，降低认知的负担。
我们在执行任务时总是希望有过往经验可借鉴，如果事情按照自己的预期发展了会觉得很踏实有可控感。同理，用户在操作一个系统界面时也会有类似的心理变化，对于自己熟悉的功能希望主动权在自己手里，能复用之前的经验无需额外的学习成本；对自己不熟悉的功能希望有及时的引导，能很快地上手并能掌握主动权。
不可控的操作体验会让用户在使用过程中产生很强的挫败感，一旦有了这样的心理感受就很难被扭转。那如何保障体验的基线确保用户正向的感受呢？下面就结合操作一致性和明确指引性两方面进行说明。
1.操作一致性
针对同类型的功能，在交互设计上要尽可能地保持逻辑对齐，保证平台的一致性同时降低用户的学习成本。一致性设计对产研提效也有很大的益处。
案例：下例中的批量操作项的逻辑，都是通过选中复选框之后在模块上方展示批量操作栏且支持一键关闭。这样该平台的用户无论在任何场景下只要注意到复选框就对批量操作功能有了预期，没有额外的学习成本。
2.明确指引性
对于复杂的使⽤流程，最好能够在客户使⽤的过程中建立统一的指引，引导客户⼀步步完成操作，从而提高任务的完成率，促成业务目标达成。
案例：当一个平台需要用户完成的任务繁多且流程性强时，需要把所有的核心任务按照层级进行呈现，并作为一个固定模块展示在醒目位置。这样用户既可全局视角理解业务又能作为功能入口快速触达。
B端业务中，交互设计的核心在于为特定场景设计择优的行为路径；通过分析用户当前所处的阶段和场景来判断此刻遇到的关键问题。针对不同的问题去选择对应的解决策略，例如对于新手来说降门槛会是首要任务，对于熟手来说操作的效率会显得更为重要。结合预判设计、表达清晰、操作可控三个维度的案例可以让我们在对业务理解有限的情况下，产品设计能有更多思考角度，也能有更明确的设计主张。
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请加ben_lanlan，报下信息，蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系
作者：百度MEUX 来源：站酷
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务、UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司
蓝蓝设计的小编 http://www.lanlanwork.com