图像排序 (Image Sequencing)教程

图像排序(ImageSequencing)教程图像排序(ImageSequencing)要求学习者将一组无序的图像按照正确的逻辑顺序重新排列。这种交互方式不仅适合展示过程、时间线或故事情节，还支持为每张图片添加音频旁白，使其成为一种多感官的学习体验。本教程目标通过本教程，您将学会：创建多媒体排序任务：结合图像与音频，设计更丰富的互动体验。配置辅助功能：设置无障碍描述和键盘导航支持，确保所有学习者都能使用。优化反馈机制：启用解决方案和重试选项，鼓励学生自主探索与纠正。何时使用图像排序故事重述(StoryRetelling)：如本教程示例，要求学生按情节发展重排故事场景，检查阅读理解。过程演示(ProcessDemonstration)：展示科学实验步骤、烹饪流程或软件操作顺序。时间线梳理(Timelines)：排列历史事件、生物进化阶段或产品生命周期。逻辑推理(LogicalReasoning)：通过排列因果关系图（如：云->雨->植物生长），训练逻辑思维。语言学习(LanguageLearning)：结合音频，让学生听到描述后选择对应的图片顺序，训练听力与语序。教程示例下面是我们将在本教程中创建的图像排序活动，主题是「邋遢的喜鹊」，学习者需要根据故事情节，将莫里斯收集礼物到回归大自然的图片按正确顺序排列。HYPERLINK/content/01k6zepz49fn0w8y5phhcha8xhnormalLink\tdfe-10\tdlttext\tdlfFromDialog\tdtf0\tdsubnormalLink\tdkey0mh4ro点击这里浏览示例拖动下面的图片按故事中的正确顺序排列；点击图片右上方的音频按钮可播放描述快速复制示例点击HYPERLINK/content/01k6zepz49fn0w8y5phhcha8xhnormalLink\tdft\tdfe-10\tdfid\tddp\tdop\tdltinline\tdds\tdfvi\tdlf\tdtf\l\tdsubnormalLink\tdkeykk7z8d\tdkeykk7z8d这里➜将示例复制到你的课灵工作区在打开的页面点击"复制"(注意：请确保已登录课灵账号，否则无法复制)随后在生成的副本中点击"编辑"即可查看并操作本教程所示的设置。创建图像排序：分步指南步骤1：创建新内容在课灵工作区点击「创建」，进入H5P编辑器在内容类型列表中选择『图像排序』或搜索ImageSequencing进入编辑界面开始配置从H5P内容类型列表中选择『图像排序』步骤2：设置标题与任务描述在『标题』字段中输入：邋遢的喜鹊（图像排序）提示别忘了点击标题旁的『元数据』(Metadata)按钮，为您的内容添加版权信息和许可证。在『任务描述』字段中输入指导说明：根据《邋遢的喜鹊》的故事，拖动下面的图片按故事中的正确顺序排列。点击图片右上方的音频按钮播放图片描述。无障碍支持您还可以在『无障碍任务描述』中为屏幕阅读器用户提供专门的指导：正确排序以下列表。使用光标键浏览列表项，使用空格激活或停用项目，使用光标键移动它设置标题、任务描述及无障碍说明步骤3：添加排序图像与音频点击『添加图像』按钮，按正确的顺序上传图片并添加描述。图片尺寸建议为了获得最佳视觉效果，建议所有图片保持相同的宽高比（例如都是4:3或1:1）。这能确保排列整齐，避免视觉混乱。以本示例中的前两个阶段为例：项目1：收藏家莫里斯图片：上传喜鹊莫里斯收集各种物品的图片。图片描述：莫里斯是个收藏家（当图片无法显示时，此文本将作为替代文本；也可用于鼠标悬停提示）。音频文件：上传对应的旁白音频（如mpeg格式）。这为活动增加了多感官体验。项目2：发现礼物图片：上传莫里斯发现礼物的图片。图片描述：发现了一个礼物。音频文件：上传对应音频。继续添加剩余的6张图片（共8张），分别对应故事的后续情节：礼物太多、环境伤害、跟着卡车、搬家、播种、大自然最美丽。上传图片、填写描述并添加可选的音频文件步骤4：配置行为设置展开『行为设置』部分，调整互动体验：为游戏添加显示解决方案按钮：勾选。允许用户查看正确顺序。添加游戏结束时重试按钮：勾选。鼓励反复练习。添加按钮以从当前状态恢复：勾选。允许用户在中断后恢复之前的进度。启用解决方案、重试及状态恢复按钮步骤5：保存与预览点击『保存并关闭』生成完整的图像排序活动。您现在应该有一个与本教程HYPERLINK/docs/tutorials/tasks/image-sequencing#%E6%95%99%E7%A8%8B%E7%A4%BA%E4%BE%8BnormalLink\tdft\tdfe-10\tdfid\tddp\tdop\tdltinline\tdds\tdfvi\tdlf\tdtf\l\tdsubnormalLink\tdkey5hrpop\tdkey5hrpop顶部示例类似的结果。交互说明拖放操作(Drag&Drop)：这是最直观的交互方式。在触摸屏设备上，体验尤为流畅。音频辅助(AudioSupport)：点击图片右上角的扬声器图标即可播放音频。音频播放不会打断排序操作，学生可以一边听一边思考位置。键盘导航(KeyboardNavigation)：使用Tab键进入图片列表。使用左/右箭头键在图片间移动焦点。使用Space(空格键)选中一张图片，再次移动焦点并按Space键将其放置到新位置（交换位置）。优化与可访问性图片描述(AltText)：必须填写。对于视力正常的用户，它是图片加载失败时的替代文本，也是鼠标悬停时的提示。对于屏幕阅读器用户，这是他们理解图片内容的唯一途径。音频的双重作用：音频不仅是装饰，更是脚手架。对于阅读困难的学生，听觉信息能帮助他们理解复杂的图片内容。无障碍任务描述：这里的文本是不可见的，仅供屏幕阅读器朗读。请使用祈使句，清晰地说明操作方法（如本教程示例所示）。专家提示：用例灵感与相关内容类型推荐想拓展『图像排序』的使用场景？以下是一些创意方向：漫画创作：提供打乱的漫画格子，让学生复原故事逻辑。算法可视化：排列流程图组件，展示正确的程序执行逻辑。艺术鉴赏：按时间顺序排列画家的不同时期作品，展示风格演变。急救培训：排列CPR（心肺复苏）的正确操作步骤，强化肌肉记忆。提示在选择内容类型时，以学习目标为先；『图像排序』适合"顺序理解和流程掌握"的场景。如果你需要测试视觉识别能力，考虑HYPERLINK/docs/tutorials/tasks/image-choicenormalLink\tdft\tdfe-10\tdfid\tddp\tdop\tdltinline\tdds\tdfvi\tdlf\tdtf\l\tdsubnormalLink\tdkeyi5iwil\tdkeyi5iwil『图像选择题』；若要训练关联记忆，选择HYPERLINK/docs/tutorials/tasks/image-pairingnormalLink\tdft\tdfe-10\tdfid\tddp\tdop\tdltinline\tdds\tdfvi\tdlf\tdtf\l\tdsubnormalLink\tdkeyeguz3u\tdkeyeguz3u『图像配对』；需要多轮次测验，使用HYPERLINK/docs/tutorials/tasks/image-choice-roundsnormalLink\tdft\tdfe-10\tdfid\tddp\tdop\tdltinline\tdds\tdfvi\tdlf\tdtf\l\tdsubnormalLink\tdkeym45sv7\tdkeym45sv7『图像选择回合』；而HYPERLINK/docs