教育应用

全球范围内,教师、家长和学生都使用科技使学习更加生动。通过查看本主题中的应用场景并了解如何在这些应用中应用 Microsoft 设计样式,你可以获得设计你自己的教育应用的灵感。Windows 8.1 具有开发人员工具和新的设计选择,你可以使用它们为学生、教师、教职人员和管理者构建浸入式应用体验。

对于教育应用,考虑以下方面十分重要:内容、教室编排以及帐户管理、协作、管理和测试、参与度和辅助功能。

内容

当你设计教育应用时,请考虑你将为受众提供的内容类型,以及他们将使用还是创造内容或者两者兼具。教育应用的常见内容方案包括:

  • 课程内容和标准、教科书、图书馆以及自学教程。
  • 教室编排。
  • 评估—测试和小测验。
  • 教学工具和教室编排。
  • 为学生设计的工作效率工具(写作、展示、整理)。

Kno TextbooksKhan Academy 都是教育内容应用,它们非常擅长向用户提供可使用的有吸引力的教育文本和视频。

显示 Kno Textbooks 的屏幕截图

Kno Textbooks

显示 Khan Academy 的屏幕截图

Khan Academy

在来自 OakReFactory 的应用 Record Voice and Pen 中,重点在于内容创造。教师可以同时记录声音和笔记,然后保存、导出并共享该内容。

Record Voice and Pen 导出向导

一旦用户停止录制视频,一个模态框将使他们可以选择导出首选项。

Record Voice and Pen 搭配“共享”超级按钮

然后,他们可通过“共享”超级按钮共享内容。

另一个着重于内容创造的应用是 Educ8 Teacher。Educ8 Teacher 允许教师启动教室会话并在虚拟黑板上写字。然后,该教师可以保存已创建的内容并在以后重新使用它。对于教师在教室前方向较大的屏幕投影的应用场景而言,该应用非常理想。

Educ8 Teacher 数学和几何学

Educ8 Teacher 一年级数学

Educ8 Teacher 应用数学

课程编排和管理

设计你的应用时,请考虑你希望应用如何通过实时和异步通信、内容创造和使用以及控制或允许来支持教师和学生。对于教室编排和管理,要为你的应用设计考虑以下事项:

  • 教室编排

    教室编排是指对教室活动的实时管理。请考虑你的应用是否会由本地用户和/或远程用户使用。让用户的实时需求和实际位置引导你设计用于教室编排的应用场景。例如,如果教师要管理一间坐满学生的教室,他们对于应用的要求可能不同于为全球范围远程学习的班级教学的教师。教室编排需求的常见应用场景可能是测试应用场景,将在评估:管理并完成作业、小测验和测试进一步描述其详细信息。另一个要考虑的应用场景是活动网站或视频聊天会话,它们用于实时提供问与答,适合学生、助教和教师参加。

  • 帐户管理

    考虑多个帐户类型以适应大量需要访问应用的用户(例如,教师、管理员、家长和学生),并考虑你希望为每种帐户类型提供的不同界面元素和内容。例如,你可能希望你的应用为教师帐户提供内容创造功能,但为学生帐户提供只读功能。你可以通过为教师提供学生不具有的功能来在 UI 中表达这一点,这由登录体验确定。

  • 年龄分级和家长控制

    由于许多教育应用都用于 18 岁以下人群,所以请在应用中对年龄敏感的数据作出谨慎决定。Microsoft 为此目的提供年龄分级。在将你的应用上载到应用商店之前,请确保年龄分级反映出相关的年龄组,并且你符合年龄分级图表中的条件。还请务必在你的应用中提供任何必要的家长控制设置。

    GuruCool Preschool Puzzles

    可在 GuruCool Preschool Puzzles的左上角和应用栏内找到“家长设置”

协作

请考虑用户可能希望协作的应用场景,并设计可支持你希望应用鼓励的协作类型的用户流。将进行实时协作还是让学生在不同的时间看到信息?

Promethean ActiveEngage2 是一个虚拟答题系统,学生可以在其中实时回答问题并参加课堂讨论。界面设计将引导他们与教师或全班同学分享信息。

Promethean ActiveEngage2

Promethean ActiveEngage2鼓励实时协作。

Microsoft OneNote、Skitch 和 Evernote 都是通过允许用户共享并同时编辑笔记来支持协作的应用。在这些案例中,这些应用使用“共享”合约帮助用户发送文件位置、文档或摘要。

评估:管理并完成作业、小测验和测试

如果你的应用包含测试和小测验应用场景,教师可能希望为学生的测试设定约束或时间限制,或者在学生测试期间在应用内限制访问其他内容(如课程视频)。例如,如果你的应用具有课程计划,当学生在应用中进行测试时,你会希望不为他们提供这些计划。BrainPOP 的设计使用户不能在进行小测验的同时访问视频内容。同样,如果他们在没有完成小测验并获得评分的情况下退出小测验,他们就不可以保存答案,也不可以不重新开始就返回小测验。

BrainPOP 小测验

BrainPOP 小测验对话框

BrainPOP会在用户未完成即退出小测验时通过消息对话框警告用户,如果他们选择离开,则不会保存答案。

