舰船科学技术  2023, Vol. 45 Issue (10): 168-171    DOI: 10.3404/j.issn.1672-7649.2023.10.034   PDF    
舰船智能导航显控界面交互设计与应用
贾园园     
郑州科技学院,河南 郑州 450064
摘要: 为提升显控界面的交互效果,确保舰船航行安全,提出舰船智能导航显控界面交互设计与应用。利用PS平面软件或Axure软件,绘制显控交互界面元件;在Axure软件内,以最大元件间距、最大视觉注意等级与最大隐喻度为目标,建立绘制显控交互界面元件布局模型,通过灰狼搜索算法求解该模型,得到绘制显控交互界面元件布局结果;在布局后的界面内加入交互用例,实现显控界面交互原型设计。若符合交互需求,则完成显控界面交互设计,反之修改界面布局方案。实验证明:该方法可有效布局显控交互界面的元件,并符合人眼的视觉需求;应用该方法后,操作人员操作显控界面时的反应速度较快,θ波功率较低,该方法可有效降低操作人员的脑力负荷,具备较优的交互效果。
关键词: 舰船智能导航     显控界面     交互设计     元件间距     布局模型     灰狼搜索算法    
Interactive design and application of ship intelligent navigation display control interface
JIA Yuan-yuan     
Zhengzhou Institute of Science and Technology, Zhengzhou 450064, China
Abstract: In order to improve the interactive effect of display and control interface and ensure the safety of ship navigation, the interactive design and application of display and control interface for ship intelligent navigation are proposed. Use PS plane software or Axure software to draw display and control interactive interface elements; In Axure software, aiming at the maximum component spacing, the maximum visual attention level and the maximum metaphor, a component layout model for drawing the display and control interactive interface is established, and the grey wolf search algorithm is used to solve the model to obtain the component layout result for drawing the display and control interactive interface. Add interactive use cases into the layout interface to realize the interactive prototype design of the display and control interface; If it meets the interaction requirements, complete the interactive design of the display and control interface, otherwise modify the interface layout scheme. Experiments show that this method can effectively lay out the elements of display and control interactive interface and meet the visual needs of human eyes. After applying this method, the response speed of the operator when operating the display and control interface is faster, and the θ wave power is lower. This method can effectively reduce the mental load of the operator and has better interaction effect.
Key words: ship intelligent navigation     display and control interface     interaction design     component spacing     layout model     gray wolf search algorithm    
0 引 言

舰船智能导航设备可以对航行过程中的诸多因素进行分析,例如海洋气象、船舶状态、交通情况等,从而实现高效的船舶导航。但是,由于复杂的航海环境和多样化的航行任务,确保船员熟练使用智能导航设备成为一个亟待解决的问题。在此背景下,界面交互设计成为了一个关键的解决方案。好的交互设计可以大大提升船员对设备的使用效率,减少操作失误,提高航行安全。

智能导航属于舰船航行的关键设备,在目标定位与路径规划等领域中具有重要作用[1]。操作人员和智能导航系统的交互媒介是显控界面,该界面的交互效果直接影响操作人员的使用体验[2-3],间接影响舰船的航行安全。为此需要研究舰船智能导航显控界面交互设计方法,提升舰船航行安全。

王大颜等[4]设计舰船智能导航显控交互界面,通过模糊层次分析法量化布局原则,构造布局优化模型,通过遗传算法求解该模型,得到交互界面布局优化结果。该方法具备交互界面设计的可行性。宫晓东等[5]利用用户绩效测量表,获取操作者的认知负荷水平,根据认知负荷水平,设计舰船智能导航显控交互界面。该方法可有效实现显控界面交互设计。但这2种方法均未考虑人的视觉注意习惯,无法提升操作人员的舒适性,导致其使用体验较差,降低显控界面交互效果,提升显控界面操作的错漏率。为此以视觉注意机制为研究方向,充分考虑人的视觉注意习惯,研究舰船智能导航显控界面交互设计与应用。使用PS平面软件或Axure软件,绘制显控交互界面元素,并在Axure软件中建立布局模型以最大化元素间距,最大化视觉注意等级和最大化隐喻度。针对该模型,应用灰狼搜索算法来解决并得到绘制显控交互界面的最佳布局结果。进入此布局模式的显控界面中加入交互用例,以实现显控界面的交互设计原型。如果满足交互需求,则显控界面交互设计完成。反之则需要修改界面布局方案,以满足交互需求,确保显控界面的最佳用户体验,提升显控界面交互效果。

