APP下载

基于移动互联网技术的变电运维互动培训系统的设计与实现

2018-09-11黄海宁杜海舟卫春峰

上海电力大学学报 2018年4期
关键词:关卡界面设计变电

黄海宁, 杜海舟, 卫春峰

(1.上海电力学院, 上海 200090; 2.国网上海市电力公司嘉定供电公司, 上海 201800)

变电运维部门在电力系统运行中承担着变电站的运维管理、倒闸操作和事故处理等重要工作,为电网安全、稳定和经济运行提供保障。随着电网规模的不断扩大,变电站数量日益增加,用户对电力系统的要求越来越高,变电运维部门承担的安全压力逐渐增大,因此对员工专业技能的要求也日益提高。考虑到变电运维部门相关岗位存在极高的操作安全风险,如何快速、高效地提升新入职员工的专业技能和专业素质显得尤为关键[1]。

对于新时期变电运维新员工培训模式改进的探究,目前国内外已取得一些成果和解决方案。国外针对变电运维培训模式的改进主要有3个方案:一是通过对新入职员工进行上机操作或通过佩戴虚拟现实头戴式显示设备(VR眼镜)进行培训[2];二是通过远程视频,对新员工进行集体培训[3];三是通过实际操作训练,使理论与实践相结合[4]。

这3种方案虽然在培训效果上取得了一定的成效,但培训成本高、便携性差、隐私性差等问题成为制约其进一步发展的关键因素。

为解决目前变电运维培训存在的问题,国网公司也做出了一些努力,如推出变电运维培训微信公众号、变电运维培训知识小程序。虽然将变电运维培训模式转为移动端,但由于公众号功能及操作的限制,存在对培训数据格式存取的限制,以及公众号对用户消息记录自动清空等诸多弊端,制约了移动互联网这种新技术在电网的推广和功能的扩展[5-6]。

本文针对变电运维培训系统存在的不足,提出了一种把移动互联网技术与变电运维培训相融合的变电运维互动培训系统,即将变电运维培训模式转向移动端,培训不受时间地点约束,方便新员工随时随地进行模拟仿真操作,从而可以使新员工更加高效便捷地获取培训资源,提升培训效果。

1 系统的关键技术

为解决培训新员工手机移动端平台的差异,本文采用最新的跨平台HTML5作为变电运维互动培训系统的前端设计语言;为满足用户对系统功能体验的需求,采用DCloud系列产品来提高产品的原生体验;为适应新员工年轻化特点,采取娱乐与工作相结合的思想,使用LayaAir变电运维互动培训系统引擎技术,将变电运维互动培训系统操作模式融入到培训内容。

1.1 HTML5前端设计语言

变电运维互动培训系统使用HTML5作为前端设计语言,主要因为其两个突出优点:一是兼容性强,即HTML5是唯一可以在Android和iOS等主流平台的跨平台语言;二是传播途径广,安装便捷,响应速度快,为系统在电网内部的推广带来便利。

1.2 DCloud集成框架开发平台

本文使用DCloud来解决HTML5存在的工具包少、能力不足、性能差3个主要问题,使客户对系统的体验更舒适,更快地适应系统培训过程,提高变电运维互动培训的业务水平。DCloud技术结构如图1所示。

图1 DCloud技术结构

1.3 LayaAir应用开发引擎

本文所开发的变电运维互动培训系统面向的是手机移动端,考虑到LayaAir具有突出的三端发布和运行库小巧两个特点,选择LayaAir应用引擎,驱动“五防”和“调操”培训功能,使得培训变电运维互动培训系统在运行内存有限的情况下仍能流畅运行[7]。

2 系统的架构设计

变电运维互动培训系统架构设计思路主要包括以下两个方面:首先,互动培训终端应用将强调面向大众;其次,互动培训终端应用功能模块需要改进。

整个变电运维互动培训系统主要分为3大模块:互动培训终端应用、互动培训系统后台数据源子系统(Data Admin)以及互动培训系统个性化配置子系统(Configure Admin)。终端应用向后台数据源系统发送HTTP请求,后台数据源系统返回JSON格式的数据,同时从个性化配置系统获取数据显示的格式,将互动培训数据配置信息展现于移动设备上。后台数据源系统以及个性化配置系统都是用JAVA软件开发的Web系统,主要为终端应用提供数据、图片和游戏内容[8]。系统架构设计如图2所示。

图2 系统架构设计

3 系统的整体设计

