文章标签 ‘设计’ 的存档
-
瞬间的设计(三)
三、不要打断任务流
用户在每选择一个操作时都希望当前的任务是连贯的。页面刷新会人为的造成用户体验——或者说用户心流的中断。
[在由harper pernnial 出版的《心流:最佳体验的心理学》一书中,把心流定义为:当人们进入一种全神贯注的状态时,他会感觉一切都是水到渠成,不费吹灰之力。]
1.三个重要的交互相应参数
Jakob Nielsen提出了关于交互的相应参数,这三个准则30年后的今天依然是不变的。[Miller 1968; Card et al. 1991]
0.1秒 是用户判断系统瞬时反应的时间,意味着在该时间内显示反馈结果用户是可以接受的。
1.0秒 是用户保持不间断的思维流的限定时间,即用户会注意到这样的延迟。如果没有特别的信息反馈该操作超过0.1而少于1秒,他们会比较难以忍受。
10 秒 是保持用户关注当前对话框的极限时间。对于长时间的延迟,用户会想在等待计算机完成期间处理其它事务。所以需要显示计算机将要完成的时间(通常选择进度条或百分比来表示),不然用户期待会大打折扣。

另外,用户的反应时间不仅仅有上限,同时也有还有下限,也就是说他是一个阈值区间。在视觉感知领域,人眼观看物体成像于视网膜上,并由视神经输入人脑而感觉到物体的像。当物体改变时(时间小于等于0.05秒),由于视神经对物体的印象不会立即消失,因此感受不到它的变化。人眼的这种性质被称为“变化视盲” (change blindness)。因此我在上述3个响应参数的基础上,加入了0.05秒这个参数,作为衡量人眼对计算机作出反馈的最小值。[注:也有数据显示0.04秒]

Gtalk

我的 Gmail里通常嵌入gtalk 组件,在我的鼠标移动相关好友名字上时,该好友区域高亮显示,且显示覆盖层显示该好友详情。鼠标移出时该覆盖层消失。这两个过程的覆盖层响应时间都控制在 0.1秒时间内,用于响应用户的反馈。另外,当鼠标悬停后快速(<0.05秒)离开高亮区域时,覆盖层并没有随之消失,这是为什么呢?由上述的用户最小反应时间可以看出,正常情况下用户操作鼠标移开的时间也应大于0.05秒以上,如果小于这个值,多半属于非正常情况下的用户操作行为。比如:手指不小心碰了鼠标一下等。这时候设计师将这种情况判断为防止用户误操作而依旧显示覆盖层信息,想的所么体贴啊!
2.用虚拟的视觉效果当页面加载时间过长时,用虚拟的视觉效果提前给用户展现,来满足他们的预期,是个不错的办法。
live的图片搜索在图片加载过程中将数据正在读取的图片用灰色背景填充而不是显示空白,让用户感觉这个加载的时间不会太长。

3.缓解长时间的操作疲劳

TED是一个关注分享科技、娱乐、设计等领域前沿思想的视频网站。这个网站不单单是我常去汲取灵感的好地方,他们的播放器设计也是我认为做的最细致的。上图正在播放一个教授的演讲,鼠标移动到播放进度条上时我们会发现:当前视频被自动化分出不同片段,你可以hover查看详细文字提示并点击定位到该片段去播放。很棒对吧?该设计充分考虑到用户长时间观看视频带来的疲劳,或者被迫中断以后重新定位的不便,于是将大于16分钟视频做了划分。
四、提供引导邀请
我们有句古话:叫“酒香不怕巷子深”。可是在互联网你如果遵循这句话就会死得很惨。因为我们的服务实在太多了,用户如果找不到他们想要的信息,会毫不犹豫的离开。提供邀请有利于帮助他们建立熟悉的体验。

上图是Absolutely网站的设计师的个人blog,他的blog独特点在于每个页面内容都经过精心设计。而Twitter是他积累思想和灵感的常用工具,因此在页面的首页都大大的显示了“follow”的信息提示和邀请。在这里关于邀请的细节他做了很多尝试,我们不妨来看看。

可以看出,设计师仅仅改变了邀请文案,从之前的“我做什么”改成“你可以做什么”到“你可以在哪里做什么”,就将follewers的百分比提高了2倍。
Google docs
Google docs在“share folder“功能刚上线时,采用了两种邀请方式:一个大大的覆盖层指向“my folders”,帮助说明告诉用户如何使用以及share后的提示信息。并提供以后查看或关闭该邀请提示。关闭后还可以点击页面上方的链接查看详情。

2.动态邀请
动态邀请适合提示用户当前页面包含什么功能。用户一般没有耐心去看文字,利用动态邀请可以在交互过程中吸引用户,并引导他们进行下步操作。
Google map
Googlemap增加的“街景”模式浏览用小黄人引导发现新功能。

案例
我在做淘宝的评价时,也用到了邀请引导。为了让用户发表有帮助性的评论,在输入框运用了文案的邀请提示。同时“店铺动态评分”的星星打分的拖拽属于比较高级的操作,需要告诉用户怎样打分,并用图形将打分后的结果显示出来。


