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

用户体验

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

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

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

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

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

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

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

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

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

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

案例学习 - 我们在设计iPhone应用时犯过的错误 »

首先给大伙儿道个歉,上周这边发生了些问题,网站挂了一阵子。一顿折腾,目前算是初步恢复了,不过评论方面的模块还没有打开,需要再捣鼓捣鼓,希望谅解。再次感谢在微博上给我加油和鼓励的朋友们,还有默默关注和支持Beforweb的各位。

另外,上周网站挂掉之前,有位朋友留下一条评论,内容大致是同样喜欢SmashingMagazine的东西,喜欢做做译文一类;由于恢复数据的时候使用了前面几天的备份,所以这条评论蒸发了。希望这位朋友可以看到这些,特别向您道歉了。

那么开始本周译文叭。又是一篇移动应用设计方面的实战案例,我个人很喜欢,真人真项目真事儿,更具实践价值。走着。

今年,我们(英文原文作者及团队)发布了FreshBooks的第一款iPhone应用。从前我们的产品一直是通过Web端应用的方式提供服务的。这次,我们把iPhone应用的设计开发过程看作一张空白的画布,尽力在其中实现一些新的功能概念和设计想法。在这个过程中,我们着实学到不少东西。

一个文本框搞定信用卡相关信息的输入 »

大家周四下午好。打破每周日上一篇译文的规矩,临时来一发。今天刚刚看到的东西,很简短的图文,介绍了一个蛮赞的交互模式,于是把拿来把译文做掉,特别推荐给交互设计师们。走你!

移动应用的设计师们一直在努力降低用户的输入量。屏幕太小了,手指无法精准触摸,输入过程中产生错误简直是家常便饭。输入量是无法被无限制的降低的,很多时候我们更需要考虑的是怎样使输入变得更加容易。

输入蒙板是一种限制内容格式、避免输入错误的方式。举个例子,我们可以使电话号码输入框只接受数字内容,而不对其它任何类型的字符做出响应。所接纳的数字也可以被限定在某个范围或模式当中。不过,输入蒙板的功能不仅限于防错,它同样可以被用在更加“积极”的地方,例如将多项输入内容合并为一个逻辑序列,使用户不必在多个输入框中来回切换。

最近我(英文原文作者)在Square的iPhone应用(Square Wallet)当中见到的输入方式就蛮有意思的,用户在一个输入框当中就可以完成信用卡类型、卡号、有效期、CVV号(卡片背后的3位数字)和邮政编码的填写。

真人之间的交流 - 通过手绘元素提升产品的个性与亲和力 »

这周天气状况很丰满,前面连下三天的雨,周六难得晴了一天,今天又阴晦肃杀了下来。

其实每篇开头这些碎碎念都是在译文做到尾声时根据当时的状况而写下的。这周的译文偏向视觉方面,具体说就是关于手绘手写风格的视觉元素在产品当中的运用方式的。刚刚做到最后“切莫滥用”的部分,就有朋友在微博上针对我零星发出的预告表达了自己的观点,挺好,那我也就顺便再唠叨两句。

对于类似这种“看多了索然无味,中文字的手绘效果识别度又很低,现在看到这样的新手帮助一律立即关掉”的评论,还有之前所收到的一些朋友包括一些“老师”的反馈,我要说的是叭,我挑来做翻译的英文原文,在我自己看来,多数是针对一些比较完美而理想的标准进行的方法论述或经验总结,然则每个团队每个产品所在的实际情况必然是不同的,作者将这些经验见解分享给我们,就是为了让大家在一个相对“正确”相对“理想”的方向上,根据各种实际因素进行调整而落实到实践中。理论陈述、经验分享、方法归纳,这些东西按照理想了来做是没问题的叭?能否以合适的方式加以吸收并以合适的方式运用在你自己的工作中,那是你们自己的问题好吗,亲?只要有点什么不错的设计思路,一群无脑产品就会立刻拿来一股脑的哪哪都给用上,这不是设计思路的问题而是人的问题好吗,亲?

