交互设计实例:sohu的widget开放平台的气球设计

曾经在sohu的开放平台上做过一些小的widget,其实这些widget已经是很久以前的事了,只是最近在看站点访问量时,还是想应该把这段记录下来。故事虽然很小,甚至都不算是产品,但是过程也许多少还能给人一些启发吧。

当时,对产品设计很多的思考来自于观察普通用户的行为,但苦于不能验证这些用户的感觉是否到位。sohu的widget开放平台已经建立了一段时间,于是萌生了业余时间做个小的widget,一来测试一下平台的传播性,另一方面可以通过数据更好地提高自己对用户的理解。

一. 飘扬的汽球

背景:

当时正值反藏独的时刻,人们义愤填膺地表达着自己对国家的热爱之情。

在MSN上,每个人都开始注意到了那个红色的爱心,越来越多的人自发的将签名改成love heart,一时间msn上的联系人红成了一片。

同事们和我也受到感染,也纷纷效仿。

分析:

注意到这个有趣的现象,就开始思考为什么人们会同时做一样的事情。依稀有些结论:

首先,在国家发生危难的时候,每个人良知的国人,都会油然而升一种民族责任感,很多人走上街头开始游行,抒发自己对国家的热爱和对分裂分子的愤怒。

但毕竟很多普通人不够愤青,这时就很难将心中的想法表达出来。每每看到新闻报道,“支持祖国”的声音,只能在心中默念。

聊天软件上的签名,正是将这种声音表达出来的最好途径,于是很多人开始更改签名“反对藏独!”。但是自我的表达,并不像在街上游行一样有气势。

就在这时,红心,一个简单的符号,伴随着“让全世界的名字,都飘上红心CHINA”这个激动人心的口号,一下就击中了冲动的内心。

是不是可以把普通人在MSN上的行为,搬到博客上去呢?

通过对MSN现象的分析,可以抓住的几个关键点:

1.有相当多数的普通人,需要表达自己热爱祖国的感受。

2.聊天软件是人们每天都要面对的,很容易促进传播,扩大群体行为。

3.红心China这个符号,有很强烈的代表意义,更符合普通人表达的平和方式。(与愤青相比)

再来看看博客的特点:

1.博客与聊天软件不同的是,用户对博客的装饰需求很高,同时访问不像聊天软件那么频繁。(通过历史widget的添加数据得出)

2.widget开放平台,具备让用户添加内容的能力,同时培养了一部分喜欢玩widget的活跃用户。

通过对比分析,那么将设计提炼为:

1.添加一个装饰性的widget,要非常显眼,让人一目了然。

2.该widget可以很好的传播,最好是在用户看到产生共鸣时,直接进行操作。

3.使用平和的方式表达,不过激。

行动:

1.一想到装饰widget,我就联想到很多用户喜欢添加flash在自定义代码里,然后让动画飘着。很自然的表达形式,那就可以将某个饰品浮动地摆在博客的右上角。

2.使用什么饰品呢?还是红心?如果是一个很小的红心,感觉不够醒目,而且很多人都在MSN加过了,肯定缺少新鲜感。

3.平和。一定是用户经常接触的东西,或者是喜欢的东西。这时很自然地开始观察同事的办公桌,很巧的是,一个桌上飘着的汽球进入了视线。平和~让人喜欢~装饰物~醒目~恩,一切都符合了。

于是开始了这个汽球的制作,我的原则是,既然是业余搞搞,就成本最低。在百度搜了一些汽球图片,发现一个最喜欢的,重新设计,然后请 Alien 同学做了一个flash,有一种飘着的真实感~在汽球上,标着清晰的爱心 China,想来想去,还是这样的文字最容易引起用户共鸣。

 

如果细心的话,会发现刚才设计提炼里的第二条,如何传播还没有解决。

想出了一个很巧妙但也有争论的方法。在这个汽球下面,我没有放大段的说明文字。当时的想法是,如果用户认可这个汽球,如果他对LoveChina有共鸣的话,那么他自然想支持一下。汽球的红线,很容易将用户的视线向下引导,我在这汽球线下面,用了一个“顶”字。“顶”这个字,有很多好处。一很简单直白,二是一个容易引起人的兴趣,三是在汽球下面,可以引导用户可以将汽球顶出去,有一点趣味感。

如何激起用户的立即行动?在这里也使用了一些小小的方法,将添加汽球比作活动更符合之前分析中的参与感。

