表的视觉属性
数据表是界面元素的一个基本形,而基本形的位置是由基本形和框架的关系,以及其他形象来决定的,因此数据表的设计重点在于框架的设计。
3.1 字体、字形、字号
字体、字形、字号不同会形成不同的版面效果。数据表和数据项一样,可以设置整行字体、字形、字号、字间距、色彩、方向和特效等。每个数据表对应着电子表格系统中的一个sheet,选中表,按鼠标右键,在弹出式菜单中选中“设置单元格属性”,就可以设置数据的这些属性。
3.2 空间布局
空间不是空洞,它拥有和形状一样的表现力。布局是用户在面对设计时最早看到的信息,它利用设计元素的构成来吸引人们的注意力。数据项也受到空间的包围,空间的安排表明数据元素的所属关系,产生层次变化。对于数字界面来说,表格和线条最能影响布局。
面积:在使用过程中,表格不一定都是规规矩矩的单元格,可以使用合并单元格的方法,使得最重要的数字或者宏观的数字放在面积最大的、或相对大的单元格内,可以用“面积”这个视觉元素表现数据的感性特点。就像“留白”的处理。
同样,用不同粗细和颜色的线条可以划分出不同的区域,来表示不同的数据分类,还能表示层次效果和从属关系,这比其他方法更能体现宏观的设计思想。如图表3:
图表3
代码 | 金额 | 合计 |
510050 | 2.165 | 12.345 |
600789 | 5.61 | |
601668 | 4.57 |
表的设计属性中结构最重要。只有当数据被合理编排使其意义一目了然,此类表格才是有效的。在决定所要呈现的数据后,构建表格之前,应注意要表达的关系:
一、顺序结构
结构特点:列标题固定,顺次排列数据行。每个数据行内的每个数据项严格按列标题定义的顺序、宽度排列。比如:表3.1.1就是一个顺序结构的数据列表。
表3.1.1 顺序结构的数据列表
专业名称 | 班级 | 学号 | 成绩 |
电子商务管理 | 电商0402 | 2004618231 | 80 |
电子商务管理 | 电商0402 | 2004618226 | 70 |
电子商务管理 | 电商0402 | 2004618248 | 60 |
二、层次结构
结构特点:用树形结构表示数据之间的包含关系、从属关系,由于留白的运用产生了分级效果,读者的视线同时进行行、列二维移动,能更好地理解数据之间的关系。比如:表3.1.2.1 表明“专业名称”和“班级”之间存在着上下级从属关系:“机械制造”专业包含了3个班级:“机制0505”、“机制0507”、“机制0508”。
表2.3.2.1 “专业名称”和“班级”之间存在着层次关系
专业名称 | 班级 | 学号 | 成绩 | 其它 |
电子商务管理 | 电商0402 | 2004618226 | 70 | 1 |
|
| 2004618231 | 80 | 1 |
|
| 2004618248 | 60 | 1 |
国际经济与贸易 | 国贸0401 | 2004619118 | 65 | 1 |
|
| 2004619134 | 0 | 1 |
机械制造 | 机制0505 | 202050516 | 47 | 1 |
| 机制0507 | 202050744 | 59 | 1 |
| 机制0508 | 202050848 | 91 | 2 |
建筑工程技术 | 工民建0401 | 2004411119 | 90 | 1 |
三、网状结构
结构特点:使用交叉表,即电子表格中的“数据透视表”。数据表中的数据项的含义由(行,列,值)组成,表明“行”与“列”数据之间对于“值”的相关分析,。比如:表3.1.3.1 就是一个网状结构的课程表。
表3.1.3.1 网状结构的课程表
| 第1节 | 第2节 | 第3节 | 第4节 | 第5节 | 第6节 | 第7节 |
星期一 | 数学 | 物理 | 化学 | 英语 | 语文 | 物实 | 历史 |
星期二 | 英语 | 数学 | 语文 | 化学 | 美术 | 体健 | 音乐 |
星期二 | 英语 | 数学 | 物理 | 语文 | 研学 | 思品 | 劳技 |
星期二 | 数学 | 英语 | 化学 | 语文 | 思品 | 体健 | 历史 |
星期二 | 语文 | 数学 | 英口 | 化学 | 物理 | 体健 |
|