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

引导

空状态的设计值得更多关注 »

这一周刷微博的总量怕是超过过去一整年的总和了。那天早上还在想着老朋友老同学们,然后就看到新闻。几天下来,从无序,到明显的正能量导向,到掩盖、封锁,到慢慢的冷却…和历来的灾难尤其是人祸相比没什么区别,只是这次的事情发生在自己已经离开了十四年的家乡。无论背后有些什么,大苦大难只会降临在“普通”的、“底层”的、“不重要”的人身上。

所以整个一周的精神和心情也不是很好。当然恐怕在多数平时能实际接触的人看来我这一周和所有其他时间相比没什么不同因为看上去精神和心情都不像很好的样子。说到这里自己也想笑了。

不会终日通过朋友圈或微博记录生活,一周又一周,自己的小博客就成了生存下去的见证,小小的,里程碑。不知道下一周会发生什么,不知道下一周这样念叨的时候有哪些可以回顾;有点想知道,比如想知道一周之后自己所关心的ta们是不是都好,比如想知道自己一周之后有没有完成工作里具有挑战的事情,一类。

想起来,昨天上午忙好家事躺下迷糊了一刻钟然后做了那么个梦,说起来也完全没有什么特别,就是突然回到了早就被爸妈卖掉了的天津的家里,像高中时那样坐在床边笨拙的跟着Aerosmith的一盘什么磁带里的什么歌在弹即兴。醒来恍恍惚惚的感到温暖和开心。家乡的家的暖。十四年。

花了四段文字瞎念叨,那我就不多说了。本周译文,关于空状态,记得从前也做过一篇来着。有点道理。同时也特别送给一些正挣扎在空状态设计当中的小朋友。下面进入译文。

重新思考移动应用的新手教学模式 »

周六晚间了,似乎还能听到外面滴滴答答的声音;从夜里开始几乎下了一整天的雨吧?

本想在这里详细记录一下今天带斑斑检查身体的事,想想算了;每次自己在过去的博文中看到关于推推的那些记录,心里仍然会难受。倒是要在此再感谢一下在微信里发来关心的朋友们。

话说上周买了瓶葡萄酒留着平时喝两口;不想再依靠威士忌那样久而久之容易伤身的东西了;却发现自己也真是没什么欲望了;倒是每次和同事朋友聚会喝喝清酒觉得越发的舒服。一口口灌烈酒的阶段(再次)过去了,真不是坏事;反正总还会来的,恩?

今天的译文来自Theresa Neil,也就是《移动应用UI设计模式》(O'Reilly大公鸡)一书的作者;本文所讨论的话题也是从这本书延展出来的:作者在实战中运用自己书中归纳出的设计模式,遇到问题,继而开始重新思考...接下来进入译文。

对于设计师来说,设计模式库是很棒的灵感来源,不过常见的实践方式未必是最好的。本文中,我们将一起看一看为什么很多移动应用的新手教学模式并非那么有效,以及我们可以从游戏设计当中汲取到哪些理念来帮助我们选择更加有效的设计模式。

关于移动应用的新手引导设计 »

大晴天真是稀有,赶快写下来;一次一次记录阴郁风雨的天气简直让我烦透了。

终于进入三月,双鱼的同胞们开始此起彼伏的过起生日来,莫名的有种喜感。那,祝双鱼们开心,每日有快乐,天天出太阳。明天就进入last week了(有这说法么?),想想去年这阵子也是工作方面的动作,每天自己窝在家里除了看书就是看书,爽翻;然则今年还要继续为大路而犯愁(第一次没考过)。

哦,昨天终于去看了看中医啊,我就说么,一直觉得身体不爽,西医怎么查怎么OK,医生都烦了,也不愿和我交流沟通...中医就好很多,望闻问切,很有交互感嘛。我也知道这半年各种不开心的事情对自己的情绪和身体的影响,我也知道前两个月那么多烈酒和咖啡有多伤身...从此我要像水一样从容流淌不以物喜不以己悲动若脱兔静如处子...有人看到这里觉得我需要看精神科吗?

那么我说正事吧?前面做过几篇价值观、一篇莫名其妙的洗衣机界面重设计...今次回到移动应用的dirty job当中,搞基层建设。来自Nielsen Norman老爷子Group的小文一篇。下面进入译文。

如今市面上的很多应用都会在初次加载时提供“教练画板”形式的新手引导或教程任务(画着各种使用说明的半透明浮层)。此类引导有时确实可以帮助用户以正确的方式使用产品,不过很多时候也真是没有必要。如果你决定在自己的应用里增加这样的新手引导,那么不妨参考本文提供的一些设计原则,以打造出更有用的引导,而不是让用户只想赶快跳过的障碍。

谈导航栏返回按钮的替代方案 »

呼,又要夜间上新了。其实自己偶尔还会进去关于Be For Web里面看看将近两年前写的博客开篇语。当时的动力现在仍在,当时爱的那个世界现在仍在爱,并且越来越让我觉得自豪;这让我开心了些。周六晚上有在喝冰啤酒的兄弟姐妹吗,有的话我们虚拟碰个杯吧先,周末愉快=)

