起因是要画一个能代表“运营”岗位的小图标，我们在做招聘相关的业务，想用图形来辅助理解。不过总有这样的时候，用具象图形来表达某个抽象概念，选择很多，但又觉得没一个靠谱。回归本质，首先要了解我到底要表达的是什么。运营……和运营人员共事这么久，我真正理解他们是做什么的吗？作为产品设计师，和运营打交道不算特别频繁。总之很杂就对了，这是一直以来的模糊印象。而在一些视觉设计师看来，运营=不靠谱，天马行空不着边际、想一出是一出、观点前后矛盾、从不重视品牌和统一、只会简单粗暴强X用户……和我共事过的设计师，我大致能记得他们每一次发飙，其中运营稳居发飙对象榜首。当然，这样随随便便给人打标签是很幼稚的行为。我女朋友前阵子应聘，去面了一家小创业公司，最后一轮CEO亲自面她。其间谈到她的爱好是中国古代史，生活中是个极其理性的实用主义者。CEO表示非常诧异，他说设计师怎么会是你这样？设计师的业余生活难道不应该是很小资很文艺的哪种吗？听听音乐会、逛逛美术馆之类的。我听完也觉得很诧异，一个看问题如此片面的CEO，能带领团队走多远？千万不能把任何人、任何职业符号化，否则就再也没有机会看到那些值得学习的闪光点了。要相信，真正专业的运营人员绝对不会是那样。查了一些资料、和运营同事也简单聊了聊，第一次系统地了解他们的工作内容到底是什么——没错，真的很杂。运营工作分为内容、用户、活动3大方向，三者没有高下之分，都不可或缺 ...继续阅读 (2)

幽默栏目上次更新距今已经很久了，真的是因为年纪越大乐趣越少么？不过无论如何，总还不至于停播。谓语后置和人解释日语和韩语的谓语后置现象，举了几个例子，“我/图书馆/去”、“今天/雪/下下来”，对方还是表示难以理解。然后忽然想到一个经典名句，抗战片必备台词：“你滴什么滴干活？”于是对方秒懂。古墓派装修CC家在装修，由于厕所小，非常纠结做移门还是平开门，在群里发问求助。BB说做个机关门，开关是个碗，旋转即可，门会往上升起。BB的创意让我深受启发，我说开关用个钵比较好，语音控制。只要拿起那个钵，对着厕所喊：“我叫你一声你敢应么！”然后厕所门应声开启。当然，上升开门是关键，这点绝对不能变。至于门的材质，一定要是石门，咯噔咯噔升上去，扬起一缕灰。别人家什么田园风格、北欧风格都太稀松平常，CC家绝对是一股清流——古墓派风格。定个小目标这是我们公司产品经理画的原型图，一看这名字我就乐了。有志气、励志，简单粗暴接地气，看到这公司招人，我肯定就去了。目标多明确啊。一点不玩那些虚的，目标就体现在名字上。哪天目标实现，直接宣告破产，散伙分赃，各自回家混吃等死。神奇的是，他起这个名的时候，王健林还没有定他的“小目标”呢。黑科技重力感应开关公司年会去了良渚，散会时大家在酒店大堂集合等车，和几个设计同事一起摆弄起了酒店里的一盏灯。这灯非常奇妙，拿起来就熄灭，放回去就点亮。我们各种猜测，用了什么黑科技。莫非这灯里 ...继续阅读 (2)

[国外设计第172期]2008年的时候，我在*Boots.com*工作。他们想做一个单页的结账页面，运用那个年代最新潮的技术，包括手风琴组件、AJAX和客户端验证。每个步骤（寄送地址、寄送选项、信用卡详细信息）都收在一个手风琴面板中。而每个面板都通过AJAX提交。提交成功后，这个面板就会收起，并且通过滑动动画展开下一个面板。看起来就像这样：Boots的单页结账页面，使用了手风琴面板展现每一个步骤。用户千辛万苦才完成了下单过程。错误难以更正，因为上下滚动并不方便。手风琴面板让人非常痛苦和分心。不可避免地，客户要求我们作出改变。我们进行了改版，让每个面板单独成为一个页面，也就不需要手风琴和AJAX了。不过，我们还是保留了客户端验证，防止不必要的服务器请求。看起来就像这样：Boots的结账页面：每一步都是单独的一个页面。这个版本的转化率好多了。虽然我不记得具体数字了，我知道客户比较满意。6年后（2014年），我在*Just Eat*工作，发生了同样的事情。我们设计了一个单页结账流程，其中每个部分都有独立页面。这一次，我记下了相关数据。结果是每年能增加2百万订单。要清楚，这是订单量，不是利润。这个数据是基于新版本至少一周后，结账转化率提升的比例得出的。这部分转化成了订单，数量激增52倍。这是我们的移动端优先的设计：Just Eat的结账分为多个页面。我们还在设计中进一步简化了支付页面：用户 ...继续阅读 (7)

