BeFor Web
为网而生 - 原创译文博客 - 关注移动、VR及互联网产品的用户体验设计

移动应用

设计师应该了解的Beacon基础知识 - 交互体验解析 »

上周四和小伙伴们去了辰山植物园。然后预订今天和老小伙伴们再次去辰山植物园。然后因为刮风下雨没去成。没了野餐,没了蛋糕,没了小春游。一切讨厌的事情全都怪天气不好。

周末伴随着坏天气很快就要过去的样子这让我觉得很没劲,根本就是任何事情都没什么心情做,站也没建书也没看琴也没弹,完全没有建设性!...话说博客也是正事,继续上周关于Beacon基础知识的话题,开拓开拓视野呗。下面进入译文。

OK,我们已经了解了Beacon是什么,很棒。接下来的问题是,作为设计师,我们能做些什么?我们能在这种技术平台上打造怎样的交互体验?

我和我的搭档Nick Urban决定把这个问题拆解,将Beacon涉及到的交互模式进行分割,以一种清晰的、尽可能非技术化的方式把其中的每个方面都搞清楚。

设计师应该了解的Beacon基础知识 - 什么是Beacon? »

周四,小假期第一天,天气非常之不错,但是生物钟不对,没在休息的点儿上,整个人都觉得有点别扭。眼看着猫猫伸伸梅花爪换了个方向继续盘起来睡。

又想看《三体》了,2012年的这个时候第一次看,去年也是,然后现在又想,这也是生物钟吗?还是这季节这温度这味道让大脑里的什么记忆模式又开始共振了。无从了解。

话说Beacon这事,从第一次听到iBeacon这个词开始就对这个概念特别有好感,也许是觉得太形象太优雅太有情境感的缘故吧。只是平时最多看看新闻消息然后收藏一下,没有专门对待过。昨天看到一个系列的两篇文章,首先介绍了Beacon技术的大致概念和应用情境,然后是针对Beacon设备的交互设计话题,很喜欢,于是决定分两次把译文做掉。希望自己加深理解,同时对大家也有些学习价值吧。下面进入第一篇的译文。

Beacon(中文“灯塔”、“信标”)是一种“邻近系统(Proximity System)”。在该系统中,运行在智能手机、平板电脑、可穿戴或其他计算设备上的应用可以对“Beacon设备”发出的信号进行响应。

Beacon设备自身是一种小巧而廉价的实体设备,你可以将其放置在某些场所,向处于一定距离之内的“响应设备”发送信息。

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

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

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

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

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

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

在正确的情境中向用户获取iOS权限 »

仔细想想,上周什么事情都没有发生,似也无从念叨;这不是最好的状态么?周五和老小伙伴们碰头聚会,吃香喝辣,谈天论地,确是痛快。

说到吃,昨天剪好头发在家门口小店买了炸鸡排,这是一直以来的习惯。自从小理发馆换了老板,体验便一次不如一次;自从炸鸡店换了老板,鸡排便越来越难吃;又想到从前常叫的外卖譬如拉面馆的炒面啊大盘鸡啊还有西北馆的各种风味小吃或是每到夏天都会犯瘾的烧烤,全都不好吃起来。

才一两年的时间,好的都变得不好了,这事儿让我想起《基地》,丹莫茨尔撺掇谢顿研究心理史学时反复强调的衰败衰败...我不觉得自己在生活的细节里过分敏感,感觉正在变坏的,确是在变坏;真讨厌。

话说今天这篇文章,最近几日看到到处在转另外一版译文,相对浓缩一些,也挺好看的;我学我的,我做我的。文中阐述的思路和具体方法,值得各位设计伙思考与参考;“术”未必对所有的产品都适用,但“道”确是皆通一理。下面进入译文。

Cluster是我设计过的第一个iOS原生应用,整个历程让我学习到了很多在过去的Web设计当中不曾考虑过的东西。在Web世界中,你通常只需要创建页面让用户浏览或使用,而在iOS上,除了引导用户下载并使用你的应用以外,你时常需要向他们索取各方面的权限,例如获取地理位置,或是访问通讯录、相机、照片等等。

