BeFor Web
为网而生 - 关注互联网及移动端产品的用户体验设计

原创翻译

从错误中汲取经验 - 我们在打造Buffer的过程中所学到的 »

呼啸了一夜的狂风到了白天几乎彻底消逝,刚刚还见到阳光映在窗帘上,现在又满眼乌云的样子了。其实想想看,如此荒诞的天气似乎已然要成为常态了吧。

宅起来的第二周还是第三周?没什么概念的样子。只是确定EVA又看了一遍,About Face 3仍在读着,另外时不时的与旧友或同事碰头吃饭,互通有无。有毛,全是无。说正经的,今天的译文中,Buffer的两位创始人为我们带来了一些基于实践的经验总结;一起来看看能够从他们曾经犯过的错误当中学到些什么东西吧: )

这里进入译文。Buffer是一款帮助你在Twitter、Facebook等平台上更高效的发布内容的应用,到目前我们已经有超过50万的用户了。两年前刚刚开始打造这个产品的时候,我们就已经做好了充分的思想准备去面对各种挑战,包括设计开发过程中会遇到的障碍以及可能犯的错误。

我们始终觉得,在项目当中犯错是在所难免的;只要能够从中学到一些东西,这些错误就能引导我们向正确的方向前进。从某种程度上讲,将我们的产品一点点推向成功的也许正是一路上所犯下的那些错误。

行为召唤(call to action)之后是什么? »

周日好天气,猫们轮番在窗口晒太阳,不知他们是因为觉得暖,还是知道自己披着阳光的样子特别好看呢。

起床之前半梦半醒的几乎完全区分不清真实与梦境了。在那里听着nothing else matters,于是我现在也打开在听;梦到回公司和林教授抽雪茄,梦到South Park里的人大摇大摆的走在街上,梦到以前的同事问我数学题,而且在几个间断的梦里都在追问,以至于我真的在努力回忆这事是不是真的发生过,但想来也不会有人来问我数学题这样的东西吧。

一篇关于call to action的文章,我想会有一些同学和我一样能够从中收益的。感觉上和之前一篇关于用户行为及反馈效应的文章有些相似的性质,都是将产品中一些对整体体验有着影响作用的环节或流程抽象出来,结合实际案例进行分析,提出一些实践模式供参考,这样。我们来看看吧。

这里进入译文。包括电商在内的很多类型的网站,其主要目标就是促进用户响应“行为召唤(call to action)”,完成转化。无论是对于下单购物、提交个人信息还是订阅内容,作为设计师,我们不仅要想方设法鼓励用户执行目标操作,同时也要关注行为完成之后的相关环节。

设计有效的“用户行为与反馈效应”循环 »

有些日子没更新博客了,中间隔了一个坏周末的样子。shit happens alright.

今天是正经开始宅在家中的第一天,有些百爪挠心,身心还不大适应叭,一整天站不是坐不是的,眼下依靠些酒精与B.B.King的布鲁斯才略感安心。话说接下来两天便会有面试了,快是快了点,不过我也确实没有做宅上几个月的打算;空闲时间足够自己做做阶段总结、看几本一直没空去读的书就好喽。想想看刚刚进入Web行当的时候,也是这样的时季,终日寻寻觅觅,揣着自己单薄稚嫩的“设计案例”四处奔走,回到家吭哧吭哧的琢磨人家布置的家庭作业...7年过去了,却仍像是能闻到那时空气里的味道一样。

不感了个慨了。呈上本周的译文一篇。最初看到原文时,认为是关于界面当中反馈机制设计的文章,类似“为用户的操作提供正面反馈”这样;读下来发现是相对来说高一个层面的主题;一起看看叭=)

这里进入译文。无论你在设计怎样的产品,总会涉及到“用户行为与反馈效应”这样的循环。很多时候,良好而有效的“反馈循环(feedback loop)”是决定一款产品能否取得成功的重要因素。本文中,我们来一起看一看,怎样通过精心打造的反馈循环对用户行为产生影响。

移动应用的空状态界面设计 »

