ƽ - Ray ma

马平凡 – Ray ma

虽然我们会惹上帝发笑,但生存的前提仍然是思考



03/13/2012
by 马平凡
5 Comments
8,339 Views

对相册产品的思考,以及网易影像隧道的上线

相册产品数据信息图

今天网易相册影像隧道上线,这算是今年负责的项目中第一个上线的产品。在当今各大网站跟风学习Pinterest瀑布流相片展示的时候,作为老牌相片服务商,我们想走一条不同的路。
目前使用网络相册的用户,我们大致可以分为2种类型,一种是纯存储型用户,另一种则是偏分享型用户。

对于存储型用户而言,可以说Photobucket、Picasa、网易相册满足的大部分是这类用户,但面对云存储产品的相继推出,如Google Drive、微软SkyDrive、Dropbox、金山T盘、新浪微盘等这类拼网盘空间的产品,会有吸引他们的点。我也相信,随着云存储产品的兴起,在一定程度上将会稀释现有存储型相册用户的市场份额。

对于偏分享型用户而言,他们会对网站有一定的社交关系依赖,这相对于Facebook相册、QQ空间相册、人人网这类社交网站的相册会有德天都厚的优势。

数据也确实证明,Facebook是世界上用户上传图片最多的网站,拥有600亿张图片,2011年会增加到1000亿张。而图片存储网站Photobucket也只有80亿,Picasa上有70亿,而很流行的图片分享网站flickr也只有50亿张。相关信息图 

将存储型相册和分享型相册这2者的数据进行对比,不难看出,用户会更倾向于分享相片,对于用户而言,相片的分享价值会大于存储价值。

仔细分析这2种类型用户,以及我们网易相册满足这2种用户所需要面对的竞争,会发现我们的突破点 –  相片的展示与管理,理由大概如下:

  • 对于云存储产品而已,存储空间自然会是天然优势,但对于相片的展示上则天然不足。不管是图片、文档都是以文件的形式存储和展示。这对相片的浏览体验是非常不友好的。再一如果开通相片展示,则会增加相片下行访问所带来的带宽成本。另外,相片的盗链、外链都是需要考虑的。
  • 对于社交相册而言,在分享的过程中,用户会更注重相片的展示效果,有更好的相片展示效果,才会更促使用户进行分享。

确定了这个突破点后,我们开始在相片的展示和浏览体验上开始寻求创新和求不同,于是,影像隧道也就诞生。

一路上研究和学习了国外优秀网站,相对如今流行的Pinterest的瀑布流而言,网易相册推出的影像隧道,将是全新的一种相片展现方式,可以说影像隧道打破了所有传统的相片展现形式,使用了最新的前端页面技术,将多张相片进行组合排版、自由搭配。浏览相片的过程犹如穿梭影像时光隧道。同时,最大化的利用屏幕空间,越大分辨率下浏览效果更佳!

相信影像隧道给用户带来的相片浏览体验在国内来说应该是前所未有的!

影像隧道集成了多种相片排版算法,能将用户上传的相片智能组合出非常丰富的多图板式。与此同时,用户还可以通过自由缩放相片大小来改变板式,以及改变相片排序。 在iPad上浏览影像隧道,不管是单张超大图还是多图,浏览体验都非常不错。

 

了解影像隧道: http://photo.163.com/t/intro/
影像隧道 – 网易相册大家庭:http://photo.163.com/diwuma/train/25001/

PS:影像隧道目前上线的是第一版,后续还将会不断迭代。期间有任何问题和意见,欢迎告诉我。



05/04/2010
by 马平凡
7 Comments
9,415 Views

任务走查法

任务走查法 – 这是一种优化现有产品的方法。成本低,见效快。对产品整体上影响小。也是交互设计的一种方法。

这个幻灯片是去年我在公司做的一个团队分享,在之前,每当公司有新产品上线的时候,总缺乏一套较成成熟的产品测试方案。在无意之间拜读了臭鱼的UPA2008讲稿后,细细消化、提炼,才恍然大悟。在这需要感谢臭鱼

通过分享,很高兴得到公司BOSS的认可,并令将其任务走查法打印成海报帖子公司墙面上,让大家天天面对,将此方法牢记在心。在此我和大家分享这个PPT。

“以用户任务为线索,以可用性准则为依据。是的,这个说话很好记,类似“以事实为依据,以法律为准绳。”
“用户任务”是指用户实际使用这个产品时需要完成的任务。这个方法中,需要操作者依据主观判断制定用户任务,而不是通过用户研究。这虽然有可能造成更大的 误差,但同时节约了时间成本。实际工作中,参与这个产品设计的同学坐在一起讨论一下,通常是可以比较准确的描述出用户任务的。
“可用性准则”在这个方法中是指:页面表达原则、信息构架原则、视觉表现规范,这三部分。页面表达原则和信息构架原则就是前面提到的,视觉表现规范是专门 针对视觉设计而制定的。这个方法要处理的问题是现有产品,因此,不同于产品原型,更多了视觉表现这一环,在视觉设计过程中出现的问题也应该在走查中一起发现。” — 臭鱼



04/17/2010
by 马平凡
6 Comments
12,722 Views

一些与时间维度有关的产品设计。

很早就曾想对所见的一些以时间维度相关的互联网产品做一些总结。随着这篇日志的不断推迟。我也越多的发现更多类似的WEB产品设计出现。这是一件好事。我想也该是时候做总结罗列了。

