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

交互设计

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

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

话说这一周好像就没几天的好天气,目前正在下雨,大冬天也没个暖气什么的...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为例的,但其中的道理同样适用于其他平台。

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

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

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

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

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

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

精益创业 - 用户体验设计的新包装 »

最近一个多月过还是蛮有料的,读了《精益创业》(Lean Startup),然后参加了公司的精益创业产品集市;读了《启示录:打造用户喜爱的产品》,然后作者Marty Cagan过来做了两天的培训,其间也涉及到很多精益方面的话题。记得以前也在微博上念叨过,我很喜欢这种小范畴短时间高密度的信息接收方式,就好像把自己浸泡在营养液里一样。即使无法很快的掌握全部知识,也可以在头脑中培养出思维的惯性。

今天在订阅中读到这样一篇Lean Startup Is Great UX Packaging,涉及精益与UX的话题,也就顺坡下驴的用来做本周译文。篇幅上还算适中;本周也确实有够疲劳,会员卡、预订等几个项目轮番搞,时值周末实在无力做之前“设计师应该了解的iOS应用开发基础知识”那样的长文章了。那么,闲话终了,进入正文。

精益创业(Lean Startup)的基本思路及实践方式,从某种程度上讲,其实就是用户体验设计圈子中的行家们多年来所讲述和提倡的东西。与过去不同,现在人们终于开始懂得去关注这些了。而所谓的精益用户体验(Lean UX)本身也不是什么新事物;类似于“AJAX”,它们都是对已有概念和技术的一种综合运用方式,这些名字本身更像是“包装”。

企业家或新创公司的创始人一直在为“怎样开发优秀产品”这类问题寻找答案,而我们(UX从业者、研究员、可用性专家们)曾经提供的答案多数都过于复杂了。想想看那些只有我们自己或同行才能听懂的黑话(又称行业术语),譬如可用性测试、用户角色、实境调研、眼动追踪等等。

先了解规则,再寻求创新 - 关于iOS应用界面自定义 »

刚刚在微博中傲娇的赞许了一下iOS 6当中图标形式的Action Sheet。我真心不愿意用九宫格这三个字,好傻。地图用谁家的,能不能用汉语调戏Siri,这类问题我个人来讲不是很关注了,没多大需求;倒是这些交互模式当中的小改变更让我觉得惊喜。

这些改变体现出的设计原则依然是我们耳熟能详的那些:针对移动设备特定的使用情境,减少用户对于文字的阅读量(文字按钮的文案)、减小UI元素的排布密集度(文字按钮纵向排布的方式)、充分利用用户对常规应用图标的辨识和记忆能力(邮件 、信息、微博)等等blahblah...iOS Human Interface Guidelines摆在那里,有多少设计师能真正把它吃透呢?不想代表任何人,至少我觉得自己远远没有达到那样的程度。

Xcode正在更新,不知所谓的“SDKs for OS X 10.8 Moutain Lion and iOS 6”当中是否包含制作新模式Action Sheet的方式,希望可以喽;就算不会去做iOS 6 only的应用,看到这样的变化及相应的原生制作方法一点点出现,也是一件非常开心的事。

蛮巧的这个话题与今次选定要做的小译文契合在了一起,多棒的一天。原文当中的一些铺垫就不做过来了,大意是作者的一些朋友把iPhone应用设计想的太简单,把过多的精力放在了业务、市场一类事情上面,却忽略了设备自身属性所导致的交互模式方面的一些特定问题,致使产品自身在细节设计当中具有硬伤blahblah...我们跳过前戏吧,想必看过日本动作片的同学是可以理解的。那么大家都可以理解喽。进入正文。

Pages