其实我到现在还不清楚哪天正经过年呢,就知道快了,因为公司里的人走掉蛮多了的样子。不,这真的不那么像过年的时节,天气暖和的好像春末夏初,在天台抽烟时甚至会发现成群结队的小飞虫在翩翩起舞。

这都哪跟哪呢。实际上,无论工作还是生活,似乎任何正处于正常进行当中的事情都会让自己产生“过年之后再认真继续”的赶脚,一些需要上手开始做的事也准备“过年假期里再开始搞叭”这样;自己的一些项目、理想中的作品集、一些要读的书、一些想玩的游戏...大体都是这样,其实我眼下把这篇发布出来之后就拿出几个小时把想做的事情猛做一通也不是不可以,但似乎总是想寻找一个大部头的时间;不知是否是拖延症的借口;实际上我不认为自己有这毛病,真的。打住,我们进入今天的正文,关于移动应用的空状态界面设计;虽然文中的示例都是iPhone应用,不过道理应该与平台甚至设备类型无关。(btw,用微信的朋友们可以添加一下Beforweb了呗,点击侧边栏头上第二个图标就会出现二维码)

“空状态”是指移动应用界面在没有内容或数据时呈现出的状态。长久以来,空状态界面一直是被忽视的,因为设计师们通常会将全部精力集中在怎样更好的呈现内容和数据上,只有开发人员才会比较频繁的与这类相对“意外”的状态打交道。也正是因为这样的原因,空状态界面留给用户的印象大体上就是晦涩难懂的文案以及缺乏视觉设计风格。

要想打造完美的整体体验,作为设计师,我们不能放过任何一个用户有可能接触到的界面状态。空状态界面大致包括三种类型:初次使用、用户清空数据、出错。下面,我们就来一同了解一下这三种情境所对应的相关创意要素与注意事项。

渐进式吸引 - 让潜在用户在实践中了解产品、完成转化 »

阳光明媚的周六午后,窝在沙发里做做博客,微困。下载了一包“我爱我家”,搁电视里在旁边放着;多少有点不和谐的赶脚。这半年,编辑部的故事、过把瘾、封神榜、西游记、我爱我家轮着来,还真有点欲罢不能了,就差看渴望了。年龄暴露的一览无余。

悄悄打个小广告,最近上了个新博客,Be For Apps,平时有的没的随便写几个字,主要用来从设计的角度记录自己平时试用试玩各种应用过程中的体验感受;一直在其微博上做应用设计点评的Chibi猫同学也会在这里一起念叨,比如这篇“美丽说你这是要干嘛”,欢迎有兴趣的朋友们围观呗。

接下来进入本周译文。所谓“渐进式吸引”,也不是什么前无古人后无来者的新鲜东西,作者将这个概念从一些实践案例中提取出来,归纳为一种产品设计和推广思路,蛮值得参考借鉴的。走起叭。

用户访问你的产品推广页面时可以看到些什么内容?通常也就是功能特色啊截屏啊口碑评价啊这些,外加一个或多个行为召唤(call to action)操作。这类传统的产品介绍页面一般都会面临两个挑战:首先,它必须让潜在用户对你的产品产生足够的兴趣,并进行注册或下载;第二,它需要在一定程度上让这些潜在用户对产品的运作方式及使用方法有一个大致的了解,使他们在正式使用产品的时候更容易上手。

不妨试着将这两方面结合起来,引导潜在用户直接在产品介绍页面中通过某种方式试用产品,让他们逐渐对产品的功能特色及使用方法产生认知,从而激发他们自主的执行下一步动作,例如注册或下载——我(英文原文作者)将这个过程称为“渐进式吸引”。

“即将上线”页面的设计原则与创意要素 »

周五抽烟时我说,心里的感觉就像是一个时代结束了。一位同事说,只是又到了开始翻开新的一页的时候而已。是的,的确是这样。

现在耳边放着Radiohead在不插电专辑中翻唱的Wish You Were Here,不知这是一种淡定还是麻木,亦或是大脑自作主张的帮助我屏蔽掉了心中的某些感觉,让我只需安静的处于这一切的现场而忘乎所以。