前面连续做了13篇iOS7预发布版界面设计规范,这周开始重新回到正常节奏,上一些小文。今次的小话题是关于返回按钮的;其实还少谈了一种越来越普及的替代方案,也就是将返回按钮做到底部标签栏或是工具栏最左侧;当然,准确的说,这种情况下容器本身也不能再叫做标签栏或工具栏了。那开始吧。

这里进入译文。我(英文原文作者)爱iPhone5,那多出来的640×176像素的空间非常有用。不过我时常会在点击那个最重要的按钮时遇到麻烦,是的,就是返回按钮。UX设计当中有一条规则,如果某个功能是很常用的,那么它应该被放在最容易点击到的位置上。

49%的移动用户在使用手机时是单手操作的,这就意味着每两个用户当中就有一个会每天多次通过单手来点击返回按钮;算起来的话这可是数以亿计的点击率。如果手机尺寸略大,那么你将不得不使用另一只手来点击返回按钮。我猜这也是很多安卓手机会在左下角放置硬件返回按钮的原因之一;不过这种解决方案也不是最优的,因为在安卓平台中,应用内的“返回上一级”按钮与硬件返回按钮的功能还是有所区别的。

超越按钮 - 谈手势驱动的移动界面设计 »

一周一周的忙成熊样了,以至于周五晚上几乎没有意识到已经周末,以至于今早准时爬起来喂过喵们之后又准备洗漱上路了。btw,儿童节快乐,各位。

进入新公司一个月,做的事情多起来,面对的人多起来,感受也便多了起来;有时需要提醒自己屏蔽一些信号的输入,以便稳定自己的输出;吃一堑长一智,之前两三年经历过的那些让自己在很多时候容易过分敏感,但我想换个角度说那叫做“经验”。

话说又是暗暗的一个周末,对着博客后台,听着Slash在2010年的专辑,琢磨着8月份Metallica过来Live的情况,希望能够像这次一样顺利的买到票。你看,年少时立志此生必看的演出当中,一个已经成行,一个也将要在眼前了;事情就是这么有趣不是么。那么私事就念叨到这里吧,我们来看本周更新喽。

这里进入译文。作为设计师,你也许还记得苹果刚刚发布iPhone时的情景吧,我(英文原文作者)觉得那就像是昨天发生的事情一样。他们将电容触屏技术完整的运用到了这样一个私人化的重要设备当中,这是具有里程碑意义的时刻,同时也改变了整个业界的游戏规则。

若干年之后的今天,连小孩子们都已经习惯了触屏体验,好像这是非常自然的事情,而家长们也会惊叹于他们的孩子可以如此迅速的学会使用触屏设备,包括手机和平板。这也体现出触屏设备及基于手势的交互模式所具有的巨大潜力,它们让移动体验变的更加容易和有趣。

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

横竖屏切换中的界面设计与体验提升 »

之前一周朦朦胧胧的过掉了,想来也没什么可回忆的。这是一种不坏的状态,就像每天早上莫名的空洞,它们都代表着生活和工作里至少还没有很坏很衰的事情让人焦虑。有吗?也许只是在哄骗和宽慰自己。

杂志一般的小译文一篇,适合这样的下午做一做,适合这样的周末读一读。走着。

眼下,智能移动设备内置的加速计的主要作用,就是根据设备的定向方式来决定屏幕的显示模式,也就是在横屏或竖屏模式之间进行切换。这种功能使用户通过简单的动作就可以得到额外的布局模式,期间不需要操作任何界面元素或实体按钮。对于我们来说,这是一个提升产品用户体验的契机,但其中也不乏挑战;我们要充分了解不同定向方式所涉及到的使用情境,并确保两种体验模式之间的差异不会给用户带来唐突的感觉。

几乎所有类型的移动应用都能从显示模式切换功能当中获益。本文将围绕着这一话题,为应用的设计师与开发者们介绍一些可以运用到实际工作中的基础概念,同时还会帮助大家了解那些在实践当中有可能遇到的挑战以及相应的解决方案

Pages