就这样叭,不多聊了,还是那句话,我就是一玩家,我做我喜欢的东西,如果这些文章偏巧能对您的工作学习有帮助,那再好不过,如果不是这样,我也不会觉得有丝毫遗憾的。正文叭。

移动应用的十项设计原则及小提示 »

有好天气和好梦的周末,简直就是对自己能活下来一周的奖励和鼓舞。我看猫,猫看鸟,鸟在晒太阳,简直像画中的情境,美好总是这么不真实。

本周小译文,偏向于设计意识形态的培养。在我个人看来,阅读资料分为两类,一是具体操作指导性质的,另外就是这种建立思维框架、培养思维模式性质的。这两类文章,我基本上是交替看,交替做译文到这边的样子叭。不多说了,进入正文;今次的图标调皮了。

移动设备与传统桌面设备虽然都被成为“计算设备”,但它们之间的差异是显而易见的:移动设备的屏幕要小很多,无线网络链接方面会有不稳定,电池续航能力较弱,等等。这份“弱点”清单可以列的很长,但如果你因此认为移动设备就是降级版的计算机,那同样是错误的看法。

实际上,从其他一些角度来观察,移动设备又是比桌面设备更加强大的。智能手机和平板电脑都是更加个人化的设备,它们会一直陪伴在你身边,让你随时随地都可以接入互联网获取所需的信息;它们身上还有传统设备所不具备的很酷的功能,包括GPS、数位罗盘、加速计等等。

所有这些差异都使得移动设备当中的应用程序在界面设计方面存在很多独到之处。我(英文原文作者)基于在自己的workshop中的工作经验,总结出了移动应用界面设计的十条原则及小提示,在这里与大家分享,希望能够帮助那些还不是非常熟悉这个领域的设计师们建立起一套有实践价值的设计思维框架。

移动应用的成功准则 - 从产品概念到市场推广 »

几天的风风雨雨似乎在这个周日的上午逐渐褪去了,现在整个书房几乎要被阳光铺满了。如果阳光能发出声音,想必满屋子都会是轻盈精巧的小旋律了。

又是一篇我自己非常受用的文章,长是长了点,拿来把译文做掉,分享给大家。特别是后面关于市场推广的部分,我很喜欢;即使在环境如此恶劣的这片土地上,仍然希望至少能够通过自己的一点努力为大家的生存环境带来一丝正能量。进入正文叭。

多数应用产品会走向失败。残酷的现实甚至让很多不抱希望的设计师和开发者们开始认为,只有运气足够好,才能在App Store当中获得成功。

这种想法就像用来缓解失败痛苦的麻醉剂,其实蛮危险的。痛苦不是坏事,痛苦才有救,才能让人看到问题所在。如果我(英文原文作者)的应用失败了,我会首先在产品身上找原因,而不是毫无意义的埋怨那些我们控制能力以外的因素。大家所处的环境是相同的,为什么不想想看来自tap tap tapTapbots的家伙们为什么就能一再获得成功呢?

本文所归纳出的"移动应用成功准则",内容涉及产品概念、设计、开发、市场推广这四个方面。必须承认,在现实当中,我们其实很难完美无暇的将这些准则落实到位,但有一点是肯定的:沿着正确的道路向正确的目标努力前行,你能获得成功的几率将增大很多;我们可以依靠的绝不只有运气。另外,虽然本文当中的相关内容及案例都是以iOS为例的,但其中的道理同样适用于其他平台。

让用户体验设计的前期交付物更加可视化 »

前几天在我的微博里转了一段话:“我们每个人看起来都履历光鲜,在大公司时都能力挺强,工作顺风顺水的...笼罩在大公司光环之下,谁都会觉得自己牛逼。所以,请褪掉任何光环和过去的认知,如果你没有尝试过一次从0而起的创业,你的牛逼脆弱而苍白。”

