跳到主要内容

NDLA 时间轴 (NDLA Timeline)

NDLA 时间轴是标准时间轴组件的增强版。它不仅以线性时间序列呈现事件，还特别支持上传本地媒体文件（图片、音频、视频），并提供了更灵活的布局与分组功能。

本教程目标​

  1. 了解 NDLA 时间轴与标准版的区别
  2. 掌握标题幻灯片与背景的高级配置
  3. 学会添加时间节点并上传本地多媒体资源
  4. 使用“时代 (Eras)”功能对历史时期进行分组

第一次使用课灵？

请先注册并登录课灵账号(可以使用微信登录)，在工作区点击"创建"，并选择『NDLA 时间轴 (NDLA Timeline)』开始创作。

注册/登录

何时使用时间轴​

  1. 事物演变：展示技术、概念或产品的进化历程（如人工智能发展史）
  2. 历史事件：按时间顺序梳理关键历史节点与社会变迁
  3. 人物传记：通过多媒体形式生动呈现人物生平大事
  4. 项目里程碑：记录项目规划中的重要阶段与成果

教程示例​

下面是一个含多个事件节点的时间轴示例，支持图片与外链。

通过时间轴探索人工智能发展的重要里程碑
快速复制示例
  • 点击 这里➜ 将示例复制到你的课灵工作区
  • 在打开的页面点击"复制" (注意：请确保已登录课灵账号，否则无法复制)
  • 随后在生成的副本中点击"编辑"
  • 即可查看并操作本教程所示的设置。

创建时间轴：分步指南​

本指南将带您创建一个名为 『互动时间线：人工智能简史』 的交互式时间轴。

步骤 1：创建新内容​

  1. 在课灵工作区点击 "创建"，进入 H5P 编辑器。
  2. 在内容类型列表中选择 『NDLA Timeline』 或搜索 NDLA。
  3. 进入编辑界面开始配置。
选择时间线内容类型
从 H5P 内容类型列表中选择『NDLA Timeline』

步骤 2：设置标题​

  1. 在编辑器中选择 NDLA Timeline（若未自动进入）。
  2. 在 标题 字段中输入 互动时间线：人工智能简史。

步骤 3：配置标题幻灯片​

标题幻灯片是用户进入时间轴时看到的第一屏内容。

  1. 勾选 显示标题幻灯片。
  2. 展开 标题幻灯片 设置区域，输入以下信息：
    • 标题：人工智能简史
    • 4始日期：1964
    • 结束日期：2024
    • Text：人工智能（AI）的发展史是一段跨越数十年的旅程。
    • 布局：选择 文本在右侧（标准布局）。此设置决定了文本相对于媒体的位置（注：这是标准 Timeline 组件不具备的功能）。
  3. 在 背景 选项中，您可以根据需要选择 图像、填充颜色 或 无。本例中选择 图像 并上传一张代表 AI 主题的图片（如大脑电路图）。
配置标题幻灯片
设置标题幻灯片的起止日期、背景图与布局

步骤 3：添加时间节点​

我们将添加第一个历史事件：第一台机械计算器。

  1. 点击 时间轴项目 下的 添加时间轴项目。
  2. 填写事件详情：
    • 标题：第一台机械计算器
    • 开始日期：1642
    • 结束日期：1642
    • Text：输入描述文本，例如 [第一台机械计算器]由数学家和发明家布莱斯·帕斯卡建造。（支持添加超链接）。
    • 4局：选择 文本在右侧（标准布局）。
  3. 媒体设置：
    • 媒体类型：支持 图像、视频、音频 或 外部链接。相比标准 Timeline，NDLA Timeline 允许直接上传本地媒体文件，而不仅仅依赖外部链接。
    • 图像：在本例中选择 图像，然后上传帕斯卡计算器的图片。
    • 替代文本：输入 第一台机械计算器 以辅助无障碍访问。
添加时间节点
配置时间节点的日期、文本内容与媒体资源

步骤 4：添加时代​

使用“时代”功能来标记一段特定的历史时期。

  1. 展开 时代 设置区域，点击 添加时代。
  2. 填写时代信息：
    • 名称：人工智能的诞生
    • 开始日期：1642
    • 结束日期：1956
    • 这将在时间轴上创建一个标记为“人工智能的诞生”的区间，涵盖从机械计算器到 AI 正式诞生的时期。
添加时代
创建历史时期（Eras）以分组展示相关事件

步骤 5：行为设置​

配置时间轴的显示模式。

  1. 展开 行为设置。
  2. 缩放模式：选择 人类时间。
    • 人类时间：以常规表示法显示公元前后的年份。
    • 宇宙时间：使用科学表示法显示日期。
    • 索引：适用于扭曲时间轴，使所有事件看起来等距离。
配置行为设置
配置时间轴的显示模式（人类时间、宇宙时间、索引）

步骤 6：保存与预览​

点击 『保存并关闭』 生成内容。您现在应该有一个与顶部示例类似的结果。

交互说明​

  • 浏览导航：
    • 点击屏幕两侧的 箭头 (< / >) 可按顺序切换事件。
    • 在底部时间轴上 按住并拖动 可快速浏览不同时期。
    • 直接 点击 底部时间轴上的具体节点可立即跳转。
  • 视图控制（左下角工具栏）：
    • 点击 放大镜 图标 (+ / -) 可调整时间轴的显示密度。
    • 点击 重置 图标可返回初始视图。
  • 全屏模式：点击右上角的扩展图标可进入全屏沉浸式浏览。

优化与可访问性​

  • 图片优化：由于支持本地上传，请务必在上传前压缩图片文件，以确保加载流畅。
  • 替代文本：始终为上传的媒体添加描述性 alt 文本，这对于视障用户至关重要。
  • 色彩对比：确保文本与背景图片之间有足够的对比度，必要时使用纯色背景替代复杂图片。
  • 时间格式：保持时间格式的一致性（如统一使用年份 YYYY），避免混淆。

专家建议​

  • 利用“时代”分组：对于跨度较大的时间轴（如本例的 AI 简史），使用 时代 (Eras) 功能将相关事件分组，有助于学习者构建宏观的时间概念。
  • 使用标签分类：为事件添加 标签 (Tags)，这不仅有助于对内容进行分类（如“硬件”、“软件”、“人物”），还能让学习者通过筛选功能快速聚焦特定主题。
  • 控制信息密度：避免在单个节点堆砌过多文字；如果内容较多，建议提供外部链接或精简摘要。
  • 组件选择：
提示

时间轴的核心在于“时序性”。如果您发现自己在创建非线性的章节结构，或者需要整合多种不同类型的互动练习，请优先选择『互动书 (Interactive Book)』。

最后由 Sam Xu 于 更新