AntV
AntV Infographic
文档
参考
示例
AI
企业版

目录

  • Overview
  • 标题(Title)
  • 数据项(Item)
  • 装饰元素(Decoration)
  • 插图(Illustration)
  • 快速开始
    • 入门指南
    • 信息图语法
  • 核心概念
    • 设计
    • 模版
    • 数据
    • 主题
    • 资源
  • 自定义设计
    • 自定义结构
    • 自定义数据项
    • 自定义模版
    • 自定义主题
    • 自定义色板
    • 自定义字体
    • 自定义资源加载器
    • 自定义图案
  • 信息图理论
    • 信息图分类
    • 核心理论
    • 信息图构成要素
    • 信息图设计
  • 参与贡献
    • 项目介绍
    • 开源计划
    • 贡献指南
    • 代码规范
    • 提交 PR
文档
信息图理论

信息图构成要素

信息图(Infographic)是一种视觉化的信息呈现方式,通过图形、图表、图标等视觉元素将复杂的数据和信息转化为易于理解和记忆的内容。一个完整的信息图通常由以下几个核心要素构成。

composition

标题(Title)

标题是信息图的核心主题标识,用于快速传达信息图的主要内容和目的。一个好的标题应该简洁明了、吸引眼球,能够在第一时间抓住观众的注意力,让用户快速了解信息图要传达的核心信息。标题通常采用较大的字号和醒目的颜色,放置在信息图的顶部或显著位置。

数据项(Item)

数据项是信息图中承载具体信息内容的基本单元,用于展示关键数据、事实或观点。每个数据项都是信息图叙事结构中的一个节点,通过多个数据项的组合来完整地呈现信息图的内容主题。

数据项通常包含以下子元素:

标签(Item Label)

标签是数据项的标识文字,用于说明该数据项代表的具体类别、名称或维度。标签应当简短精炼,通常使用关键词或短语,帮助用户快速识别和区分不同的数据项。在视觉层级上,标签通常采用中等字号,具有较高的可读性。

描述(Item Desc)

描述是对数据项的详细说明或补充信息,用于提供更深入的背景、解释或数据细节。描述文字通常比标签更长,可以包含具体的数值、百分比、趋势说明或相关背景信息,帮助用户更全面地理解该数据项的含义和重要性。

图标(Item Icon)

图标是数据项的视觉符号,通过图形化的方式增强信息的可识别性和视觉吸引力。图标可以是象形图案、符号或简化的插画,能够快速传达数据项的类型或特征,降低用户的认知负担。合适的图标选择能够使信息图更加生动、易懂,提升整体的视觉美感。

装饰元素(Decoration)

装饰元素是用于美化信息图、增强视觉效果的辅助性设计元素。这些元素包括背景图案、分隔线、几何图形、色块、纹理等,它们不直接承载信息内容,但能够优化视觉层次、引导视线流动、营造氛围,使信息图更具吸引力和专业感。装饰元素的使用应适度,避免喧宾夺主,影响信息的传达效果。

插图(Illustration)

插图是信息图中的大型视觉图像,用于辅助说明主题、营造场景氛围或提供视觉隐喻。插图可以是手绘风格、扁平化设计或写实图像,通常占据较大的视觉空间,与文字和数据形成互补关系。优秀的插图能够增强信息图的叙事性和情感共鸣,使抽象的数据和概念更加具象化、易于理解。

上一章核心理论
下一章信息图设计

AntV Infographic
Copyright © Ant Group Co.
文档
快速开始
核心概念
自定义设计
信息图理论
API 参考
JSX
API
设计资产
更多
更多示例
AI 在线体验
GitHub
参与贡献
友情链接
AntV
G2
G6
L7