[国外设计第171期]用户体验原则在步行导视上的应用，能改善高峰时期的通勤。我从涩谷站下车的时候，人流从我身边涌过，我开始寻找忠犬八公的雕像。朋友约我晚饭前在那里碰面，但我找了10分钟仍旧迷路。幸好我放慢了脚步，观察四周，我看到了导视牌。有了精心设计的辅助引导，你很快就能找回方向。渐进式显现的地铁站导视系统当你正在前往某站的地铁上，车门上方的屏幕会告诉你这几个信息。首先，它会告诉你哪边的车门即将开启。这能帮助满满一车人找到自己的方向。人们会缓缓移动，示意周围不下车的乘客为其让道。老实说，我看不懂所有文字，不过我还是明白它表达的意思。标识也能让你确认站点，让你知道自己没有下错站。在站点名下方，会显示一张图，告诉你处在车厢的哪部分，并且表示出你所处车厢的位置对应车站的什么设施。楼梯、自动扶梯、电梯，还有列车的移动方向！太实用了。我在旧金山生活时常遇到一个问题，就是想了解到站时车门外有什么设施。我总是从楼梯旁经过，然后要回头去找。这些标识会告诉你当下正需要的重要信息，可以避免此类困扰。下车后，你会看到指向四面八方的标识。上方：电梯和求助；中间：主要的站点设施和出入口；下方：出口与方向。这个标识表达了：去哪里求助和寻找电梯你的站点里的位置，以及如何转其他线路主要的几个方向，以及从哪个口出去当用户学习新产品时，渐进式显现的概念不需要立刻解释或显现全部信息。你只需要解释当下相关的内容，逐渐展现 ...继续阅读 (7)

[国外设计第170期]一窥Dropbox品牌设计一分钟。这点时间连泡一壶茶、甚至等个红灯都不够。但要用来讲述一大堆关于Dropbox的产品更新，我们只有一分钟的时间。如你所见，今年早些时候，我们准备好了要发布一系列关于协作与生产力的新功能。伴随本次发布，我们的品牌设计团队想要创作一段短视频，展示这些功能的相互配合。一分钟。这能有多难，对吧？本文中，我们会讲述这段视频的制作过程。早期头脑风暴环节创造奇迹我们从创意简报入手。叫上产品、市场、设计和决策者一起，我们需要确保每个人都参与我们的工作。创意简报要确定以下问题：我们为什么要做这个项目？目标受众是谁？如何定义项目成功？排除哪些目标？我们想要解决什么问题？主要表达什么信息？辅助信息是什么？这件创作要用哪3个形容词来描述？交付物及规格是什么？时间安排是怎样的？要追踪哪些指标？简报成了我们的北极星，是我们创作的共同基础。当创意方向或策略偏离正轨时，我们会回溯到简报上，让一切归位。创造我们的北极星启动这个项目由Instrument与我们协作完成，这是波兰的一家才华横溢的创意机构。我们当面启动合作项目，定下了时间规划、里程碑、责任分配和目标。如果用邮件或在线沟通，这些细节往往得不到落实。通过提前当面沟通，我们迅速在两个团队间达成了共识。启动会持续了2天。这是一个每人都需要参与的工作环节。我们进行头脑风暴、在白板上涂涂画画，记录下了上百个点子， ...继续阅读 (13)

[国外设计第169期]首先出现的数值和设置内容就是默认项。它们的作用似乎微乎其微，但默认项（和它们的设计者）掌握着强大的力量——替用户做决策。本文中，我们会讨论如何运用预置的内容和默认设置，创造更好的用户体验。表单输入框中的默认内容即使过程很简单，长表单往往还是会让用户敬而远之。通过提供适合的默认值，可以从海量相关选择中拯救我们的用户。默认项应当符合多数用户所需如果可以预先确定内容，就把它预置到输入框中，要确保它是多数用户的选择（比如95%）。人们会很快速浏览在线表单，所以不能假设他们愿意花时间来理解所有的选项。他们很可能会欢快地略过那些已经有内容的项目。旅行网站的默认项是非常好的例子。Skyscanner的预置了二等舱选项和游客类型，这是多数用户的典型选择。使用智能默认值输入文字的交互成本极高，它很容易输错，而且相当耗时，即使有完整的键盘也一样（更不用说在触摸屏上输入了）。要尽可能把输入操作减到最少，防止用户犯错——使用智能默认值。下面这些例子，可以反映智能默认值如何帮助用户减少犯错，并提高生产力。基于用户的地理位置，预设国家选项。如果能够了解到用户当前位置在墨尔本，那么国家一栏就可以默认设置成“澳大利亚”。尽可能让界面做更多的运算。下面的截图中，界面正在以美元计算总花费，并且为顾客换算成欧元。尽可能让信息输入减到最少。在需要用户注意的地方，不要使用默认输入项在任何需要用户思考的 ...继续阅读 (23)

[国外设计第168期]摘要：小圆点有助于分割大段文字，使得复杂的文章和博客更容易消化，突出关键信息。有时候，最好的信息展现方式就是无序列表。无序列表能吸引注意、便于浏览、简化文本，并且表达出项目之间的关系。网站不是一个适合长篇大论的地方。相比之下，网站的读者更喜欢文案以某种易于浏览的形式组织起来，能让他们轻松跳过大段文字，直达自己感兴趣的部分。有许多种网页文本格式的技巧，能够分割大段内容。无序列表和加粗、缩进、行间距、彩色文字，都是辅助网页内容高效阅读的重要手段。区区几个小圆点能够吸引视线，并且让复杂的概念易于理解。小圆点能让读者感知到内容的简明和重要。这并不奇怪，在可用性研究中，我们观察到读者对无序列表满怀热情。网页的读者希望快速消化内容。我们可以对比下面这两个版本。你会发现第2个版本中的内容更易阅读。这是因为它以纵向列表的形式展现。相比之下，在第1个版本中，读者只能在结构不太清晰的段落中寻找。版本1我们的Spa度假套餐包含了2晚住宿，2次50分钟的任选spa项目，1顿两人份的上门早餐，到达时还有礼品篮相赠。版本2我们的Spa度假套餐包含:2晚住宿2次50分钟的任选spa项目1顿两人份的上门早餐到达时赠送礼品篮不必担心版本2占了更大的纵向版面。如果（或者说除非）用户对内容感兴趣，随着视线的下移，他们完全不介意往下滚动。事实上，相比那些用长篇大论吓退用户的网站，恰当地使用了无序列表 ...继续阅读 (11)