“红色的气球,飘满在搜狐博客的上空。让我们用真心,来表达对祖国的热爱。告诉朋友们,一起支持LoveChina活动。不要犹豫,马上添加!”

结果:

事实证明,这个小小的汽球在很短的时间内获得相当大的添加量,比我之前想的要多很多。很多网友纷纷评论表示喜欢,给以了很正面的评价。其中,飘浮和顶的设计,也被很多后来的其它widget所借鉴。这个小汽球的想法到实现,前后仅花了三个小时,应该是性价比挺高了。当然这样的小widget有自身的局限性,但在此所实现的作用足够了。

续…

做个widget并不是初衷,当初困惑并促使行动的,是因为没有比较好的测试想法的工具,同时不能很清楚的知道改动一点点所带来的数据变化。

当时做了许多其它的事情,一个是让顶转到自己的页面,页面里添加了数据统计,在简单的一句话介绍后自动跳回到搜狐添加widget的页面。这样一来比较自然,二来可以很清楚各项数据的变化。

在做数据记录的同时,还进行了在线的用户访谈。搜狐开放平台的好处是,你可以知道最近有谁添加了这个widget,同时能够给这个博主进行在线聊天。在不同时期,对于添加的博主进行访谈,了解他们对这个widget的喜好和需要。这样跟平时的工作就很相似了,也非常有效。

对于传播,也有很有意思的数据分析。前300个添加的人,到500以后的疯狂传播,再到上10000~有着明显的速率变化~另外,还有很多有意思的发现,就不一一列出了。 

小汽球的小启发:

1.需求来源于生活,不能为了设计而设计。

    需求是观察生活得到的,很多时候,为了出一个方案而逼自己去思考,可能很难接近真相。因为很多人的世界,是你无法理解的世界。

2.设计不是越复杂越好,而是要恰到好处。

    恰到好处表现在要用最精简贴切的形式,去表达用户最想说的内容。大多数时候,设计并不是来自于你,而来自于我们普通人的生活经验。用户经常使用的功能,不是来自于你的创意,而是对自己某种内心需要的共鸣。当然,艺术家除外。

3.如果确定是用户想要的,那就努力把它突出出来,那是你的竞争优势。

4.公众事件是很容易在短时间引起传播的,可以利用来做一些推广。

时间: 2025-01-24 18:26:25

交互设计实例:sohu的widget开放平台的气球设计的相关文章

交互设计实例:触摸屏手机信息连接和翻页的设计

文章描述:触屏手机网站-炫版交互设计. 触屏手机网站和非触屏手机网站区别在于,前者使用手指点击注重点击体验, 而后者是使用手机物理按键注重选取规则,触屏手机屏幕增大,可以显示更多的内容,但内容密度不宜过大否则不便点击,一般人的食指点击的区域约为7*7 mm 拇指点击区域约为8*8 mm,各大门户也分别推出适应触屏手机的高端版本,下面将会从手机网站最常使用的二个交互功能来分析3G门户炫版和其他门户的区别. 手机网站常用交互功能之一"信息连接": 竖屏状态:(图1) (图1)可见 3G门户

《数字逻辑设计与计算机组成》一 2.8 设计实例

2.8 设计实例 在第1章中讨论过,一个数据通路包括许多电路模块.本节我们将讨论一些常见的但是比较小型的组合电路模块.在第1章中图1-1中所示的"选择器"模块也被叫作多路转换器.其他将讨论的实例包括简单的加法器.译码器和编码器模块.1位加法器,也叫作全加器(FA),产生两个1位输入的和,并输出一个0或1的传位进位.译码模块将数字A(0.1.2等)转换成对应的输出信号(例如,f0.f1.f2等).任何时候都只有一个输出f0.f1等是有效的.另一方面,编码器所做的工作是译码器的逆向工作,将

网站交互设计实例:正确的引导赢得用户的忠诚

文章描述:网站交互设计实例:正确的引导赢得用户的忠诚. 网站上,用和主色调对比很强的颜色或质感很强的按钮吸引用户进行操作,从而促成交易,或浏览相关重要信息. 正确的引导,符合了人机工程原理,优化了用户体验,给用户以易用.互动性.从而使网站给用户留下了美好印象,用户倍感温暖,加大了第二次访问的可能性. 那么反之,不正确的引导--误导,会是一种什么情况.笔者上周曾去南京一趟,便在沪宁城际高铁常州站站台遇到了误导. 笔者是高铁5号车厢,可是在其旁边不远却有一个有明显的动车13号车厢,该标志很明显很清晰

