基于手势识别的交互式生成艺术平台设计与实现.pdf

信息与电脑人工智能与识别技术Information&Computer基于手势识别的交互式生成艺术平台设计与实现2023年第10 期陆雅娟马仲康刘凯凌坤龙商艺（广西大学计算机与电子信息学院，广西南宁摘要：为了使艺术设计更为普及，文章提出了基于手势识别的人工智能生成艺术设计。通过采集用户的手势识别结果，结合用户需要的生成艺术效果，在MediaPipe机器学习框架下，首先对OpenCV捕获的图像进行检测，其次精确提取手部状态信息，再次调用AutoPy和PyAutoGUI，生成手部姿势和指令动作之间的映射，最后结合Processing和p5.js设计并实现一个基于手势识别的交互式艺术平台，有效实现了用户和作品之间双向、实时的艺术交互。关键词：手势识别；生成艺术；人工智能；Processing中图分类号：TP18Design and Implementation of Interactive Generation Art Platform Based on530000)文献标识码：A文章编号：10 0 3-9 7 6 7（2 0 2 3）10-17 2-0 4Gesture RecognitionLU Yajuan,MA Zhongkang,LIU Kai,LING Kunlong,SHANG Yiru(School of Computer and Electronic Information,Guangxi University,Nanning Guangxi 530000,China)Abstract:In order to make art design more popular,this paper proposes an artificial intelligence generation art designbased on gesture recognition.By collecting the users gesture recognition results and combining with the users requiredgeneration art effect,under the MediaPipe machine learning framework,the image captured by OpenCV is detected,and thehand status information is accurately extracted.Then,AutoPy and PyAutoGUI are called to generate the mapping between handposture and command action.Finally,an interactive art platform based on gesture recognition is designed and implemented bycombining Processing and p5.js,Effectively achieving bidirectional and real-time artistic interaction between users and works.Keywords:gesture recognition;generative art;artificial intelligence;Processing0引言随着全球经济的发展和人们对艺术文化发展的日益重视，人工智能赋能艺术设计成为了近年来国内外学者讨论的热点话题。文章提出的基于手势识别的人工智能艺术生成平台设计与实现，以手势识别为基础，实现了生成艺术的效果。由此可知，可以通过计算机程序设计语言实现多样化的艺术设计效果。而传统的艺术设计过程存在设计周期长、耗费人力物力成本高、大众普及率低等设计壁垒。因此，人工智能赋能艺术生成变得愈发重要。文章基于MediaPipe库实现手势的检测和识别，通收稿日期：2 0 2 3-0 4-0 2基金项目：广西大学校级重点大学生创新创业训练计划项目（项目编号：2 0 2 2 10 59 39 2 2）。作者简介：陆雅娟（2 0 0 1一），女，广西钦州人，本科在读。研究方向：人工智能。过Processing编程提供的像素流体动画和图像处理技术，实现艺术设计效果，具有较强的人机交互性。用户只需提供预设计的思路便可实时得到生成艺术效果。1技术路线艺术设计平台的技术路线如图1所示。艺术设计平台可分为“烟波浩渺”“随机触手生长”“智慧签名”共3个主体项目。首先，从手势识别项目出发，通过手部区域和手部状态的精确图像识别利用回归算法精确定位手指关节坐标关键点；其次，通过多帧图像判断用户的手势，从而执行相应的手势算法，进而对上述3个主体项目实现手势操作；再次，辅以Java的语法设计、随172信息与电脑2023年第10 期Information&Computer机算法、图像处理技术实现3个主体项目，实现用户签名、打卡、动态景色等操作；最后，应用手势识别的3个主体项目组成基于手势识别的交互式艺术设计平台。2平台设计与实现2.1实现思路2.1.1手势识别项目利用OpenCV进行图像捕捉，配合强大的MediaPipe库实现手势检测和识别。MediaPipe作为谷歌学术研究部开发的一个开源框架，利用机器学习技术从一帧中能够推断手部2 1个关键点的坐标，实时性能较高 2。手部关键点坐标如图2 所示。AutoPy和PyAutoGUI是Python提供的简单跨平台图形用户界面（GraphicalUser Interface，G U I）自动化工具，能够控制鼠标和键盘等输入设备。首先，利用单目相机获取手势图像；其次，使用MediaPipe机器学习框架进行手掌动作检测，并建立和屏幕之间的交互映射关系；最后，根据3个主体项目实际交互需求，控制鼠标和键盘进行手势动作定义及控制指令输出 3。2.1.2“烟波浩”项目Processing是一种具有前瞻性的新兴计算机编程语言。本次设计基于像素的流体动画和图像处理技术实现，使用Processing提供的DwPixelFlow和DwFluid2D基于手势识别的交互式艺术设计平台87645321人工智能与识别技术库来创建流体动画和粒子系统，进而实现流体模拟和水波纹等功能。同时，配合手势识别技术，用户在单目相机前移动手势，可在画面中呈现水波纹的滑动轨迹。2.1.3“随机触手生长”项目使用Processing进行开发，依赖于动态随机扩展算法和粒子系统实现。粒子系统能够在画布上生成各种运动和行为的彩色粒子，每个粒子赋予动态随机扩展的特性，从而实现随机化触手。结合手势识别，通过手势控制鼠标点击或移动实现随机触手的生长。2.1.44“智慧签名”项目“智慧签名”项目基于p5.js和签名算法实现。p5.js是一个用于创造性编码的JavaScript库 5。首先，使用p5.js库创建可视化应用程序，编写交互式画板应用程序，提供选择工具、设置摩擦阻力等功能。其次，将签名算法加人应用程序，根据签名算法提供不同的画幕模式。最后，配合手势识别进行艺术创作。2.2具体实现方案2.2.1手势识别项目使用OpenCV和MediaPipe实现手势识别可分为4个步骤。第一，加载手部检测模型。使用MediaPipe中的Hand类加载手部检测模型，并将其应用于单目相机捕获的每一帧图像，以检测手部位置和姿势。第二，提组成实现用户签名、打卡、动态景色等操作Java的语法设计、艺术化随机算法和图像处理技术等方法手部区域、手部状回归一对手指关节坐标的态的精确图像识别算法图1总技术路线12161115101418913根据手势判断结果执行相对应的各种手势算法多顿判断得到用户精确关键点定位的手势0-腕关节10-中指-近侧指间关节1拇指-腕掌关节11-中指-远侧指间关节202拇指-掌指关节193-拇指-指间关节4拇指-指尖关节5-食指-掌指关节6-食指近侧指间关节177-食指远侧指间关节8-食指指尖关节9-中指-掌指关节图2 手部关键点坐标173一12-中指指尖关节13-无名指-掌指关节14-无名指-近侧指间关节15-无名指远侧指间关节16-无名指指尖关节17-小指-掌指关节18-小指-近侧指间关节19-小指-远侧指间关节20-小指指尖关节信息与电脑人工智能与识别技术Information&Computer取手部关键点。对于检测的每个手部，使用MediaPipe中的手部关键点检测器提取关键点的位置。第三，计算手部姿态。基于手部关键点的位置，可以计算手部的姿态。第四，应用手势分类器。对于每帧图像检测的手部姿态，调用AutoPy和PyAutoGUI控制鼠标和键盘，并执行相应的指令或动作。手势识别的具体实现方案如下。第一，对手部检测模型进行初始化，定义为类handDetector，使用OpenCV调用单目相机捕获图像，并调用handDetector中的findHands方法，检测并标记每帧图像中的手部位置和姿势，将手的位置和姿势信息存储于results列表。第二，使用handDetector中的findPosition方法，根据第1步得到的results列表检测并返回每个手部的2 1个关键点坐标，并将信息存储于lmList列表。第三，根据第2步得到的手部关键点坐标信息lmList列表，对大拇指和其余手指进行伸展状态判断，将判断结果写人fingers列表。第四，由第3步得到的列表fingers可知手指的伸展状态，由此判断每帧图像手部的姿态。第五，调用AutoPy和PyAutoGUI控制鼠标和键盘执行相应的指令动作。表1展示手的状态对应的姿态和相应的指令，图3为5种手势结果。2.2.2“烟波浩渺”项目本项目采用Processing程序语言编写，程序运行时自动调用setup方法，选择P2D模式进行绘制。同时，调用draw方法绘制背景并加载图像元素。最后，创建状态0123452023年第10 期一个DwFliud2D实例，表示液体效果的处理器，并创建两个图层，分别为流体效果层和绘制层，用于煊染液体效果和粒子系统，编写程序处理每一帧的绘制和更新，实现流体模拟的效果。对于水面波纹，使用disturb、water、u p d a t e D a t a 共3个方法实现。其中，disturb用于实现产生波纹的效果，water方法绘制波浪的效果，updateData实现更新下一顿的波浪效果。通过手势识别控制鼠标和键盘实现流体模拟、水波纹、迷雾以及雨天等艺术效果。图4为流体模拟效果。图4流体模拟效果2.2.3“随机触手生长”项目“随机触手生长”项目采用Processing程序语言编写。首先，在setup方法设置画布属性和帧率、绘制背景，调用colorMode方法，设置处理颜色的数据方式为红、表1手部状态对应姿态及指令手部姿态无状态手指只有食指处于伸展状态手指的食指和中指都处于伸展状态手掌完全张开手掌握拳手指的食指、中指、无名指同时伸出指令动作无移动鼠标两指距离较短时点击鼠标左键按下键盘“2”/“w”检查最近是否有5指张开的情况按下键盘“3”/“e”(a)状态为 1(b)状态为 2(c)状态为 3图35种手势结果174一(d)状态为 4(e)状态为5信息与电脑2023年第10 期Information&Computer绿、蓝（Red Green Blue，R G B），初始化Particle类对象数组pts。Pa r t i c l e 类为自定义用于构建粒子系统，并在类内部设置其大小、颜色、偏移量等属性随机化，即动态随机扩展，一个Particle类可抽象为一个粒子。其次，当鼠标按下时，更改布尔型变量onPressed为true，随后会调用draw方法。再次，在draw方法中，对Particle类对象数组进行遍历，逐个更新并绘制粒子状态和位置。最后，设置键盘操作，结合手势识别，通过手势控制鼠标移动或点击，实现随机触手的生长，控制键盘执行清空或保存操作。图5为粒子属性的随机生成效果。人工智能与识别技术画幕6:叠加线屏：关计画笔尺寸12.5.00-0100画笔速度0.0 0 10.500画纸摩擦0.0 0 110.5000分夏110.000020画幕453结语在MediaPipe机器学习框架下，对OpenCV捕获的图像进行检测，并精确提取手部状态信息，再调用AutoPy和PyAutoGUI，生成手部姿势和指令动作之间的映射，最后结合Processing和p5.js设计并实现了一个基于手势识别的交互式艺术平台。该平台能够将不同的手势指令可视化，生成具有丰富艺术效果的创作，利用相关技术将用户和艺术直接联系，有效实现了用户和作品之间双向、实时的艺术交互分一203.125图6“智慧签名”的生成效果参考文献图5粒子属性的随机生成效果2.2.4“智慧签名”项目“智慧签名”项目通过p5.js编写程序。首先，编写用户界面（User Interface，U I），包含滑块、画幕、文本等控件，编写collisionRect方法设置按键的碰撞属性，txtButtonRect方法设置按键的文本属性，drawTxt设置其他文本属性，mousePressed、m o u s e R e l e a s e d、m o u s e Dragged设置鼠标按下、释放、拖拽实现人机交互。其次，对提供的6 种画幕分别编写不同的绘图模式，即不同的签名算法drawld r a w 6。再次，在sliderRect方法中编写可以设置画笔尺寸、画笔速度、画纸摩擦等属性的代码。最后，在draw方法中调用上述方法实现操作鼠标可在6 种幕布中调换，并滑动滑块设置相关属性的功能。由此，配合手势识别可在项目中6 种不同画幕下进行艺术创作。“智慧签名”的生成效果如图6 所示。1张耿，田晓艺.生成类动图的发展历程及其趋势.艺术与设计：学术版,2 0 2 1,2(9):6 9-7 1.2刘德发.基于MediaPipe的数字手势识别.电子制作,2 0 2 2,30(14):55-57.3孟杰，杨鹏程，杨朝，等.基于Mediapipe的幻影成像装置自然手势交互系统设计 J.国外电子测量技术,2 0 2 3,42(3):116-12 2.4董灵逸，朱诗源，汤天乐.数字生成艺术在动态视觉设计中的应用研究：以Processing为例 J.科技传播,2 0 2 2,14(17):8 0-8 2.5SABUNCUOGLU A,SEZGIN T M.Kart-ON:anextensible paper programming strategy for affordableearly programming educationCj/Proceedings of theACM on Human-Computer Interaction,2022:1-18.175