变电运维互动培训系统设计思想是将整体横向分解,并逐步向子任务纵向延伸,使得设计过程清晰明了,为后续的界面优化和软件测试提供便利。系统整体设计结构如图3 所示。

图3 系统整体设计结构

本文将培训互动系统整体设计分为界面美工设计、界面层次设计、数据传递与存储设计3个部分。界面美工主要是对图标图片进行美工,使得图片更清晰。界面层次设计主要目的是使得各界面层次感更强,更易导航。数据传递与存储设计目的是使系统流畅地运行于移动端。本文通过进一步细化设计内容来完成对系统的设计,而各界面设计的优劣则是衡量系统优劣的重要标准。

3.1 系统界面层次设计

通过分析用户进入系统的流程,尽量用更少的视觉层级来展示信息,因此将界面层次设计分为主页界面设计和其他界面设计[9]。

(1) 主页界面设计 通过对系统进行功能需求和用户要求分析,主页界面设计以功能实现为主,划分模块,逐个完成。所采用的是宫格式导航与标签式导航相结合的主页面结构设计模板,突出布局灵活,能适应架构功能的快速调整,满足电网变电运维培训的需要。

(2) 其他界面设计 其他界面设计采取移动端更丰富的导航设计思想,标签位于页面底部,呈现形式是对主页界面九宫格菜单模块的内容扩展,标签导航能够让新员工快速熟悉当前所在的位置,轻松在各入口间频繁跳转且不会混乱,直接展现重要入口的内容信息,帮助新员工对培训内容作进一步操作,减少跳转。

3.2 五防调操功能与存储设计

(1) 五防变电运维互动培训系统 使用JSON格式文件记录变电运维互动培训系统控件的所有信息和过关步骤以及条件,设置两个不同的JSON格式文件,分别记录无步骤的关卡和有步骤的关卡。

(2) 调操变电运维互动培训系统 调操变电运维互动培训系统采用直接写程序,即一关一关写,通过总关卡界面点击的当前关卡数,对应于静态数组的位置,获取当前关卡。

(3) 本地存储 存储用户个人所操作的关卡数、在该手机端所登录的用户信息以及每个关卡用户所花费的时间。在欢迎界面加载系统所用的图片资源,记录当前用户信息作为全局变量。所有用户第一次进入变电运维互动培训系统时,第一关总为黄色按钮,当用户之后再次进入时,记录用户已操作关卡,并将相应的关卡按钮变成黄色,同步用户的进度。

4 系统的实现

本节将从前端展示和变电运维互动培训系统内容演示两方面展示变电运维互动培训系统在移动互联网终端的运行效果。

4.1 前端展示

图4为欢迎界面,由4张滑动图片构成,图片轮播模块播放变电运维最新成果图片,根据用户浏览习惯,在正常不进行操作的状态下,图片将每2 s进行一次轮换。图5为九宫格菜单模块,井然有序且间隔合理,视觉效果舒适,清晰展现各入口,方便用户快速查询,用户可以根据自己的需求选择点击进入其他扩展界面。

图4 欢迎界面

图5 九宫格菜单模块

4.2 五防调操部分

五防练习通过将实际的电气元件以电气符号的方式展现到变电运维互动培训系统中,调操练习通过模拟各种工况下知识问答,实现变电运维互动培训系统关卡的设定,培训新员工可在此界面进行模拟操作。调操练习界面如图6所示。

图6 调操练习界面

5 结 语

本文对变电运维互动培训模式进行了探索性研究,开发的基于移动互联网技术的变电运维互动培训系统缓解了目前培训存在的成本高、周期长、效果差等问题。该系统采用HTML5+LayaAir系统开发引擎技术解决培训过程枯燥、乏味的问题,采用HTML5+DCloud应用服务技术解决培训过程体验差的问题,并在变电运维班组进行了试用。下一阶段将进一步丰富并改进如下内容:全面完善核心功能、优化核心功能;实现对培训数据的分析,完成个性化培训方案制定;强化系统功能,完成上线,实现在各电网公司的变电部门应用推广。

猜你喜欢

关卡界面设计变电
中医养生APP界面设计
“共享员工”平台界面设计
中国传统元素在界面设计中的应用
浅谈变电运行中继电保护问题
面向智能手机的UI界面设计
疯狂冒险岛
变电运行技术在电力工程中的应用
变电设备差异化巡视优化
对变电运行防误闭锁装置的分析
2015年高考江苏省物理卷一道题的3种解法