产品交互设计实例:首都机场的点烟器

文章描述:产品交互设计实例:首都机场的点烟器. 首都机场的吸烟室里并不像其他机场那样放几个固定的打火机,而是点烟器,和车载点烟器基本是一样的:先按下加热,加热好后,它会自动弹起,拔出来,里面的电阻丝已经是红红的了,就可以点烟了.上图为车载点烟器,与首都机场的点烟器一样,加热过程中只是被按下去了,未显示进度,也未能形象的表现出"正在加热"的含义. 我走到点烟器的近前,按下,让它加热,然后等待,等了一会儿还不见动静,不知是仍在加热还是出了故障.吸烟室里很多人,感觉自己被别人看着,不会用这玩

交互设计实例:网易邮箱极速3.5版本设计

网易邮箱极速3.5版本历时半年多时间终于与大家见面了. 极速3.5有哪些新特性: 整齐,简洁的首页,能够自适应屏幕的大小提供最佳的显示方式. 一体化侧栏设计,功能更加集中,查找使用更方便. 全新的图标设计,读信时信头信息可以最小化,让你获得更大的阅读空间. 我们做了些什么: 无数次的交互,视觉的讨论和用研的验证. 产出效果图,超过200张. 制定了1套"视觉设计规范",和1套"交互控件规范". 简略讲讲各阶段所做的一些事情: 用研阶段: 极速3.5用研主要做的工作有

一组走心又走肾的优质电商网站设计实例(下)

  目前国内的几家大型的电商平台越做越完善,大有集众家之所长于一身的趋势.反观国外的这些优质的电商网站 ,大多有自己的风格和不同于他人的设计方向.这些个性和坚持让这些网站显得越发的独一无二了.也正是在这样的设定之下催生了各不相同的设计策略和技巧,而这些正是我们需要重新思考.深入学习的地方.另外,本文的上半部分在此:<潮流酷站!一组走心又走肾的优质电商网站设计实例(上)> 21. 提供多级侧边栏 相比于传统的顶部多级导航栏,侧边栏会让页面显得更加整齐易用.Carolina Herrera 的侧边

Axure交互效果实例:提示文本框和拖拽效果

Axure是现在交互设计师必不可少的交互原型设计工具,其实和任何一款工具一样,只要根据常用效果实例多练练,基本就会知道各个控件的使用.今天分享一些在Axure经常用到的交互实例:带提示的文本框和拖拽效果. 实例下载:Axure常用交互效果实例.rar 1.带提示的文本框 将提示信息放置于文本框内是一种常见的交互方式.当文本框获得焦点时,提示文字消失.当文本框失去焦点时,提示文字重新显示出来.现在就让我们看下这种控件的制作方法. 第一步: 从widget库中拖出text field控件.双击控件在

【阿里飞天】阿里飞天平台总架构师唐洪:飞天开放平台

中国最具影响.规模最大的大数据领域盛会--2013中国大数据技术大会(Big Data Technology Conference,BDTC)于2013年12月5-6日在北京举行.数十家领军企业,近七十场主题演讲,不仅覆盖Hadoop生态系统与流式计算,实时计算与NoSQL.NewSQL等技术方向,还对互联网.金融.电信.交通.医疗等创新案例,大数据资源的法律法规.大数据商业利用的政策管制等有深入讨论. 阿里飞天平台总架构师唐洪带来的分享是"飞天开放平台",唐洪认为大数据和云计算可以说

开放平台再袭,超级App成为趋势

近期,"开放平台"再次崛起.但同一个概念,两年前的重心在开放,今天的重心却在平台. 2011年,腾讯经历过3Q大战之后马上宣布了开放,当时对于开放的态度要有多坚决,就有多坚决.到今天,开放已经成为互联网平台的最基本的标签,人们关注点逐渐转移到了平台上,这是因为移动互联网时代到来. 与传统互联网类似的是,移动互联网的开放路径是从应用到平台.但是目前所谓的App开放平台其实还在婴幼期--考虑开发.运营.流量互补等全部环节(应用商店.手机助手.地图类平台是单纯的发行平台),目前称得上玩家的只