一直以来,都觉得自己尚未具备真正的创业所需的能力、见解、经验、资源。我想这一认知还算客观务实。不过从来也没有停下在工作之外做些事情,包括beforweb这个博客,还有一些自娱自乐的小项目。这些行为背后的真正动机,我自己也没有完全了解,但有一点很清楚——相比于平日的工作,这些事可以让自己对产品以及与之相关的各种方式方法进行更全面的接触、学习、执行和控制,这是我所要的。

突然意识到再这样念叨下去就要扯远了,还是说正经的叭。本周译文,关于提升设计交付物信息传达能力的话题;之前有些文章也有涉及到这方面。每每看到这样的文章,就会觉得实际工作中那些看似正常正确的事物当中总还是有提升质量和档次的空间;文中的一些做法,觉得叭,可以试试。进入正文我们。

在实际的用户体验设计工作当中,作为设计师,我们的一些产出在信息呈现方式及沟通效果等方面做的其实不算理想,尤其是那些涉及到用户角色定义、信息架构分析、功能流程规划的文档。怎样将这些交付物打造的直观易懂,使它们具有更强的沟通能力,这同样是我们必须思考的问题。

移动应用的视觉美学 - 谈三款拥有高收入的应用产品 »

“状态不好”这类话,无论自己讲给自己,还是他人讲给你听,其实都会产生一系列极其负面的自我暗示效应。一旦身处这样的效应链当中,想抽身便不那么简单了。

看似没头没脑的开场白,不过似乎在过去的一周里,自己就是纠结于这样的思维当中。终于到了周末,顺便多请了三天的假期,在家休整一下,放下那些会让我“状态不好”的东西,做自己喜欢做的事,看自己喜欢看的书,说自己喜欢说的话。不多说,进入今天的译文。今次偏向视觉方面,送给所有可爱的视觉小动物。

当前,智能手机的占有率仍在以前所未有的速度飙升,移动应用市场也在造就着下一代的“科技百万富翁”。苹果的App Store当中的应用数量已经超过68万个,并且正在以平均每天375个的速度继续增长着。

市场的巨大是毋庸置疑的,到处都有很棒的机会。不过一个显而易见的问题在于:成功的移动应用是由什么造就的?

这个问题的答案通常包括创新的概念、才华横溢的设计、坚实而高效的开发等等。其中,“视觉美学”这个要素通常可以对应用产品的成功以及品牌的塑造起到巨大的推动作用。在本文中,我们将以App Store当中三款拥有高收入的应用为例,来看看他们在视觉设计方面都有哪些独到之处。

移动应用设计案例 - 打造初创型产品的用户体验 »

又是天气不错的周末,不冷不热,一年里最舒服的一些时日了叭。感觉自从十一长假结束之后有些东西就变掉了,自己熟悉的很多事情、很多感觉,都像是在头脑里向后退去了一层,要努力去抓才能让它们回来的样子诶。也许只是阳光泛滥了太久的缘故。

好叭。今次的译文是我最喜欢的一类小菜,篇幅简短,实战性强。原文作者,来自Frog的一名交互设计师,讲述了她与朋友在共同设计开发拼车服务Ridejoy的iPhone客户端的过程中所遇到的一些挑战以及相关的解决方案。前戏到这里,进入正文。

Ridejoy拼车服务在Web端上线运营了几个月之后,大家对当前的用户基础有了比较清晰的认知。而对于Ridejoy的iPhone应用来说,我们希望它不仅仅是网站的移植版本,它所能带来的应该是更符合移动上下文环境的全新用户体验。

基于这样的产品思路,我们识别出了三个关键性的挑战:

  • 怎样鼓励驾车者及搭乘者发布更多的信息?
  • 怎样快速有效的帮助驾车者及搭乘者进行匹配?
  • 怎样促进那些已被匹配的驾车者及搭乘者更有效的完成约定?

Pages