想到另外一位同事所说:“我真的只想安安心心的做做设计,做自己喜欢的这些东西”...到这里我几乎不知该怎样才能继续写下去了...我有幸能和你们一起度过一段值得珍惜和回忆的时光,我永远不会忘记;我们对得起“设计师”这个头衔,而他们不是。

今天开始在微博里对苟延残喘着的每一天做留念,可我甚至不知道自己是在纪念些什么混账东西。一想到这些就无法停下,这简直要了我的命,接下来还是进入本周译文的正文叭=)

“即将上线(coming soon)”页面是互联网当中一个相对较新的概念,过去很长一段时间里,每当有新产品新业务准备就绪时,今天还什么都没有,转天它就突然出现在线上了。

如今,互联网及移动应用领域的营销推广策略发生了一些转变,要想将产品有效的推入市场,我们通常需要做足“预热”工作。这也正是“即将上线”页面的由来。

你可以在网络上找到很多这方面的优秀设计案例;而今天我(英文原文作者)希望能够和大家一起更深入一步的对“即将上线”页面的设计原则及重要创意要素进行了解和分析。

十条设计贴士,帮你塑造更好的iOS应用整体体验 »

2013年的第一篇,也不知道是不是有什么可以庆贺和纪念的。这个假期没少下雪,印象里在1号之后就没见过太阳的样子了;倒是这样夜晚的时候灯光昏黄的吹吹空调听听B.B.King,还真有那么点迷离。

假期中间回去金山海边爸妈家,温度更低,风雪更大,这种季节没什么人还会到海边溜达了,沙滩上原本那些摩天轮和海盗船一类的娱乐设施也都拆除掉了,彻头彻尾的肃杀荒凉。有意思的是在家里翻箱倒柜找到几本1997至2000年间买的杂志,比如Music Heaven啊通俗歌曲啊这些;拍了照片放到微博上,立刻有朋友评论说我完全暴露了年龄,哈。

这次选取了Computer Arts官网当中的一篇小文章。CA,国内叫做“数码艺术”,记得没错的话我是从2006年3月开始购买的,那阵子算是刚刚进入Web这个行当叭,看什么都新鲜,发现这本杂志之后简直就忘乎所以了,无论是内容还是杂志本身的排版设计都让我无法自拔...不过到了09年之后就不怎么买了,感觉它变了...怎么变的我也说不上,总之不再那么爱了。倒是偶尔会在RSS订阅里发现一点可以读读的小文章,所以这次也算是纪念自己曾经对CA的爱叭。十条设计贴士,帮你塑造更好的iOS应用整体体验。

btw,其实这次的图标我不是很喜欢,冷冰冰的赶脚,不过其他几个备选的还没这个顺眼呢。

50个小时的可用性测试带给我的启示 »

今天下了好大的雪。上海这地方要积雪不是很容易,印象里只有2008年初的那次;更多时候即使漫天飞扬着雪花,最终还是好像下了场雨一样的到处是水。

所以每到冬天的这种时日,就会想到小时候在北方的样子。高三那年入冬之后,喜欢在每个周六的晚上花一个小时左右的时间在外面骑车或是溜达,而且每逢这种时候只听枪花的Use Your Illustion 1,最后在听到Dead Horse或是Coma的时候回到家;若是遇到雪天,则必定是Metallica的黑专辑。走在积雪上面,路上没什么人和车,夜晚很黑,但雪被路灯映照的很白很亮,那样的情景在当时觉得好像做梦一样,如今回想起来却好像可以伸手抓住一样,有种温暖的感觉。

说着说着还有点入神了;此时此刻是现实当中上海的晚间,外面依旧飘着雪,落在地上蛮尴尬的化去了。打住叭,来看这周的译文。原文作者总结了过去一年当中在一些项目的可用性测试里得到的经验收获,虽然有些东西看上去像是老生常谈,但经过实践检验之后所提炼出的要点也许正是我们平时自认为精通但很容易忽略掉的;至少我自己是这样的赶脚。走着叭。

