液相色谱-质谱虚拟实验室的构建

2017-06-06 12:00刘伟吕狄亚丁德英邢心睿第二军医大学药学院
数码世界 2017年5期
关键词:液相质谱网页

刘伟 吕狄亚 丁德英 邢心睿 第二军医大学药学院

液相色谱-质谱虚拟实验室的构建

刘伟 吕狄亚 丁德英 邢心睿 第二军医大学药学院

液相色谱-质谱仪(LC-MS仪)作为药学学科领域的一个重要的分析仪器手段,也是本科学习过程的一个重要内容,但由于仪器的自身特点,难以反复开展实验进行操作,学生往往浅尝辄止。本文在Dreamweaver软件的基础上结合Flash和JavaScript建立了具有交互功能的气相色谱-质谱虚拟实验室,该虚拟实验室以LC-MS仪的完整实验流程为基础,运用计算机语言设计出相对应的模拟实验流程,一方面为学生提供教学服务,另外一方面为进一步设计相关仪器的虚拟实验室提供参考思路和基础。

液相色谱-质谱联用 虚拟实验室

虚拟实验室是一种基于Web技术构建的开放式网络化的虚拟实验教学系统,是现有各种教学实验室的数字化和虚拟化。虚拟实验室为开设各种虚拟实验室课程提供了全新的教学环境,因而虚拟实验室的设计备受师生的欢迎。在药学本科学习中,液相色谱-质谱仪是分析化学学习内容中的重要环节,但其软件工作站较为复杂,现实的实验教学往往耗费较长的时间,课程设置往往也都是示教内容。但通过设计LC-MS虚拟实验室,可以极大的解决这些问题,增强教学的多样性和丰富性。

1 实验室设计

1.1 设计原则

液相色谱-质谱虚拟实验室在作为实验室设计基础的同时,也是实验教学的手段。所以必须遵循以下的设计原则:

①准确性液相色谱-质谱虚拟实验室的设计必须要以实验室中对应仪器作为虚拟对象,运用计算机语言将仪器与实验室结合,从而保证虚拟实验室内容的准确。

②完整性虚拟实验室的内容应该具备整个实验流程,保证实验教学内容的完整,同时仪器的基本介绍和注意事项也可作为补充添加进入虚拟实验室。

③交互性在整个实验室的设计中,交互应该作为基本思想贯穿其中,虚拟实验室根据学生的相关操作而变化,这是构建虚拟实验室基本原则。

1.2 设计内容

本虚拟实验室是基于液相色谱-质谱仪的主要内容来进行设计,主要包括以下三个部分:仪器的基本介绍,帮助初学者了解仪器的构造和工作原理;仪器操作准备,主要是样品的预处理过程;软件操作过程,该过程又包括方法编辑、Worklist编辑、数据处理。

第一部分仪器的基本介绍,是利用Dreamweaver的网页制作技术将液相色谱-质谱仪的原理和构造展现在页面上。第二部分仪器的操作准备,是利用Flash的动画制作,并在关键步骤上利用Action Script 2.0制作交互按钮,以此加强初学者的知识点强化。最后一部分是软件操作过程,我们实现的软件是Dreamweaver和JavaScript,并通过脚本进行相关操作的提示和网页直接的链接。

2 实验室构建

本文提到的虚拟实验室构建是以Agilent公司的Agilent Technologies 6538 UHD Accurate-Mass LC-MS为硬件系统的虚拟对象,以Workstations软件为软件系统的虚拟对象。

2.1 硬件操作构建

液相色谱-质谱联用仪的进样操作需要进行样品的预处理,所以在模拟该操作以后,有助于初学者熟练的掌握样品的预处理过程。此过程可以通过Flash和Action Script完成,具体实现手段如下:

①通过Photoshop制作仪器的控制面板、涡旋仪、离心机的操作面板等虚拟素材,并导入到Flash素材库中,然后新建饮品剪辑元件插入舞台;

②点击剪辑元件进入元件的编辑界面,将素材摆放到合适的位置,创建补间动画,制作动画效果;

③在舞台上导入按钮素材,加入Action Script,制作启动和相关流程的操作按钮效果。

2.2 软件操作构建

软件操作构建的主要对象为LC-MS联用仪自带的Workstations系列软件,该软件较为复杂,也是虚拟实验室构建的重点和难点。本文对于该软件的构建主要利用了Dreamweaver和JavaScript方法,实现了基本的流程操作,并加入相关的交互机制和预警机制,保证虚拟实验有效顺利的进行。

2.2.1 实验素材

构建过程中的素材是利用标准物质进样进入液相色谱-质谱联用仪检测,然后通过录屏和截屏软件将关键步骤截图和录像,并利用Premiere和Photoshop对素材进行处理,得到合适格式的素材。

2.2.2 操作流程设计

软件操作的设计流程主要包括以下三个方面:方法编辑和Worklist编辑以及图谱处理。主要形式是以小卡片的形式展现每步操作的要求,初学者必须完成每步要求并输入要求中的数字和模式才能进入下一步操作。Worklist编辑则比较简单,通过编辑工作列表即可进入后续的图谱处理过程。图谱处理过程由于设计上的复杂性,我们采用数据处理时录制的视频来进行演示和教学

2.2.3 整体的结合

在网页中插入超链接,即可进入后续的操作网页,网页和网页之间相互连接,网页中放入自己准备素材文件和图片,并根据各个网页上实验操作的不同设计交互代码,并利用JavaScript实现交互。

2.2.4 交互式设计

交互性作为虚拟实验室的最重要的要求之一,要求设计者能根据用户在使用虚拟实验室过程中出现的一些问题或者一些操作能够有效的做出反馈。这里以样品准备演示的插入和使用为例,在样品准备的实验环节中,我们通过Dreamweaver导入Flash演示动画,当使用的浏览器版本低于我们的要求时,将有效的提醒用户更新Flash Player的版本,之后演示实验中,初学者可以通过控制Flash上的按钮来控制实验演示的进度和步骤进行实验。

3 结果与讨论

利用Dreamweaver、Flash等软件构建液相色谱-质谱联用仪的虚拟实验室,是分析仪器实现模拟的重要方法,该虚拟实验室的内容与实际教学实验的内容相差无几,但对比实际教学,优势在于初学者可以反复学习来熟悉实验,而且虚拟实验室的进行可以避免对于错误操作而导致仪器的损坏。所以该虚拟实验室在加入教学实践以后,证明确实极大提高了教学的效率,学生对于实验技能掌握也更为熟练。

液质联用虚拟实验室在教学方面的呈现较大作用,但仍然有较大的提升空间。在计算机技术日益成熟的今天,利用Unity 3D等立体3D软件进行虚拟实验室的设计将使该设计更上一层楼,实验内容更为生动立体。相信在不久的将来,在我们进一步开发虚拟实验室的功能和设计以后,虚拟实验室会成为教学的必备手段。

猜你喜欢
液相质谱网页
固相萃取-高效液相色谱法测定水产品中四环素类的含量
临床医学质谱检验技术质量管理研究
牙膏中禁用漂白剂的测定 高效液相色谱法(GB/T 40190-2021)
气相色谱质谱联用仪在农残检测中的应用及维护
超高效液相色谱法测定茶叶中的儿茶素
反相高效液相色谱法测定食品中的甜蜜素
基于两种质谱技术检测蛋白酶酶切位点的方法
基于HTML5与CSS3的网页设计技术研究
基于CSS的网页导航栏的设计
基于HTML5静态网页设计