在设计Cluster的过程中,我们在很多细微却充满变数的交互环节里花了不少心思,以提升用户的满意度及信任感;其中“怎样向用户索取权限”就是我们关注的重点之一。

关于iOS7当中“编辑”与“新增”按钮的布局问题 »

放假便该有放假的样子,哪怕只有一天;书也看得,电视也看得,游戏也玩得,博客也做得,还不止一篇;之前发掉关于智能眼镜应用设计的文章,以及一篇腾讯ISUX招聘信息,今天看到一篇小文,就趁天气好时做一下;不消多看,留意便好的一些东西,其实是在平时工作中常会遇到的小问题。下面进入译文。

初次使用iOS7的时候,我便有些受挫的感觉,其中最典型的问题包括大家所质疑的“这是按钮还是普通文字?”,“这个按钮可点击吗?”一类。在接下来的几个月里,我又逐渐发现细节当中更多的体验问题,例如“编辑”与“新增”按钮的布局。

接下来我们来看看这个问题在以下几款iOS自带应用当中的体现:

提升移动应用的“心理响应速度” »

好雨可劲儿下,皱皱眉头不算英雄好汉。正在看98版水浒。

提到水浒,便能想到三件事情。一是小学大约三年级的时候,去图书馆借书,眼看着那边摆着一套水浒的连环画,便和管理员吆喝着“我要看那边的水许”。二是小学里第一次学到鲁迅的文章,老师提问鲁迅原名是什么,我的同桌小伙伴连手都没举就喊了一嗓子“鲁智深”。三是98年初,正是初三寒假,晚上时常溜去街机房玩真侍魂,正好是央视放这套水浒的时候,老板天天看,我就一边玩一边听电视,记得放到潘金莲害死武大郎那段的时候我正在打服部半藏。如今很多事情,转眼就忘;而这些想起来甚至好像能闻到当时味道的回忆,自己都不知道是怎么印在脑海里的。

雨声越来越响,房间里越来越昏暗;我想干脆钻到被窝里听着“大河向东流...”睡去好了。

之前一周过的相当丰韵。入职新公司,大路夜考,临时抱佛脚啃掉科目四的笔试。想起来也是恍恍惚惚的,过山车一样就到周末了。车学完了,就像了了心病,又像刮出一身的痧,心明眼亮,身轻如燕。我考虑要不要另开个博客专门用于扯来扯去好了。噗。开始说正经事儿,这周不做价值观了,关注一点简单而有意思的设计技巧。下面进入译文。

在移动体验的设计当中,界面的响应速度是我们需要重点关注的。移动用户所处的典型情境通常会使他们的注意力更难集中,耐心更有限。如果交互的触发或内容的加载需要让用户等上太长的时间,那么很少有人会不动声色从容不迫的听之任之。

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

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

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

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

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

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

那些小处见大的设计细节(8) - Facebook Paper专题 »

好冷的一天。早上练大路时,突然见到雪花飘落在车窗上面,便对师傅讲,“下雪了诶”。师傅没有搭理我。

写了上面这段话之后顿了好久。心里沉沉的冷冷的。不想下周到来,也不想情人节/元宵节到来。那么暖的一个春节之后却是一段如此冰冷的日子,工作和生活当中将要开始有reset;不过至少在某些方面看到了“一年之计在于春”的希望,也还不坏。

说着说着要沉下去了,看看正经事情。今次不去收集Little Big Details了,因为正好看到一篇关于Paper的文章,作者从交互的角度汇总了TA所看到的22个设计亮点,蛮适合拿来做“小处见大”的。

这什么Paper的时髦我只在Beforweb里赶这么一次。在同事的手机上把玩了一会,第一感觉,确实惊艳,甚至有些震撼,翻了几个界面就看到一些非常值得学习借鉴的设计(基本都包含在本文中了);但不能不说接下来有些忙乱和无所适从的感觉,好像迷失在它的交互空间里面,或许是不大熟悉各种炫酷的交互方式及动效也未可知。