[国外设计第167期]假设你是一名兽医。因为你非常善于利用人们对弱小可爱动物的爱心，所以Instagram账号经营得风生水起。但这对你来说还不够，你决定开发一个移动应用来拓展你的宠物帝国。这款应用能把人脸模拟成猫猫狗狗的脸。（承认吧，你14岁的时候肯定构想过类似的模拟马脸和猪脸的应用。毫无疑问。）那么你的这款改变世界的应用，肯定也需要一个图标，猫咪图标。这时候Icons8就派上了用场。在搜索框里输入“猫”，下载你喜欢的“iOS”风格图标，因为你觉得Appstore还不够拥挤，差不多就是这样。然后，你发布了应用。你的秘书向你祝贺，从那一刻起，你的名字被载入兽医的史册。我想表达什么？兽医真是个好职业。好吧我只是在搞笑。人们往往有各种奇怪的兴趣。他们会搜索一些含糊不清的图标，例如“新闻”、“工作”等。用在他们的应用、网站、T恤上。试着搜索一下工作图标，你就能了解我们的搜索算法的厉害之处，它能囊括所有几乎能与“工作”沾上边的图标。问题是，每个人对于相关与不相关都有自己的理解。更要命的是，即使同一个人，在某些因素影响下也会对一个图标的相关与不相关做出不同的判断，比如说文字标签。给图标加上文字标签，或许就能改变人们的认知。我们不知道怎么应对这种情况，因为我们有两种显示模式：我下文中会把这两种模式成为纯图标模式和图标+文字模式。哪种更好，图标还是图标+文字？哪种更适合作为默认模式？人们看到太多不 ...继续阅读 (5)

[国外设计第166期]真的……我没疯首先讲一讲背景。这是在我们周会上发生的事情：“Andrew，我们做了几个很厉害的新功能，测试一下吧。”“好的，当然。”“嘿，你甚至会忍不住写篇文章来介绍的！”“呃……”只有一个问题……当我被要求测试一项功能，通常意思是让我发起一场可用性测试，这就包括寻找参与者、准备一系列任务和问题，并且通过Skype访谈来执行（执行问题，不是处决参与者）。【译者注：这是作者的一个玩笑，“执行”与“处决”在英文中是同一个词】于是我去看了我们的网站，自己先研究了这个新功能，基于它想象各种相关联的任务。我花了11秒尝试了所有可能性。我甚至尝试反复来回点选，就好像我在一边和我妈通电话一样，这样花了30秒。然后我妈真的打电话来了，我又试了一次，花了20秒。我所讲的功能，是图中右上角的3个按钮。3种视图模式的切换。3个按钮可以让视图在3种模式中切换：纯图标、带标签的图标、表格视图通常我的Skype访谈会持续30分钟：其中80%是任务，20%是简短的谈话和我的蹩脚笑话。如果任务只有30秒，我就得讲29分钟的笑话。我才不会那么做，有2个原因：没人愿听如果我能做到，我就是个喜剧大咖了于是，我现在有的只是3个按钮，只能通过一个问题来检验。此时我的剧本大概是这样：设定一些任务来检验人们是否注意到这3个按钮。“这3种模式中，你最爱用哪种？”通俗而言，UI与UX的区别我还需要更多信息。于 ...继续阅读 (19)

【提醒：本文图片极多，如果心疼流量，请立刻关闭网页，以后在WIFI下浏览。】这是一篇前前后后写了一年多的笔记。梳理逻辑，收集资料，写写停停。现在，是时候整理一下，公开亮相了。2013年6月，我买了一套90方的小户型住宅。期房，等了2年半，2015年11月底才拿到手。我只是个UI设计师，和室内设计八竿子打不到一块。但面对新房装修这样的浩大工程，我决定亲自操刀，毕竟这是个难得的学习机会。虽然请的装修队里也有设计师，但他只做了两件事：量房、画水电和木工图，然后就再也没出现过。可以说家里从格局到细节装饰，95%是我亲自设计的。事后证明这其中的收获远超我想象，虽然折腾，但确实乐趣十足。头一回装修，我立下目标，要把完整的经过记录下来，让所有的收获有一个地方沉淀。一定要亲自操刀吗？这个问题需要花些时间才能回答。要有个心理准备，搞清楚这到底是个多庞大多繁杂的项目。有个感性的认识，才能判断有没有足够的精力，是否真的适合自己。自己主导装修，就意味着要事无巨细一一把控。虽然不一定要亲自去铺电线、刷墙漆，清包、半包、全包都可以，但关键在于大部分的细节自己要清楚了解。装修不是单个的大难题，而是一大堆鸡毛蒜皮的小问题。光是思考从何入手就花了我不少时间。因为有很多角度，时间角度、空间角度、经济角度，而且也不像电脑上的设计那样无拘无束，在具体工艺与材质的限制面前，往往不得不向预算低头。总之，一步到位的想法不可取， ...继续阅读 (9)

终于迎来一期特刊。最近打算在公司内部做一个分享，讲的是组件化的设计与开发的思维方式。准备完演讲资料，发现这完全可以改成一篇文章。藏着掖着不合适，发出来分享给有需求的朋友吧，就当是个试讲了，希望大家帮忙指出错误。下载地址：https://www.jianguoyun.com/p/DY1Z3bEQwKOaBhimoyg由于本文首先是以keynote的形式诞生的，其中还有动画和视频，所以我比较推荐大家直接下载keynote文件（也存了PPT版本）。内容和本文是一样的，但有些逻辑关系还真得让画面动起来才说得清。提醒一下，keynote文件大小将近150mb，嫌麻烦的朋友，当然也欢迎继续阅读。组件化组件化的工作方式信奉独立、完整、自由组合。目标就是尽可能把设计与开发中的元素独立化，使它具备完整的局部功能，通过自由组合来构成整个产品。对于计算机这么复杂的工业产品，组件化是唯一能使它成为现实的方法。我中学暑假去电脑城打工，跟着别人学习电脑维修。CPU在哪里，负责什么，如何拆装；内存在哪里，负责什么，如何拆装。这些都是基础知识，各部分各司其职，什么坏了就换什么。我还见过资深维修工修主板，他真的能找出主板上哪个电容爆了，换一个相同规格的上去，电脑又能正常开机了。对产品设计的意义当然今天我们不讲电脑维修，组件化思维要运用到我们的工作中。首先要了解，它对设计和开发到底有什么意义？这部分虽然讲的是设计，但 ...继续阅读 (8)

