文章分类 | 推荐文章 | 最新文章 | 热点文章 | 最新软件 | 精品软件 | 下载排行 | 推荐下载 | 免费看大片 | WPS | 杀毒软件
清风网络
首 页 软件下载 网络学院 数码学院
QQ 电脑入门 游戏 操作系统 图形处理 办公软件 媒体动画 精文荟萃 工具软件 网络编程 程序开发 网络技术 认证考试 网站建设 文章专栏
当前位置:清风网络学院图形处理设计欣赏设计理论:信息可视化与视觉设计
精品推荐
特别推荐
·网站设计欣赏:kashiwasato的色彩革命
·平面设计中字库使用的问题解答
·设计理论:什么样的图标更具有可用性
·设计理论:原型的使用
·设计理论:如何改善用户的阅读体验
·视觉设计:用理性说话
·设计理论:信息可视化与视觉设计
·经验:可用性第一法则,不要听用户的
·在5分钟内就能制作出Web2.0风格的网页图标
·制作参考:韩国网站的几种典型配色方案
·设计理论:微软设计主管一些经验分享
·设计理论:想用户所想——感受亚马逊
·安静的结构:控制页面的视觉“分贝”
·美工LOGO设计进阶
·创意家居用品设计欣赏:个性收纳
·设计基础:关于中性灰的讨论
·网页设计作品欣赏:暗色调站点设计(下)
·Vista四款主题全对比(美图欣赏)
热点TOP10
·1680*1050高清宽屏PS唯美风景壁纸欣赏
·英文字体创意设计及应用作品欣赏
·韩国素材下载:精美小房屋矢量图标
·几何图形英文字体创意设计及应用作品欣赏
·手绘服装设计插画作品欣赏
·天生丽质 桥本丽香经典壁纸欣赏
·制作参考:韩国网站的几种典型配色方案
·创意家居用品设计欣赏:个性收纳
·设计理论:如何改善用户的阅读体验
·开合式立体纸雕贺卡设计作品欣赏
·设计理念剖析:什么是“平面构成”
·优秀商业网站布局设计欣赏
·蛋糕美食网站界面韩国模板免费下载
·图标素材:Realone最新最清晰漂亮图标
·六月海创意作品欣赏(2)
·展现极致创意的优秀生态设计产品
·经典的国外创意广告欣赏
·传承典雅 La Sposah08婚纱设计赏
·Windows Vista系统动态桌面截图欣赏
·首页设计、风格一致、色彩搭配、版面布局的技巧

设计理论:信息可视化与视觉设计

日期:2007年8月31日 作者: 查看:[大字体 中字体 小字体]


设计理论:信息可视化与视觉设计

在工作中你是否会因为不知道用哪种图表(柱状图、饼状图、散点图……)来呈现表格数据而头疼呢?

这就是信息可视化(Information Visualization),是一个很大的话题。我们一般讲的可视化,包括科学计算可视化和信息可视化。前者大量运用在医学、地理、物理等领域(空间数据),比如部分分布式计算项目的屏幕保护程序,可以归为科学计算可视化的一种(当然与科研领域相比只能算毛毛雨了)。后者则主要是信息系统、商业金融、网络等领域(非空间数据,或者多维数据)。一方面由于信息可视化本身是近些年才发展起来的,另一方面我本人实际涉及的也不是很多,本文参考了一些信息可视化的文献,附在文末,与大家共勉。

一个例子

设计理论:信息可视化与视觉设计

今年股市比较热,打开任何一款炒股软件都能看到花花绿绿的曲线、图形,那么你可知道用来表示股价信息的 K 线图是谁发明的呢?传说是日本大米商人本间宗久为了记录下每日的大米价格变动而发明的一种图示,记录下价格的涨跌和走势,适时的进行大米交易来积聚财富,这种图示法准确、细致、独特,后来才被引入美国股市和期货市场。当然现在信息技术和统计学的发展,还涌现了一大批图表,比如星空图、散户线、火焰山等等。

信息可视化在这里将大量的数据进行信息提取,然后通过直观和形象的图形表现出来。(想象一下如果股票信息都是以二维表格形式呈现的话,那是多么恐怖)

认知心理学和图形设计

信息可视化的两大基础是认知心理学和图形设计,认知心理学是理论基础,图形设计是实践操作。

