基于计算机图形学的按键布局设计方法研究

周媛 周瑄

关键词：泰森多边形理论 逆蒙特卡罗理论 贝塞尔曲线理论 按键布局 方法研究

引言

随着科学信息技术的到来，产品按键逐步成为各种按键面板的主导，按键的布局设计正逐渐向个性化与功能化相融合的趋势发展。然而，通过对现有产品按键布局进行调研和文献分析，按键布局设计相对来说还存在一定的局限性。在国内外的研究中，该领域主要是围绕按键的人机工程设计以及计算机键盘设计等维度展开[1]。按键的人机工程研究是为了缓解使用者长期操作产生的疲劳感，避免误操作的发生。有必要时还会针对不同用户类型进行研究，例如，基于人机工程理论的适老化按键设计[2][3]。而对于计算机键盘的设计[4][5][6]则考虑的是数字键盘的排列方式、人机鼠标研究等领域。

基于以上分析，目前多数的研究趋向用户操作的生理特性，相对来说仍然比较单一，不仅未同时满足产品功能与其个性化之间的融合，而且也没有对其形成一套定量全面的思路与方法。因此，本文借用计算机图形学相关理论有效地提出了一种新的产品按键布局定量设计方法，建立了一种与功能更匹配的个性化产品按键设计体系流程，满足了个性化及形状与功能相匹配的目的，为今后产品按键创新设计和方案优选提供了参考。

一、基本原理

（一）POWER DIAGRAMS基本原理：POWER DIAGRAMS是一种广义的加权Voronoi图[7]。但POWER DIAGRAMS不同于Delaunay三角化对偶所形成的经典Voronoi图，它是从一组种子点及其相应的权值出发，先生成超平面映射，将种子点及其权值映射到高维空间，再通过寻找高维空间内的凸包，生成泰森多边形。当权值均为0时，POWER DIAGRAMS退化为经典的Voronoi划分。李佳田等[8]顾及地物的空间分布形态和几何特征，从地物Voronoi图出发，提出复合 Voronoi生长元高度、Voronoik阶邻域缝隙及Voronoi阶邻域可视性特征的地标提取方法。可以看出，POWER DIAGRAMS经典的Voronoi划分可以科学地计算出各项要素的权重值，帮助设计师进行等级评价和优先次序排序。

（二）逆蒙特卡罗基本原理：逆蒙特卡罗方法（Reverse MonteCarlo Method）作為标准的Metropolis-Hastings算法的变形，是一种用来解释实验现象和发现物理规律的技术手段，常应用于基础学科的研究中。逆蒙特卡罗方法其核心思想在于，首先通过满足确定物理约束的大量重复实验，随机游走；再根据所建立的数学模型，逆向调节参数，确定游走方向；最后，达到与实验数据更好的拟合效果[9]。王丽燕等[10]在降低研发成本的条件下，对高温作业防护服的厚度值进行了优化求解。在满足约束条件的情况下，对防护服第2层与第4层厚度的最优设计采用蒙特卡罗算法，可避免陷入局部最优解，使得研究的成本有所降低，研发的周期有所减短。采用逆蒙特卡罗相关理论，对模型进行取点、测试、优化，以此找到最佳精确度。该方法的运用也为高温防护服的设计提供了不同设计思维的参考。

（三）BEZIER曲线基本原理：二十世纪六十年代晚期，法国工程师皮埃尔·贝塞尔（Pierre Bézier）应用数学方法为雷诺公司的汽车制造业以稳定数值描绘出了贝塞尔曲线[11]。该方法在CAD／CAM技术中得到了广泛应用，在设计中能满足包括初始状态约束、目标状态约束、曲率连续约束等条件[12]。张海军和郭雪岩等研究人员，采用BEZIER曲线，利用了相对少的控制点云数量，再利用BEZIER曲线理论综合对比了三种不同参数化方法关于飞艇外形拟合性能的差异[13]，达到飞艇外形设计的高精度、高效率的拟合。可以看出，BEZIER曲线理论在设计中充分发挥了一定的作用。

二、研究设计

本文基于POWER DIAGRAMS、逆蒙特卡罗、BEZIER曲线理论的基本条件和演绎步骤，探索将计算机图形学理论[14]融入产品按键布局的设计中，构建出更加系列化的创新设计方法。按键布局设计推演流程见图1。第一步，基于控制voronoi划分技术随机撒点，且对每个点赋予一定权重，按照权重进行划分；第二步，对第一步所得结果借用逆蒙特卡罗优化方法对其区域空间进行划分，根据其分布条件，随机游走，循环操作；第三步，借用贝塞尔曲线（Bezier）技术对按键形状进行细化设计，确定光滑按键的轮廓。最终构建出与其功能更匹配的个性化产品按键设计。

第一步：POWER DIAGRAMS空间划分

设产品按键所在平面空间G=[Bu，Bd]×[Bl，Br]，Np为该空间内所需放置按键数。其中，Bu、Bd、Bl、Br分别表示随机源点在该平面空间上、下、左、右的边界。根据算法公式