-
瞬间的设计(二)
好的设计绝不是单纯的因为天才的创意或者灵感爆发的一瞬间而产生的,只有设计师在“持续改进”的迭代方法中才能达到好的效果,你必须通过不断的“质疑自己”,在不同的设计种找到缺点,并寻求 更好的方案来改进它。Bill Scott在他的《Web界面设计》里提到了关于富交互设计的六个原则告诉我们如何发现并找到解决的办法,我遵循这些设计原则,通过实例和数据来和大家一起分析一些有趣的瞬间,指导我们的设计。
一、直接操纵原则
直接操纵原则就像Alan Cooper在《ABOUT FACE 2.0》中陈述的那样”:“在哪里输入,就在哪里输出“。例如编辑内容的操作完全可以不用重新打开页面,而直接在当前页面进行就可以了。
flickr是用到即时编辑照片信息的网站。这种方式更直截了当,用户不用切换当前页面就能完成。他们将更乐意为他们照片改名字,那么也就意味着会有更多与照片有关的元数据被记录下来,方便其他用户更好的搜索和浏览。我们先分析一下在这个操作的交互瞬间。

每个交互元素在不同触发事 件下所表现的响应状态。其中橘黄色区域是隐藏在初始状态后面发生的动作和出现的元素。

邀请编辑——默认情况下,标题正常显示。当鼠标悬停在标题上,标题立刻显示黄色背景条和一个“click to edit”的提示条出现,这种邀请提示的好处是——告诉用户当前区域是可编辑的并引导他们去点击。
编辑——单击以后,就立即进入到编辑模式,标题原位置出现了标题表单和”save”“cancel”按钮,用户就能非常清楚他们是在编辑标题。(这种方式的缺点就是多出来的按钮会把照片顶到下一行,造成排版不稳定)
完成——保存方式有很多种,flickr采用了文本的”saving…“临时替换标题,一旦保存完成,新标题就会以非编辑的样式出现。
上述过程中,使用到了一些邀请提示用户完成编辑,只满足了”可操作性“。那么用户怎样才能发现这个功能呢?这就涉及到”可访问性“问题。上述例子只有在鼠标移上去时才能被用户发现是可编辑性的,那么很可能存在一部分用户没有用鼠标移上去而忽略这些邀请。为了让功能更易被发现,可以采用在标题边放”编辑“链接。单击该链接便可触发编辑。(不过这也会影响到页面的视觉干扰问题,如果有过多的功能提示会造成页面噪点过多,可用率下降。)因此,做设计是要权衡易读性和易编辑性哪个重要,做出取舍。
二、保持轻量级
Digg在早期的时候,用户想要推一篇文章,需要经过两步操作。而现在的改进版——只要单击”digg“马山就可以记录一次投票。就因为”单击,结束“容易了一点,带来了用户活跃度和网站点击率的飞速增长,这正是交互轻量级设计的一大作用。
怎样通过简化交互,实现操作更接近内容,从而保证设计的轻量级呢?
1.费茨定律
费茨定律指的是:移动到目标上的时间(T)和移动距离(D)的对数(S)成正比。用公式表示为:
T = a + b log2 ( D / S + 1 )来计算。其中
D:鼠标达到目标的距离
S:目标的宽度(尺寸)我们可以简单的理解为:目标定位越容易,距离鼠标当前的位置就应该越近,目标占用空间应该更大。为了简单,我们可以把功能都集中到一块(如放在菜单栏和工具栏中)。但是这样就违反了费茨定律(找起来会很费劲,距离也会增加)。通过上下文工具把操作放在相关内容附近是不错的办法。[注:上下文工具是桌面右键菜单的web版]
2.实时可见的工具
digg在每篇文章旁边,有一个推举的记分卡,下方的”digg it“按钮要比其他的操作显得明显。鼠标悬停的时候”digg it“的按钮边框变成黑色突出显示,单击”digg“后,投票结果马上记录并在记分卡上实时更新。同时”digg“按钮灰掉不可点,标签文本也变成灰色”dugg“。

和digg一样,豆瓣的打分也是网站的核心功能。因此明确的操作(评级)邀请非常重要。打分后,用户可以随意更改打分分值,对评价作出删除和修改。

shutterstock把加入的收藏的图片总是显示在页面底部的遮罩层中,用户可以随时看到并编辑自己添加的图片。

3.保持关键内容可见
Gmail在页面加载的时候考虑了用户慢速连接的使用情况,减少样式的加载,使用备选方案保证主要内容可见。

淘宝的listing页面一次改版,鼠标悬停在宝贝图片上时,不仅出现大图,同时还在时间维度上对卖家推荐的商品轮播显示,用户同样可以点击下方的小图来选择查看。不仅保证了关键内容可见,同时解决了多信息的展现和交互。

4.只做一件事情
Linkdin消息列表中,用户名承载着两个交互行为:鼠标点击后会跳转到用户profile页面,而鼠标悬停0.5秒以后出现弹出层,显示该用户的简介。如果我们不做0.5秒的限制,就会出现用户在鼠标以上去时立刻显示弹出层,那么很可能会有用户认为这个链接只具备这一种操作功能,而忽略了它可以点击的功能。所以对一个交互行为只赋予它一种功能,多种功能需要考虑用其它方式去实现。

Amazon用另外一种方式来解决多功能的展现。星星打分的信息包括两方面:鼠标悬停展现弹出层显示每颗星的打分人数;鼠标点击后显示评价详情页面。如果把这两个信息同时通过点击星星来实现就会出现上述类似问题。Amazon则是通过增加一个类似下拉的按钮来承载鼠标悬停的交互行为,把点击行为只留给星星。