1 显控界面交互设计与应用 1.1 显控界面交互设计流程

依据视觉注意机制中间距与视觉等级等影响因素,结合Axure平台,实现显控界面交互设计,提升显控界面交互效果。

具体步骤如下:

步骤1 当舰船智能导航显控界面元件较为繁琐时,可使用PS平面软件制作界面元件;当元件较为简单时,利用Axure软件绘制界面元件。

步骤2 在Axure软件内存储绘制完成的界面元件,在该软件内,建立以元件间距、视觉注意等级与隐喻度为目标的绘制元件布局模型,通过灰狼搜索算法求解该模型。灰狼算法是一种基于自然灰狼行为的优化算法,基本思想是模拟自然界中灰狼群体协同行为,通过群体智能算法的方式来解决优化问题。在每一代中,所有灰狼都会向当前最优解靠近,而领导灰狼则会向全局最优解靠近。该算法具有收敛速度快,易于实现和多维度优化等优点。在交互设计中,可运用灰狼搜索算法来求解最佳布局模型,从而实现更好的用户体验。由此获得绘制元件的布局方案,实现显控交互界面布局。

步骤3 完成显控界面布局后,为各元件设计交互样式,得到交互样例。

步骤4 在界面全部功能空间内加入设计的交互用例,实现舰船智能导航显控界面的交互原型设计,且交互原型的保真度较高。

步骤5 对显控交互原型进行评价,若符合交互需求,则完成显控界面交互设计,反之,返回步骤2,修改界面布局方案。

1.2 舰船智能导航显控交互界面布局

舰船智能导航显控交互界面布局时,影响视觉注意力机制的主要因素有元件间距、视觉注意等级与隐喻度。为此,以最大元件间距、最大视觉注意等级与最大隐喻度为目标,建立元件布局模型,完成舰船智能导航显控交互界面布局。

元件距离目标中包含距离对比度 $ S $ 与距离相关性。 $ d $ 代表舰船智能导航显控交互界面元件间视觉对比程度和相对距离的关系, $ S $ 与元件间相对距离具有负相关关系。显控交互界面元件距离矩阵 $ D $ 如下:

$ D = \left[ {{d_{ij}}} \right] = \left( \begin{array}{*{20}{c}} {d_{11}}& {d_{12}}& \cdots & {d_{1m}} \\ {d_{21}}& {d_{22}}& \cdots & {d_{2m}} \\ {\vdots} & {\vdots}& \cdots & \vdots\\ {d_{m1}}& {d_{m2}}& \cdots & {d_{mm}} \\ \end{array} \right) 。$ (1)

式中: $m $ 为显控交互界面元件数量; $ {d_{ij}} $ 为元件 $ i $ $ j $ 间的距离。 $ i $ 和其余元件间的距离对比度为:

$ {S_i} = \sum\limits_{j = i + 1}^m {\frac{{{w_i}}}{{{d_{ij}}}}} 。$ (2)

式中, $ {w_i} $ 为其余元件权重。 $ i $ 和其余元件的距离相关性为:

$ {H_i} = \sum\limits_{j = i + 1}^m {\frac{{{o_{ij}}}}{{{d_{ij}}}}}。$ (3)

式中, $ {o_{ij}} $ $ i $ $ j $ 间的相关程度。联合式(2)和式(3)可获取元件间距数学模型,公式如下:

$ {Q_i} = {\omega _1}{H_i} + {\omega _2}{S_i} 。$ (4)

式中, $ {\omega _1} $ $ {\omega _2} $ 均为 $ {H_i} $ $ {S_i} $ 的权值。式(4)的约束条件为:

$ {\omega _1} + {\omega _2} = 1 。$ (5)

视觉注意等级越高,显控交互界面越符合人的视觉需求[6]。视觉注意等级数学模型为:

$ {Z_i} = \sum\limits_{u = 1}^m {\sum\limits_{l = 1}^4 {{t_{il}}{M_i}} } \times {Q_i} 。$ (6)