在G中生成Np个随机源点Pk（Xk，Yk），k=1，...，Np，形成随机分布的点云。然后，对每个随机源点Pk赋予权值Rk。在本文中，为避免权值过大引起的源点不在对应泰森多边形内的情况，Pk点权值Rk的取值范围为[0，dis_min]，且dis_min为Pk点到所有随机源点间的最短距离（如图2所示）。

第二步：逆蒙特卡罗优化划分

设由点云P与权值R构成的三元组为{（P，R，B），且B为边界} ，基于此，所有泰森多边形生成的集合记作Qk，{Tk|k=1，...，Np}，且随机源点Pk对应的泰森多边形为Tk，面积记作M（Tk）。三元组（P，R，B）生成的所有泰森多边形的面积分布记为状态W（P，R，B）={M（Qk|k=1，...，Np）}。定义同一边界B下的两族点云权值集合分别为（P1，R1）、（P2，R2），同时所对应分布 W1，W2之间的距离为

记理想分布为W*，初始点云P0 ，权值R0，边界条件 对应分布为Wo。为了使分布满足其理想分布条件，此阶段借助逆蒙特卡罗方法，采取随机试验，逆向决定初始点云与权值，使得最终分布与理想分布的距离低于设定的距离阈值 。具体的步骤如下：①根据初始点云位置P0与权值R0确定当前分布Wo；②计算出初始分布Wo与理想分布之间的距离Do；③随机选取点云P0与权值R0中的一个变量根据如下公式进行随机游走。

得到一组新的点云与权值P1，R1；④计算P1，R1与边界B决定的分布W1与理想分布W的距离D1；⑤若D1＜ DO，则更新P1=P0，R1=R0；⑥循环上述过程直至分布距离小于给定阈值eps（如图4所示）。

第三步：Bezier曲线设计输出

已知，泰森多边形集合为{Qk|k=1，...Np}，此时，需考虑基于Bezier曲线技术在泰森多边形内完成按键形态的构造。设泰森多边形Tk的节点为P1，...，Pi，中点为M1，...，Mi，，节点Pi和中点Mi所形成的控制点为{Ck|i=1，...2n}，且 为节点个数（如图6所示）。Mi、Ci、Ci+1、Mi+1构、成了一组中点Mi和Mi+1的对应控制顶点集合Zk，根据控制顶点集合Zk的Bezier曲线公式：

得到所有中点Mi、Mi+1对应生成的泰森多边形Tk，由此形成相应的按键形态，最终构成一组产品按键布局的设计（如图5所示）。

三、实证应用

（一）样本检验

在日常生活中可发现，如今的终端设备中多少都会含有各种按键来辅助功能的实现，而键盘设计个性化与功能的统一已经成为影响电脑使用和人类健康的一个因素[16]。按键布局设计中，基于保持整体按键多样性的前提下，为验证对按键大小定量控制的可靠性，设置不同且具有代表性的按键大小分布进行实证检验。

根据调研分析得知，按键布局种类大致包括硬件设备按键布局，比如a1 、a2 、a3 、a4 、a5 、a6 、a7与界面设备按键布局b1 、b2 、b3 、b4 、b5 、b6 、b7。其中，按键布局主要存在三种分布状态：第一种为产品中所有按键大小均匀分布、第二种为产品中所有大小不一的按键随机分布、第三种为产品中所有按键依次呈现递增或递减的趋势分布。在生活中，这三种情况的按键分布出现频率较高，比如常见且比较有代表性的a1 遥控器按键、a5 音箱按键、a6计算机键盘按键、b1游戏机按键等（如图6所示），其三类产品按键设计布局采用比较规则保守的设计，虽节约空间、减少了工艺及材料等成本，但也导致千篇一律，缺少个性。因此，在满足用户需求的前提条件下，采用以下方法在定量情况下控制按键布局，使得产品按键布局设计各不相同，实现按键布局的个性化。具体流程如下：

首先，设定该按键区域空间G的范围取值为[0，1]×[0，1]，总按键数Np为10，初始权重值R0为0，根据上述公式（1）生成的随机源点为 Pk（Xk，Yk），k=1，...，10。泰森多边形的面积实际分布状态记为W1 、W2 、W3 ，理想分布状态为

其次，在按键区域空间G中随机撒10个点，基于此开始进行初始源点随机PD划分，初始PD化分后，所呈现出的泰森多边形为图所示。 根据上述逆蒙特卡洛算法，首先判断是否满足停机条件。若该划分不满足逼近其理想分布W*1、W*2、W*3的停机条件，即可通过其中一个随机源点随机游走点云的位置Pk和权重Rk。其中，点云位置Pk不超过按键区域空间G取值范围[0，1]×[0，1]，同时，权重值Rk变化不超过条件随机游走，点云位置Pk及权重Rk游走的步长Dk分别设置为0.001。根据上述公式（5）随[0，dis_min]机游走后，再判断是否满足停机条件，若不满足条件继续进行循环，直到实际分布W1、W2、W3和对应的理想分布W*1、W*2、W*3误差为0.001，满足停机条件，循环停止，即可得到近似理想分布。

