湖南白癜风医院 http://pf.39.net/bdfyy/bdflx/140322/4358927.html
日常生活中,我们通过眼睛,鼻子,嘴巴等器官接受信息的传递,然后经过通过大脑把信息理解反馈出去。例如:日常我们通过眼睛看手机新闻,那么手机屏幕作为一个载体只是把信息通过眼睛传递了出来,这就是传递信息。当眼睛把看到的信息传递到大脑,大脑对信息加工处理,这就是理解信息。这两个动作传递信息、信息理解就是今天的主题:视觉交互。一、传递信息

信息的传递主要通过身体的器官接触到信息后,通过神经系统传递给大脑。本文主要讲的是视觉交互,那么这里的传递信息我们就主要讲眼睛信息传递这个领域。

这是京东Web端的首页,模糊处理以后,用户第一眼看哪里?(思考一下)

第一眼被中间黑色的大图片所吸引,接着被左下角的红色卡片吸引,接着看到下面一排图片。

刚才这个我们的浏览顺序就是接下来讲的视觉动线。

为什么我们的视觉动线是这样的?

视觉动线1这块,颜色、形状都特别突出,和周边的差异很大,所以我们刚打开网站就被它给吸引了,接下来我们又看到了左下角红色的卡片,由于红色颜色过于亮丽、突出,所以我们忽略了1右边的模块,直接转向了2这个模块,接着往右看很多图片,就有了视觉动线3这个动作。

那么我们总结出吸引我们视觉动线模块的特点:1、颜色鲜艳。2、形状突出。3、与周边有差异。

在移动端app产品中,有些产品为了吸引用户的眼光,也会运用其他的手法来改变用户本来的视觉动线,吸引用户点击,

例如:左边淘宝的首页金刚区位置,由于“芭芭农场”这个icon是动态的,总是不断的在变化,所以就会很快的把用户吸引过去。这就是为什么产品在活动大促的时候,会加一些动态的效果,这样动态的效果对比静态的图片更加吸引人,用户也就能很快的被吸引过去。

右边这是ins上某位明星截图,只是一些图片的简单排列,相信大家的视觉动线会随着图片颜色、构图等不同原因而产品不同的视觉动线,这就是为什么在某些产品的广告中总是喜欢放一些美女的图片,提高点击率。

通过上面两个小例子我们也可以总结出“动态效果”、“信息敏感”这两个方法来提高改变视觉动线。

通过刚才的几个小例子,总结一下影响我们视觉动线的5种原因。1、颜色鲜艳。2、形状突出。3、与周边有差异。4、动态效果。5、信息敏感。

但是呢,在日常的产品设计中,由于各种原因,我们明明展示了某些信息,但是用户就是看不到,其背后的原因就是我们的视觉动线不太明确,让用户忽略了一些信息。

例如:之前的Airbnb网站。根据我以往的认知了解到Airbnb是一家预定民宿的产品。那么我什么时候才会打开Airbnb预定民宿?周末游、亲子外游、全家旅游的场景的时候是不是打开Airbnb的几率大一些,为什么我会打开Airbnb预定民宿?因为Airbnb这种高品质民宿更多给用户传达了一种家庭的感觉,让用户在外出旅游的同时也能感受到家的温馨,所以在Airbnb最早的网站中,产品为了给用户传达一种家的概念,首页用了一张全家吃饭场景的大图。左侧粉色的Airbnb爱彼迎、与家人一起,在旅行中迎接新年、首单***的按钮,这都是在Airbnb刚确定中文名字以后,给用户传达一种爱彼迎中文品牌感,整个头部的banner组合起来就是为了给用户传达一种我们叫爱彼迎,全家外出旅行可以找我们预定高品质民宿。但是随着大家对爱彼迎这个品牌的认知,有些用户反馈到找不到预定民宿的入口,这就是因为有些用户只顾着看美丽的大图和文艺的文案信息,随着视觉动态的变化把预定这个模块给忽略掉了。

现在我们再打开Airbnb的



转载请注明地址:http://www.jinsihouz.com/hzxpyh/7942.html