当信息图表遇上网页设计

开篇：润墨网以专业的文秘视角，为您筛选了一篇当信息图表遇上网页设计范文，如需获取更多写作素材，在线客服老师一对一协助。欢迎您的阅读与分享！

信息图表设计是信息设计的重要分支，其兴起原因是20世纪末期信息技术对平面设计的介入，并最终导致后者的多样化表现。美国学者道格·纽瑟姆在2004年提出，信息图表的种类非常多，图表、图形、地图、图解、表格、列表等均是信息图表的重要形式。在视觉传达设计尤其是平面媒体如报纸杂志等的版面设计中，信息图表以其超越纯文字的新颖、直接的传达特性吸引了众多在繁乱的媒体信息面前不知所措的读者。作为平面视觉向深度层面与互动模式延伸的网络媒体，信息图表也愈来愈多地出现在其主页面设计上，成为网页设计的一大亮点。

信息图表设计最常见的类型为时序性图表，以时间轴图为代表，这种图表以时间信息为基础，描述事件在空间中的先后流动变化。Adam是一个年仅21岁的波兰平面设计师，尤其擅长网页设计及界面设计，在三年的从业经历中，Adam获得了三个国际性奖项，先后完成了150多个设计项目。在其个人网站上（图一），Adam采用时序性图表的方式回顾了自己的设计历程：第一件作品诞生，第一个商业网页设计，第一次同广告公司合作，第一次获专业奖项，第一次成为公司艺术指导等。但在具体性的数据展现上，Adam设计的是独立的六边形图标，粗黑体数字置于六边形图标中心位置，数个六边形图标一字排开，构成并列性数据图表。

通常情况下，饼状图是信息图表中展示数据内容之间比率关系的最有效方式之一。网站更突破一般平面图视觉冲击力较弱的局限，利用网络的流媒体特征，创意出利用平面饼状图向立体饼状图转化的过程来个性化表现数据的形态。Adcade是纽约一家互联网营销机构，网站用大量篇幅介绍了新媒体对于当代企业营销的重要意义和价值，图二展现的是消费者在桌面终端与移动终端使用互联网的数据比率。为了形象而清晰地说明二者关系，同时体现页面的丰富性与生动性，网站设计了饼状图从平面延展为立体的Flas。而在展示公司广告效果测量的理论与实际经验时，网站则采用了柱状图的方式。当鼠标移至此页面时，数个小正方形演变为按照透视原理排列的高度层次不齐、明度深浅不一的方形柱，蓝色字体的比率数据呈现在方形柱之间，构成别有趣味的动态化信息图表。

数据是信息的重要形式，但并非信息的全部，很多信息图表可能并非表现具体的数量或比率关系，而是表现空间位置的距离、高度、面积、区域，并将这些内容按照一定比例高度抽象化，形成空间组织模式图，常见的有地图、导视图或器物结构图等。图三是全球知名营销创意公司Asylum在美洲地区的机构分布图。这家公司在美国、墨西哥、哥伦比亚和巴拿马四个国家拥有五间办公室，在整个美洲地区则遍布50家以上的合作组织。网页绘制了大半个美洲的地图，并用黄色、红色在深灰色地图上醒目地标示出直属办公室与合作机构所在的位置，简单而又清晰。

除了时间关系、位置关系、数量关系等信息图表表现内容外，很多信息图表也可用来表现逻辑关系与组织关系。前者展现的是事件的因果关系或者逻辑变化情况，后者则用来展现信息之间整体局部或上下级的从属关系。奥迪汽车“选择奥迪的一百万个理由”品牌宣传网站就采用组织关系图表的样式。奥迪宣称从网络社交媒体及线下销售终端搜集了一百万个选择和热爱奥迪汽车的缘由，并将这些理由用黑色的圆球表现出来，呈现在网站上。一百万个黑色圆球颗粒在网页中有规则的聚集，组成了一辆奥迪汽车的3D透视图。当鼠标点击任一黑色圆球时，其所对应的来自消费者对奥迪汽车的评价便呈现在页面中央。奥迪汽车3D视图可随鼠标移动在页面空间中做360度旋转，也可将视角深入汽车内部或向外拉伸。与其他信息图表不同的是，关于奥迪汽车的评价信息是隐藏起来的，只有浏览者有意识地去探寻时，信息才会暴露出来，动态的信息展露过程本来就充满了趣味性，也更能体现尊重浏览者信息获取的主体意愿。

信息图表是一个可读、可视的复合系统，在视觉内容上体现为文字、图像和数字的创意化与个性化融合，它帮助人们更好地借助特定视觉内容元素系统、显著、鲜明、直接、连贯和全面地转化文本内容，使得信息被重新整合、个性再现。当信息图表介入到网页设计中后，其表现形式便进一步变得丰富和多样，动态、交互等信息表现形态有了施展魅力的基础和空间。这是信息图表设计的网络化与媒体进化，也是网页设计的风格化与个性化。2013c

链接

.cn

兰蔻“小黑瓶”产品升级活动网站。在产品介绍及互动体验环节，设计师借鉴达芬奇著名素描作品《维特鲁威人》的造型创意，以“小黑瓶”代替男性人体，设计了围绕“小黑瓶”的圆形视觉图示，代表“十种年轻印记”的十条文字信息均匀编排于圆形视觉图示周围。

数字设计公司官方网站。这家位于乌克兰基辅市的数字设计机构在网站上按照时间顺序展示了他们所做过的大部分经典作品。网站设计了一个骑自行车、头套纸袋的年轻人形象，随着鼠标的滚动，自行车在页面上左右行进，而其行进的地图就是按时间先后顺序排列的设计作品案例。

锐步新产品介绍网站。网站在介绍锐步三款新鞋产品时，将产品实景图片置于页面中央，采用空间结构图表介绍三款鞋的创新部件，如添加了特殊材料的鞋帮、轻质的鞋跟等。网站采用Flas创意出三幅结构图表依次呈现的动态信息展露效果。

www.opencolleges.edu.au/informed/learningstrategies

开放学院“探索你的大脑”网站。网站设计了一个大脑的3D模型，并用色彩区分开了各个不同的区域。鼠标无操作时，3D大脑图形上会显示出不同色彩的圆点和“+”号标记，鼠标点击此处，大脑对应区域则呈现蓝绿黄红等不同色彩，一旁同时出现介绍该区域名称、功能等信息的图表。

transferwindow.info

转会窗口网站。网站汇集了欧洲主要足球联赛球员转会数据，包括了所属联赛信息、转会球队信息、球员个人信息等。网站设计了一个由优美的弧形线条组合而成的不完整圆形图表，欧洲主要联赛列表肩负着信息内容和网站导航的双重身份。密集的抛物线式线条充满了力量之美，恰似足球运动带给人的激情感觉。