又是培根……好吧，主要是因为这批培根保质期不长。主料：金针菇、培根辅料：黑胡椒汁料就这么简单几种，洗好备着，金针菇撕成小撮。培根对半切，半条就足够裹住金针菇了。裹紧之后用牙签固定住。先尝试裹了一卷，比例刚好。把其余所有的都加工好。分几批下油锅，两面煎，直到培根两面各有一条焦黄。所有都煎好之后，再全部回锅。锅底加一层薄薄的水闷2分钟，确保金针菇都熟了，并且可以增强培根的香味。起锅之后浇上黑胡椒汁。不必放盐，培根和黑胡椒汁里都含有盐分。这个菜的技术含量其实比看起来要低得多。当然，就是比较花时间。不过事后我考虑了一下，或许没必要用锅煎，抹上食用油用微波炉来烹饪，可能效果会更好。以后再尝试一下。 ...继续阅读 (14)

[国外设计第165期]减少注册和登录的痛苦处理用户验证通常是事后诸葛亮，我们总指望它有用，但很少深入思考它。它应该足够简单，但事实是，无论对于用户还是运营产品的公司，都像是在自找麻烦。登录失败、忘记密码和冗长的交互。登录界面是你的应用中最常展示的界面之一。客观地说，75%的人都在登录时重置过密码，废弃了之前的密码（来源）。在企业内网登录中，忘记密码是帮助台每天处理的头号问题（来源）。通过清晰的表述和设计良好的流程，能极大的减少这些问题的数量。要提升用户验证的体验，降低服务成本，增加转化率，有几件事情要好好考虑。清晰说明规则亚马逊和阿里速卖通的例子避免使用模糊的规则，表述清楚。不要等到错误验证来警告用户，密码至少要6位。强调密码的最短限制是有意义的，但也不要太复杂。有实际意义的密码，比随机组合的字符更有用。显示密码亚马逊的例子可以考虑让密码可见。这对用户登录和注册有帮助。不用再次输入确认，用密码输入框来切换显示隐藏，帮助用户确认首次输入是否正确。显示和隐藏的功能可以用一个小图标、一行文字标签、或者勾选框来表示。亚马逊对此做了些小变化，把隐藏字符保留在输入框里，在下方显示完整密码。增强了用户的信心，减少焦虑，表达出密码被妥善处理的事实。忘记密码的处理Slack和Trello的例子没人愿意重置密码，除非登录失败或者账号被盗。这么看来，如何帮助用户在不重置密码的情况下登录进去呢？发送一个短 ...继续阅读 (12)

最近开始每天带饭去公司，又有大把机会做菜了。每天做菜和偶尔做一次的情况完全不一样。以前偶尔烧一顿，想吃什么买什么，定种类定量。现在则是囤了一冰箱的菜，什么容易坏先吃什么。这种排列组合就更难驾驭了。这道菜就是这样东拼西凑出来的，味道却意外的好。主料：茄子、培根辅料：生抽、蒜蓉、盐、黑胡椒粉茄子买的是那种特别细长的，洗净切成小段，均匀铺在锅底，有皮的一面朝下。培根就买现成的。调味料准备好，生抽、蒜蓉酱、盐、黑胡椒粉。我买的这款蒜蓉酱很香，之前用它蒸过贻贝，效果非常棒。当然，可以自己切蒜泥加麻油替代。开始动手，取出几片培根。培根和茄子的比例要控制好，我这是个不太成功的案例。其实就我用的这点茄子，两片培根就够了。培根切成和茄子大小相同小片。均匀铺在茄子上面。前面提到的几种调料，倒一些在小碗中拌匀。盐要少放，培根本身有一定的盐分。拌好的酱料涂抹在培根表面，再倒少量食用油。虽然茄子吸油，但培根也出油，所以油不能多。我这用的是亚麻籽油，颜色特别黄。拌酱料的小碗，倒小半碗水下去。开火，沸腾之后转中火，盖上盖闷。中途再加一到两次水，防止烧干粘锅。总共闷10分钟左右，然后要翻炒几下。虽然摆得整整齐齐，那是为了受热均匀，别舍不得动啊。翻炒出锅。培根浓香，茄子绵软，简单又有惊喜的一道菜。果断盛入第二天的便当盒里，明天加餐！ ...继续阅读 (17)