可视化不仅仅是视觉上的,该领域的研究人员也尝试着将听觉、嗅觉和触觉融合进去(比如针对残障人士的设计)。在《信息可视化的基本过程和与主要研究领域》一文中,作者将视觉上的可视化变量分为 7 种:位置、形状、大小、方向、色彩、纹理、灰度,有时候也会将色彩分为色相、亮度和饱和度。基本上所有的信息可视化应用都是一个或多个变量的组合。不同的视觉变量在呈现数据各有优劣(从认知角度),如下表所示:

联系 选择 次序 数量
位置
形状
大小
方向 一般
颜色 很好
纹理 一般 一般
灰度 很好
* 联系:数据与数据间的关系等;选择:数据的识别等;次序:比如时间序列和空间序列;

在 Web 设计上的应用

信息可视化对于具体的 Web 应用是很有指导意义的,或者说就是信息可视化的应用。基本步骤就是从大量数据中提取元数据,然后对应可视化变量,用图形设计方法去实现。IBM 有一个相关项目叫做 ManyEyes ,内置了很多常见的可视化模型,可以参考。

对于 Web 设计来说,重点是利用认知心理学的理论作引导,比如色彩的暗喻、直觉等,如果是国际化产品,尤其注意文化差异。从色彩的角度讲,各个国家或地区因为政治、宗教、环境等不同,对色彩的感受不同。

结合上面的表格,举个例子:TagCloud。TagCloud 的目的是什么呢?并非是表现出各个 Tag 之间的关系,而是让用户能够更好的进行选择、识别,所以通过大小和颜色的区分,创造了 TagCloud。所以做设计还是回到了先进行用户研究这个话题上。

其他在 Web 上的应用,比如 Google AnalyticsGoogle Trends。借助于 Flash、Flex、SilverLight 等强大的浏览器端图像渲染,可以将大量的、复杂的数据清晰、直观、生动的展现给用户。

设计理论:信息可视化与视觉设计

也可以通过信息可视化技术和方法将 Social Network 表现出来:

设计理论:信息可视化与视觉设计

更多应用

以下例子取自 information aesthetics ,点击图片上的链接访问源网站:

设计理论:信息可视化与视觉设计
http://oakland.crimespotting.org/

设计理论:信息可视化与视觉设计
http://www.similardiversity.net/

设计理论:信息可视化与视觉设计
http://carohorn.de/anymails/

设计理论:信息可视化与视觉设计
http://www.areacodeinc.com/work/sharkrunners/

设计理论:信息可视化与视觉设计
http://mullinslab2.ucsf.edu/craigstats/data/mapall.html

参考文献

* 宋绍成, 毕强, 杨达, 信息可视化的基本过程与主要研究领域, 2004
* 张聪, 张慧, 信息可视化研究, 2006
* Edward Tufte, Envisoning Information, 1990

(出处:清风网络学院






上一篇:解析Oracle/Oracle Forms 的多用途代码

下一篇:网站安全:单引号导致的网站崩溃 L-blog入侵实录

设计理论:信息可视化与视觉设计 相关文章:
·3DS Max 7卧室效果图设计:建模篇
·震撼你的视觉 3D星空高清晰壁纸欣赏
·VB+Access设计图书管理系统
·如何建立一个网站?规划、设计、目的、原则、宣传
·飞机订票系统设计
·华北水利水电学院新校区校园网规划与设计
·解决与HTTP 500 – 内部服务器错误错误信息有关的问题
·校园网网络方案设计及分析
·Java图形用户界面设计
·英文字体创意设计及应用作品欣赏
设计理论:信息可视化与视觉设计 相关软件:
·美工设计教程
·Dreamweaver 网页设计
·C语言程序设计
·Photoshop CS中文版平面设计师标准案例教程
·Photoshop CS经典创意设计200例
·Photoshop 7.0 平面 广告 装帧设计100例
·Windows环境下32位汇编语言程序设计
·远潮自我形象设计系统
·PhotoShop7 设计百例 + 经典实例教程 + 滤镜教学
·建筑抗震设计规范GB50011-2001

特别声明:本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载,但请务必注明出处和原始作者。文章版权归文章原始作者所有。对于被本站转载文章的个人和网站,我们表示深深的谢意。如果本站转载的文章有版权问题请联系编辑人员,我们尽快予以更正。
[打印本页] [关闭窗口] 转载请注明来源:http://www.viphot.com
| 帮助(?) | 版权声明 | 友情连接 | 关于我们 | 信息发布
Copyright 2007 www.viphot.com All Rights Reserved. 鄂ICP备05000083号Powered by:viphot