式中, $ l $ 为视野区域编号, $ l = 1,2,3,4 $ ;按照等级ABCE,将舰船智能导航显控交互界面划分成4个视野区域; $ {M_i} $ $ i $ $ l $ 内的面积; $ {t_{il}} $ $ i $ $ l $ 内的等级。

式(6)的约束条件为:

$ {t_{il}} = \left\{ \begin{gathered} 1,\frac{{x_i^2}}{{a_C^2}} + \frac{{y_i^2}}{{a_C^2}} > 1,\frac{{x_i^2}}{{a_E^2}} + \frac{{y_i^2}}{{a_E^2}} \leqslant 1 ,\\ 2,\frac{{x_i^2}}{{a_B^2}} + \frac{{y_i^2}}{{a_B^2}} > 1,\frac{{x_i^2}}{{a_C^2}} + \frac{{y_i^2}}{{a_C^2}} \leqslant 1 ,\\ 3,\frac{{x_i^2}}{{a_A^2}} + \frac{{y_i^2}}{{a_A^2}} > 1,\frac{{x_i^2}}{{a_B^2}} + \frac{{y_i^2}}{{a_B^2}} \leqslant 1 ,\\ 4,\frac{{x_i^2}}{{a_A^2}} + \frac{{y_i^2}}{{a_A^2}} \leqslant 1 。\\ \end{gathered} \right. $ (7)

式中:视野等级ABCE为的区域长轴是 $ {a_A} $ $ {a_B} $ $ {a_C} $ $ {a_E} $ ;短轴是 $ {b_A} $ $ {b_B} $ $ {b_C} $ $ {b_E} $ $ i $ 在显控界面内的位置是 $ \left( {{x_i},{y_i}} \right) $

在视觉注意等级数学模型的基础上,假设隐喻度 $ P $ 代表操作人员的认知行为习惯,其值越高,显控交互界面越符合操作人员的认知程度,交互效果越佳。隐喻度数学模型为:

$ {P_i} = {Z_i} \times \sum\limits_{i = 1}^m {{\rho _i} \times V \times {d_{ik}}} 。$ (8)

式中: $ {\rho _i} $ $ i $ 的重要度权值; $ V $ 为常数; $ {d_{ik}} $ $ i $ 和界面中心 $ k $ 的欧式距离。式(8)的约束条件为:

$ 0 \leqslant {\rho _i} \leqslant 1 。$ (9)

联立式(4)、式(6)、式(8),可获取舰船智能导航交互界面元件布局模型:

$ f{\left( i \right)_{best}} = \max \sum\limits_{i = 1}^m {\left( {{\varpi _1} \cdot {Q_i} + {\varpi _2} \cdot {Z_i} + {\varpi _3} \cdot {P_i}} \right)} 。$ (10)

式中: $ {\varpi _1} $ $ {\varpi _2} $ $ {\varpi _3} $ 分别为 $ {Q_i} $ $ {Z_i} $ $ {P_i} $ 的权值。

以式(5)、式(7)、式(9)为约束条件,利用灰狼搜索算法,求解舰船智能导航交互界面元件布局模型,得到舰船智能导航交互界面元件布局结果。具体步骤如下:

步骤1 以灰狼位置为布局模型的可行解,求解猎物与灰狼的距离 $ G $ ,同时包围猎物[7]

步骤2 求解狼群内灰狼的适应度,以适应度最高的前3只狼为 $ {\theta _1} $ 狼、 $ {\theta _2} $ 狼、 $ {\theta _3} $ 狼,由 $ {\theta _1} $ 发送包围猎物指令至 $ {\theta _2} $ $ {\theta _3} $ ;同时根据 $ {\theta _1} $ $ {\theta _2} $ $ {\theta _3} $ 的位置求解其余灰狼位置。灰狼接近猎物时,需实时更新灰狼位置[8]

步骤3 当协同系数低于1时,狼群攻击猎物;反之,更新灰狼位置;猎物被攻击后,灰狼的位置即舰船智能导航交互界面元件布局结果。

2 实验分析

为了验证舰船智能导航显控界面交互设计与应用研究的效果,设计实验。实验在模拟的舰船导航系统环境中进行,需要配置舰船导航系统,以某舰船智能导航为实验对象,该智能导航具备航向设置、航向选择、航速设置与方位调整等功能。利用本文方法为该智能导航进行显控界面交互设计,分析本文方法显控界面交互设计的可行性。

利用本文方法根据该舰船智能导航的工作需求,为其显控界面绘制元件,舰船智能导航显控界面元件绘制结果如图1所示。

图 1 舰船智能导航显控界面元件绘制结果 Fig. 1 Drawing result of display control interface element of ship intelligent navigation

根据图1可知,该舰船智能导航显控界面内共包含13个元件,利用本文方法对绘制的元件进行布局,确定各元件的位置,各元件的坐标如表1所示。

表 1 各元件的位置 Tab.1 Position of each element

可知,本文方法可有效确定绘制元件的坐标位置,将确定的坐标位置与视觉注意等级、隐喻度结合到一起,获取最终的舰船智能显控交互界面布局结果,如图2所示。

图 2 舰船智能显控交互界面布局结果 Fig. 2 Layout results of ship intelligent display control interactive interface

可知,经过本文方法布局后,该显控交互界面的整体布局比较符合人的视觉需求,利于操作人员对显控界面的操作与观看,可及时发现智能导航过程中存在的故障问题,提升舰船航行安全。实验证明:本文方法可有效布局舰船智能导航显控界面元件,且布局结果符合人的视觉需求,便于查看智能导航的显控信息。

在该舰船上的工作人员中,随机选择8名操作人员,由这8名操作人员对本文方法设计的显控交互界面进行操作,衡量本文方法显控界面的交互效果。衡量指标选择反应时间、错误率与θ波功率。反应时间越短,说明操作人员的交互时间越短,错误率越低,说明交互精度越高,θ波功率越低,说明交互过程中操作人员的脑力负荷越低,即反应时间越短、错误率越低、θ波功率越低,显控界面交互效果越佳,分析结果如表2所示。

表 2 显控界面交互效果分析结果 Tab.2 Analysis results of interaction effect of display and control interface

根据表2可知,8名操作者的平均反应时间是4697.825 ms,并未超过设置阈值,说明应用本文方法设计的交互界面,操作者需要的交互时间较短;平均错误率为0.06%,并未超过设置阈值,说明操作者的交互精度较高;平均θ波功率为17.1 μV2,并未超过设置阈值,说明操作者交互过程中的脑力负荷较低。综合分析可知,应用本文方法后,可有效提升显控界面的交互效果。

3 结 语

在航海行业领域,研究舰船智能导航显控界面交互交互具有重要的作用,下一步工作可以针对性地开发界面产品来优化界面操作,从而提升相应产品在实际应用中的效率和用户体验。从交互设计的角度出发提高舰船智能导航设备的使用效率和安全性,成为今后亟待解决的重要问题。

参考文献
[1]
田胜, 赵立营, 李维. 基于多模态的雷达显控VR人机交互技术研究[J]. 现代雷达, 2022, 44(7): 56-60.
[2]
金昱潼, 吕健, 潘伟杰, 等. 基于视觉注意机制虚拟交互界面布局优化[J]. 计算机工程与设计, 2020, 41(3): 763-769.
[3]
景春晖, 支锦亦. 面向知识重用和智能创新的交互界面进化设计研究[J]. 图学学报, 2021, 42(2): 332-338.
[4]
王大颜, 瞿珏, 王崴, 等. 防空反导装备指控舱显控台界面布局优化设计与评价[J]. 空军工程大学学报(自然科学版), 2021, 22(5): 104-111.
[5]
宫晓东, 龚迁, 刘毓舜, 等. 基于认知负荷理论的雷达信息视图交互设计策略研究[J]. 包装工程, 2021, 42(20): 66-76.
[6]
谷佳, 王昕兵. 基于视觉感知的图形化人机交互界面分层模型[J]. 计算机仿真, 2021, 38(9): 190-193+365.
[7]
马大勇, 李安卓, 徐昕, 等. 基于经验重要度判断的虚拟交互界面布局仿真[J]. 计算机仿真, 2022, 39(11): 230-234.
[8]
马超民, 赵丹华, 辛灏. 基于用户体验的智能装备人机交互界面设计[J]. 计算机集成制造系统, 2020, 26(10): 2650-2660.