系统对接+PBP+嵌入,打造优雅的在线培训考试系统

文/文静

编辑/麦壁瑜

本文的分享是以一个在线培训+考试系统的搭建为例,讲述如何在明道云应用设计中去繁存简、巧妙构思打造出一个交互体验更好的应用系统。

在线培训考试系统的应用场景

相信很多明道云的客户和顾问都基于明道云平台做过培训考试类系统,它们可以应用在很多业务场景,比如企业内部培训、规章制度学习、软件系统使用帮助、岗位技能提升、安全教育等。一般而言,这些系统可以分为培训学习和考试两大场景。

在培训学习场景中,培训内容通常会采用视频录播模式,让员工自行学习并反馈学习进度。下面是用部分系统展示效果:

基于明道云平台设计的企业内部培训应用

学员学习进度反馈

线考试功能一般是通过工作表的基本控件(文本标题、下拉选项、多选、富文本),组合成试卷和答案选择项,如下图:

新员工面试时,也可以用明道云生成测试题。通过公开表单让候选人在线作答和评分。

主要存在的问题

虽然明道云已经能满足绝大部分培训和考试功能,但我们不得不承认,和一些专业的培训考试产品相比在功能,尤其是交互设计上,明道云仍然有很大差距。其主要体现在这几方面:

1.无法准确掌握学员学习情况

明道云对学习视频的支持很简单,一般通过附件上传到工作表,或者通过嵌入控件、自定义页面等组件直接打开第三方视频链接。而视频播放的很多控制能力(如:继续上一次播放、弹幕、播放时长统计等)无法实现,也就无法有效的统计和监控学员的学习行为。这个问题在一些以安全生产教育为目的应用场景中是非常关键的,因为组织这样的培训是企业的法定责任,而学员的学习也带有一定的强制性。

2.考试操作交互体验欠佳

明道云能够方便地实现题型、题库和试卷设计,也能适应各种培训和考试的模式;利用工作流自动打分评级也是小菜一碟,但是由于范式化的前端设计,在学员考试的操作上不太友好。比如:题目的上下切换一般是通过工作表自身的行数据上下切换来完成,位置不醒目,新手可能找不到;所有题目以数据记录的方式呈现,缺乏传统在线考试的用户体验。

新体验需要新思路

如果实在要用明道云打造一款交互体验更好的在线学习&考试应用,其实还是有办法的。在视频学习模块,我们可以集成外部专业视频处理能力,弥补明道云本身对视频支持的不足。同时通过精细化的应用设计,打造更加符合学员习惯的考试模块。

升级后的应用具备以下特性:

1.增强视频播放和处理能力

视频资源的上传、播放和管理交由专业技术平台“获得场景”(www.bokecc.com)来实现。播放体验大大增强,支持播放位置记忆、播放密码、视频打点、字幕管理、弹幕、清晰度管理、多线路切换等效果。

2.获取学员的播放行为数据

通过平台接口获得学员的播放记录数据,实现对学员学习监督和管理、数据的自动汇总。其中最重要的是可以通过视频 ID和学员ID获取学员的播放行为数据,再根据数据自动判断是否完成学习,防止作弊。

学习课程列表

课程播放数据管理

3.一键创建试卷

考试模块和培训模块打通,除了常规的题库管理、试卷管理、可以直接通过培训计划获取学员列表一键创建试卷,同时也支持手动单独添加。

4.考题批量生成

在答题体验上,考试试卷采用了“单页面”设计。通过业务规则和工作流,实现试卷元素动态更新。整个考试过程中不需要整体切换“试题记录”,而是采用醒目、易于理解的上下题切换按钮,答卷完成提交后可直接进行评分统计。

单页面”题目选择效果

评分自动生成

关键技术实现原理

1.使用“嵌入”控件,工作表与视频播放平台快速集成

之前讲过明道云对于以附件形式上传的视频文件没有复杂的管理能力,那么我们转变下思路,先上传视频到第三方平台,再以URL形式整体嵌入明道云。URL能嵌入的地方还有很多,比如自定义页面、工作表记录中的“嵌入”组件、工作流界面推送节点。

2.“获得场景”视频后台管理

此项目中视频素材的上传和播放都是在“获得视频”平台上进行,而平台会为每个视频自动生成视频ID和播放地址URL。

3.一个URL参数解决学员身份识别问题

要管理学员个人的学习进度,首先要解决身份识别的问题。“获得场景”平台提供了基于前端JS接口验证身份的能力,但是明道云目前还无法支持这样的集成模式。不过获得场景视频的工程师为我们专门提供了基于URL参数的模式。

只需要在一个统一的视频URL后面为每个学员单独添加一个带有学员信息的参数customid,即可生成每个学员专属的播放地址URL,保存在「学员URL」控件中,并且最终被「嵌入」控件引用,实现“带参播放”。

4.PBP实现播放进度接口快速调用

谁?什么时间?看了什么视频?从哪个位置开始看的?看了多久?最后停留的位置在哪里?发了什么互动弹幕……获得视频能为这些信息提供非常详细的数据接口。通过接口获取数据后,我们就能对其计算和分析,准确知道学员是否完整看完视频、重点关注的内容、行为习惯……为改进教学内容提供更多的数据支撑。

5.获得视频接口参数示例

有了这些接口,我们就能进行接口调用和数据处理啦。这里我们用PBP封装了「访问获得视频接口」的功能,方便内部其他工作流随时调取,只需要传入2个参数(videoid和customid)即可。

6.自定义按钮+工作流动态刷新试卷信息

要实现单页面的信息动态加载,关键在于设计出合理的数据源结构和更新方案。所有题目及其序号在“试题模板库”已经设置好,个人的试卷都会自动参照这个模板,生成考卷记录和答案存储记录(暂不考虑题序打乱的需求)。

7.试卷模板管理

将试卷信息加载功能独立成一个子流程。通过题目序号获取题目信息,并刷新当前试卷。这个逻辑可供多个自定义按钮所使用,差别只是传入的题目序号不同,比如“开始答题”按钮固定传入序号1。

总结

明道云应用的设计模式灵活多变,每个人都可以把自己的思想融入其中,有时为了满足一些复杂场景和特殊需求,也许要把应用结构和处理逻辑做地非常复杂。但是实用、轻便、健壮、易于维护的设计理念才是我们追求的目标。适当整合外部资源,合理简化逻辑,都可以让我们的应用更加优雅和高效。

关于明道云

明道云(www.mingdao.com)成立于2013年,位于上海,创始人为互联网知名人士任向晖先生。明道云是一个APaaS平台,帮助企业快速搭建个性化业务应用。用户不需要代码开发就能够搭建出用户体验上佳的销售、运营、人事、采购等核心业务应用,打通企业内部数据,也能够通过API和Webhook和其他系统对接。

明道云的自动化工作流还可以实现审批、填写等控制流程和业务自动化。如果用户企业使用钉钉或企业微信,也可以将明道云搭建的应用直接对接到工作台上。

明道云可以帮助企业大大节省软件费用、降低定制开发的成本和时间,拥有一个极度灵活和易用的数据中台,并提高整体数字化和智能化水平。目前已有上百万用户使用,付费企业超过4000家,典型客户包括:中铁三局、佛山地铁、普华永道、艾瑞咨询、迪卡侬、北京大学、四川航空、上海静安区街道、艾默生电子、西门子、杭州建筑设计研究院、七天四季酒店、希尔顿、凯宾斯基酒店、可口可乐等知名机构。了解更多