-
瞬间的设计(一)
瞬间设计是什么?
良好的用户体验,全在于那些完美的瞬间。在第一个瞬间,假设当一位用户从购物搜索结果页面跳转到某个店铺的时候,他此刻可能是想看看这个店铺的风格及其信用;而下一个瞬间可能就开始琢磨如何使用页面中的导航来观看某个宝贝介绍。再然后则可能是询问怎验购买,从哪里注册,者看看商品是否打折,或者尝试联系这个卖家。
若想完成优秀的设计,我们就需要时刻自问:在希望用户做些什么,界面应该如何鼓励他们完成这些任务?每一个瞬间对于完整的用户体验来说,都是不可或缺的一部分,因为他们都有可能加强也可能摧毁用户对某个产品或公司的信心。为什么这么说呢?因为每个人在每时每刻所要完成的任务,对于此时此刻的他而言,那就是重要的任务。
设计师要做什么?
我们的工作不是设计花哨的页面,而是要设计美好的瞬间,确保每时每刻都完美,是设计师的职责和价值所在。在用户进行选择的瞬间,我们要帮助他们做出正确的决定,我们要留意创建怎样的交互行为以及鼓励人们输入,编辑,搜索和共享,激励他们完成所有的他们希望做的事情,我们还应该设计各种手段帮助人们提高工作效率——即使他们天生忘性大,老出错,或者总是三心二意。可以说设计师的工作就是考虑所有这些瞬间——设计一些东西来支持用户达成每一个目标,而不会干扰或者妨碍到他们,同时,把这些完全不同的部分凝成为一个整体。只有这样他们才能相信我们产品,喜欢我们的服务。
从一个例子开始
如何设计美好的瞬间?在开始之前,请大家先回想一下igoogle界面,这个产品大家一定很熟悉,有的设计师几乎每天都用到它。igoogle有很多关于拖拽的操作,而拖拽这个复杂的交互行为需要不同的状态(我们称之为瞬间)来表现其交互事件(Event),yahoo模式库曾对其进行详细的划分,他们分别是:
* 页面加载(Page Load)
* 鼠标悬停在拖动目标上(Mouse Hover Over Drag Object)
* 鼠标按下拖动目标区域(Mouse Down On Drag Region of Drag Object)
* 拖动发起(Drag Initiate)
o 拖动原位置(Drag Over Original Location)
o 拖动离开原位置(Drag Leaves Original Location)
* 拖动重新进入原位置(Drag Re-enters Original Location)
* 拖动有效区域(Drag Over Valid Target)
o 拖动进入有效的区域(Drag Enters Valid Target)
o 拖动悬停于有效的区域(Drag Hovers Over Valid Target)
* 拖动推出有效的区域(Drag Exits Valid Target)
* 拖动非操作区域(Drag Over Invalid Target)
o 拖动进入无效的区域(Drag Enters Invalid Target)
o 拖动悬停于无效的区域(Drag Hovers Over Invalid Target)
o 拖动退出无效区域(Drag Exits Invalid Target)
* 拖动非具体目标(Drag Over No Specific Target)
* 接受放置(Drop Accepted)
o 接受放置起始(Drop Accepted Begins)
o 接受放置结束(Drop Accepted Ends)
* 拒绝放置(Drop Rejected)
* 放置于原位置(Drop On Original Location)此外,拖动的目标模块包含了以下界面元素(Actor),用于展示以上交互事件的种种有趣的瞬间,他们分别是:
* 页面(静态文字,图片)Page (static text, images provided)
* 光标(Cursor)
* 工具提示(Tool Tip)
* 模块(Drag module)
* 模块存放区(Drag module’s Parent Container)
* 模块放置区(Drop Target)针对每个界面元素所表现的交互事件不同,我们就可以得到很多有趣的交互瞬间,如以下表格所示:

细心的你也许会发现,为什么这里只列举了少数的事件和元素,而没有都列举出来。其实这是因为部分特殊的交互事件非常复杂,很难一一列举。仅仅“拖动进入到无效的区域”这个交互事件就有很多种情况,比如:把模块拖动到浏览器地址栏里的情况;把模块移动到toolbar下方时的情况;还有“移动模块到有效的区域”过程中,该有效区内的模块会被挤到其他的区域内,什么时候作为判断来移动呢?尝试后你会发现当被拖动模块超出了原有模块尺寸的1/2时,就会发生跳转等等。
由这个例子我们不难看出要设计美好的瞬间,要做到以下几点:
1.关注分秒的响应(比如说我们要考虑到页面的加载效果)
2.关注微妙的细节(鼠标hover上去的光标显示效果,移到哪里显示等等)
3.想象各种可能性 -
「风格」与「设计」
这是著名网页设计师杰夫·齐曼(Jeffrey Zeldman)给 Adobe 设计中心的「对话框」栏目写的文章。相信国内跟网页设计有关的人——无论甲方还是乙方——读完都会心有戚戚焉。齐曼不但在网页设计领域卓然成家,更写得一手好文章。能读英文者,请移步 Adobe 设计中心网站阅读原文。
文:Jeffrey Zeldman
我的父亲是个业余画家,我的童年就是被他的那些美术书籍塑造的。跟很多小孩一样,我对「纯粹的再现」十分着迷。那些巨细无遗的版画——搏斗中的角斗士,风景如画的村庄,日出时的罗马废墟——每每让我瞠目结舌、口不能言。当时我对艺术的理解就是「画功好」。在那年幼而懵懂的日子里,细节越丰富、蚀刻的线条越密集、树叶越多,这艺术家就越棒。稍后我邂逅了漫画,再往后是美术馆。麦菲·派瑞(Maxfield Parrish)让我想嗑药,也让我明白自己永远当不了画家。保罗·克利(Paul Klee)在我看来是个不会画画的烂艺术家。安迪·沃霍尔是个骗子,因为他的作品都是助手做的。今天我仍不敢说自己明白了艺术是怎么一回事,但我的确知道自己早年那些想法与艺术的本质毫无关系,而仅仅和纯粹的视觉刺激有关。艺术,和迪士尼或马戏团一样,是一种奇观。但敬亭山看多了也会厌,棉花糖吃多了也会腻,我也渐渐从感官刺激升级到了风格层面。史蒂夫·狄可(Steve Ditko)的蜘蛛侠。波普艺术。摇滚乐,还有骚灵乐,然后是朋克专辑的封面。我开始对「风格」上瘾。我分不清好坏,但我知道什么东西够酷。
今天很多年轻网页设计师看待自己这门手艺的视角,和我以前看待流行文化的视角是一样的。要么酷,要么烂。他们错把风格当成了设计,而其实两者是完全不一样的东西。设计是发生于各个层面的沟通。它告诉你身在何处,你现在能做什么,并且让这个「做」的过程尽量方便。风格意味着重复,它是关于「风格感」的沟通。用视觉语汇说,风格是设计的一个方面;用商业语汇说,风格是有关品牌特性的沟通。
风格有时也会传达出设计师对设计主体的厌恶。「这东西太闷了,所以在这儿加了点条纹,这里有个下拉式菜单。总之你要知道以我的能力做这种小活儿绰绰有余。」在这个意义上,风格是一种地下语言,只能在同侪之间传递,和网站的访客或目的无关。的确,这种风格上的花样还有可能与站点的目的相悖。然后,研究网站可用性的大师就会现身,把对癖恋风格造成的恶果归咎于设计。
风格先行的设计师如果有幸能只选那些符合他们的风格偏好的活儿来接的话,也不是不能成功,可惜大部分网页设计师没有这种待遇。不过,他们仍然热衷于将顶尖设计师的风格语汇应用到手头的项目上。于是我们看到做得像锐舞派对宣传单张那样的电子商务网站,或是一个以传递信息为目的的网站充斥着奇怪的导语。(少数这类的导语读起来很炫,但通常是搞错了方向,而且不合时宜。)
万维网曾经像一本电话簿。现在它更像一张设计作品大全。更准确地说,像是二十位知名设计师的作品大全。年轻设计师以他们的弟子自居,反复拷贝他们的风格。视觉设计和「以沟通为目的的设计」之间的界线在这些设计师身上荡然无存。同样,他们也没搞清真正的风格和山寨风格之间的区别:前者源自项目的本质,后者则像是硬接在项目上的义肢。
癖恋风格的网站会令访客迷惑,令用户和为这网站付了钱的公司受害。如果设计师不是从「这个网站是做给谁用的?」和「他们用它来干嘛?」出发,我们只能得到没有意义的美丽外表。正是这种设计令「美」蒙尘——至少在某些圈子如此。
问题在于,我们的社会迷恋表象(并且害怕窥视表象之下的东西)。人们会因为一双球鞋的样子很酷就为它一掷千金,Beck 的歌能用来当广告配乐。在这样的消费文化里,炫和酷就是标价最高的商品。
对于某些客户以及太多的年轻设计师而言,用 Flash 做的多媒体站成了网页设计的同义词。网页上如果没有点带响的和会动的就不会好到哪去——酷就更加别提了。用 Flash (SWF 文件) 做的项目佳作频出,并终于成了各种大奖的宠儿——尤其是那些老牌的高姿态奖项。在那些颁奖礼中,「数字作品」总是被安排在前面,后面才是用上百万美元堆出来的电视广告。评委们对电视广告在概念和制作水准上的期待超过了商业电影。自然,他们也希望网站能有那种将他们掀翻在地的力量。
只要评委们用的是最新版的浏览器、宽屏 G5、奔腾处理器和 T1 专线,那些利用最新技术做出来的突破性花哨实验就能继续得奖。当然,前提是他们必须在视觉设计和编程水平上达到了奖项的要求。我们在此谈的不是烂设计,我们谈的是最高水准的设计,但,这只是设计的一个类别。
我的大部分同事都在设计这样的网站。他们的成就令我惊叹。他们获奖是实至名归,我也为他们喝彩。但我也有我的担忧。
我担忧,因为这一类设计虽然适用于某些场合,但在更多的场合中并不恰当,而它已经成为唯一一种能获奖的网页设计。正因如此,它也成为年轻设计师争相模仿的对象。他们不只在个人项目(很棒的个人项目)里模仿,接商业项目时也是如此。对于后者,这可能会造成伤害。
我担忧,因为分不清风格与设计的年轻设计师学到了大师们的技巧和风格,但未必学会了如何利用网站这一媒介来沟通。《黑客帝国》里的「子弹时间」很棒,但用在纪录片就不合适了。由于大部分网页设计都是为了传递信息(至少本应如此),这种在信息类网站里大批移植他人风格的做法并没有促进这一媒介,相反让它愈发令人困惑。
我担忧,因为有些设计师会永远无法形成自己的风格,更别提针对不同的项目发展出适合品牌形象的风格了。这是因为负责招聘的人往往缺乏批判性的语汇,且会给那些简历看起来很酷很炫的人安排完全不适合的工作。(「以你的才华,完全可以把他们盖了。」)因为,理解品牌塑造、懂得用设计去沟通、知道风格与设计的区别的传统设计师迟早会进入这一市场。届时,那些没有机会理解网页设计奥义的年轻设计师就会丢掉饭碗。
我也为这媒介本身担忧,因为在漂亮的外表和高度的可用性之间存在一大片中间地带,大部分网页都属此类,但这一类的网页设计师却少之又少。专注这种设计的好处也越来越少,因为它虽然令用户愉悦,却无法获得业界肯定,除了一张支票以外,设计师可谓别无所获。(「天,加载速度好快,又那么好用,而且在我爸的老戴尔电脑上的 IE 3 里看都没问题。」你听说过有评委说这样的话吗?嗯,我也没有。)
我最担忧的是用户。商业性的网页开发已经发展了十多年,但用户还是不能轻松有效地找到想要的东西,他们还是不懂,为什么在网页上阅读这么不舒服,而阅读却是大部分人在网上的主要活动。
只要我们的社会把风格置于设计之上,把表象置于实质之上,这种状况就不会改善。当然,每隔四年,当我走向投票箱时,都会想到同样的问题。
-
为生活的精彩而设计—User Friendly2009主题演讲
11月14日消息,第六届用户体验大会(User Friendly2009暨大中华区第六届用户体验大会)今日在上海举行,大会的第二天,美国FIT Associates创始人发表了题为《为生活的精彩而设计》的主题演讲。他表示做产品,不仅仅要关注产品的设计,也要考虑到社会效应。
同时,他还表示“随着时间的过去,我自己对设计的定义也有所改变,那就是必须从深层地了解人们的情绪和感受,必须要做出新的原形,把这个原形在现实生活中尝试使用。再进行更深度的观察。假设如果新的产品改变了,对人们生活会带来什么改变。为生活的精彩而工作,在一开始的时候太关注产品,当然要关注产品,这是我们工作之一,但是要考虑到社会的体系。我们如何让这个东西对社会更有用,也可能是创造一些故事,比如说用这个简单的茶壶喝东西,我们要把整个设计扩大到社群,把自己跟其他爱喝茶的人比较。我们已经在改变世界的旅程上。”
大家早,我知道大家非常辛苦,我非常高兴今天能够到这里来,大家在同一个时间聚在同一个地点,整个世界正在转变,而我们正在参与这个改变的过程中,这个改变也发生在中国。通常我做演讲的时候,会把自己想成是各位的同事,今天我们在这里齐聚一堂,我们要变得更好,这是非常困难的工作。
刚才Bill Moggridge已经描述了技能,今天我们简单的交流一下故事,交流一下技巧,分享一下什么可以行得通。接下来我跟大家分享的是正在发生的改变。我对大家不是非常了解,我今天到这个大会来,大家已经展示对技术的追求,对专业的执著,我认为你们都是领导者,在中国的设计界是领导人的角色。我会跟大家分享图表之类的,而是更加关注世界各地所发生的一些转变,让大家更好的担任领导的角色。
大会是为领导人举办的,你可以把大会学到的信息跟同事分享,对你整个公司、整个组织产生影响。我今天非常感激今天有这个机会,也非常感谢Bill Moggridge刚刚把我们的工作做了一些介绍,并且展示了非常专业的工作,这是一个非常好的承接。
首先我想先讲转变这个主题。我以前头发不是白的,明年我在这个专业已经有30年的经验了,而这个领域正在发生一些转变,我们都是这些转变的见证人,我们都想成为这个转变的一部分。最早期从一些文字转到图象,这个转变会席卷到全世界。但是花了15年的时间才发生这个转变,对我来说我不知道这个转变到底什么时候发生,但是我们都可以感觉到,大部分受到市场发展所驱动的。
技术和业务都是为人服务的,必须在其中发生一个平衡点。大家都可以感觉到世界各地都在发生的,这是钱(图),过去是唯一的驱动力,现在有必须好平衡的考量,从各个考量中取得平衡点。我们不仅仅看金融界http://cimg20.163.com/tech/2008/3/31/20080331145327d1893.png的指标,而是要看看冲击,对环境有正面的冲击还是负面的冲击。我们会考虑到10到20年之后,讨论的议题跟现在不会相同的。
接下来是今天的议题,首先会提到设计领域转变的需要,第二,转变的范畴以及改变的工作和过程。
首先讲的是到底什么是设计,我们讲设计已经非常普遍了,我们对设计的定义可能不一样,但是必须要互相了解彼此对设计的定义。比如说看一下水壶,为什么是蓝色,为什么受把这么高,为什么用这个材质设计,有各式各样的力量去促成这个设计。当你一开始什么是好的茶壶的时候,设计就非常复杂,它的容量、大小到底能不能放到柜子里,装满水的时候会不会太重,到底能不能有效的传导热,材质会不会太贵,会不会对环境造成一些伤害。这些都是我们必须要考虑的问题。我们这个社群里面讨论了很多,比如说把手的设计很高,提的时候不会被烫到。
我们可以在市面上找到各式各样的茶壶,左上角这个是日本茶道使用的茶壶(图),这个茶壶的设计背后有几百年的历史。右边这个茶壶提的时候就非常担心不要烫到手(图)。我们怎么样判断什么样的茶壶是好的茶壶。我们的工作就是了解各式各样的力量,哪些力量可以促成这个设计,必须要设计出哪些特征,找出什么东西能够适应我们的生活。
我简单讲一下设计的过程,首先要了解自己,了解自己周边的世界。这个图可以看到有很多方块(图),箭头就是整个设计的流向,必须要先了解环境,之后建立一些指标、架构,然后再做一个原形,让团队了解。
就像Bill Moggridge讲的,原形可以是个故事,甚至是一个能够使用的软件。我觉得设计中非常重要的是把判断和观察分分开来。要先尽量的看,像海绵一样尽量的吸收,然后再找规律、框架,然后把这些东西赋予到设计的东西。首先要创造,制造出想法,放开心胸去观察,然后再把所有的意见收集起来,慢慢的塑性成一个原形出来。
到底设计怎么做,只要你了解原形,了解原形,不断的重复,就可以做出设计。在设计的过程中,美国三藩市的一个设计师说,设计跟科学的方法是一样有力的,在全世界都学科学,科学的主要目的就是了解世界运作的方式,而设计对于创造新的事物有巨大的影响力。我们要找出问的问题,找出可能解决的方案。问题在于,我们要设计什么?我们设计的东西是对的吗?
我一直提到Bill Moggridge,其实在美国很多大会我站在台上会跟大家说,我们要做以用户为中心的设计,为人而设计,我们讲的都是设计的东西,设计的网站或者是所做的图表,应该要谈谈人。所以今天非常开心能够围绕人的话题。
这是幸福指标,有许多组织都调查人的快乐指数,这是根据人的平均寿命、婴儿死亡率几个指标来做的调查,他们每年在世界各国用同样的方式来人民的幸福指标,这是今年所得到的结果。我们发现中国的幸福指数很高,美国是是最不幸福的国家。这是生态图,大家可以看到美国是红色的(图),红色就表示如果全世界每个人都以美国人的生活方式来生活,我们要提供所有的资源给全世界的人,会需要多少个地球的资源才会达到。中国是黄色的,如果全世界的人都以中国平均生活水平来生活,需要多少地球资源。
这个也是类似的指标(图),左边是幸福指标,右边是GDP,等于是钱和幸福的相互关系,这是一个非常残酷的指标。大家在这里可以看到,墨西哥在左上交,它的GDP最低,但是幸福指标最高。而美国GDP是世界大国,幸福指标而不低,最可怜是卢森堡,他们的钱很多,但是并不快乐。
从这些指标可以看到一些趋势出现,在5到6年的时间,大家可以看到美国的趋势是,9个星球,意思就是说需要更多的资源,而我们的幸福指数更低。中国也是倒向于更多的消费,但是幸福指标在提高。在西欧世界,倒向于更幸福的生活,更小的消费。我们在学校学习的是技能,都是一些具体的东西。在行业里面要促进更多的成长,要不断的创造,但是我们心里知道这并不是创造生活的质量。
每个人都会有不同的见解,大概将近2年前我跟共同创办人花了1天的时间决定公司将来的走向是什么。我们觉得要从公司是否成功转变到持续、长期对生活的影响,这是我们衡量公司是否成功的指标。这是我们两个人共同认为想要达到的目标。对我们来说,我们在追求目标的过程中有一些观察,我并不能告诉达到如何达到这个目标,但是我可以跟大家分享思考经验的过程。我们现在有的系统思考、技巧制作,以及团队设计,都是非常高贵的资产,我们所受到的培训都是急迫需要的。
我们的训练都是以机械的眼光看世界,如果想要理解事物的机理,要理解它的组成部分,比如说理解一个相机的组成部分原理,就可以说我理解了相机。我们在5年间做了很多的项目,使得我们逐渐的意识到,这样的视角是不足够的,所以我们想从生物学的眼光来理解设计的初衷。这种有机的系统是一个网络,是相互连接的。像一棵树一样,每个点都是相连接的,起点是一个地方。
在我们这个工作中,我们经常集中了解一个客户、一个人,这个人是社会群体中的一个点,有他的朋友,有他的家庭。这一点让我们意识到,这个人本身的社会身份是理解这个人的前提条件。另外我们做了一个医学的项目,人用个面具协助他们水面。当时我们的设计是面具是否舒服,会不会影响到他睡眠。当用户拿到这个产品后,带这个面具以后,夫妻间的距离疏远了。为什么会产生这个错误的效果?是因为当时制药公司没有很好的理解人性的需求。
另外一个例子,我们为娱乐公司做了一个项目,当时这个公司特别注意了解客户的需求,了解客户家庭情感的联络。从学校的角度看,从邻里之间的角度看,都是一个整体的网络。如果真正了解客户的需求,必须了解他在社会网络点中的角色。一定要体会他工作会带来什么影响,或者和这个人产生关系所有的因素。
这些所有的因素像网络一样,是一个有机的网络,有机的整体。有这么多的系统有机的复合在一起,又相互流动着,这个对我们来说是很好的启示。我们要回到我们应该接触的那些点,在设计的过程中思考持续性发展的问题,思考到疏通的问题。
比如说一个相机在家庭生活中到底起什么样的作用,而不是去考虑相机作用一个有什么样的机理。亚历山大之前一个设计师,提到一个自然法规的理论,就是说如何用自然的眼光理解一个人身边所有复杂的社会因素,比如说这个人邻里人际关系,或者商务关系。主要的关系网是我们做研究的起点,所以我们把所有的因素做成整体,然后整体的理解项目。在家庭中有什么样的成员,公司中有什么样的同事,大家相互之间联系的方式是什么样的,关系的特点是什么。在家庭里面、团队里面,谁会永远的处在里面。如果从各个角度透析整个关系,就会很好的理解。
再回到我之前研究的数据,想要用这里面的一个想法来解释我们研发出不同的模型,这样对于一个团队,或者对于家庭,或者对于个人都是受益良多的。比如说刚才讲的那个呼吸面具,要考虑夫妻之间的关系,从商业战略的角度讲一定要首先考虑要有利于促进夫妻关系,才会进行设计,因为关系有的时候比事物更重要。
就算你不完全理解,单单看这个图片展现的生命力和阶段,(图),你要么错过了一定的关系,可不可以把这个过程进行分解。我想说,变化的影响是有机的。
接下来讨论一下变化过程中采取什么样的工作。在我的生涯当中我看到这个图片会觉得非常沮丧。左边的图片是有些人需要一些东西,在公司里面知道需要什么东西,然后把这个东西做出来,送到公司里面。但这种逻辑从来没有发生过。就算公司意识到这一点,也会假使这个东西不太适合这个人,可能设计出来的产品不会真正满足人初始的欲求,最后人就非常迷惑,为什么会发生这种情况。
如果公司真正考虑一下人的需求,如果这个团队没有精细的分析这个问题,可能简单的有这个想法,而不是去核查过这个想法。也可能某位经理人有不同的想法,领导的意见是必须按我的法来,别人说什么我都不管。有的时候,在众多的可能性里面,最好的想法被大家忽略了。我们要想对简单的生活产生巨大的影响,我们面对如此的僵局和窘境,这就是很多公司内部面临的问题。所以变革的工作一定是具有社会性和文化性的。
我们经常听到,不可能取得持续、深刻的影响,从一个会议上、讨论中拿不到一些解决方案。右边是一个小理解,然后进行包装延伸,然后拿到公司。这个过程可能根本就不可能实现(图)。
大家想一想树的结构,有可能树的结果不可能直接影响它,如果影响树的整体成长过程,使影响最大化。我们必须从一点一滴的塑造,来凝聚文化上的变化。所有这些变化会帮助我们更好的理解关系在其中体现的因素。
下面是一个简单的关系图表说明(图),分析各种关系所体现的不同特性和特点,在各个团队之间,在团队和高端的领导之间,在平行的结构中,在公司的垂直领导结构中,这里面我不一个个讲,这里面并不讲抽象的东西,而是讲一些实际的东西。
这个是客户的例子,他们是一个新的设计团队,他们需要被理解,但是没有人真正理解他们,没人觉得他们做的事情很重要,因为他们公司里面泛滥很浓郁的工程文化。蓝色的小圈圈没有跟其他的建立很好的网(图)。几年后,他们做了很多的努力,让整个事情更好一些,他们澄清了一些事情,尽了自己最大的努力和竞争对手进行沟通,把他们的设计的力量、优势进行有效的传播和表达。几年以后的努力以后,越来越多的人认同他们的设计理念。所以现在不是一个单独的小圆圈,而是和其他的网络建立很好的关系。最后上升到一个人类学的研究项目中。再过一两年,他们就成长到一个更大的规模。
这里面给我们的启示是,公司思考整体文化变革的时候,刚开始可能是单纯制造一些医疗设备,如何提高家具生活的质量。下面这些小圈圈(图)表现的是一些患者,大的圈圈里面却把单独的家庭消费群体看成是团队一部分,所以我们的设计会基于他们的需求。有的人会说我们是整体的系统,下面覆盖着成千上万的家庭,整个公司的气泡覆盖的范围不仅是办公室,我们覆盖的是成千上万的家庭。所有这些融合在一起,就进入到下面的思考模式。
不再单纯思考产品的技术角度,而是思考所带来的社会效应和治疗效应。从之前想着如何协调团队的关系,现在如何理解终端用户实际的需求,走入他们的生活,设计他们需要的产品。所有这些都源自于对关系的理解,这些改变不是一天做到的,是公司内部和外部的人,一点一滴关系的建立,建立的过程中逐渐认知到这个问题。
这是另外一个客户的故事,是一家汽车公司,从对车子有概念想法开始,到车子在路上跑,到消费者手中,这中间的过程大概是5年的时间。他们每年都会有新的任务,这些我们认为将来会产生的趋势,工作团队必须花1年的时间了解这个趋势。如果达到这个趋势,应该做成什么样的车才能符合这个潮流。这里面有三种颜色,因为他们有三种不同的团队,战略规划、工程、汽车技术。
这是上海(图)上海在中国是一个新兴的城市,这里面有一些特殊的社会潮流,我们应该如何研究中国10到15年的趋势。其实我们没有办法研究,因为我们没法预测,美国人觉得跟中国文化太遥远了,美国人能做的事情就是来到这边,沉浸中国文化里面,尽量深度的观察。大家可以看到灰蒙蒙的天气,很多的污染,这是2008年金融危机之前,哪里都是成长的足迹,有越来越多的建筑,我们经常可以看到拥塞的交通,而这些汽车的设计师就观察这些景象。晚上来消化白天看到的观察,过了4天以后,假设上海的街上有100万辆车,即使全部的车都是电动车,能够减少污染的问题。但是还有很多基础建设的问题没有办法,因为成千上万的人打算买车,对中国人来说有车是一种成就。所以这些设计师,为了要卖给这些人更多的人是错误的概念,对我们的业务也不好,因为我们的基础设施不够。这些人的生活质量已经被过多的汽车影响了,我们的任务是要找一个更有持续性的交通方式,满足每个人对成就的渴望,同时满足交通的需求。
这个团队就把想法做了一个转变,这是一个美国人设计的历程(图),人们先去做,有一个认知的层次,情绪的层次,人们的感受,精神上并不只是宗教,而是人们跟其他人之间所连接的感受,或者是孤立感,人们在乎别人以及被在乎的感受,还有告诉别人自己的感受。刚才Bill Moggridge战展示了一个冰山,下面非常深,这个深度对每个人都非常重要,我们必须要深刻的了解每个人的需求。
所以这个团队在上海之旅有三个不同的圈,原来他们是一个单一的小团队,他们把会影响他们决策的这些人包含进来,变成一个大的整体,所以从不同的思考角度出发。我想这是一个非常漫长的旅程,但是可以马上开始做,可以在街上观察,做一些笔记,可以根据自己的猜测和其他人分享。
随着时间的过去,我自己对设计的定义也有所改变,必须从深层的了解人们的情绪和感受,必须要做出新的原形,把这个原形在现实生活中尝试使用。再进行重新深度的观察。假设如果新的产品改变了,对人们生活会带来什么其他的改变,之后为人们创造出一个具有幸福指数的产品,人们非常渴望生活有不同的可能性。
为生活的精彩而工作,在一开始的时候太关注东西,当然要关注东西,这是我们工作之一,但是要考虑到社会的体系。如果要讨论可持续性,并不只是做产品,而是制造非常多的故事,将原物料做成物品,这些物品进入世界,后来被使用,被回收再利用,最后被丢弃。我们如何让这个东西对社会更有用,也可能是创造一些故事,比如说用这个简单的茶壶喝东西,我们要把整个设计扩大到社群,把自己跟其他爱喝茶的人比较。我们已经在改变世界的旅程上,
不要让这些事情发生,(图),并不是说设计茶壶的时候把所有的情形都考虑到进去。右下角这是生活最熟悉的环节,可以看出喝茶涉及到这么多的情感交流,而我们设计考虑到这些情感交流,这样可以设计出新的生活方式。我们可以作出一些策略性的规划和选择,可以把生活的复杂性规划进来。要改善人们的生活,并不只是关注个人,而是要提升整个生活质量。
最近文章
- 设计师如何搜集资料?
- Google的设计原则
- Axure RP 快速原型制作软件 – 线框图,原型,规格文档
- SEO优化—挖掘关键词3大秘诀!
- 建新网站要做的四个SEO优化
- 教你如何让google baidu收录网站最快最多
- CSS Overflow属性详解
- CSS网页布局中易犯的10个小错误
- 网站结构设计之关键词群布局
- 使用CSS为图片添加的五种特殊效果
最近评论
- 问道推广员 在 当视觉设计师遇上产品经理、开发工程师 上的评论
- AileenFULTON23 在 当视觉设计师遇上产品经理、开发工程师 上的评论
- 物流服务 在 当视觉设计师遇上产品经理、开发工程师 上的评论
- 小区 在 当视觉设计师遇上产品经理、开发工程师 上的评论
- 色播 在 当视觉设计师遇上产品经理、开发工程师 上的评论
分类目录
- SEO (5)
- 互联网 (19)
- 免费模板 (1)
- CSS模板 (1)
- 前端技术 (25)
- CSS+HTML (16)
- JavaScript (1)
- Jquery (1)
- WAP (4)
- 用户体验设计(UED) (50)
- 紫枫生活 (10)
- 设计制作 (7)
- 设计杂谈 (37)
紫枫印迹
| 一 | 二 | 三 | 四 | 五 | 六 | 日 |
|---|---|---|---|---|---|---|
| « 三 | ||||||
| 1 | ||||||
| 2 | 3 | 4 | 5 | 6 | 7 | 8 |
| 9 | 10 | 11 | 12 | 13 | 14 | 15 |
| 16 | 17 | 18 | 19 | 20 | 21 | 22 |
| 23 | 24 | 25 | 26 | 27 | 28 | 29 |
| 30 | 31 | |||||