仁者见仁智者见智,无论如何,我个人的态度:这样的产品具有太强的“榜样”和“标杆”性质;在学习和“拿来”的过程里,也千万不要忽视自己产品的特性、所面向的用户群体、所要帮用户解决问题的恰当方式,等等。无脑的跟风一会毁了自己的东西,二会给业界带来坏风气。我shut up,进入正题噜。哦对了,原文提供了动态gif来演示相关动效,由于文件太大,我只在这边正文里放了较小的静态图;要看实际的动效,你可以点击每段文字后面的“查看动态gif演示”;每个gif的尺寸都蛮大的,会在新标签中打开。

聚焦目标,取舍有道 - 关于设计中的权衡与决策 »

明明是周六,但是怎么都觉得是周日啊,因为明天要上班...眼下看着宰相刘罗锅...上次看还是初一的时候,1996年;故意暴露年龄了噜。

短暂的周末上个新都觉得捉襟见肘,一篇小文,作者讲述了自己在设计一款天气应用的过程中关于灵感、目标、取舍方面的感悟,从产品层面的原则到界面设计层面的思路,一并分享给大家。

这里进入译文。我们最近上架了一款天气应用,Skyline Weather。我是在睡觉的时候想出设计概念的。

很多东西的想法都是从梦里产生的。据说保罗·麦卡特尼就在梦中写出的Yesterday这首歌。又据说他接下来花了几周时间到处跟人打听他们有谁听过这首歌,直到足够多的人都说没有,他才确定这确实是他自己的原创的、从潜意识当中飘忽而来的歌曲。

再据说,伊莱亚斯·豪也是在梦中完成了他的缝纫机发明。他梦见自己被捉到了一个原始部落,原始人把他绑起来准备烤着吃,而他敏锐的注意到原始人使用的长矛在末端都有一个小洞。正是这个细节启发了他,进而搞定了缝纫机的设计方案。

而我自己,则是因为流感而卧床…当时我想看看接下来的天气情况,于是浑浑噩噩的拿出手机,却发现自己难以透过惺忪迷离的双眼在任何一个天气应用当中快速而轻松的获取天气信息,特别是接下来几个小时内的天气变化。我感觉这事儿里面一定有优化和简化的工作可以做。

案例学习 - Grocery List的iOS7重设计 »

周六中午,仍没什么阳光,却也不算阴沉,说冷不冷说暖不暖,我把这种天气叫做棉花天。太棉花了,打不碎揉不开,蒸不熟煮不烂的。

这个博客,就像个日历,一周又一周,一月又一月,一年又一年;有时自己不太敢看以前的东西,特别是开篇的闲言碎语,看到想到,岁月的感觉就出来了;得到的,失去的,纠结的,茫然的...过去的东西却是最安全的,因为都已了然在心;过去的东西又是近在眼前想抓却抓不到的,看的越多,越觉得无力。

棉花天里容易惆怅...说正经的吧。新的一篇iOS7重设计案例文章,和我们之前的Luvocracy改版Commit改版等等相同性质,拿实际产品的重设计工作说事儿,有实战参考价值(更多关于iOS7设计的文章可以戳右边栏里的iOS7应用设计系列)。好呗,开始呗。

这里进入译文。最初在WWDC上看到iOS7的时候,我们看着自己的应用Grocery List,琢磨着:这次的iOS更新够彻底好吗,就像当年iPhone刚刚推出时的那种感觉呢。要让产品适应新系统,简单的修改界面设计是不够的,我们必须重新思考,重新创建,使其能够真正融入新系统的环境当中。然后我们就这么干了。

另外,虽然应用的基本功能不会发生变动,但我们还是决定基于用户的反馈以及我们自己的需求来改进一些流程,例如在过去的版本中,为清单中的条目设置数量需要多个步骤才能实现,在这次的Grocery List 2中,我们会将此类功能简化到在同一屏内即可完成。

Pages