[国外设计第164期]Skacks会彻底改变你对Sketch布局方式的理解。就像CSS中的Flex Box、iOS中的UIStackView和Android中的FlexboxLayout——Stack的自动布局可以再次改变整个局面。Sketch用户终于可以在不用CSS的情况下，直接使用Flexbox的排版技术。我们相信，推动设计生态前进的关键在于，创造出强大的设计概念。Flexbox已经彻底改变了局面，它出现已有好几年了。但要使用它，你得在浏览器中使用CSS来设计，因此对于多数设计师可望不可及。Stack是另一种形式的Flexbox，它更直观，但能力丝毫不减。它能使设计师以列、行、网格的思维来思考设计——使设计更加一致。Stack是什么？Stack是一种特殊的组，定义了其内部图层的布局方式。Stack组的图标是一种特殊的蓝色，上面还有图标来表示方向。要使图层变为Stack模式，在Auto-Layout面板中点击Stack按钮。小提示：-Stacks能产生一致性。-一致性使设计清晰。-Stacks能使设计清晰。一个Stack组有3个属性：方向：定义其内部图层按照水平还是垂直方式排列。方向对齐：包括顶对齐、中央对齐、底对齐、伸展。对齐间距：定义其中每个元素的间距。Stack可以嵌套使用！来解这道题！90%的设计师第一次都会理解错！下图由多少个Stack组构成：正确答案是：3。Stack ...继续阅读 (16)

[国外设计第163期]别让措辞毁了你的设计成果。用户体验设计师必须了解文案的力量。并不需要成为一名文案写手，而且也绝对不需要小说家的文笔（当然，你愿意也可以）。但你需要清晰了解语言学，理解你所用文案的真正含义。令人难以置信，产品和体验中使用的语言，会彻底改变用户的感受和使用方式。实际上，掌握特定词语的内涵（何时该用，何时避免）能使你的工作和创意更有效。不信吗？没关系，我也心存疑虑——我们一起来看看。“能”和“可以”的区别这是个好例子，因为两者很接近。设想回到校园时代，你在一堂数学课上急着上厕所。你会举手，然后对话大致这样发展…你：“对不起老师，我能去厕所吗？”老师：“我不知道……能不能，你说呢？”我每次都无言以对（而且非常紧张）。许多人都没意识到，当你询问别人自己能否做什么时，你可不仅仅是在征求意见。你问的其实是可能性。你在问你是否有能力做某件事……他们是否有能力做某件事……某件事有没有可能发生，如果发生怎么办？“能”使得问题含糊不清，增加了上下文变数，使你（或者用户）从目标上分散注意力。现在，把上面例子中的“能”换成“可以”。可以（逻辑上来说）只有两个结果——可以和不可以。下次当你提问或请求允许时，应该用“可以”，观察对方的回答会发生什么变化。相对来说，你会更容易得到是或否的回答。实际上，只要你的请求不算荒唐，天平总是向肯定的回答倾斜。作为用户体验设计师，我们都知道避免设计含糊不 ...继续阅读 (18)

[国外设计第162期]典型的企业后台界面一般长这样：有一些巨大的数字（人们都喜欢大数字，对吧？），有几张图表，可能还有表格。理论上，这些元素给用户讲了一个清晰明了的故事，让他们采取进一步措施。但是，现实情况则未必如此。多数人眼中，这些典型的企业后台界面就像这样：图片来自维基百科大家都能看到小黑点，但很少有人能看到其中隐藏的画面。为什么？因为数据极其复杂，我们却要求用户自行连线，来了解信息全貌。企业软件如此复杂，通常也有合理解释。有些行业本身就很复杂性，例如政府、健康、市场营销。但是，后台不只是给数据科学专家用的，对吧？设计能做什么？2016年6月，我们启动了用户体验管理后台的改版设计，当时遇到了同样的问题。它背后的技术非常强大，但我们的用户似乎无法理解这套后台界面。这里有各种数字，它们都相当重要、有价值。但人们难以理解它意味着什么。背景介绍Qubit是一款客户体验管理平台。Emirate和Topshop这样的企业，就用我们的软件来追踪、分析和管理与客户的互动。如何使用呢？比如说你有一个电商网店，出售游艇观光线路，但人们很少购买你的旅行线路。这有无数种可能，但你能做的都做了。你已经看了数据分析，知道很多人在下单页面离开了。他们就是不点“购买行程”。为什么呢？你也找公司决策者聊过，又做了一些用户研究，了解到用户并不愿意花599英镑购买一段旅程。这太贵了，他们无法立刻决定购买。决策者建议 ...继续阅读 (11)

oudate: 2016-03-09 12:53status: drafttitle: 日志模板url: templateurl 3539[国外设计第162期]原文链接：http://www.creativebloq.com/netmag/5-rules-visual-direction-interaction-design-31514304作者信息：Armen GhazarianI am a UX consultant from Armenia with a big passion for sleek and usable digital products. You can always get in touch with me@armen_ghazaryanandGoogle+andWebsite. ...继续阅读 (5)

[国外设计第161期]手势操作，是通过手指轻微移动来让用户操作应用。触屏界面提供了许多自然的手势，比如点按、滑动、双指缩放。但这些交互方式不像UI控件，通常对于用户是不可见的。除非用户事先了解手势存在，否则他们并不会尝试使用。如何加入隐藏手势呢？好在有许多视觉层面的交互设计技巧，可以让用户了解这些手势。首次打开时的教程和引导页在手势为主的应用中，教程和引导页相当常见。许多情况下，在应用中加入教程意味着向用户说明、解释界面。但是，UI教程并不是阐述应用核心功能的最简洁方式。这种方式存在两个问题：如果你要给产品准备说明书，就说明与用户的沟通还不到位，因为他们可不希望使用前还要读说明书。另一个问题在于，用户不得不记住所有这些新的用法。举个例子，Clear应用一开始会展示7页教程，用户得耐心阅读所有信息，尝试记在脑海中。这个设计很糟糕，因为它需要用户在真正开始使用之前就付出精力。Clear的教程避免使用强制性的多步引导，要试图在操作所处环境中教育用户（这时候用户真正需要相应功能）。几经迭代后，教程可以变成更加平缓的暗示。关注单个操作，而不是试图在界面中解释每一个操作。以Android版YouTube的手势操作指引为例：Android版Youtube这个应用有用到手势操作，但并不是通过教程的方式教育用户。它反而是在新用户首次触发时进行了暗示，每次只介绍一处，而且只在用户进入相关功能时才触发。 ...继续阅读 (14)

