网页版微博的模块彩研究
目前网页版微博的界面多以模块化的布局形式为主,界面的彩和风格的设计是微博发挥良好的交流作用的元素之一。文章从网页版微博的组合模块入手,分析目前微博的彩及彩在模块上发挥的功能,并发现彩使微博发挥良好交流作用的一些使用方法。
文章微博承认出轨标签:微博;彩;界面设计
1 网页版微博介绍
1.1 关于微博
微博于2009年底在国内开始兴起,作为一个基于用户关系的信息分享、传播以及获取的平台,蕴含着大量的信息量。由于微博内容碎片化、海量化、层级性等内容呈现方式,使用户清晰的获取信息是微博视觉传达的关键。微博作为当前最流行的即时网络社传播工具,普及度甚广。
1.2 网页版微博的彩
网页版微博的界面视觉设计直接决定着网页与用户能否成功对话,彩无疑是设计中极为重要的一个方面。当用户打开一个网页时,留下第一印象的并不是它的内容或版式布局,而是网页的彩。彩具有容易被人注视和感知的特征,并能够持久地给访问者留下深刻的印象。彩作为网页版微博界面的重要元素之一,对微博如何全面展现用户风格和发挥传播功能发挥着巨大的作用,基于网页版微博的界面按模块化功能划分,文章着重针对界面模块的彩功能进行分析,研究彩在网页版微博中的作用和运用规律。
2 网页版微博的界面构成及作用
网页版微博的界面布局形式有兩种,一种是传统的两栏式(如图1),也是微博最初出现时的界面布局形式,一种是目前的新版三栏式界面(如图2)。二栏式微博总宽为800px,有一级导航和二级导航、发布框、内容区、个人简介区等。目前最流行用户最多的微博界面是三栏式布局,增加了左侧导航和右侧栏各种引导和公告,三栏式界面微博的页面信息量比二栏式界面的微博更大。微博界面中的主要模块是顶部总导航栏、左侧分类和应用导航栏、发布栏、内容区、右侧个人简介和活动推广区。
3 网页版微博界面模块的彩分析
3.1 总导航栏彩分析
总导航栏——总导航栏位于网页版微博界面的顶部,模块较小,并且随着页面上拉下滑都保持位置不变。现有的网页版微博产品的导航栏彩都趋向于透明,映衬出用户个性设置的背景颜,但总导航栏底部的框线会采用明度较高的彩以显示总导航栏与其他模块的区分。总导航栏上除门户网站的logo的彩外,字符和功能图标的彩都运用简洁素雅的纯,一般字符都为白。当总导航栏有消息提醒时,提醒标志的颜一般是明度、纯度都较高的颜,如红、橙等比较醒目的颜。
3.2 左侧分类和应用导航栏彩分析
左侧分类和应用导航栏——位于主界面左侧,调趋向半透明化,半映衬出背景颜。相对于总导航栏的功能导航,左侧分类和应用导航栏的功能导航主要是微博互动的一些功能图标,便于用户交流、转发、评论等。图标和字体的颜以黑白灰变换为主,这样不论用户设置的背景是任何纯度、明度的颜都可以保持图标的辨识度。该模块中的应用导航部分显示的应用图标主要是明快、活泼的亮度较高的颜,这在图标较小的情况下也能辨识度高。
3.3 发布栏和内容区彩分析
发布栏和内容区——该模块是整个网页版微博界面的主要区域,需要展示给用户大量的文字和图片,是微博发挥良好的社交功能的关键。当用户设置背景是纯度较高的暖调或彩绚丽时该模块并不趋向于透明化,彩不随背景颜的变化而改变,以白为主;当用户设置的背景彩是冷调,如黑、深蓝时,该模块会在调整背景的透明度或者饱和度的基础上,产生新的彩,这样既有利于整体界面看起来彩统一,有层次感。该模块中的字符颜会随着背景颜的变化而变化。被转发的微博内容为了显示来自于其他用户的区别,对话框的颜会与该模块的主调稍微区分开来,但也是在背景的基础上调整透明度或者饱和度。
3.4 个人主页界面彩分析
个人主页界面——个人主页主要显示的是用户介绍和用户本人发布的微博,用户可以个性化设置页面顶部的“封面图片”,主界面就是用户个人的微博内容,整个主界面是一体的,也是以白为主或在背景的基础上变换出相搭配的彩。字符颜随着背景颜的变化而变化。
4 网页版微博界面模块彩的运用规律
在功能性方面:微博界面中的字符内容的层次性和状态都是通过彩的变化来表现出来的;弹出的提示信息采用醒目的颜;导航栏的功能图标按键以黑白灰为主,在背景可变的情况下增加图标的辨识度,而由于发布栏一直保持白为主不变,发布栏下面的发布信息相关的功能图标则是多采用纯度、明度较高的暖,给用户轻松明快的感受。在整体性方面:导航栏的颜都是透明;主要界面彩在背景主彩的透明度或饱和度的基础上与背景保持和谐一致,突出整个界面彩的统一性和对比性;主要模块的字符的颜也随着背景颜的变化而变化;模块与模块之间采用高亮度颜的边框线条分割;整体上网页版微博界面的彩运用都会给用户一种趋向于透明、映衬背景的感觉,使各个模块的风格相统一。整个网页版微博界面的彩运用的规律就是变化中保持统一和谐,在彩不变的模块和彩可改变的内容中寻调和,运用无彩系作为不变的彩的同时通过彩在饱和度、透明度上略微的变化来增加界面的层次感和用户对微博的个性化需求。
参考文献
[1]饶简元.网页的彩认知与构建[J].艺术评论,2011(6):38.
[2]王君.网页设计在平面设计中的运用[J].包装工程,2012,33(16):140-142.
[3]刘娟.门户网站微博的传播理念与传播形态比较[J].调查与研究,2011(11):10.
[4]王荦思.信息设计的视觉语言浅析[J].装饰,2005(4):42-43.
[5]Ben Shneiderman,Addison Wesley/Pearson.用户界面设计-有效的人机交互策略[M].北京:电子工业出版社,2004.
[6]林毅惠.设计美学在网页制作实践中的研究[J].福建电脑,2011,27(3):46-47.
[7]危丽丽,过宏雷.从用户体验角度谈网页设计中的彩元素[J].大众文艺,2012(6).
[8]罗仕鉴.人机界面设计[M].北京:机械工业出版,2004.
[9]http://baike.baidu/view/1567099.htm[DB].