网络编程
位置:首页>> 网络编程>> 网页设计>> When we`re only No.2, we try harder之淘宝节日LOGO互动设计小探讨(2)

When we`re only No.2, we try harder之淘宝节日LOGO互动设计小探讨(2)

作者:健刚 来源:Taobao.com UED Team 发布时间:2010-01-20 10:31:00 

标签:淘宝,节日logo,交互设计

3.淘宝2009圣诞节及2010元旦的LOGO设计

设计六一儿童节LOGO的时候,我们采用的是bonus情节的方法,也就是说,如果用户鼠标不与LOGO发生互动的话,是看不到奖励的故事情节的。而2009圣诞节及2010的元旦LOGO是采用Recall的方法,当动画播放到定格时,鼠标响应区域出现,rollover则重新播放之前已经发生过的某个情节。

以上所有的互动指令都是使用了鼠标Rollover的方式,那么我们是否可以使用Press(左键点击)的动作呢?如果节日LOGO只是出现在首页(像淘宝那样),此时并不作为一个回到首页的救生圈功能,那么Press与Rollover可以是一致的。然而在网络广告中,Press已经默认成为一个跳转的指令,所以在一般只是起展示作用的视觉设计中,用Rollover比Press更容易让受众“安心”。不过如果在设计触摸屏FLASH互动动画时,Rollover又不太管用。

4.触摸屏上的节日LOGO设计

传统的FLASH动画由于可以将鼠标悬停在响应区(Hot zone)上方,所以通常会做Rollover动画来响应动作。(有Rollover动画后,一般不会再设计释放(Release)动画,否则整个点击过程冗余,影响用户体验)。

使用触摸屏时,手指放在感应区上方悬停,并不能触发交互动作,因此绝大部分情况下,是没有Rollover状态的(触摸屏加上WII技术又另当别论)。所以,响应用户点击行为的提示动画会在手指按下(Press)并且脱离接触(Release)的那一瞬间才开始。(注意是Release时才开始,如果在Press时动画就开始播放,手指就会把动画部分挡住。) 另外,比较高级的触摸屏终端支持指尖长按(Long Press)、拖曳(Drag)等行为,设计时可以作为交互动作的补充。

从图例可以看到,触摸屏的FLASH LOGO动画设计与普通的设计差别并不大,除了Rollover动作改成Press(Actually: Release)动作外,最大的区别可能在于当鼠标Rollover时,动画可以不断反复播放,而换成触摸屏时,手指Press一下只能Recall一次,要Long Press才能不断重复Recall的情节。在整个设计过程中,指尖Long Press, Double Click甚至Drag可以产生更丰富的互动行为,从而引出更多的戏剧化情节和视觉效果。当然,这种设计运用在节日LOGO上成本比较高,(设计制作、用户摸索和学习互动行为两方面的成本)。如果运用在较大型的互动动画或者网络广告上,则可以使受众与广告发生更多的互动、从而提高用户的参与度、提升其品牌体验。如果要让消费者实现跳转怎么办?用户体验设计良好的网络广告通常都会把跳转的响应区域单独划分开来。

小结一下, 无论是平面插图、FLASH动画或者互动动画,作为节日LOGO设计的形式来说并没有孰好孰坏之分,关键是能否与应用的环境相搭配、是否与网站的个性和定位相吻合。在此基础上,加上一点点无论是视觉还是交互上的想象力和创意,将使您的节日LOGO在浩如烟海的同质化设计中脱颖而出、为用户带来惊喜、使他们留下良好的品牌印象。When we`re only No.2, we have to try harder.

上述三个淘宝节日LOGO SWF格式下载地址

http://www.jolam.cn/download/Taobao_Logoes_2009_Pack2.rar

0
投稿

猜你喜欢

手机版 网络编程 asp之家 www.aspxhome.com