我就想问一问你们京东买东西从退货到退款要多长时间！【京东商城吧】_百度贴吧
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&签到排名：今日本吧第个签到，本吧因你更精彩，明天继续来努力！
本吧签到人数：0成为超级会员，使用一键签到本月漏签0次！成为超级会员，赠送8张补签卡连续签到：天&&累计签到：天超级会员单次开通12个月以上，赠送连续签到卡3张
关注：621,197贴子：
我就想问一问你们京东买东西从退货到退款要多长时间！收藏
买了台苹果8 商品还没有发货我突然想还不如买个X点退款他还照样打包发货问客服说系统拦截不成功要等货到长沙 等配送员打电话拒收才可以 吗的等就等吧只要今天能把款退了就行了 到了长沙拒收了客服说要等货退回原来寄出的仓库才能退。ok 我也等过了一天没动静 客服又说这个商品要在长沙放48小时才可以退回，！ 在京东退个货能把你玩死
快来人呐！
目前还未到账
您好，您的心情我们非常理解，烦请您把相关订单号给我们为您核实处理，还请您放心，我们会尽快为您解决好相关问题，感谢您对京东的支持，祝您生活愉快！
登录百度帐号推荐应用拒绝访问 | steamcn.com | 百度云加速
请打开cookies.
此网站 (steamcn.com) 的管理员禁止了您的访问。原因是您的访问包含了非浏览器特征(3e72ed2efa2e43bf-ua98).
重新安装浏览器，或使用别的浏览器你好，我想问一问，我在淘宝退款成功后，钱没有到银行卡里，退款详情页面显示退款成功，退款到支付宝。。。_百度知道
你好，我想问一问，我在淘宝退款成功后，钱没有到银行卡里，退款详情页面显示退款成功，退款到支付宝。。。
可是我没有支付宝账号啊。。。难道要等一段时间？？？
我有更好的答案
黑暗教海岸线的空无分割了 在我们的衣袖上留下记号。挥手告别，挥手消失在视野中它们是唯一的声音，在抗议，抗议。伟大的止息 “你不是最惨的一个”哈哈
采纳率：63%
你把支付宝激活下！
退款直接都是退到支付宝的，你用你的淘宝账号关联的支付宝就可以，激活就可以用的。
没激活吧，激活试试，里面应该会有余额
其他1条回答
为您推荐：
其他类似问题
淘宝退款的相关知识
换一换
回答问题，赢新手礼包
个人、企业类
违法有害信息,请在下方选择后提交
色情、暴力
我们会通过消息、邮箱等方式尽快将举报结果通知您。【得到APP】产品体验报告(交互设计师-陈韬宇) &br&一、产品概述&br&（1）体验环境&br&&p&机
型：IPhone 6S&/p&&p&系
统：IOS 9.3.1&/p&&p&APP版本：1.2.3&/p&&p&体验 时间：&/p&&p&体
人：UX陈韬宇&/p&&br&（2）产品的概括或简介说明&p&
得到是一款由罗辑思维团队2015年11月推出的知识服务应用，主打利用碎片化时间听知识、阅读图书，帮助用户更快捷高效的获取未知有用的知识。在App store 的标题为:“三分钟听一条新知识、一天读一本好书，每天为知识充值... ...”。&/p&&br&&br&&br&&br&&p&
产品Icon采用具象的文字符号“得到”，颜色为暖色系中最温暖的橙色。橙色是欢快活波的光辉色彩，能给人庄严、神秘、尊贵的感觉，也是一种能够引起人食欲的颜色。&/p&&p&
“得到APP”Icon给我传达的设计理念和信息：&/p&&p&
左脑理解为：橙色的汉字“得到”；&/p&&p&
右脑感受为：对获得知识的渴望；&/p&&br&&p&
所以在使用前，我对它的期望是：&/p&&p&
1.希望能从中获得有用的知识；&/p&&p&
2.希望有简短、有料、有趣的内容；&/p&&p&
3.希望APP界面简洁清爽，没有广告；&/p&&p&
4.和从微信公众号获取知识的体验不一样；&/p&&p&
5.区别于传统的新闻资讯类APP、电子书阅读APP；&/p&&br&&br&（3）产品定位&br&产品定位：为职场小白领和部分有阅读需求的大学生，提供浓缩版的电子书。&br&&br&（4）用户需求分析&br&&ul&&li&用户是谁——“职场小白领、有阅读需求的大学生”&/li&&li&客户是谁——”出版商、作家等知识生产者“&/li&&li&用户特征——“20岁-40岁的移动互联网用户，文化教育程度较高，工作（学习）压力大，空闲时间较少”&br&&/li&&li&目标用户的需求——“阅读时的知识选择、阅读的时间成本、难以坚持阅读”&br&&/li&&li&解决方案——“ 核心功能点：今日值得花时间/听、今日值得花时间/看
”&br&&/li&&li&用户使用场景&br&用户会在睡觉前、公交车上、午休时间、吃饭时等碎片化时间使用该产品。&/li&&/ul&（5）市场状况现状和分析&br&&ul&&li&行业分析——&br&当下的阅读类app的市场状况竞争激烈，移动阅读正逐渐成为人们阅读的主流方式，各种阅读app层出不穷，发展势头强劲。内容为王被赋予了新的内涵，内容价值标准发生转变，产品趋同性较强，用户体验有待提升。&/li&&li& 产品数据——&br&得到app上线5个月，累积注册用户已经达到百万人，日活比例18%，用户付费比例达到20%，在苹果商店的图书畅销榜一直排在前十。&/li&&/ul&&p&&strong&二、产品体验&/strong&&/p&&br&（1）新手引导、注册与登陆&br&
先从启动页开始说起，【得到app】的Splash screen 使用应用的logo和slogan作为主元素，传递品牌信息。且展现时间足够短，页面设计的很简洁，由于slogan使用了大家都熟悉的不能在熟悉的”好好学习，天天向上“，所以用户能够在很短的时间内对该应用的品牌留下印象。Icon、splash screen、界面导航栏颜色都是橙色，设计的连贯性与一致性非常好，给用户快速启动的感觉。&br&&br&
引导页和登陆注册页面整合到了同一个页面，用户想看引导页就看，不想看就不看，直接登陆，我觉得这样做是一个比较好的设计。常常听到很多用户吐槽一些app的启动页很烦，每次都是直接跳过。这样做不仅达到了产品提前告知用户主要功能和特点的目的，也让很多熟悉产品的用户可以直接跳过，一举两得。&br&
注册登陆方式中，微信快捷登陆非常突出，这应该是由于罗辑思维微信公众号的用户数量庞大，得到app的早期用户都是从罗辑思维微信公众号导流过去，所以产品突出了微信快捷登陆。随便看看在底部三个入口中是最突出的，用户可以在不登陆、不注册的场景下体验产品。&br&&br&&br&
注册页面非常简洁清晰，只需要用户输入手机号码、验证码、密码三项内容，简化了用户的输入操作。但接下来的页面需要用户上传头像、填写昵称和性别，个人觉得不带有社交属性的产品可以在注册流程中去掉用户基本信息维护。&br&&br&（2）产品的界面与交互如何&br&&br&&br&&br&
首页界面给人的感受就是“有节制”，不多不少。首页分为今日值得花时间/听、今天值得花时间/看、今天推荐三大栏目，&今天值得花时间/听& 的信息展示简单清晰，标题、标签、时间及隐藏功能的排版符合移动端用户的阅读与操作习惯。点击橙色的播放按钮，可以播放今日全部列表中的音频内容；点击其中某条列表，可以播放该列表对应的音频；在此操作中不跳转页面，减少首页的跳出率，且有明显的操作反馈，个人认为体验还是不错的。”今天值得花时间/看“点击内容区域也不做页面的跳转，相对弱化了内容的购买，强调收藏和分享，分享后的页面做了重新的排版，突出品牌的展示与宣传。”今日推荐“突出订单的转换，商品名称、图片、介绍、价格等基本信息都有，其中比较有亮点的是简介中有音频时长或节省的阅读时间，体现了该app与其他同类产品的差异性。&br&
首页的不足之处：体验后觉得在界面设计上栏目标题和列表（内容）直间的层级区分不明显，栏目标题的文案略有些长，建议修改为”今日值得 / 听“ ”今日值得 / 看“。另外对于这样一款碎片化阅读软件，应该突出个性化定制，根据用户的阅读兴趣，提供每日的听、看和推荐。&br&&br&&br&
金句页面的设计简洁明了，采用手势随意滑动切换的交互方式，自然有趣，动画效果细腻。底下的三个按钮分别是”解读版商品详情页、收藏、分享“，比较强调收藏功能，解读版商品详情页的图标符号首次使用用户可能不懂，但摸索一两次之后就知道此功能了。导航栏上有底图这一功能，用户可以自定义金句卡片的底图，并且可以同步到分享后的页面。&br&&br&&br&
发现页面使用横滑动列表的形式展示商品，查看全部需点击品类名称后面的右箭头（&），很容易忽视此功能，建议可以在横滑动列表滑动到尾部后加上“查看全部”。导航栏上左边为搜索，右边为购物车，购物车和底栏的切换TAB“已购”在用户感知上是没有区别的。banner底部的导航控件没有用传统的小圆点导航控件，保证了banner的完整性、易用性，个人觉得不错。商品详情页的商品价格不够突出，用户不能一眼就找到商品金额信息。商品详情页下拉图片放大的交互效果不错，不仅满足用户下拉的操作行为，而且提供了放大展示banner信息的功能。&br&&br&&br&&br&
我的页面使用传统的列表排版，通过列表之间的间隙来对信息进行分类，线性图标和3种不同颜色文字之间的搭配清晰呈现了页面中信息关系。&br&&br&&br&三、产品分析（1）产品结构图&br&&br&&br&（2）用户使用流程图&br&1.用户注册流程&br&&br&&br&2.用户登陆流程&br&&br&&br&&br&3.用户听、看流程&br&&br&&br&&br&4.用户购买商品流程&br&&br&&br&&br&（3）主要功能体验分析&br&1.注册功能分析：&br&
注册流程整体上体验还是不错的，但注册流程中，第二步”上传头像、填写昵称、设置性别“放到注册流程中没有必要。&br&
理由是：非社交类app，也不涉及线下交易或快递收货，所以可以去掉注册流程中的个人信息维护，简化注册流程。&br&&br&2.用户听、看功能分析：&br&
每天为用户提供6条免费的语音，每条时长2分钟左右，大都是知名大佬的商业观点或科学理论;另外还提供干货图书(精简版的电子图书)和音频演讲资料。替代其他阅读平台提供免费试读的机制，得到的内容团队把原著里经典的理论和案例做成金句，通过这些来吸引读者。&br&
在设计上，得到app把”听“这一板块用整个首屏来展示，即点即听，操作门槛极低。”听“这个板块的列表上不做页面的跳转，减少首页的跳出率。同时还为每个音频都配有电子文稿，方便用户详细阅读这些内容。&br&&br&3.日历功能分析：&br&
我认为日历功能存在的价值不仅仅是方便用户查看历史内容，而是要让用户持续去学习，增加用户学习的动力与乐趣！得到app的日历功能简单粗暴，直接呈现过去每天的历史”干货“，对用户历史上已经读过的内容和未读过的内容在界面上没有任何提示，且对未来将要推送的内容也没有预告。&br&
在功能的设计上，突出强调下载功能，大部分用户在此场景下的目的就是下载（收集内容），这点做得挺赞！&br&&br&4.用户购买商品功能分析：&br&
商品详情页的商品价格等关键信息的页面展示太不突出，有加入购物车和直接购买功能，但缺少确认订单的页面，（在用户账户中有余额的场景下）点击购买，直接一步就完成下单支付。这个功能虽然减少了用户一步操作，但不符合移动端用户的支付操作习惯。尤其是在误操作的情况下，不可撤销订单状态，会对用户造成不必要经济损失，这样的体验是非常不好的。&br&
在账户余额不足时，只能通过app store 充值，不支持支付宝或微信支付，个人认为这是功能方面的缺失。&br&&br&（4）盈利模式&br&&strong&B2C——直接销售内容知识与电子书&/strong&&br&&br&四、竞品分析&br&1.kindle阅读器&br&竞品的优势：海量全本电子书资源，软件硬件结合，用户体验优秀。亚马逊旗下产品，商业模式成熟，用户规模庞大，掌握庞大的用户数据。&br&竞品的劣势：缺少优质的个性化服务来增强用户粘性；随着移动互联网的发展，人们对阅读图书的需求也发生了变化，从之前单一的看，转变为听+看，尤其是对碎片化时间的利用，kindle在这方面做的不够好；&br&&br&2.喜马拉雅&br&竞品的优势：海量音频资源，海量内容生产者，用户基数大&br&竞品的劣势：内容的质量参差不齐&br&&br&3.一个app&br&竞品的优势： 韩寒监制与腾讯合作推出的一款文艺阅读应用。每天为你提供一张图片，一篇文章‘一个问题及它的答案。借助韩寒的名气和粉丝效应，培养了庞大的忠实用户群。盈利模式已从单一的广告发行发展为线上品牌旗舰店+线下体验店，从无互动性发展到具有社交属性。&br&竞品的劣势：粉丝属性太强，产品太过于小众，不利于后期用户的扩展。&br&五、如果我是PM1.增加确认订单页面或弹窗；2.增加支付宝与微信支付功能；3.首页“听”“看”基于用户兴趣推荐；&br&4.强化内容生产者的品牌展示和利益，吸引更多优秀的内容生产者入驻；&br&&br&总结&p&我愿意持续使用这款APP，因为它解决了我碎片化阅读的需求，内容的质量较高。&/p&&p&得到是一款把书读薄的APP，现代社会，资讯多了，诱惑多了，人们越来越没有心思沉淀下来去完整的看完一本书，这种碎片化阅读方式正好满足了用户在求知过程中的投机取巧急功近利的心里。正如罗胖所说：不需要下苦功夫，不需要从底层开始构建，不需要拼接逻辑，不需要啃原始材料，只要听我讲，听我给你的流食，你就能得到... ...&/p&
【得到APP】产品体验报告(交互设计师-陈韬宇) 一、产品概述 （1）体验环境 机 型：IPhone 6S系 统：IOS 9.3.1APP版本：1.2.3体验 时间：体 验 人：UX陈韬宇 （2）产品的概括或简介说明 得到是一款由罗辑思维团队2015年11月推出的知识服务应用，主…
&figure&&img src=&https://pic3.zhimg.com/v2-c5fbd6268c4_b.jpg& data-rawwidth=&560& data-rawheight=&420& class=&origin_image zh-lightbox-thumb& width=&560& data-original=&https://pic3.zhimg.com/v2-c5fbd6268c4_r.jpg&&&/figure&&p&本文9733字，你可以上个厕所回来再看。_(:зゝ∠)_&br&&/p&&p&___________________________________________&/p&&br&&br&&p&Hello各位看官，我（终于）来更新了，你们有没有想我呢？&/p&&p&经过上一篇文章之后，陆陆续续开始有一些编辑和读者问我是否有出书的意愿。关于出书这件事情，我不知道作为一名UI转产品设计师的视角去写的一些产品和交互方面的东西逻辑是否能站得住脚，也不知道会不会毁人不倦。&/p&&p&但是上一篇百度外卖的文章写完之后，百度外卖交互的同学加我QQ告诉我：&/p&&figure&&img src=&http://pic3.zhimg.com/v2-d5f31cb7be191cdd42c2a_b.png& data-rawwidth=&510& data-rawheight=&110& class=&origin_image zh-lightbox-thumb& width=&510& data-original=&http://pic3.zhimg.com/v2-d5f31cb7be191cdd42c2a_r.png&&&/figure&&p&我还是挺欣慰的，在做UI设计之初，我就一直有跟一些app版本和更新的习惯，在互联网行业久了，总是会从他们每一个版本的产品形态去揣测这个公司的动态，看到一些功能和交互点，也会设身处地的思考如果我是他们的产品设计师应该如何处理，遇见一些深得我心的功能点，总是有一种和他们的产品设计师惺惺相惜的江湖感情。反正久而久之，边猜边总结，也是养成了自己的一套歪门邪道的方法论。至于出书这种事情，还没想好，但是如果未来真出书了，（我猜）你们会买的对么？&/p&&br&&br&&p&好了言归正传，来看这一期的文章内容。&/p&&p&互联网时间来到了2017年，手机空间越来越大，相信大家的手机中装了越来越多的app，很多时候，当我拿起一个朋友的手机，看他手机里都有哪些应用、这些应用的优先级是如何排布的，经常会从中得出关于这个人的另一层线索。&/p&&p&比如一个人手机里优先位置上有脉脉、知乎、豆瓣、一个ONE、单读这几个app，那我可以推测这个人一定是具备文艺属性的互联网从业者。&/p&&p&比如一个人手机封面是吴亦凡或者鹿晗，手机里优先位置上有优酷、爱奇艺、腾讯视频、芒果TV、天猫、京东、蘑菇街这样的一堆app，可以看出这是一位爱综艺爱追星爱剁手的小姑娘。&/p&&p&……&/p&&br&&br&&p&&strong&PART 1 – 意识是主观形式与客观内容的内在统一&/strong&&/p&&br&&p&如果说13-15年的时候app UI设计上充斥了很多同质化的产品的话，到了17年，UI设计师们在dribbble和behance的风格影响下，有了更多的发展空间，我们不得不说的是，现在的app比之前越来越好看和越来越好用了。&/p&&br&&p&如下图所示我随意截取了九个（其实这样的app我手机里有远不止九个）我自己觉得UI很nice的产品和大家分享，他们分别是Enjoy、单读、Artand、Airbnb、一个ONE、Gilt、良仓、Zeen、和氧气：&/p&&figure&&img src=&http://pic2.zhimg.com/v2-89a2a8b1bdc8b079c04e9_b.jpg& data-rawwidth=&2560& data-rawheight=&1361& class=&origin_image zh-lightbox-thumb& width=&2560& data-original=&http://pic2.zhimg.com/v2-89a2a8b1bdc8b079c04e9_r.jpg&&&/figure&&figure&&img src=&http://pic4.zhimg.com/v2-a4a1535cfa62fdae068dee8f_b.jpg& data-rawwidth=&2560& data-rawheight=&1361& class=&origin_image zh-lightbox-thumb& width=&2560& data-original=&http://pic4.zhimg.com/v2-a4a1535cfa62fdae068dee8f_r.jpg&&&/figure&&figure&&img src=&http://pic4.zhimg.com/v2-5f1fd5dd20ff37ecb0c4f_b.jpg& data-rawwidth=&2560& data-rawheight=&1361& class=&origin_image zh-lightbox-thumb& width=&2560& data-original=&http://pic4.zhimg.com/v2-5f1fd5dd20ff37ecb0c4f_r.jpg&&&/figure&&p&那这里有一个关键的问题就出现了，为什么有些app，普通用户一打开就自然而然的觉得它很美？用户这种“觉得他很美”的意识到底是从哪儿来的？&/p&&br&&p&在此之前，我先来说两组哲学概念：&/p&&br&&p&&strong&意识是主观形式与客观内容的内在统一。（马克思主义哲学）&/strong&&/p&&p&&strong&内容决定形式，形式反作用于内容。（黑泽尔唯心主义哲学体系）&/strong&&/p&&p&（看不懂也没关系，反正我就是写来装逼的。_(:зゝ∠)_）&/p&&br&&p&为了阐述用户这种“觉得他很美”的意识到底是从哪儿来的，就必须要了解app中“内容”和“形式”之间的关系。那我们不妨来看一下什么叫内容，什么叫形式：&/p&&br&&br&&p&&strong&PART 2 – 内容：&/strong&&/p&&br&&br&&p&如果我自己斗胆给app设计工作中的“内容”下一个定义的话，我大概会说：&strong&内容是集成在app中，所有可被感知图片、文字、声音合集。（这里之所以说是可被感知，主要是从用户层面上看，忽略了用户不可感知的“代码”层面。）&/strong&&/p&&br&&p&那么我们必要搞要清楚的是，一个app的内容到底是如何产生的？也就是一个app到底是如何产生的？&/p&&br&&p&那这里我不妨展开一下，假设我是一个产品设计师，有一天CEO告诉我最近想做一个电商app（这里我假设我们公司很有实力，忽略了市场和运营、渠道和资金上的问题，只考虑产品设计方面。）&/p&&p&那这个时候我问老板：老板你做电商类app，是想做平台类的呢还是做垂直的呢？你可想好了啊，你做平台类的想要从淘宝京东分份额的话那你必须要有自己的特色。（比如国内app“xx”、“xx”和“xx”、他们都有自己的特色）或者说你是想做垂直一些的么？（比如“xx”是专门做化妆品领域的，比如“xx”是专门做美食的，比如如“xx”和“xx”是专门打擦边球做情趣的）然后老板被我一番“驯化”之后得出的结论是我们来做一个美食电商吧，但是这个美食电商不会对标“enjoy”那样的高档人群，其实想做成类似于“什么值得吃”这样的大众场景。&/p&&p&好，故事讲完了，现在我化身为这个产品设计师，简短片面的阐述我的思考过程：首先我拿到的目标是“做一款什么值得吃app”，他的目标人群是更加广泛的全中国吃货，且要满足吃货推荐，评价和在线下单支付（前期无法做渠道的话需要跳转淘宝京东链接）功能。&/p&&br&&p&那这个时候我开始思考这款app的MVP状态应该需要什么功能：&/p&&figure&&img src=&http://pic1.zhimg.com/v2-39bff3a134438_b.png& data-rawwidth=&865& data-rawheight=&590& class=&origin_image zh-lightbox-thumb& width=&865& data-original=&http://pic1.zhimg.com/v2-39bff3a134438_r.png&&&/figure&&p&这里简单说一下MVP是啥意思，MVP=Minimum Viable product（最小可行产品）是《精益创业》的作者埃里克·莱斯提出提出的一个概念，字面意思就是可保证产品正常使用（主逻辑闭环）的最小产品单元。MVP又分为Validating MVP和Invalidating MVP在这里就不展开了，《精益创业》是一本特别赞的书，推荐大家阅读。&/p&&p&我设计的这个其实是Invalidating MVP，大概需要四个部分：&/p&&p&&strong& “推荐”是核心，以帖子形式或者别的什么形式出现一些推荐的东西附上链接，“专题”方面做一些可供运营和推广的专题，比如“情人节送什么巧克力”、“最适合食辣族的几款辣酱”之类。“商城”里面会丢一些自营的物品。“我的”里面会有我的推荐，我的收藏，我的订单之类的一堆东西。&/strong&&/p&&br&&p&你们发现了么，其实这个时候，产品设计师就已经在定义产品的信息架构了。&/p&&br&&p&那第一个问题我就在思考，因为这个app叫什么值得吃，那我们是不是还需要推荐一些线下值得吃的店的？如果做了是不是就和enjoy同质化太严重了？那最好就是先不做。&/p&&br&&p&第二个问题那在推荐这一页里面我大概需要什么功能，因为面向的对象不太像enjoy那种偏一线城市的人群，那我应该用户群体同类对标到今日头条这种level的感觉。&/p&&br&&p&第三那么这个首页我是按照各种食品属性的分类来建立推荐列表呢？还是说我按照人的属性来建立推荐列表呢？如果是按照食物的分类的话，给别人的感觉可能和淘宝很像，比如我在列表里面看到“巧克力”再点进去看巧克力的推荐，和我在“甜品族”这个人群tag里看到某巧克力好吃，这两种行为逻辑给用户的感觉完全不同。大家体会一下，作为“什么值得吃”这款app来说，肯定是后者更适合，所以得出结论是以人的属性建立推荐列表。（我甚至考虑到了以后迭代未来功能版本的可能性，比如时候每个人可以有多种身份tag，再去做匹配社交之类的。）&/p&&br&&p&好，那假设我现在关于产品首页大概得出了三点感觉：&/p&&p&1.首页推荐按照人的属性tag去区分推荐列表&/p&&p&2.产品风格不宜太大洋（尤其是一定不能像enjoy那样使用黑白配色），最好是产品对标今日头条那种和微博的感觉，受众偏向二三四线城市。&/p&&p&3.每一个推荐应该有收藏，购买链接，这样的东西，在首页上应该有专门为运营活动或者市场换量设置的入口（可能是banner形式）。&/p&&p&4.为了不使推荐属性具有倾向性，应该每一个推荐都尽量层级平行。（比如“吃辣党”和“甜品族”就应该入口平行。）&/p&&p&5.一定要保证一个完整的支付逻辑和用户推荐逻辑通顺，这是最基本的两个功能。中间可能涉及到推荐里面要有商城链接（如果商城没有的要跳淘宝），自己的商城支付要支持支付宝微信，要有订单状态和退单等一系列功能，余额功能或退款自动退回功能二选一（看公司需不需要资金池）。&/p&&p&6....（此处省略N条）&/p&&br&&p&大家明白了么，所谓app“内容”的产生，就是我上述这些奇怪东西的综合（当然其实并没有上述这么简单，这个以后有机会细讲），比如我们从上面的论述当中，我可以归纳出这款“什么值得吃”app的首页“推荐”应该具有的信息如下：&/p&&figure&&img src=&http://pic1.zhimg.com/v2-9a95aaf2af78dc37ce7a24_b.png& data-rawwidth=&865& data-rawheight=&89& class=&origin_image zh-lightbox-thumb& width=&865& data-original=&http://pic1.zhimg.com/v2-9a95aaf2af78dc37ce7a24_r.png&&&/figure&&p&我写这么多字其实就是想告诉大家一个app的“内容”是如何产生的，当然我这里说得十分十分简单，真实情况可能比这个复杂百倍，大家意会就是了。&/p&&p&好了说完了内容，我们来看所谓app中的“形式”又是什么鬼。&/p&&br&&br&&br&&p&&strong&PART 3 – 形式：&/strong&&/p&&br&&p&&strong&如果说我们把所有集成在app中，可感知的图文声的集合都可以称作app的内容的话，那么app的形式就是“承载这些内容，使内容更好被感知的方式”。&/strong&&/p&&br&&p&人有五感，视觉、听觉、嗅觉、味觉、触觉。&/p&&p&而人去和一款手机应用进行交互的时候只会从视觉，听觉，触觉（反馈）三个方面去感知，而触觉涉及到交互层面，以后我写到app的交互架构的时候会详细说； 关于听觉其实也不是本文重点，我举个例子一笔带过就好了，比如大家都用过滴滴，滴滴有一个“内容（功能）”是司机送一个乘客的过程中，当判断距离目的地很近的时候会默认进行一个“下一单的匹配”的功能。我们用滴滴的这个功能来对比手机游戏里面的“匹配下一局”，我们会发现这是几乎相同的“内容”，但是承载形式不一样，手游是视觉展现，你必须点击手机上的“匹配”按钮，而滴滴因为考虑到司机在开车很难解放双手去点击匹配，所以从产品逻辑上设计的是“语音提示+主动匹配+手动接单”的方式，所以我们总能在快下出租车的时候听到司机手机上传出响亮的“开始接单啦”语音提示。&/p&&br&&p&今天文章的重点是视觉。&/p&&p&因为UI中国和站酷里面是UI和视觉设计师聚集地，可能在大家以往的工作当中并不会care一款app原型是怎么样设计出来的，大家可能只会关心我拿到原型以后应该如何转化为惊艳的高保真页面。&/p&&br&&p&把一个内容整理，排列成一个app页面，就是大家更关心的“形式”的部分。还是回到上文“什么值得吃”这款虚构的app上，综合上面的观点，我大致能画出原型如下图所示两种：&/p&&figure&&img src=&http://pic4.zhimg.com/v2-5a8a3c3aa7ecc94aaffb638ac02ae5a3_b.png& data-rawwidth=&865& data-rawheight=&717& class=&origin_image zh-lightbox-thumb& width=&865& data-original=&http://pic4.zhimg.com/v2-5a8a3c3aa7ecc94aaffb638ac02ae5a3_r.png&&&/figure&&p&当然这个是最粗糙的原型（如果各位UI设计师在工作中接到了类似于这样的原型那只能说心疼你们一秒。）那么问题来了，大家在生活中一定见到过这两种原型的app，左边这个很常见，比如斗鱼tv这些直播平台、早期咸鱼和网易严选、今日头条等等都是用的这种感觉；右边这个就更常见了，不论是点餐平台（美团百度饿了吗）、大型电商（京东淘宝）你都可以看到它。&/p&&br&&br&&p&&strong&那么问题来了，尝试分析一下，上面这两种形式到底有什么优劣呢？&/strong&&/p&&p&第一件事应该想到的是如果需要采用右边的排列形式就必须要控制tag的字数，你懂我是什么意思吧？比如今天有个运营跳出来说我们做一个新的tag把名字叫“酸酸甜甜就是我”。产品一定哭晕在厕所，因为：&/p&&figure&&img src=&http://pic2.zhimg.com/v2-9b70d62a6d2e1d475ee9ecc564e015a5_b.png& data-rawwidth=&817& data-rawheight=&1442& class=&origin_image zh-lightbox-thumb& width=&817& data-original=&http://pic2.zhimg.com/v2-9b70d62a6d2e1d475ee9ecc564e015a5_r.png&&&/figure&&p&你们懂不懂这种感觉233333，简直想死。但是左边那张那种就不存在这种问题。&/p&&br&&p&第二，由于右边的tag占据了推荐贴的位置，导致推荐贴可能没有左边的那种展现形式更加醒目。但是相对的，图右的优势在于，由于竖向排列tag可以让一个屏幕显示更多的tag，这一点就需要取舍，比如一个产品的初期没准备放这么多切换tag的话，还是建议用左边那种。&/p&&p&&strong&更深层次的，外卖产品之所以用右边这种形式是因为力求一屏展示更多的菜，而且外卖产品的左侧tag一般是一家店铺的菜的品类，用户下滑菜品配合点击品类，点完即走，很方便（京东和淘宝电商类平台也是类似的）。但是比如早期的今日头条只能采用左边的这种形式，因为头条是需要用户长时间沉浸的，比如用户选中一个“体育”的tag一般要看好久好久，用户需要沉浸在这个tag下的内容中，那这个时候显然用右边这种设计方式让tag常驻屏幕左侧是不合适的。&/strong&&/p&&br&&p&基于以上分析，作为内容+电商平台的“什么值得吃”应该选用左边这种设计形式。&/p&&p&好，“什么值得吃”这个虚拟的例子就说到这里，主要是让大家明白内容和形式之间的关系，只有你们明白了这个，才可以正式进入今天的主题：app的视觉美成因分析。&/p&&br&&br&&p&&strong&PART 4 – app的视觉美成因分析&/strong&&/p&&br&&p&（在这里我们先别管好不好用，只管好不好看，关于好不好用以后文章慢慢说。）首先先来看结论：一&strong&款app让你感觉到长得美，一定是团队在两个方面下功夫了：第一是内容视觉优化，第二是形式的视觉优化。&/strong&&/p&&br&&p&我先来给你们看两张图你们感受一下啥叫内容的视觉优化：&/p&&figure&&img src=&http://pic2.zhimg.com/v2-35f62b2ccccaeddf5bc1_b.png& data-rawwidth=&865& data-rawheight=&730& class=&origin_image zh-lightbox-thumb& width=&865& data-original=&http://pic2.zhimg.com/v2-35f62b2ccccaeddf5bc1_r.png&&&/figure&&p&你们可以看到左右两张图，左边是enjoy的精选页，右边是我随手糟蹋的，大家会发现其实信息内容一模一样，但是左边的level和右边的level大家一眼就能看出来区别吧，如果出现右边这样的UI稿那只能说明这个团队在内容的视觉优化上面不！用！心！（我是没用力糟蹋不然我可以辣得你们半天睁不开眼睛哈哈哈）&/p&&br&&p&以上就是内容的视觉优化的作用，关于内容当中的图片，其实大家都有直观感受：&strong&一款app允许用户自定义的图片越多，这款app视觉就一定越难把控。&/strong&原因很简单，因为用户自定义的信息里面，文字信息我们是可以通过限制字段和select去控制的，但是对于图片来说，哪怕控制了用户自定义图片的尺寸，我们也无法控制这些图片的质量，大家去看一下秒拍这款app，它的框架设计做得很棒，包括一些empty status的小图标绘制都很棒，但是我们打开的时候首页的内容总是参差不齐，差强人意。同理还有咸鱼这款app， UI框架做得很漂亮，但是内容页面总会显得没那么“高大上”。&/p&&p&这也就是为什么比如enjoy，自如、氧气、想去以及毒物、Gilt、美团这些轻量电商或者租房app，都选择花一大笔成本自己养一批或全职或兼职的摄影师的原因，就是为了得到符合自己规范的优质内容图片（比如你们去看自如的房源信息照片基本就是那种样子，氧气的内衣样片背景永远是白色）。&/p&&p&我之前做过一款旅行游学类app，在立项之初我们的图库里面就已经有了几万张高质量有版权的摄影师作品，然后在设计的过程中大胆采用（类似于今天开眼app的）流式布局，大量展示优质图片，才使得在15年初那个时期我们的UI风格比较具有鲜明的特色。&/p&&br&&p&其实这也是一个产品团队需要深思熟虑的点：&/p&&p&&strong&·比如是一个旅行app，那就一定要有大量优质的图片作为依托才可能app美。&/strong&&/p&&p&&strong&·比如一个淘宝这种体量的大型电商，那除了尽可能控制图片质量以外，更多的应该在优化专题和banner上，并且告诉入驻商家（用户）上传优质的图片更容易获取用户流量从而转化为成单。&/strong&&/p&&p&&strong&·比如知乎、贴吧之类这样的问答和社区，用户上传的图片五花八门千奇百怪，那我们可以考虑在首页列表展示的时候就压根不要展示图片……&/strong&&/p&&br&&br&&p&那是不是内容的视觉优化只包含图片的优化呢？其实不是的，除了图片的视觉优化以外，icon的优化、包括文字的视觉优化这些都是很重要的。&/p&&p&关于icon的优化大家应该已经看过足够多的文章在这里我就不赘述了，比如线性icon里面不能参入块状icon，负空间icon里面突然出现一个奇怪的渐变icon会感觉很奇怪，在这里因为写这个的人太多了我就不赘述了。有一点心得可以分享，比如大家画了一个2px的线性图标用于@2x，那在plus上面应该要手动调整一下图标变成3px而不是用png自动生成，必然会有虚边（除非你们的工程师使用的是svg的iconfont）。&/p&&br&&p&关于文字的视觉优化，其实在今天这个时间点去谈论已经没什么好说的了，因为几乎市面上的所有app，只要涉及文字内容的排版，毫无例外都做得很好。从根源上出发，为什么一个设计师需要去不厌其烦像个工匠一样折磨开发调整字体大小间距粗细什么乱七八糟的东西？其实，字体视觉优化去达到的目的主要有两点：&/p&&p&&strong&1.辅助视觉对焦&/strong&&/p&&p&&strong&2.减轻视觉压力&/strong&&/p&&br&&p&第二点没啥好说的，大家应该都明白，主要说第一点，视觉对焦这个事情是这样的，我们在一个界面中，如果不出现特别突兀的信息，正常人眼一般是从左到右，从上到下的顺序阅读：&/p&&figure&&img src=&http://pic1.zhimg.com/v2-abc83ed5ce70e7f55d680c8e47df4fb4_b.png& data-rawwidth=&865& data-rawheight=&388& class=&origin_image zh-lightbox-thumb& width=&865& data-original=&http://pic1.zhimg.com/v2-abc83ed5ce70e7f55d680c8e47df4fb4_r.png&&&/figure&&p&比如上图是一个阅读界面，所有问题都没有特别突兀的地方，所以我们把界面做一个高斯模糊去分析视觉焦点，会发现整个页面呈现很平和，所以，这个页面的阅读顺序应该是一行一行的阅读文字，也就是从上到下，从左到右。&/p&&br&&p&但是，这只是页面形式很平的情况，举个没那么平的例子：&/p&&p&&figure&&img src=&http://pic3.zhimg.com/v2-77bc65e468c_b.png& data-rawwidth=&865& data-rawheight=&493& class=&origin_image zh-lightbox-thumb& width=&865& data-original=&http://pic3.zhimg.com/v2-77bc65e468c_r.png&&&/figure&如上图所示是一个知乎页面，我们把它去色并且高斯模糊去分析它的视觉焦点，大家会发现其实视觉焦点是加粗加大的title字体和上面的小头像去构成的：&br&&/p&&p&&figure&&img src=&http://pic1.zhimg.com/v2-62f81468aff35b368d11aeba096fa960_b.png& data-rawwidth=&865& data-rawheight=&754& class=&origin_image zh-lightbox-thumb& width=&865& data-original=&http://pic1.zhimg.com/v2-62f81468aff35b368d11aeba096fa960_r.png&&&/figure&这就是通过文字优化去辅助视觉对焦，我不妨再举一例，大家来看16年5月左右的氧气app截图:&br&&/p&&p&&figure&&img src=&http://pic1.zhimg.com/v2-fd7bdcd030bc8_b.png& data-rawwidth=&865& data-rawheight=&716& class=&origin_image zh-lightbox-thumb& width=&865& data-original=&http://pic1.zhimg.com/v2-fd7bdcd030bc8_r.png&&&/figure&左边是氧气的原UI，右边是我做的对比图。显然，关于文字优化辅助视觉对焦这一点，氧气的设计师显然深谙此道，它们没有按照右边那种传统办法设计这个页面，而是把每一个深夜话题的题目都变成了一张图，变成一张图还不算，还在这张图上面用浅绿色“划了重点”，这样虽然加大了设计师的工作量（其实也还好就是给到话题title换个字出张图而已），但是这个页面正是因为这样的处理，能让用户第一眼聚焦到标题title上：&br&&/p&&figure&&img src=&http://pic4.zhimg.com/v2-d878f86f231d1adc9dbd536b_b.png& data-rawwidth=&865& data-rawheight=&504& class=&origin_image zh-lightbox-thumb& width=&865& data-original=&http://pic4.zhimg.com/v2-d878f86f231d1adc9dbd536b_r.png&&&/figure&&p&关于内容的视觉优化我已经说完了，说了这么多，大家看到这里也不容易，有没有混乱呢？我来总结一下吧：&/p&&p&&strong&app内容是集成在app中，所有可被感知图片、文字、声音合集。那么内容的视觉优化主旨在于通过图片，文字，图形（icon）等的优化，去使得app更加易读，易用和美观。&/strong&&/p&&br&&p&说完了内容的视觉优化，我们再看一下形式的视觉优化案例，按说只要内容都已经优化好了，表现内容的形式只要不是排得特别烂，应该展现出来都不错。我们再重复一遍形式的定义好了：app中更好去承载内容，使内容更好被感知的方式称为app的形式。&/p&&p&我们该如何去排列不同的内容让它们更好的被感知呢？&/p&&br&&p&这里面最常见的方法就是UI组件化设计，&strong&我个人把一款app里面同样形式排列但是不同内容的单元叫做UI设计中的组件。&/strong&这样的例子不胜枚举，我们每天都见到的最常见的一个组件化设计是微信里的每一个tableview：&/p&&figure&&img src=&http://pic4.zhimg.com/v2-a2b1ef053da3cb8a2067976bcbd12b03_b.png& data-rawwidth=&865& data-rawheight=&165& class=&origin_image zh-lightbox-thumb& width=&865& data-original=&http://pic4.zhimg.com/v2-a2b1ef053da3cb8a2067976bcbd12b03_r.png&&&/figure&&p&大家可以打开你们的微信，看到其实微信的聊天列表的每一个单元都是由固定的内容组成的，内容包含一张图（头像），两段Text（名字和最新信息），一段时间组成。&/p&&br&&p&再比如另两个页面：&/p&&figure&&img src=&http://pic2.zhimg.com/v2-bf012f8f6a43bbf662df75_b.png& data-rawwidth=&865& data-rawheight=&705& class=&origin_image zh-lightbox-thumb& width=&865& data-original=&http://pic2.zhimg.com/v2-bf012f8f6a43bbf662df75_r.png&&&/figure&&p&先看左面这个页面，虽然第二个品牌故事被遮挡了很多，但是由于我们看到了第一个GUCCI的之后，用户心理预期就有了，用户左滑一下屏幕大概率出现的也是这样形式的不同内容。&/p&&p&再看右边这张图，一个app的每一个专题都是以一本杂志的形式呈现的，所以当你看到这个页面的时候，用户心里会有预期我左滑右滑都是一本专题书。&/p&&br&&br&&p&在设计过程中，我们往往会把相同属性的内容设计成同一形式。这样做有什么优点呢？&strong&最大的优点是减少用户认知负担，使得内容更好的被感知。&/strong&&/p&&br&&p&举个大家都懂的格式塔的例子：&/p&&figure&&img src=&http://pic1.zhimg.com/v2-5c3897bbaffd6dc_b.png& data-rawwidth=&865& data-rawheight=&345& class=&origin_image zh-lightbox-thumb& width=&865& data-original=&http://pic1.zhimg.com/v2-5c3897bbaffd6dc_r.png&&&/figure&&p&上图A，大家都知道接下来一个一定是正方形，上图B，下一个别说你们不知道是什么，我也不知道。格式塔相似律告诉我们，人们在知觉时，对刺激要素相似的项目，只要不被接近因素干扰，会倾向于把它们联合在一起。&/p&&br&&br&&p&那么我们就很容易解释下图：&/p&&figure&&img src=&http://pic1.zhimg.com/v2-0fbe9eaca2ab419bc72b0_b.png& data-rawwidth=&804& data-rawheight=&1383& class=&origin_image zh-lightbox-thumb& width=&804& data-original=&http://pic1.zhimg.com/v2-0fbe9eaca2ab419bc72b0_r.png&&&/figure&&p&&strong&一切UI设计本质上是为了更好的展现信息。&/strong&&/p&&p&&strong&更好的展现信息是为了更好的指引用户完成交互操作，从而让用户更好的去接收信息并完成一定功能目的。&/strong&&/p&&br&&p&本文一直在讲述app信息呈现上的视觉优化。其实视觉优化也好、逻辑优化、交互优化也罢，都是为了使得app更加好用、易用、有效。&/p&&br&&p&在我刚开始接触UI设计的时候，也是曾经沉迷dribbble，不断模仿那些大师们的惊艳界面，还长达一两年的学习和工作中，我一直认为UI设计师的本职工作就是画一个漂亮的壳子，把信息装进去然后能让app变得更好看而已。&/p&&p&但是后来我完全不这样想，如果现在让我评价一款app的UI，我可能真正最看重的那个维度已经不是“视觉感觉”上的好看，而是“视觉逻辑”上的严谨和“视觉风格”上的一体化。比如分割线，比如icon的样式，比如tableview的设计，比如字体的主次对比等等。&/p&&br&&p&当我没有理由的画一条分割线，只为了分割两个也不知道是啥的元素时&/p&&p&当我没有理由的就是想要为卡片化组件加上一个boxshadow时&/p&&p&当我没有理由的设计一个奇怪的交互方式还硬说它特别好用时&/p&&br&&p&我都在警醒自己一句话：&strong&每一个UI界面的设计都应该被赋予应有的理由。&/strong&&/p&&br&&p&希望以此共勉。&/p&&br&&p&&strong&&br&· 下期预告&/strong&&/p&&p&一个人和一块触摸板到底能衍生出多少种交互方式？&/p&&p&每一次点击和每一次滑动的背后心理学逻辑又是怎样的？&/p&&p&下期我想说说人在使用app过程中是如何和屏幕进行互动的。&/p&&p&敬请期待。&/p&&br&&p&（下一期可能也是一万字左右，所以中途我可能会穿插三期的《交互闲谈》，谢谢关注。&/p&
本文9733字，你可以上个厕所回来再看。_(:зゝ∠)_ ___________________________________________ Hello各位看官，我（终于）来更新了，你们有没有想我呢？经过上一篇文章之后，陆陆续续开始有一些编辑和读者问我是否有出书的意愿。关于出书这件事情，我不…
&figure&&img src=&https://pic4.zhimg.com/v2-8b1dbec9b353c4be227dae_b.jpg& data-rawwidth=&560& data-rawheight=&420& class=&origin_image zh-lightbox-thumb& width=&560& data-original=&https://pic4.zhimg.com/v2-8b1dbec9b353c4be227dae_r.jpg&&&/figure&hello，新年过完了，开工快乐。&p&距离上一篇文章已经过去四个多月了，这前前后后一直有朋友私信问我说，之前一篇文章中的信息架构应该如何梳理，当我们尝试分析一款移动端app的时候，我们应该如何进行思考之类的问题。&/p&&p&那么今天，我将从大家经常用到的百度外卖（iOS v4.4.1）说开去，阐述我自己分析一款app时候的思维逻辑和过程，当然我说的不一定对，希望能给新手朋友们一些思路。&/p&&p&我之前一直有跟进一些app迭代的习惯，比如百度外卖就是其中之一，当它更新来到了v4.4.1之后，和之前可谓发生了天翻地覆的变化，当我重新开始尝试分析它的时候，我采取的办法依旧还是和分析一款陌生app一样，从已有产品的信息架构入手。&/p&&p&大家都知道，一个产品没有信息架构梳理，就像在盖一所迟早都会倒的楼，信息架构到底是个什么东西呢？其实我所理解的并没有江湖传说的那么悬，我一般会把app的每一个点击事件都点击一遍，然后做相应的记录，比如我做百度外卖如下这张信息架构图大概用了一个半小时，整个过程乏善可陈：『点击一下，记录页面信息，再点击一下』如此循环。&/p&&p&但是这就像是破案一样，你会从中发现一些线索去了解百度外卖的产品经理和交互设计师们当时是如何思考的。&/p&&p&下面请看百度外卖v4.4.1信息架构梳理图：&/p&&p&&figure&&img src=&https://pic2.zhimg.com/v2-ff60bf2dd6fbf634ce26_b.jpg& data-rawwidth=&1763& data-rawheight=&3401& class=&origin_image zh-lightbox-thumb& width=&1763& data-original=&https://pic2.zhimg.com/v2-ff60bf2dd6fbf634ce26_r.jpg&&&/figure&大家可以先用这张图对比大家现在iOS手机上的百度外卖(v4.4.1)看看，由于我是整张截图可能会存在字太小页面太长的问题，没关系一会分析的时候我会截大图，至于图上的星星点点和框框的标记，一会也会详细阐述。&/p&&br&&br&&h2&&ul&&li&&b&Part 1 - 首页&/b&&/li&&/ul&&/h2&&p&&figure&&img src=&https://pic2.zhimg.com/v2-ee3e528cdc3ed2f93a28a54_b.jpg& data-rawwidth=&750& data-rawheight=&2711& class=&origin_image zh-lightbox-thumb& width=&750& data-original=&https://pic2.zhimg.com/v2-ee3e528cdc3ed2f93a28a54_r.jpg&&&/figure&如上图所示，我们先来看下面四个Button bar的第一个页面：首页。&/p&&p&&b&首页整个单元中存在几个奇妙的交互亮点：&/b&&/p&&blockquote&&p&0.用力上拉，百度外卖会根据最近的一些热点更换不同的插画：&br&&/p&&p&这是情感化设计的一种体现方式，偶尔给用户带来发现的惊喜。&/p&&figure&&img src=&https://pic3.zhimg.com/v2-1cb165abf6eecf2_b.jpg& data-rawwidth=&719& data-rawheight=&1280& class=&origin_image zh-lightbox-thumb& width=&719& data-original=&https://pic3.zhimg.com/v2-1cb165abf6eecf2_r.jpg&&&/figure&&/blockquote&&br&&blockquote&&p&1.搜索框上滑消失过后会隐藏到右侧，如下图所示：&/p&&figure&&img src=&https://pic2.zhimg.com/v2-8aecb58a6e20e7f8aa3f8e28e42f9b61_b.jpg& data-rawwidth=&750& data-rawheight=&316& class=&origin_image zh-lightbox-thumb& width=&750& data-original=&https://pic2.zhimg.com/v2-8aecb58a6e20e7f8aa3f8e28e42f9b61_r.jpg&&&/figure&&/blockquote&&br&&blockquote&&p&2.滑动到信息架构里的『点餐流程』开始时，『为你精选』和『此刻最热』两个tab会置顶。如下图所示：&br&&/p&&figure&&img src=&https://pic3.zhimg.com/v2-26d20ce7dca04de46a92e9_b.jpg& data-rawwidth=&750& data-rawheight=&1334& class=&origin_image zh-lightbox-thumb& width=&750& data-original=&https://pic3.zhimg.com/v2-26d20ce7dca04de46a92e9_r.jpg&&&/figure&&/blockquote&&br&&blockquote&&p&3.点击大banner不仅支持滑动，点击右下角按钮可供预览。&/p&&p&虽然这个功能看似没有什么特别重要的作用，但这是交互设计师为愉悦用户设计的小把戏，明显我感受到了他们的诚意：&br&&/p&&figure&&img src=&https://pic1.zhimg.com/v2-f721b15f4faf148a8df49_b.jpg& data-rawwidth=&1706& data-rawheight=&1428& class=&origin_image zh-lightbox-thumb& width=&1706& data-original=&https://pic1.zhimg.com/v2-f721b15f4faf148a8df49_r.jpg&&&/figure&&/blockquote&&br&&blockquote&&p&4.购物车列表隐藏当前定位不可送的物品。&/p&&p&外卖类产品一定有一个用户情景是这样的，用户今天在家里面放了一堆食物在购物车但是未支付，过了几天在公司不知道吃什么的时候发现我还有个购物车于是打开匆忙下单，谁曾想你在家时候放置在购物车内的外卖不一定能送到单位地址，肯定是百度外卖遇到这样的用户反馈很多，所以产品做出了这样的交互：隐藏当前定位不可送达的物品。&/p&&p&（看到这个页面的时候我不禁脑补除了一个被广大用户投诉疲于解释的客服生无可恋的表情。）&/p&&figure&&img src=&https://pic2.zhimg.com/v2-b5a1986aedf5f057dc604_b.jpg& data-rawwidth=&719& data-rawheight=&1280& class=&origin_image zh-lightbox-thumb& width=&719& data-original=&https://pic2.zhimg.com/v2-b5a1986aedf5f057dc604_r.jpg&&&/figure&&/blockquote&&br&&p&说完了一些交互亮点之后，我们回过头来看看首页的信息架构：&/p&&p&&figure&&img src=&https://pic1.zhimg.com/v2-faba89f4ea09cf65bc12a8d1c0cb8416_b.jpg& data-rawwidth=&1095& data-rawheight=&1165& class=&origin_image zh-lightbox-thumb& width=&1095& data-original=&https://pic1.zhimg.com/v2-faba89f4ea09cf65bc12a8d1c0cb8416_r.jpg&&&/figure&&b&在我的信息架构中，我把产品的核心逻辑流程加上了红色五角星。&/b&也就是说一个外卖产品中，选择地址，购物车，搜索功能和点餐流程是一定必不可少的。其中我又把点餐流程拆解成了选择店铺、从店铺选择菜品和支付流程三个关键部分以便于大家理解。&/p&&br&&br&&p&那么百度外卖这款产品半年来都做了哪些更新？答案是新增了&/p&&p&1.外卖榜单&/p&&p&2.小banner&/p&&p&3.遇见你的菜+能量午餐（匠心晚餐）&/p&&p&4.精选专题&/p&&p&5.频道button数量（从8个变成了现在的19个）&br&&/p&&p&而且新增的这些内容层级最高，占据了首页的第一、二屏&/p&&br&&p&关于这些新增内容在这里我有一些自己的疑问和思考分享给大家：&/p&&blockquote&&p&&b&1.为什么之前已经有了一个大的轮播banner之后仍然要增加一些小的滑动banner？&/b&&/p&&p&&figure&&img src=&https://pic1.zhimg.com/v2-c4a30a1ece46dbea6da07faca2d041cd_b.jpg& data-rawwidth=&750& data-rawheight=&1334& class=&origin_image zh-lightbox-thumb& width=&750& data-original=&https://pic1.zhimg.com/v2-c4a30a1ece46dbea6da07faca2d041cd_r.jpg&&&/figure&我猜想可能是出于两种考虑:&/p&&p&&b&一、为了UI的美观&/b&&/p&&p&在之前我的经验是，一款app，允许用户自定义的图文越少，产品就越能做到美观，外卖产品要面向很多独立商家，每户商家logo千奇百怪，比如大家看看下面这两张图的对比：&/p&&p&&figure&&img src=&https://pic1.zhimg.com/v2-43dbdeeaf7e899a617a8f1ce7d81cc6f_b.jpg& data-rawwidth=&1139& data-rawheight=&936& class=&origin_image zh-lightbox-thumb& width=&1139& data-original=&https://pic1.zhimg.com/v2-43dbdeeaf7e899a617a8f1ce7d81cc6f_r.jpg&&&/figure&对比那种logo被截断的视觉体验来说，首屏加入了一套滑动的小banner无疑是保证用户进入第一眼就能感到饱含食欲的关键。&/p&&p&但是我认为作为一个体量这么大的产品，不会单纯为了视觉的美观就加入这么大一组滑动banner的，百度外卖加入这个一定有更加深层次的含义，于是我苦思冥想，想出了第二种可能性，那就是&/p&&p&&b&二、为了盈利创收&/b&&br&&/p&&p&对的你没有看错，百度外卖体量这么大，总会有商业变现产品经理思考广告入口往哪儿放，这么多的店铺，除了默认算法的排名以外还有没有一些别的办法可以取巧？提到变现这种羞羞哒事情总是让我们杏眼含春，欲罢不能，嘴上说不要不要，但是产品形态体现上却很诚实：（好像有什么奇怪的东西混了进去）&/p&&figure&&img src=&https://pic1.zhimg.com/v2-601d8ddf4d60f3495cc04bbe44c3887a_b.jpg& data-rawwidth=&750& data-rawheight=&1334& class=&origin_image zh-lightbox-thumb& width=&750& data-original=&https://pic1.zhimg.com/v2-601d8ddf4d60f3495cc04bbe44c3887a_r.jpg&&&/figure&&/blockquote&&br&&br&&blockquote&&b&2.为什么圆形的频道button数量越来越多了？ &br&&/b&之前的外卖app，不论是百度还是美团，如今种类都越来越多了，美团从之前的8个变成了现在的16个，百度从之前的8个变成了现在的19个：（换上春节皮肤的icons）&br&&figure&&img src=&https://pic4.zhimg.com/v2-982e563a1e_b.jpg& data-rawwidth=&1256& data-rawheight=&542& class=&origin_image zh-lightbox-thumb& width=&1256& data-original=&https://pic4.zhimg.com/v2-982e563a1e_r.jpg&&&/figure&&figure&&img src=&https://pic4.zhimg.com/v2-b1ae51e504fcbce61ae0f2_b.jpg& data-rawwidth=&1356& data-rawheight=&590& class=&origin_image zh-lightbox-thumb& width=&1356& data-original=&https://pic4.zhimg.com/v2-b1ae51e504fcbce61ae0f2_r.jpg&&&/figure&有很多人可能和我有同样的思考，比如我现在想喝粥吃粉吃面，那我直接去里面搜就好了啊，为什么现在多出了一个奇怪的『粥粉面』？比如我想吃点小龙虾我直接去搜就好了啊为什么现在多出一个奇怪的『龙虾盛宴』？伟大的设计准则less is more为什么在这里一点都不less？&br&&p&我猜想这些奇奇怪怪越来越多icons主要承担着三个部分的产品作用：&/p&&p&&b&第一个作用：更加便捷的简化流程。&/b&&/p&&p&当我点击第一个『餐饮』icon时，跳转到了如下页面：&/p&&p&&figure&&img src=&https://pic2.zhimg.com/v2-a363ece0af92144ea1ed_b.jpg& data-rawwidth=&750& data-rawheight=&1334& class=&origin_image zh-lightbox-thumb& width=&750& data-original=&https://pic2.zhimg.com/v2-a363ece0af92144ea1ed_r.jpg&&&/figure&大家可以看到上面的滑动tab其实有『全部』、『品牌馆』、『小吃快餐』、『粉面粥』、『川湘风味』、『西式快餐』、『日韩料理』、『烧烤海鲜』和『香锅烤鱼』这么多种类的，那么为什么唯独会把『粥粉面』这一项提前在前面独立成一个icon？我猜想肯定是数据上点这一个分类产品的用户远远高于别的分类，所以产品经理根据数据做出的产品形态上的改变，把『粉面粥』这个tab单独提前变成了『粥粉面』这一个icon，如下图所示：（这里吐槽一下，这两个名字不统一是什么鬼！）&/p&&figure&&img src=&https://pic2.zhimg.com/v2-0dbf9a689cf5de5d172d1fd1d6f1663e_b.jpg& data-rawwidth=&1238& data-rawheight=&1036& class=&origin_image zh-lightbox-thumb& width=&1238& data-original=&https://pic2.zhimg.com/v2-0dbf9a689cf5de5d172d1fd1d6f1663e_r.jpg&&&/figure&&br&&p&&b&第二个作用：突出一些用户以为没有的边缘功能和为别的产品导流。&/b&&br&&/p&&p&比如百度糯米，万能跑腿，买药和订花、超市购和定蛋糕水果奶茶之类的。&/p&&p&作为一线城市的年轻人，我们当然在用了这么几年的外卖产品之后知道他们什么都能定，但是对于三四线城市的萌新来说，他们可能一直以为外卖产品只能定食物，所以把他们放在这里会突出效果。&/p&&p&（今年过年我回家还闹了一个笑话，我们四线城市父母看到百度糯米以为是过年了专门卖糯米的我也是惊了个呆 =
=。。所以千万不要试图以为你是了解用户的，用户这种生物什么事情都干得出来。。。）&/p&&br&&p&&b&第三个作用：为以后的运营活动和一些奇奇怪怪的市场行为埋下入口。&/b&&br&&/p&&p&这一点就不多说了，之前有一个知乎问题问的是：&/p&&p&&a href=&https://www.zhihu.com/question//answer/& class=&internal&&我就想问一问 为什么好多软件全是这种首页八个图标的设计？&/a&&br&&/p&&p&不得不承认，这种图标频道的设计方式一向就不是一种优雅的办法，只是在平台类产品由于信息太多必须要有所分类之后在UI中形成的产物。&/p&&p&这种形态的ui设计模式最大的作用是有利于扩展产品入口，所以万一哪天你在百度外卖的这些频道icon里面看到一些奇怪的广告之类的东西也不用惊讶，毕竟是产品经理和交互设计师们也不想的。&/p&&/blockquote&&br&&p&好了
聊完小banner和这些频道icons之后，我们来看百度外卖近半年来在app中新加入的『我最常吃』、『外卖榜单』、『遇见你的菜』、『能量午餐（匠心晚餐）』和『精选专题』五项：&/p&&figure&&img src=&https://pic2.zhimg.com/v2-fb75b958cd8cf8a4dd55a_b.jpg& data-rawwidth=&750& data-rawheight=&1334& class=&origin_image zh-lightbox-thumb& width=&750& data-original=&https://pic2.zhimg.com/v2-fb75b958cd8cf8a4dd55a_r.jpg&&&/figure&&p&这五项的层级都很高，大概在整个app首页的第二屏，这样设计到底为什么呢？&/p&&p&&b&答：入这五项的目的是为了减少用户选择！&/b&&b&（划重点）&/b&&br&&/p&&p&去年跨年的时候罗胖『时间的朋友2017』演讲里面曾经讲了一个故事，说的是他想请客吃饭但是不知道吃什么，于是咨询了一位吃货朋友，那个吃货朋友告诉他：你如果要我告诉你那你就必须听我的，听我的就去xxx餐馆，只点A、B、C、D、E、F这6样菜，蘸料只放甲、乙两种，不好吃你回来找我。罗胖表示那一刻特别幸福，心想这个朋友太靠谱了你还能对我再粗暴点么。&/p&&p&这个故事其实暗合百度外卖的产品逻辑：&/p&&blockquote&&p&&b&『我最常吃』：喏，每次点的都是这几样，要不来份儿一样的？&/b&&/p&&p&&b&『外卖榜单』：喏，我们这里卖得最好和最受好评的是这几样。&/b&&/p&&p&&b&『遇见你的菜』：喏，你也是老主顾了，我们推测啊你应该最喜欢吃这几样。&/b&&/p&&p&&b&『能量午餐（匠心晚餐）』：喏，这几样东西是别人午餐（晚餐）常吃的，不然您试试？&/b&&/p&&p&&b&『精选专题』：喏，这是俺们运营让我们告诉你的，常吃这些啊对身体好！&/b&&/p&&/blockquote&&p&你们说，有了这五项，谁还要一家店一家店的筛选？&/p&&p&如果用户说我非要享受那种筛选的快感，那没问题，您稍微下滑一点点儿就到筛选部分了，那部分您说了算~&/p&&p&可能刚开始更新的时候用户是不太习惯前面多了这么多东西的。&/p&&p&（用户内心OS：什么乱七八糟的推荐，老子想吃什么自己不清楚？）&/p&&p&但是当你接受了这个设定之后（不接受也没办法每天都要点餐啊——换隔壁美团），发现其实会方便不少。&/p&&p&&b&总结：&/b&&b&Don't TMD make users choose.&/b&&/p&&br&&h2&&ul&&li&&b&Part 2 - 订单&/b&&/li&&/ul&&/h2&&p&首先感谢大家看到这里还没有关掉，你已经阅读了三分之二了。&/p&&p&那我们就再来说一说第二个部分订单。&/p&&p&你们肯定会有疑问，第二个部分难道不是『指南』么？对的，讲道理的话，百度外卖整个app第二个单元确实是『指南』，但是大家有没有一个疑问，为什么一个外卖app会有这样一个奇怪和外卖半毛钱关系都没有的单元，并且Buttonbar优先级还排在第二个？所以百度外卖的『指南』这个单元我会在未来对比爱奇艺『泡泡』和拉勾『言职』一起详细另起一文详细说说为什么现在的大型app里面总有奇怪的东西混进来。在这里就不做过多赘述。&/p&&p&关于订单这个功能其实相对简单：&/p&&p&&figure&&img src=&https://pic2.zhimg.com/v2-bce3eb479dad44b89c1693_b.jpg& data-rawwidth=&723& data-rawheight=&205& class=&origin_image zh-lightbox-thumb& width=&723& data-original=&https://pic2.zhimg.com/v2-bce3eb479dad44b89c1693_r.jpg&&&/figure&『万能跑腿』这个功能大家用一下就知道了我就不说展开了（也没有内容展开）&/p&&p&我下面着重说一下订单这个单元中中间涉及到一个产品设计中的小把戏叫&b&埋深层级&/b&。&/p&&p&&b&产品经理肯定是不鼓励用户进行投诉餐馆操作的，但是投诉这个功能又必须存在，那如何解决这个矛盾呢？办法是让投诉这个操作的成本变高：&/b&&/p&&p&我清楚的记得，之前用户在订单列表页就可以投诉，但是后来把投诉功能入口埋深到了下一层级——即必须点开订单详情才能投诉，如图所示：&br&&/p&&figure&&img src=&https://pic3.zhimg.com/v2-420dbaa3e276d76efbc09ea_b.jpg& data-rawwidth=&1147& data-rawheight=&950& class=&origin_image zh-lightbox-thumb& width=&1147& data-original=&https://pic3.zhimg.com/v2-420dbaa3e276d76efbc09ea_r.jpg&&&/figure&&p&别看投诉功能就被埋深了一个层级，但是这个小小的改动没准每个月能减少好几万单投诉呢。&/p&&p&既然说到这个了，那就不妨展开一些说点关于产品设计过程中某些功能信息层级的调整（下沉/上浮）规律，这些规律其实在不论是产品原型迭代或者UI设计在设计高保真迭代的时候都是可以作为理论支撑的点:&br&&/p&&p&&b&1.某些功能是不推荐用户使用但是又不能没有的：方案是功能入口适当下沉。&/b&&/p&&p&比如修改密码；登出账号；平台类产品的投诉，退款，退单；活动报名类产品的请假等等&/p&&p&&b&2.某些平行功能当中的某一个比另外几个点击使用率大很多：该功能入口单独适当上浮。（反之同理）&/b&&/p&&p&比如上文说到的『粥粉面』；比如微信更新之后把『收付款』当中的『付款』功能提前。&/p&&p&但是这里的下沉和上浮的度一定要把握好，不能影响并行的层级上其他功能使用。比如大家试想一下如果微信的buttonbar依次变成『朋友圈』、『信息』、『通讯录』、『发现』、『我』会发生什么事？我觉得大概率会把微信变成一个强调朋友圈的微博而削弱IM功能。&/p&&p&&b&3.某些产品策略上的功能入口：功能入口适当（有时候不是适当 =
=）上浮。&/b&&/p&&p&比如喜马拉雅的付费精品；脉脉的定制头条；拉勾的言职；今日头条之前主推的『视频』；支付宝的一堆社交。&/p&&p&&b&总结：根据埋点数据或者用研灵活调整功能入口是产品设计中的常用手法，但是把握这个度的过程中，需要怀着一颗敬畏之心。&/b&&/p&&br&&br&&h2&&ul&&li&&b&Part 3 - 我的&/b&&/li&&/ul&&/h2&&figure&&img src=&https://pic2.zhimg.com/v2-6b3e9486a0adce576df86bec20d019f7_b.jpg& data-rawwidth=&606& data-rawheight=&719& class=&origin_image zh-lightbox-thumb& width=&606& data-original=&https://pic2.zhimg.com/v2-6b3e9486a0adce576df86bec20d019f7_r.jpg&&&/figure&&p&关于『我的』页面很常规其实没啥好讲的，但是这里面两有个小的有意思的点：&/p&&figure&&img src=&https://pic3.zhimg.com/v2-7601be30afed9cff484ee_b.jpg& data-rawwidth=&750& data-rawheight=&1334& class=&origin_image zh-lightbox-thumb& width=&750& data-original=&https://pic3.zhimg.com/v2-7601be30afed9cff484ee_r.jpg&&&/figure&&p&第一是陈列馆式的设计让每一个相互不搭的独立功能都能放在第一层级。&/p&&p&第二是从产品形态上为百度钱包导了一波流：之前的运营活动是使用百度钱包支付每单会便宜几毛钱，所以我绑定了我的信用卡。&/p&&p&关于什么饭卡联名卡之类的我就不细说了没什么意思，这里想起了一个百度外卖有意思的功能，大概在两年前，百度外卖还在推广的时候出了一个叫mvp的东西，一年大概是一百多块钱，买了以后全年不收配送费，后来可能由于办的人太多导致赔的太厉害所以关掉了mvp这个功能入口，那已经购买mvp的人怎么办呢？就多出了一个我的mvp的入口，到了一年之后所有人mvp消失了百度外卖就关掉了这个功能，假装这一年什么事情都没发生2333。。。&/p&&br&&br&&h2&&ul&&li&&b&总结&/b&&/li&&/ul&&/h2&&p&分析一款移动端产品的时候，一定要细心、耐心和敏锐。&/p&&p&好的设计师永远是解决问题的，我们只需要看这些信息架构如何被这款app呈现，呈现方式是否优雅，是否有一些看似奇怪而矛盾的点，并尝试自我分析是什么导致了这些矛盾点的发生，保证自己在产品设计过程中由得借鉴就行了。&/p&&p&希望这次的文章能够为广大UI设计师们提供一种分析app的思路。&/p&&br&&br&&h2&&ul&&li&&b&下期预告&/b&&/li&&/ul&&/h2&&p&为什么有些app普通用户一打开它就觉得它界面很美？&/p&&p&下一篇我会着重说一下三个问题：&/p&&p&1.app的设计感与形式感是如何产生的。&/p&&p&2.ui设计师如何（尽可能）优雅的解决问题。&/p&&p&3.在不伤害我们与开发之间的关系的前提下，为了愉悦用户视觉体验，我们还可以做哪些奇怪尝试。&/p&&br&&p&（由于我行文较慢，再加上你也看到了，我一篇文章接近一万字。所以我会努力写哒你们别催我
hello，新年过完了，开工快乐。距离上一篇文章已经过去四个多月了，这前前后后一直有朋友私信问我说，之前一篇文章中的信息架构应该如何梳理，当我们尝试分析一款移动端app的时候，我们应该如何进行思考之类的问题。那么今天，我将从大家经常用到的百度外卖…
&figure&&img src=&https://pic2.zhimg.com/v2-133cac160b6_b.jpg& data-rawwidth=&1920& data-rawheight=&823& class=&origin_image zh-lightbox-thumb& width=&1920& data-original=&https://pic2.zhimg.com/v2-133cac160b6_r.jpg&&&/figure&&blockquote&近期因为项目需求，整理了产品中的各类空白页。简单而重复的梳理工作，希望能透过现象对空白页本质有更多的理解。&/blockquote&&br&&br&某研究机构于2016年公布的数据：有77%的用户在安装新app的前三天将会卸载这个产品。在前30天内，80%的日活用户将会离开这个新产品。这些产品中的低回归率是因为产品的程序崩溃么？事实并不是这样。我们作为设计师总是先开始设计一些我们所认为重要的界面，来尽力用一些目前流行的设计元素于页面中，但是空白页总是我们最后设计的一项。其实空白页往往是充满潜力和各种可能性的，并且它作为新用户接触我们产品的第一印象，是需要我们去推动设计来增大产品retention rate的。所以我们作为设计师需要关注空白页的给用户带来的交流价值。&br&&br&&br&&h2&&b&什么是空白页？&/b&&/h2&&br&空白页是app中一些特殊情况，“没有内容”、“没有网络”等一些错误或者初始情况。&br&&br&空白页根据场景来划分：&br&&b&1 功能引导。&/b&&br&引导用户去进行本页面内容从0到1的建立。&br&分别有1步完成：先图后文，再接button。&p&&figure&&img src=&https://pic1.zhimg.com/v2-afe387c68d49bdc3f11e90d_b.jpg& data-rawwidth=&1548& data-rawheight=&1288& class=&origin_image zh-lightbox-thumb& width=&1548& data-original=&https://pic1.zhimg.com/v2-afe387c68d49bdc3f11e90d_r.jpg&&&/figure&&br&也有多步完成的：多步完成的空白页，也称作引导页，旨在通过图文引导用户完成某项任务，了解某项新功能，提交某项信息。现在也多用图文结合的方式。&br&&figure&&img src=&https://pic1.zhimg.com/v2-09ae1bfebd_b.jpg& data-rawwidth=&1542& data-rawheight=&1304& class=&origin_image zh-lightbox-thumb& width=&1542& data-original=&https://pic1.zhimg.com/v2-09ae1bfebd_r.jpg&&&/figure&&br&&br&&b&2 新手教育&/b&&br&往往通过教育，让用户开启某项新服务，这存在于第一次打开某个页面。往往除了配图以外，也会有较多的文字描述关于该项新服务。并且告知用户开启这项新服务会有什么好处。&br&&figure&&img src=&https://pic1.zhimg.com/v2-48fbeeeac2fc0c4bbf275_b.jpg& data-rawwidth=&1550& data-rawheight=&854& class=&origin_image zh-lightbox-thumb& width=&1550& data-original=&https://pic1.zhimg.com/v2-48fbeeeac2fc0c4bbf275_r.jpg&&&/figure&&b&3 结果反馈&/b&&br&结果反馈分为正向和负向。这种结果反馈较为正式，也比较重要的反馈。不同于一般toast的瞬时反馈，这种阻断式结果反馈，更加直接和强反馈。但是好的空白页设计是不会让用户感到突兀，而是让使用者感受不到它的存在。&br&&figure&&img src=&https://pic3.zhimg.com/v2-eba07adb878_b.jpg& data-rawwidth=&1546& data-rawheight=&840& class=&origin_image zh-lightbox-thumb& width=&1546& data-original=&https://pic3.zhimg.com/v2-eba07adb878_r.jpg&&&/figure&&br&&b&4 空白页无内容&/b&&br&这一类空白页设计，是指内容为空。这个可能是使用者删除了内容，或者触发了一些事件。这个时候可以适当展现产品的幽默，或者鼓励用户创造内容。&br&&figure&&img src=&https://pic4.zhimg.com/v2-2ac0acc3ce8bac58da72ea1_b.jpg& data-rawwidth=&1562& data-rawheight=&850& class=&origin_image zh-lightbox-thumb& width=&1562& data-original=&https://pic4.zhimg.com/v2-2ac0acc3ce8bac58da72ea1_r.jpg&&&/figure&&br&&br&&b&5加载&/b&&br&loading中的空白页，不属于标准空白页的范围内。应该被归纳到loading
控件中。&br&&figure&&img src=&https://pic4.zhimg.com/v2-7d8f6647aff33f5bdc5c_b.jpg& data-rawwidth=&1550& data-rawheight=&856& class=&origin_image zh-lightbox-thumb& width=&1550& data-original=&https://pic4.zhimg.com/v2-7d8f6647aff33f5bdc5c_r.jpg&&&/figure&&br&&br&&br&&b&空白页根据页面来划分：&/b&&br&空白页分为整页面的空白页（上）、和带其他内容的空白页（下）。&br&带其他内容的空白页要关注一致性，以适应不同页面内容和页面架构的变化。&br&&figure&&img src=&https://pic3.zhimg.com/v2-80f5e7a0a570fc80c4ddc4_b.jpg& data-rawwidth=&1554& data-rawheight=&1044& class=&origin_image zh-lightbox-thumb& width=&1554& data-original=&https://pic3.zhimg.com/v2-80f5e7a0a570fc80c4ddc4_r.jpg&&&/figure&&br&&br&&/p&&h2&&b&空白页设计的大方向：&/b&&/h2&&br&&b&1品牌：&/b&在空白页中介绍并强化你的品牌元素。通过插图的风格、颜色、形象IP来展示产品的品牌元素。&br&&b&2亮点：&/b&有创意或者展示产品的幽默感。&br&&b&3共鸣：&/b&展示产品温暖人性的一面，让用户感受到你的产品情怀。&br&&b&4规则：&/b&庞大产品，特别是平台性产品，要使每个模块、每个页面的设计风格，图文排布形式，插图风格等等保持一致性。&br&&br&&h2&&b&如何设计空白页？&/b&&/h2&&br&通过一些好的案例来解析它吧～&br&&h2&1、它教育和帮助你的用户&/h2&&br&设计空白页的首要目的是教会用户如何去使用你的app。如果他们不理解这个功能，我们的设计将是失败的。所以你需要以舒适的方式，告知用户他们将要发生的事。&br&好的案例：&br&invoice：下面这个app通过插画告知用户快速访问您的数据，检查您的销售业绩，才可以拥有所有的客户。&br&&figure&&img src=&https://pic3.zhimg.com/v2-53dc260a47ecda9458850c_b.jpg& data-rawwidth=&1402& data-rawheight=&1052& class=&origin_image zh-lightbox-thumb& width=&1402& data-original=&https://pic3.zhimg.com/v2-53dc260a47ecda9458850c_r.jpg&&&/figure&&br&空白页必须在页面失败的情景下，保证其能帮助你的用户，告知用户如何去解决某个问题。而且你需要在友好性和有帮助性之间保持一个平衡。&br&不好的案例：这个页面只是为用户提供一个错误信息，除此以外什么也没有。&br&&figure&&img src=&https://pic2.zhimg.com/v2-da68eb1ce_b.jpg& data-rawwidth=&680& data-rawheight=&1206& class=&origin_image zh-lightbox-thumb& width=&680& data-original=&https://pic2.zhimg.com/v2-da68eb1ce_r.jpg&&&/figure&&br&&br&&h2&2、让你的用户愉悦&/h2&&br&一个好的产品印象不是其可用性，而是关于产品的个性。如果你的第一个空白页看上去与一个简单的页面有些不同，你就可以向用户展现你不一样的一面。你的目标就是让用户看到空白页的时候，是一个愉悦的惊喜。&br&&figure&&img src=&https://pic3.zhimg.com/v2-106bbc801fe32f4aa700a1c06b6629fe_b.jpg& data-rawwidth=&1364& data-rawheight=&1196& class=&origin_image zh-lightbox-thumb& width=&1364& data-original=&https://pic3.zhimg.com/v2-106bbc801fe32f4aa700a1c06b6629fe_r.jpg&&&/figure&&p&可以使用信息通过以下方式：&/p&&p&为你的用户带来愉悦：介绍您的品牌元素（与其他产品有趣的方式不同）。&/p&&p&显示幽默感和娱乐（使用积极的情绪和惊喜你的用户）。&/p&&p&显示您的业务或产品的人性化（提供激励，或即使你没有义务也提供帮助）。&br&&br&&/p&&h2&3、推动操作行为&/h2&&br&把空白页当作一个小的登录页，如何让用户快速进行下一步操作。&br&&figure&&img src=&https://pic1.zhimg.com/v2-1e40c0c90eda816fd681c835df7b4ca1_b.jpg& data-rawwidth=&1556& data-rawheight=&1236& class=&origin_image zh-lightbox-thumb& width=&1556& data-original=&https://pic1.zhimg.com/v2-1e40c0c90eda816fd681c835df7b4ca1_r.jpg&&&/figure&&br&在空白页上去推动操作行为，你需要：&p&1）激励你的用户：用激励化的语言和设计去推动你的用户。例如“Learn more” or “Let’s get started.” &/p&&p&2）说服你的用户：提醒用户他们使用您的产品时将会收到的好处。 &/p&&p&3）指导你的用户：推荐并向他们展示开始使用的最佳方式。 提供指引性的按钮，以指导用户看到空白屏幕所需的操作，来获得更有意义的内容。&br&&br&&br&&br&&/p&&h2&&b&总结&/b&&/h2&&br&因为UX是产品一体中各个架构的和谐化，所以空白页是与其他页面一样重要的页面。空白页的设计要求在信息和动作中获得一个完美的平衡，这个平衡的状态可以使你站在用户和你做的UX工作之间，因此空白页需要获得比我们想象的更多的关注。
近期因为项目需求，整理了产品中的各类空白页。简单而重复的梳理工作，希望能透过现象对空白页本质有更多的理解。 某研究机构于2016年公布的数据：有77%的用户在安装新app的前三天将会卸载这个产品。在前30天内，80%的日活用户将会离开这个新产品。这些产品…
这是我以前收藏的一篇文章，希望对题主有些帮助
本文是贾真对淘宝运营的思考，根据自己的实际经验来解读四四二法则。为什么淘宝卖得最好的女装居然是小众的民族风?什么是定位成功?爆款意味着什么?文章中都有精彩解答。
　　前段时间不停的有人问：代运营能不能找? 我回答：好的很少，但如果一个代运营不和谈定位和市场，只神化自己的运营技术，果断放弃。
　　淘宝搜索这边有个说法：能SEO说明搜索本身不完善，随着搜索引擎的进步，能SEO的东西越来越少。同样道理，随着淘宝的成熟，网购市场已经越来越回归商业本身，需要的纯粹的淘宝运营技术其实越来越少。
　　也许在前几年，大家经验都不多，淘宝规则也不完善，运营甚至可以神化一些“垃圾”低价产品，传统行业那时进入电商先低头学运营。但是从今年之后，强烈的感受：像我这些纯靠运营能力起步的小年轻们需要虚心的像传统行业学习真正的商业运作了。
　　在营销界，有个广泛被使用的“四四二法则”：
　　直销大师艾德梅尔(Ed Mayer)提出：成功 40%取决于定位+40%取决于产品和定价+20%取决于营销。
　　经过了这么多年淘宝的历练，越来越觉得淘宝运营不再是简单的技术，更多的是对于市场的感悟和理解。
　　40%定位
　　运营做的第一件事，一定是重定位。 这个和产品本身同样重要，为什么?有的时候我们发现，卖同样产品的卖家，有的评价产品好，有的评价产品不好。因为不同店铺的顾客生态圈不一样。有的时候，不是产品不好，而是没把它卖给对的人。
　　很多人觉得，产品一定是质量为王，产品质量一定要最好。但是ZARA成功的把一批质量一般的衣服卖给一群追求新鲜感的年轻人，一样做的很好。
　　说到定位，我们必须谈一下数据。现在的电商都知道数据的重要性，都知道数据的好处。但是有没有人思考一下，其实数据是有毒的。
　　现在的卖家很容易通过数据分析出哪些产品的受众最大，而把自己定位在某个最大淘宝群体的市场。最后很可能的结果是，大家都挤在一条独木桥上。呈现的就是现在的景象：全网的卖家都在做爆款。
　　网购和传统店铺有很多的不同，最显着的一条：商圈容积。传统开店营业额高的往往做大众共性的东西，因为一个店面只能辐射一个小商圈，容量有限。但是我 们看去年淘宝女装销售第一名竟然是民族风，很小众!这在线下几乎不可理解!这证明网购的商圈容积大的惊人，更惊人的是，它还远远没有被开发出来!
　　说说我自己的例子：本来我觉得做笔记本贴膜，市场太小。后来我看中iphone手机壳，进入后发现，非常难，然后就继续退回专心做自己的键盘膜。曾经 一度我商城的销量和流量都比iphone手机壳销售最好的店铺更好，虽然iphone手机壳的市场容量比我大100倍。
　　太多的传统行业进电商都死在这一点，他们太多的产品可以选择，所以他们不过滤的都放到店铺来卖。
　　我一个学生，汕头卖毛衣的，20年的工厂历史，很有实力，他也找了专业团队给他做旗舰店，也舍得花钱，但是结果投入产品比很差。他的优势反而最终成了 他的瓶颈。因为他的产品实力强，所以他的店里上了各种风格，各种年龄层次人穿的毛衣，完全没有目标顾客考虑。或许他有几百万资金，但是直接把自己简单粗暴 的定位到某大类目，很可能是像扔到大海里的小石子，水花都没有。商圈容积大，同样竞争也更激烈。
　　后来，我给他们的建议：选一个小风格，这个店铺只上这一种。努力使你的店铺让目标顾客趋之若鹜，不用理会非目标客户的嗤之以鼻。
　　我去参观了很多的淘宝店，发现现在能成功的店铺，几乎都是赤裸裸的产品和定位的成功。大码女装，日本黑帮范，民族风等等。曾经我以为，大店的运营都是 超牛A 水准的。但是去了之后发现，根本没有! 他们甚至在搜索，直通车，回购率等方面做的努力非常少，技术很一般。但是因为定位的好，回购率高，所以他们甚至每个月发几万条短信告诉老顾客：节日快乐 (每个月都有节日)，然后订单就源源不断的来了。
　　我买了花笙记的衣服，很喜欢。所以下次需要买衣服的时候，我先去他家看看。如果实在没有，我才“懊恼”的使用淘宝搜索。这就是定位细分的好处。其实很多顾客是初级的，懒得去用“复杂”的搜索引擎。
　　没定位的店铺是找流量，哪个产品的需求大，就卖那个产品。这方法开始很容易得到流量和销量，但越往后越难，不可避免的走进红海，外表光鲜内心痛苦，销 售额大不赚钱。找到定位的店铺是会以“客户”的心态去看流量，前期要抛弃很多流量，没建立自己的客户生态圈之前非常难，但越往后走可能反而简单，因为你的 客户在你这生活了。顾客成为了你产品的粉丝，甚至帮你宣传产品。
　　有很多人说我定位高端XX。其实价格并不是定位的方向，而是定位的结果。定位是界定了使用你产品的某个特殊人群。只是因为这个人群喜欢用价格标榜身份，带来的结果是你价格被迫高一点。
　　还有个误区：是不是做成高端产品就一定好? 但 2012 全球品牌价值第一的是可口可乐。另外，中国的最大市场不是高端，未来网购的增长点在二三线城市。
　　单纯卖货是个很枯燥的事情。而一个好的定位，就像是把卖货写成一个很让人心动的故事，让大家激情燃烧，而这个故事的完美结局很好预测，两个字：品牌。
　　如何检验自己的店铺有没有定位成功?
　　答案是无爆款。大家去看知名的线下品牌在淘宝的店铺，往往没有特别突出的爆款。因为爆款，往往是因为顾客忠诚于某一个产品的性价比，这其实很危险。当每个产品都销售的不错时，说明顾客真正的爱上了这个店铺，这个品牌。
　　40%产品和定价
　　产品设计一直是我的弱项，我是09年拿了600元钱一个人跑到数码配件批发市场开始做淘宝，选择的东西都是市场常见的，没什么竞争力，做起来纯靠自己的运营能力。曾经还一度自信的认为什么产品我都能做。但是下面两个小故事改变了我：
　　故事1：
　　在南京某大码女装家做客，老板的一番话让我很受用：“我是个偏执的人，如果要买的东西有缺陷，我宁可不买也不将就。所以我店铺做产品也这样。”他现在 只有一个C店，月销售额估计700万以上。在前几年，大家都因为搜索排序的引导去做低价爆款的时候，他家始终坚持做质量。前些年确实很难，但是坚持了几年 之后，爆发了。
　　我说这是“好产品最终战胜了营销和搜索”，淘宝最终一定会回归到市场，所以方向对了，总有一天会到达。我觉得他能成功，最重要的2个原因：
　　选了一个回购率高的行业定位。
　　好产品帮他最近几年累计了大量的顾客。
　　这个事情之后，我反思了很多。现在我要求自己和公司员工必须用自己的键盘膜。有主管告诉我，不想用。 我告诉他，用的不舒服? 那就想办法找出能让你舒服的产品!营销，只能解决顾客的第一次，而产品本身才是市场的核心。接触了大量卖家，我还发现一个很有趣的情形：做传统行业的老板 找我聊天，多会谈产品多好。而只做电商的人，往往聊某个运营很牛B。
　　大家猜猜，未来，谁会活的更久?
　　故事2：
　　南京大部分洗车店做事都很麻利，很快。有一次去一个洗车店，限定洗车时间不低于XX分钟，上车前看到门下一脚垫，小伙子提醒：上车前擦一下脚底。心里 温暖。车门打开发现一块毛巾在驾驶室脚底下，说：“你毛巾掉车上了!”。心里还暗想小伙子丢三落四。小伙子提醒说：“上车之后再用干净毛巾擦一下脚底，就 一点灰尘没有了!”
　　我心里很感动!
　　其实，他们大可不必管我上车之后的事情，只需要把一个干净的车交给我就完成了整个销售过程，我上车之后脏不脏不关他的事。我感动，是因为他们的销售是真心的帮我解决一个困难。
　　在这之后，我告诉自：我以后做生意，一定是90%的生意+10%心意。带给我的改变是：店铺每销售一张键盘膜，都会额外赠送一张普通的平板膜，而且在 描述里不告诉他。当顾客收到我们产品的时候，发货单上一定会有一段话： 赠品通用膜，亲换洗键盘膜的时候可以暂时用这个。
　　很赞同乔布斯的一句话：赚钱是企业行为的结果，而不是目的。心态若不同，产品也就会大大的不同。
　　关于定价
　　我以前发了一个微博：
　　一个医学绝症的人遇到一个道士，给了他一颗仙丹，收了他9999元。后来他的病真好了。 但背后的故事：仙丹只是淀粉，只是因为这个人开始绝望，后来又有了希望，所以免疫力恢复，最后产生了奇迹，自愈了。
　　所以这时候我们思考，这个产品的定价能不能从他自身的成分出发?9999元是太贵，还是太便宜?
　　虽然这是个杜撰故事，但是很多化妆品都类似。只要你能让客户觉得他用了自己变的更漂亮了，那就是物超所值。需要为定价负责的是最终的效果，而不是成 本。非常可惜的是，目前淘宝的低毛利不能支持大家去思考：怎么成为用淀粉救人命的道士。但是我相信，未来改变这个行业的人，一定会领跑下一个电商阶段。
　　即使从数据测试来看，尤其在非标品类目，价格和转化率往往不是简单的正比关系。有的时候，我无法从网上判断一件衣服质量和做工究竟如何，那我一般会买贵一些的。(当然，我只能代表一部分人)
　　不可否认，淘宝上很大量的顾客是喜欢低价爆款的，在没有个性化之前，我们看到的产品都是主流顾客喜欢的。但是淘宝个性化之后，千人千面，品牌的客单价可能会影响看到你产品的人的身份。想想看，将你的产品群发给全淘宝具有高消费能力的人，是一件多么诱惑的事情。
　　因为顾客第一，所以未来的淘宝，一定不会打击爆款。因为顾客需求多样化，所以淘宝不会允许只有爆款这一个商业模式。这是个很有趣机会和的挑战!
　　20%营销
　　在做淘宝有点成绩之后，很多亲戚朋友找我“教教我!”他们或许想知道的是淘宝运营的绝招。一般我都会建议他们别做淘宝，除非他对这个行业有难以抑制的激情。不让他们做的原因：
　　看别人做的行业都看起来很美，但实际上做淘宝赚钱的公司不多。
　　同样的个人一年赚5万，做淘宝连假期没有，上班可能优哉游哉。
　　做淘宝其实没有绝招，不然我干嘛还只坚守一个行业?淘宝运营的招数基本都是基于产品和市场，细节非常多。
　　我自己的店铺所处3C数码行业，我在搜索上投入了很大的精力，这是我新客户的主要入口，但是我去大码女装家建议他们搜索只投入部分精力，做60分就 好。更多的精力放在老顾客身边的新顾客。在普遍回购率本身就很高的行业，老客户其实是更重要的销售重点，老客户身边的新客户其实比搜索的新客户可能更具有 价值。我问他们老板：CRM对你来讲，比搜索更重要，你有没有做一些努力去挖掘满意你衣服顾客身边的新客户? 运营回答说说：推荐购买，返还XX元!
　　我买了某淘品牌男装，发微博，主持人朱丹评论说：很有品味! 这时候我会觉得推荐给朋友这家店很有成就感。 有的时候，顾客不是不愿意去分享，而是没有想起来。但是，顾客其实很忌讳为了钱推荐给朋友东西(除非诱惑足够大)，而愿意为了得到朋友的赞同和认可去推荐。
　　但并没有一个放之四海而皆准的淘宝运营手册，不同行业，不同产品，不同定位，这里面都会有很大的不同。
　　如果要寻找新客户，你先要知道你最有效的新客户入口是在哪里? 搜索，淘客，回购，直通车，类目还是其他? 如果让我给运营建议：先把所有的常规入口都做到60分，然后把主要精力放在最适合自己的一点。淘宝的流量