最后，借助贝塞尔曲线进行具体形态的优化设计，在三种分布状态下，算法总迭代次数达分别为268次、360次、237次，最终相对误差分别为0.001、0.007、0.001时，满足分布条件，实现产品按键功能与布局形态个性化融合，达到算法提出的目的（如图7所示）。

（二）实际应用

现如今，随着经济的发展，人们生活水平的提升，空调已成为室内不可替换的家用设备，空调遥控器充当了不可缺失的角色。当今用户首选产品条件已经不再是简单满足物体的基本功能，消费者更喜欢满足功能与个性化美观共存的物质产品[17]。

分析得知，现有相关遥控器产品整体外观设计为长方形，其内部按键布局由包括温度调整区、常用功能区、不常用功能区三个部分组成。其中，根据人们的认知性强弱维度来看，方便人们肉眼观察以及调整温度，温度调整区放于靠近显示屏最近的地方；从左到右来设置按键位置，最敏感按键位于靠近大拇指最近的区域，依次类推，中间放常用且辨认率最高的功能键与开关键，用户易识别使用；不常用功能区设置在最远不易接触区域，避免误操作；键盘最底部为产品品牌标识，便于用户识别品牌。用户在使用遥控器时一般使用食指和中指来控制按键，长期这样的姿势控制会造成手部以及视觉的疲劳，使得用户操作灵活性和准确性有所降低。此外，大部分遥控器的按键布局分布相对不合理，尺寸不匹配，比例不协调。

因此，随机选定现有一款常见的空调遥控器为目标遥控按键。为了更好地在定量层面控制产品按键的布局，满足其个性化及形状与功能相匹配的目的，利用上述的方法对其做出相应的定量分析，然后对该方法分析所得出的算例进行实际应用。首先，确定遥控按键区域空间G的范围取值为[0，60]×[0，60]，总按键数Np为10，初始权重R0为0，根据上述公式（1）生成的随机源点为Pk（Xk，Yk），k=1，...，10，其中，P1=（20，50）、P2=（30，50）、P3=（40，50）、P4=（30，38）、P5=（18，28）、P6=（18，18）、P7=（18，10）、P8=（41，28）、P9=（41，18）、P10=（41，10）（如图8所示）。泰森多边形面积实际分布状态记为Wk，理想分布状态为W*k，且确定每个按键具体坐标位置和实际分布的状态值，其中，W1=0.38、W2=0.38、W3=0.38、W4=1.68、W5=0.64、W6=0.64、W7=2.16、W8=0.64、W9=0.64、W10=2.16（如表1所示）。

其次，利用上述樣本检验方法进行算例循环，直到实际分布Wk和对应的理想分布W*k误差为0.001，满足停机条件，循环停止，即可得到近似理想分布。再借助贝塞尔曲线进行具体形态的优化设计，在这种分布状态下，算法总迭代次数达分别为182次，最终相对误差为2.632时，满足分布条件，实现产品按键功能与布局形态个性化融合，达到算法提出的目的（如图9所示）。

最后，设计师根据算法定量分析推演出来的特征形状，借用Rhino3D NURBS软件与KeyShot渲染软件对此展开产品按键布局的设计。在设计之前，按键造型会从尺寸、形状、颜色三个基本属性等维度考虑，每个功能按键借用尺寸与形状的不同来降低操作失误程度。产品的开关功能按键的色彩设计高明度、高纯度的显著色调，以便于用户第一识别，抓住首要关键信息。因此，色彩采用产品本身的浅白色、浅灰色及黄色点缀，给用户一种温馨、居家、舒适的感觉。产品按键设计造型在定量分析的基础上不断完善逼近，同时对其进行特征细节的追踪优化，提升了按键布局面板的饱和度，产品最终的方案设计效果如图10所示。以上所探索分析的按键布局方法只是定量分析中的一种形式，在今后的实践设计中可根据用户的实际需求、产品的实际用途、设计师的经验来结合设计约束输入自行推演。

结语

为了有效地进行产品按键布局设计，多数方法往往通过借助人机工程学、人体行为学与心理学与产品有效进行设计融合，使产品本身与按键之间使用率达到最大化。而本文方法依据计算机图形学的性质，结合POWER DIAGRAMS、逆蒙特卡罗、BEZIER曲线理论及算例分析快速地选取产品按键布局特征，并作为显著性因子，其优点在于：（1）从数字化的角度出发，采用定量数据分析选取显著性影响因子，降低了特征选择的复杂程度，保证产品固有的功能性质；（2）结合多个可视性产品按键布局分析，更符合实际情况中多视角的设计认知，更有利于按键布局个性化与功能化设计的融合。

基于POWER DIAGRAMS、逆蒙特卡罗、BEZIER曲线理论的提取方法，可作为按键布局设计的基础，并可验证按键与其邻近产品周边的几何分布特征对产品使用的重要性，产品功能性因素和算例数据分析将在后续工作中着重研究。