2012年里,我(英文原文作者)在TH_NK里大约花费了50个小时用于可用性测试,其余的时间则主要用来进行实际的设计工作,或是与客户、开发者、分析人员等进行沟通。在这些可用性测试当中,经过对被测者行为的观察以及与他们面对面的交流,我对一些一直以来虽有所了解、但在实际工作中却时常会忽视掉的设计原则有了更加贴近实践的认知,另外也发现了一些从前没有想到过的问题。时值岁末,我将这些经过实践验证的设计要点作以小结并分享给各位,希望能够为大伙来年的工作带来一定参考和借鉴的价值。

关于扁平化界面风格的设计美学讨论 »

似乎真的没发生什么,也就是玛雅人过了个年。本周的更新如约和大家见面,视觉方面的一篇悠悠闲闲的小文章,关于扁平化与拟物化风格的讨论。

我个人对这方面的话题是蛮关注的,偶尔在微博上弱弱的念叨两句,也会有不少朋友来发表各自的看法,确实是大家都蛮关心的设计问题。另外最近看到不少文章观点也都是围绕这些展开的,其中有些比较公允务实,有些则比较偏颇;所谓偏颇,也就是片面表达某种风格一定比某种风格更好,以及好在哪里。说真的,都有一定的道理,都能看出发表论调的设计师的思考和激情。

有人说了你怎么这么没节操呢,你到底觉得哪种好呢?我要说的是叭,在我看来这个事情里的的确确不应该存在哪个强于哪个的争议,因为它根本就不是个非黑即白非美即丑泾渭分明的问题;脱离了实际产品的上下文环境,脱离了产品功能与目标用户群类型之间的关联,所谓好与不好的命题压根就不成立。

说的具体些,远的不讲,单说Beforweb这边的视觉风格,除了每篇文章的图标以外,可以说是彻彻底底的扁平化了(当然,细心的朋友可以在侧边栏标题背景底部发现类似阴影效果的1像素边框,这个不算数...),但如果有人说我是扁平风格的卫道者的话,我会很不开心,因为我只是在自己觉得合适的地方使用这种风格而已。我喜欢iOS里很多拟物拟真风格的界面,最典型的包括语音备忘录、iBooks、iPad里的日历等等,它们的界面让我觉得亲切自然,让我可以在冰冷的电子设备当中找到现实生活的真实感,就这么简单。

表单设计与转化率的提升 »

话说这一周好像就没几天的好天气,目前正在下雨,大冬天也没个暖气什么的...16号了诶,还有一周,希望下周这个时候我们依然可以在博客当中见面。快要到总结过去展望未来的时候了,最近在工作中频繁而剧烈的刷三观,整个人一坐那儿就感觉懵懵懂懂的,一会笑一会愁;我赶脚这日子是到了不变不行的地步了。

说到这到突然想起来,之前在微博上也有求助过,今天再来一发叭:我和一名优秀的UI设计同学做了个小App,东西不大,有点儿意思...卡在开发阶段,希望寻找一名上海本地的iOS开发者共同推进项目;东西不复杂,有项目经验的开发者应该可以搞定;目前确实难以提供实质性的回报,只求彼此有缘对路,一步一个坑的迈向未来。有兴趣的同学可以到我的微博私信一下,或是通过coda7210这个gmail邮箱联系;成不成的大家聊聊交个朋友也好=)  那么开始今天的译文叭,关于表单设计与转化率的提升。

无论是用于注册、支付还是联络,我们总是需要通过表单来获取用户的信息。不幸的是,在现实当中,总会有很多访问者一见到表单就会立刻点击浏览器上的后退按钮。这里面原因有很多,例如表单篇幅太长、不大友好、不那么值得信任,或是用户还没真正准备好进行交易等等。

这种情况每发生一次,我们就失掉了一个潜在用户。怎样将表单设计的让尽量多的访问者更愿意完成填写,这是设计师们必须面对的挑战。站在用户的角度,我们可以将问题分为四个方面。

Pages