Plurk

在去年年底,发生MSN 中国“抄袭门”- 聚酷抄袭 Plurk事件。足以证明Plurk是有独特之处。Plurk,中文名称为噗浪,是一个提供基于时间轴的可视化微博客服务的多种语言支持的社交网站,类似于twitter,由一个称为A-team的组织创 建。其最大的特色就是在一条时间轴上显示自己和好友的更新,并能在时间轴上对内容进行直接互动。用户还可以自定义时间轴的背景。这样赋予了时间轴的多样性,也满足了用户的个性需求。目前噗浪在港澳台相当流行,中国大陆地区2009年4月起暂时无法使用,噗浪官方已在协商中。
Plurk

Google实时搜索

GOOGLE(en)的最新实时搜索结果也采用了与时间轴的融合,这也是最近我非常喜欢的一个设计。时间轴上峰值条显示的高度与密度都取决于实时信息的量。信息量越大,峰值条高度越高、宽度越密,在这个时间轴通过左右移动蓝色框,可以灵活定位时间域。还有年月日的选择。这样的一个时间轴设计是对信息可视化一种很好表现。另外有一个很有意思的细节设计。当用户刚打开实时搜索结果是最右侧栏会显示相关新闻Top Links,Top Links是来自左边这些更新频繁的博客、微博客、论坛里分享的链接地址,那些最多被分享的链接就会出现在Top Links里。而当用户自定义时间轴具体位置后,Top Links会消失。这样设计可能是考虑信息噪音的影响吧。
google实时搜索

Google百宝箱-时光隧道

去年5月份,Google发布的搜索百宝箱首批推出的包含的时光隧道等,用户只要输入一个简单关键词,百宝箱中的时光隧道就可以根据用户的意图,按网页内容的时间属性重新提炼或者组织,将所有信息按照时间重新排序并呈现在用户面前。相比百度等其他搜索引擎,Google推出的百宝箱,能根据用户搜索查询的不同出发点,提供不同的搜索结果。这是一种极具革新的搜索改变。目前Google考虑到用户习惯,百宝箱默认是关闭。在以后的不久百宝箱将慢慢的在不影响用户习惯的前提下默认打开。

Google百宝箱-时光隧道

Google 十周年大事年表

google十周年的大事记页面,通过简简单单的滚动条+时间轴的结合。展现google从注册域名到成为世界级互联网公司的这10年当中的历史性的一些重大时刻。
Google 十周年大事年表

Digg Labs(365)

通过界面中的时间罗盘。指定某天、月或年。以可视化方式帮助用户轻松捕获热门咨讯。切换年份后,按月份对应的颜色显示10条年热门事件。也可按故事的类别查看。

Digg Labs(365)

flickr clock

flickr clock一个以图片和视频结合时间轴的产品。通过时间轴上的定位可以查看那该时段的图片或视频。时间轴的峰值条高度、密度与宽度,都取决于数据量。
flickr clock

最后,让我们思考一下 – 时间维度的意义。

1、有时间轴的融合内容展现更有空间感、历史感。
科学家有过这么一个构想,说所有的维度都是由时间构成,没有时间,就没有空间。因为没有时间,空间本身的存在就没有任何意义,因为时空本身就是不能分割的整体。根据爱因斯坦相对论所说:我们生活中所面对的三维空间加上时间构成所谓四维空间。
2、另一种阅读、检索信息的方式。
引入时间轴的这种信息可视化设计,对用户来说。阅读信息内容无疑又多一种全新的方式。以时间维度来组织内容、组织记忆是人类一直使用的方法。例如我们历史上的“九一八事变”、“512四川大地震”。。。。

面对信息检索。除了tag、社会化分类、情景式分类以外,如果时间要能结合信息可视化设计,应该也是一个非常好的分类和检索方式。



07/04/2009
by 马平凡
2 Comments
2,551 Views

也说虾米网导航

有段时间没更新博客了。一是为了更新,二是看了kimi对虾米网首页导航的日志。想简单谈谈自己的看法。

kimi觉得虾米网的导航过于复杂、没有把虾米网的核心功能和价值突现出来。

对于虾米网的顶部导航我是有同感,记得有一次我邀请完同事注册完虾米,他竟然一时半会没找着登录入口。

我想这些都只是交互层面的问题。下面开始进入正题

问题一、导航过于复杂、层数过多,进入个人页面在同一个视觉块有4层导航!不是不能有4层,如果能合理控制在3层,我觉得最好。在一这样的四层关系1也并非就是这个信息结构的最顶级,1和2是应该可以属于同一级。区别只是在于1是个人,2是整站而已。

问题二、个人导航分离、不完整、使用不方便。1和2本该就是一个整体。这样分离是为了突出同步微博客和账户?

我觉得可以这样处理,下图中2的“个人设置”可以改成“我的设置”,“虾米账户”可以改成“我的账户”,然后一起归属到1中的“我的”下面。然后1和2合并,统一放到下图中2的位置,和为一层,这样很合理,并且前面中的4层导航也就可以精简成3层。

另外在个人主页增加账户和微博客绑定的简单显示和管理入口。

一点和导航无关的话:如果在豆瓣听虾米!不用装什么插件,直接能听的话,我想虾米网在流量和用户上都将会大大提高。虾米的BD赶紧出动吧,搞定豆瓣。嘿嘿。