ABC School 是一个面向初阶读者的应用,它以卡通形象为特色并播放背景音乐。当答案正确或错误时,声音和动画将为用户提供反馈。请考虑实现此类用户反馈功能以使你的受众一直沉浸在当下活动中。

ABC School

参与度

Windows 通过磁贴和通知提供了提高并维护用户参与度的机会。设计你的教育应用时,请将以下参与机会考虑在内:

  • 磁贴

    动态磁贴是提高你的应用的参与度和回头率的绝佳方法。请考虑以下关于在教育应用中使用动态磁贴的应用场景:

    • 鼓励学生复习他们不太理解的主题部分。
    • 提醒学生即将到来的作业、小测验和测试。
    • 提醒教师完成评分,或为学生提供关于最近交上的作业的反馈。

    如果你的应用主要以内容为基础,使用动态磁贴的机会包括向学生显示当天主题,正如 BrainPOP 所做。

    BrainPOP 磁贴

    BrainPOP使用动态磁贴告诉用户当天的主题是什么。

    如果你的应用是出版应用(例如 NOOK),你可以推送一条更新以提醒用户他们已读或正在阅读的内容,或者让用户了解他们正在学习或感兴趣的主题的新电子图书。

    Nook 磁贴

    NOOK在动态磁贴中提醒用户他们最近阅读的内容。

    较大磁贴提供充足的空间,可同时添加多个磁贴更新,或以图形的形式显示用户的进度。例如,GuruCool Preschool Puzzles 可以在较大磁贴上实现较小版本的进度表,以鼓励孩子及其家长完成主题。

    GuruCool Preschool Puzzles 进度表

    Preschool Puzzles可以在较大磁贴上实现以上进度表的一个版本以鼓励用户完成主题。

    辅助磁贴是用户在应用中感兴趣的部分的理想入口点。它可减少导航到该部分的步骤数。例如,一位学生想查看课程表,链接到课程表页面的辅助磁贴可让该学生通过单击或点击调出他们的课程表。

  • 通知

    在具有对时间敏感的内容(例如即将到来的测试或作业截止日期)的应用场景中,考虑通过通知补充你的动态磁贴。通知可能比动态磁贴更吸引注意力,因此请确保在更重要的应用场景(例如测试或快到期的作业)中使用它们,以避免让你的应用感觉"充满垃圾消息。"请考虑让用户选择他们要接收什么类型的通知,以帮助用户感觉更能掌控应用与他们的交互方式。

辅助功能

在设计流程早期,请考虑所有类型的学生如何与你的内容交互,以及你在应用中满足哪些听觉和视觉需求。在应用开发的设计决策阶段,你可以考虑几种辅助功能应用场景。对于教育方面,最重要的辅助功能需求如下:

  • 听觉需求

    Windows 配置了 Microsoft 讲述人这一屏幕阅读器,它可以朗读屏幕上的文本并描述事件。针对 Microsoft 讲述人和其他屏幕阅读器优化你的应用是确保视觉受损或失明的用户可使用应用的好方法。测试你的应用以查看它是否在 XAML 或 HTML 中针对辅助功能进行了优化。要使屏幕阅读器工作,你的应用中的所有 UI 元素必须相应地标上名称、角色、描述、状态、位置和任何其他相关信息。优化你的 XAML 或 HTML,以便屏幕阅读器可以确定基本 UI 元素,这仅需投入相对较少的开发事件,就可以为所有身体条件的用户显著提高用户体验。

  • 视觉需求

    要为所有用户创造增强的可访问视觉体验,请在应用中包含图像和视频的隐藏说明文字和字幕。要改进应用中的文本,建议在 XAML 和 HTML 中都为文本和背景使用高对比度比率。相对于背景的发光度对比度比率至少需要为 4.5:1,你的应用才被认为具有辅助功能。若要针对色盲症调整这些功能,在使用颜色传达信息的应用场景中,请使用颜色替代项,如文本、形状和图标。

  • 键盘交互和替代输入

    人们可能会使用各种方法与应用交互:触摸、键盘、鼠标和笔是最常见的方法。如果应用游戏化,可能可以识别控制器或 3D 手势。

    你的应用具有的键盘辅助功能越多,可以轻松理解应用内容并完成作业的学生就越多。通过启用键盘快捷方式支持键盘交互,允许使用 Enter 或空格键激活元素,并允许用户通过箭头键和/或 Tab 键导航。你可以通过在 XAML 或 HTML 中设置 Tab 索引属性来替代默认 Tab 键顺序。

    为应用设计辅助功能之后,确保在提交到 Windows 应用商店时将你的应用标记为带有辅助功能

年龄分级和分级委员会

应用磁贴示例

辅助功能清单

定义构想

辅助功能指南

应用栏指南

登录控件指南

共享内容指南

磁贴指南

toast 通知指南

HTML AppBar 控件示例

认识 Windows 应用商店应用

Microsoft 讲述人

共享内容源应用示例

共享内容目标应用示例

测试应用的辅助功能 (HTML)

测试应用的辅助功能 (XAML)

Toast 通知示例

工具

Windows 应用商店应用的 UX 指南

UX/UI

XAML 应用栏控件示例