[国外设计第160期]简单5步，外加一个冷笑话这篇文章的简介部分，我想了很长时间。设计决策需要同时满足商业与用户需求，但了解真实用户需求也非常重要。为了平息这场争论，下面就要请出本文的主角——用户研究——一种能让设计方案落地并关注用户体验的手段。不过我决定不去谈用研有多重要。我会主要关注如何最大程度体现用研的价值。1. 问对问题人为创造（例如用户画像）是一种手段——而非目标。计划的第一步就是定义目标。希望通过用户研究得到什么？最普遍的错误就是拥有这样的目标：我要为我的应用创造几个用户画像。但用户画像只是一种手段——是到达终点的一种方法——这种研究中的人为创造可以帮助我达成真正的目标。我希望得到的是什么？最终目标是什么？可能会是这样：我希望创造有史以来体验最棒的应用。这也是没有意义的。这就偏得太远了，虽然热情和信念值得赞扬，但这个目标过于抽象，野心太大，无法验证。我该做的，是提出一个可以通过用户研究来回答的问题。这得是实实在在能够产出可行结果的方法。试试这么说：我在应用中引入了一套新的付款流程，我想看看用户是否理解，能否更轻松完成任务。是的，这就是可以验证的问题。问对问题可以总结为以下几点：关注结果，而不是产出物。实在的问题对应实在的答案。研究中的人为创造只是到达终点的一种手段。2. 选对研究手段单向镜的原则：安静、关灯、关闭手机。现在我已经有了一个问题，我可以与研究员一起决定最合适 ...继续阅读 (23)

[国外设计第159期]2016年是对话式设计之年。消息应用正以惊人的好评度和参与率，占领世界和app store的排行榜。每个社区产品、应用市场、点播服务、约会应用、社交游戏和电商产品，为了提高好评度、参与率和销量，都已经或即将加入消息功能。有大量关于对话式UI的讨论，还有这种人机对话模式如何通过简单的指令和文字反馈（偶尔配合照片），将消息或语音交互融合在一起。虽然我很喜欢文字和照片，但它尚有非常广阔的探索前景，可以在对话式界面中加入丰富的图形界面元素。这点有些讽刺，因为1986、1996、2006年也是对话式设计之年。想知道对话式UI会走向何方，我们就应该回到这些历史时期。命令行，又称作原始对话式界面似乎我们都见过这些界面。命令行正是最初的对话式界面。输入上下文指令，敲回车，电脑就会执行命令，并且打印出答案。输入和输出都是文字。有时候通过非常原始的方式，你能看到各种符号组成的表格或ASCII码图片。这是文字媒介的一种极具创造力的用法，但它本质上还是文本。Linux命令行仔细想想，这是不是很像一场互动对话，人告诉电脑做什么，电脑执行，然后回来汇报结果，或者提出新的问题，得到回复后才能继续任务。命令行最大的缺陷在于，你必须准确知道应该输入什么，或者让电脑给你提供选项。要记住所有这些命令，对多数人而言要求太高，这时的电脑还不够平易近人。即使早在那个年代，消息应用就已经存在了，因为人们不 ...继续阅读 (13)

[国外设计第158期]插画来自Crafticons培养探索未知的心态（持续）学习用户体验是最需要技巧的事情。因为这不是标准教育中的某个正式课题。它总是以某种神秘不可预测面貌示人，直到你在设计、研发、市场推广（或者其他创意领域）中遭遇到用户体验的具体概念。虽然在用户体验方面有一些基础书籍，还有成百上千的博客文章，研究最具体的设计细节。但关于如何培养心态与思维过程，仍然严重缺乏资源。不同于视觉设计（实践是开拓眼界的关键），我们多数人都能够思考和提出正确的问题，培养自己的用户体验思维。毋庸置疑，成长为一名杰出的用户体验设计师需要时间、投入和努力。但实际上，大多数基本的用户体验，仍然是关于如何提出正确的问题——这点我们基本都能做到。创造高质量的用户体验，包括了提出好的假设，然后检验、持续迭代（通过数据与反馈）。提出好的假设，是用户体验思维、用户体验感觉和学习用户体验的基础。插画来自Crafticons人本主义所有的用户体验设计，都源于人本主义和执行这些操作的人。请别误会，用户体验其实也不仅限于人类。本文的每一章，其实也完全适用于猫猫狗狗甚至斑马——都适用。在下文中，我们对交互作出如下定义：在用户体验中，交互可以定义为人与物之间的一切互动。互动一词非常重要——交互的作用是双向的。一切交互都需要耗费资源。无论是能量、时间或是其他什么，人们总会付出他们认为有价值的东西与某物互动，他们也希望得到同 ...继续阅读 (8)

[国外设计第157期]“错误”时有发生。在App与生活中都会发生。有时是因为我们犯了错误，有时是系统错误。无论错误原因是什么，它们——还有解决方式——对用户体验影响深远。但它往往不被重视，草草处理错误、组织混乱的错误信息会使用户沮丧，最终抛弃你的应用。相反，处理得当的错误提示，能把失败变为惊喜。本文中，我们会讨论如何优化app的设计，来尽力防止用户错误，并建立良好的错误信息。错误是什么？错误（或者说错误状态）发生在app未能完成某个预期操作时，例如：app不理解用户的输入app出错了用户试图同时进行两个矛盾的操作无论是谁引起的，每一种错误对于用户而言，都会成为一种阻碍。好在，设计良好的错误处理能减少这种阻碍。预防用户错误设计过app的同学，应该很熟悉各种限制条件。例如网络状况差的情况下，很难填写表单，而且几乎没法同步数据。要考虑到这些限制，设计更易使用的app，将错误减到最少。换句话说，应该提供建议、加上限制、保持灵活，第一时间预防用户犯错。Twitter因推文的字数限制而出名，他们会在用户达到字数上限之前提出警示。让错误信息统一有效10条可用性启迪中建议，要清晰优雅地表达出错误信息。有效的错误提示应该提供如下信息：明确表达发生了什么描述用户应该如何应对尽可能多地保留用户输入的信息用户输入错误用户输入信息验证的意义在于与用户交流，并引导他们克服困难，应对不确定。输入验证的首要原则是 ...继续阅读 (7)

图片来自Dribbble。文章标题可能有点误导，这里不是要讨论IM产品的体验设计，而是聊天内容本身的阅读体验。数字的强迫症前几天，主管问我要手机号和身份证号，用于制作工作相关的证件。由于是钉钉上沟通的，很简单一件小事，我回了个OK，然后顺手发过去了：××（我的姓名）手机号：186××××××××身份证：360103××××××××××××我盯着发出去的消息，细想觉得有点问题，可以优化一下，于是我又发了一遍：××（我的姓名）手机号：186 ×××× ××××身份证：360 103 ×××× ×××× ××××我说这样便于阅读。主管说小伙子不错啊，强迫症又犯了。然后我回了一句略微有点装X的话：“用户体验无处不在。”并且配上一个咧嘴笑的表情。事情到此告一段落。不过既然硬要把这件事情扯上用户体验，那就不妨深入思考一下吧。仔细一想，发现这真的不是没事找事。而且，我发出去的消息，其实也不算是一件合格的设计产物。把回复消息的形式当成一项设计课题，既然是设计，绝对离不开用户场景和目标。场景很明显，对方在手机版钉钉上查看这条消息。但目标是什么呢？其实我之前并没有问清楚。要我的手机号和身份证用来制作证件，但肯定不是我主管本人制作，她要把这些信息再传递给制证者。通过什么方式传递出去？用纸笔填写还是手机转发？这可有天壤之别！纸笔填写如果用纸笔填写，鉴于任务比较简单，制证者不太可能用上什么逆天的高科技手段来 ...继续阅读 (8)

[国外设计第156期]一切都从一点点小转变开始声势浩大的改版设计总使人望而生畏。有太多变化与未知，有可能会失败。但我们知道，如果想要打造未来，我们就得欣然接受挑战。这就意味着不仅仅是在外观上下赌注，也是在重新想象整个流程。Uber原本的主旨很简单，“按下按钮，搭上一辆车。”你不必设定目的地，也不必选择产品，只要按一下按钮，或者两下，之后就不用管了。随着新功能的增加，产品正在变得更复杂，我们继续坚持原先一个按钮的简洁与速度。但我们意识到，速度并不只在于减少点按次数、简化流程。人们赶着去看电影的时候会选错产品（人民优步，说的就是你）。没有推荐最佳上车点，错失了节省时间的机会。在快速成长期间，要看清前方的路并不容易。所以，要离开起初的舒适区，我们决定在新的Uber体验设计中做一点小转变：“从终点开始”。去哪里？有时候，为了更快地从A点到达B点，我们反而需要慢下来，查阅一番，看看前方有什么。原先Uber只需要你想着叫一辆车，现在我们会问你“去哪里？”一切都由此开始，并围绕它进行。下一步的界面元素飞入画面中，路线动画通向你的目的地。这是一种关注未来的哲学，在乎你的去向。你的每一个操作，都驱使你进入下一步，你每次的行程体验都会得到反馈。直到你准备去往下一个目的地时，它就已经出现了。之前这套体验的最大败笔在于产品选择面板。一个界面包含了……比如说3-4个选项，其实这都不算多，多的都能超过8个—— ...继续阅读 (6)

[国外设计第155期]想象3个用户界面（UI）一起去了酒吧。第1个点了一杯酒，然后又再点了几杯。几小时后，它买了单，醉醺醺的走了。第2个界面点了一杯酒，直接把钱付了，然后又点了一杯酒，又马上买了单，几小时后也醉醺醺的离开了酒吧。第3个界面刚走进酒吧，马上就已经醉醺醺的离开了——它知道酒吧是干什么的，它非常讲求效率，一点时间也不浪费。你听说过这第3种界面吗？它就叫做“乐观派UI”。乐观派UI设计并非乐观地看待页面——至少不仅限于此。（查看大图）我最近参加了许多关于前端开发和用户体验的会议，讨论了心理表现最佳化，我很惊讶，乐观派UI设计是业界一个如此微不足道的话题。坦白说，这个术语本身都没有清晰的定义。本文中，我们来探讨它的基本概念，寻找一些案例，并回顾它的心理学背景。然后，我们讨论掌握这项用户体验技巧的关键。开始之前，我得说，没有任何一个单独的界面能被称作“乐观派UI”。其实它是界面实现背后的心智模型。乐观派UI设计有它自己的历史和逻辑。很久以前很久以前——那时候“tweet”一词还只有鸟鸣的意思、苹果公司濒临破产、人们还会把传真号码印在名片上——网页界面相当单调。其中绝大多数没有一丝一毫的乐观意味。比如一个按钮的交互，可以遵循下面类似剧本来进行：用户点击一个按钮。按触发进入禁用状态。一条请求发送到服务器。服务器返回信息到页面。页面刷新，反映出返回的状态。那个年代，界面与乐观派扯不上 ...继续阅读 (9)

[国外设计第154期]注：本文来自我与Robert Scoble合作的新书《Beyond Mobile: Life After Headsets》中第6章的节选，目前尚未发布。这个章节关注一家你不了解的企业：Eyefluence。由于它只从事B2B业务，你很可能没听过他们。不过，如果未来你有机会用上增强现实或混合现实设备，它的体验就取决于这家公司提供的技术。Jim Marggraff和David Stiehr，于2012年联合创立了Eyefluence，不过那时候他们早已就眼球追踪技术展开合作了。他们开始探索各种途径来为此技术赋予价值，就像它的字面意义那样。眼球追踪技术本身并没什么大不了。它早在100年前的PC时代就出现了。科学家使用纸笔创造了一种研究方法，研究人的大脑在阅读时如何工作。到80年代，这种方式被运用到计算机中。当时，名为Marcel Just和Patricia Carperter的两位心理学家创立了理论，证明眼睛看到事物之后，大脑立刻就开始处理相关信息。除非人类继续进化，否则再也没有什么比这个更快的了。科学家发现了一系列领域能发挥眼球追踪的价值，例如心理学、心理语言学、还有其他健康相关领域。它能让四肢瘫痪者通过点头和眨眼，操纵屏幕上的物体。史蒂芬·霍金的语音合成系统就用了这种技术，让他的思想能够转化为相仿的语音。后来，一家名为Fove的头戴设备制造商，将它引入虚拟现实 ...继续阅读 (13)

[国外设计第153期]设计师常犯的错误，以及正确做法无论是注册流程、多屏分步表单，或者是单调的数据列表界面，表单都是数字产品设计中的重要组成部分。本文会探讨表单设计的注意事项。记住这些只是通用规范，每条准则总有例外。表单应该只有一列多列布局会扰乱用户垂直方向的视线移动。顶部标签顶部标签的表单比左侧标签有更高的完成率。顶部标签的表单也易于移植到移动端。但是，对于有多种选择项的大量数据列表而言，请考虑使用左侧标签，因为它们在一起更易于浏览，能够减少高度，比顶部标签更贴心。把标签与输入框成组排列把标签和输入框贴近排列，确保项目之间留有足够高度，防止用户困惑。避免全大写标签全大写标签更难阅读和浏览。如果选项少于6个，全部展示出来把选项放入下拉选单需要用户进行两次点击，还会把选项隐藏起来。超过5项才使用下拉选框。如果超过25个选项，就要在下拉菜单中加入搜索。不要把默认提示当做标签把默认提示文字当做标签，意在节省空间。但这会导致许多可用性问题，Nielsen Norman Group的Katie Sherwin对此作过总结。纵向排列勾选框（和单选框）以保证易读性纵向排列勾选框能加快浏览速度。行动指令要具有描述性行动指令要描述出具体行为。逐行说明错误告诉用户哪里错了，说明原因。逐行验证要在用户填完一行之后进行（除非填写中验证更有帮助）别在用户打字的时候进行逐行验证，除非这对他们有帮助——例如创建 ...继续阅读 (9)

[国外设计第152期]聊天机器人的惊人潜力在于能够一对多地根据语境分别沟通。我们把这句话分解一下。一对多沟通：现今，有许多工具可以实现一对多沟通。从基本的信件，到电子邮件市场营销，再到社交媒体，这些工具可以轻松触达大量受众和目标群体，一视同仁。但是，这些工具多半不能分别沟通。分别沟通：对大量人群进行分别沟通的方式出现并不久。目前最受欢迎的方式是程序化广告投放，但是最终要以一种有意义的形式触达终端受众，需要大量研究和分析技巧，才能正确运用。语境沟通：我们每天与人交谈时都要这么做。在多数人来说是下意识行为。“未来，聊天机器人会成为交互的标准方式。”当有人问你“我给你拿件夹克过来？”你不会问他哪天拿过来——你很清楚他说的就是现在。你下意识（或许思考过，并且看了下天气应用）意识到天气因素，基于当前对话和环境，给出最适合的回答。我相信，正是语境沟通（动态智能的一种形式）使得聊天机器人成为一种万众期盼的革命性技术。现如今，机器人的语境沟通还无法做到完全合理，但还是有些做的非常不错，而且我相信这种交互会成为未来的标准：https://www.hipmunk.com/hellohttps://pana.com/https://www.google.com/search/about/http://www.mitsuku.com/https://www.getvi.com/?src=kickstart ...继续阅读 (17)

[国外设计第151期]图片来源：Behance设计师都知道，设计不只是为了好看。设计也决定用户如何融入一个产品，无论是网站还是app。这是一种交谈。导航就是一种交谈。因为如果用户不明白使用方式，你的网站或app再漂亮都没用。为什么底部导航如此重要？Steven Hoober在他的关于移动设备使用状况的研究中发现，49%的人依靠一根手指完成手机上的操作。在下图中，手机屏幕上的画面表示大致的触摸范围，不同颜色表示用户能用拇指在屏幕上触及的区域。绿色表示轻易触及；黄色表示需要伸长手指；红色表示需要用户改变持握方式。图片表示单手操作智能手机的舒适程度。图片来源：uxmatters把最重要最常用的操作放在屏幕底部非常重要，因为它们能用一只手指轻松触及。标签栏许多应用遵循这一规律，将底部导航（又称作标签栏）作为最重要的app功能。Facebook的核心功能一触即达，能够在不同功能中迅速切换。Facebook的iOS底部标签栏。底部导航设计的3个关键导航通常是搭载用户的交通工具。底部导航应该承载重要性等同的顶级目的地。这些目的地需要在app的任何地方留有直接的入口。优秀的底部导航设计遵循以下3条定律：1. 只显示最重要的目的地在底部导航中使用3到5个顶级目的地。如果少于3个，请考虑使用标签代替。底部导航避免使用5个以上，因为点击目标相互会过于接近。在标签栏放置过多的项目，让人们难以点中他们的目标 ...继续阅读 (13)