动态绘图板

互动媒体技术期末作业

主题

编写一个“绘画系统”，提供一系列绘画材料（例如画笔/颜料/滤镜）给用户操作，以创作出动态/交互的绘画作品。这个绘画系统是对“绘画”的概念的扩展，但仍然体现出与传统绘画系统的相似性。

概念解释

按照文章《什么是绘画？——以抽象思维理解绘画》对于“绘画”的界定，绘画可以看作四个要素的构成：

材料：颜料，画布，画笔等物质要素；

作画者：创作的思想/技法有关的内容；

交互方式：作画者如何操作材料；

作品：即呈现效果。通常的绘画作品；

补充说明：

材料并不直接决定它如何与人交互，实际上可以有不同的交互方式。例如，画笔的交互方式通常是将其直接接触到画布，但波洛克那样的泼洒画法，却采取了不接触画布的交互方式；

////////////////////////////////////////////////////////////////////////////////////////////////////

首先展示我的绘画系统：

这个是由https://blog.csdn.net/qq_27534999/article/details/79427721这位博主的作品学习改编的。

功能丰富，可以调整画布背景色，画动态圆、三角形还有曲线。还可以用五角星、花朵作画。有暂停/播放功能，还有橡皮擦“Eraser”，一键清楚“Clear”，保存画面“Save”。

总体的设计方案

作画的人可以通过改变画笔的颜色，以及画笔的类型在特定的画框中来自由绘画。

这个绘画系统是用p5.js写的。可以从http://p5js.org/zh-Hans/examples/官网的例子中学到很多。

对绘画理念的理解：

       绘画是自由的。你可以用任何工具画出任何你想画的东西。绘画内容可以是情感的表达，情感的释放，或是单纯地提高绘画技巧的练习。我通过一个学期速写课的学习，发现绘画离我们很近，生活中的一切事物都可以作为绘画内容，也可以创作抽象的作品，天马行空。压力大的时候烦躁的时候，或许可以静下心来绘画或者临摹，是释放压力的一种好方法。绘画没有什么难的，别人也很难评价你的作品的好坏，只要你敢于尝试，不断下笔，勇于表达，就能给自己创作出属于自己独一无二的作品。绘画也没有那么简单，需要一定的扎实的绘画技术，最基础的就是线条，打好基础，才能更流畅地表现出你的绘画作品。

 

这次作业学习实现的绘画系统，通过代码实现一个类似于非常常见的画图板，并且是动态绘图板。

下面我从不同角度来比较分析。

从技法（艺术创作的技巧和方法）上说，这个动态绘图板是用p5.js实现的，当然代码语言有很多种，可以用不同的平台来实现这个系统，比如unity软件,或用java语言等。语言的学习主要靠网络资源，我是从官网的例子中得到了很多的启发，再根据自己的想法进行改编，调试代码；

从工具来说，绘画系统都是用虚拟的画笔来进修绘画创作，通过设置画笔的形状和颜色，方便自由快速的更换画笔类型，进行绘画创作。

                            

绘画理念其实和很多艺术创作根源是一样的,它蕴含了你在绘画时想表达思想内容,想给欣赏者传递什么信息并在意识上交汇产生共鸣,在确定这些以后用什么的绘画工具风格来表现绘画这题内容。一般说来，绘画是人类精神自我追问的一种存在方式，同时它又是一种充满灵性的表现艺术。然而，绘画又是一种心境，是一种情绪的自然流动，这已经是绘画艺术最含共性的东西。艺术创作需要激情和感觉，它能带给你瞬间的灵感和顿悟，可以说激情是引导创作的开始。艺术创作时，画家必须真诚，必须激动，必须选择，必须敏锐而自信，必须概括与把握，那是身、心、灵的投入，精、气、神的全面调动的状态。一幅好的作品，应该留下自然所不能替代的东西。不同的作画者有不同的绘画理念，也可能跟绘画工具有关。

那么创作体验呢。这个绘画系统虽然在我看来实现也不是很容易，但是跟电脑系统中的画图板来比，还是非常简洁的。但有特别之处就是动态绘图。常规的绘画系统可以画不同几何形状，还有2D、3D等模式，尤其可以变换逼真的画笔类型，实现不同类型的画，比如油画、彩铅、蜡笔等，画笔种类多样又逼真。但是这次作业实现的绘画系统添加了动态的效果，通过旋转画布，实时变换图形的大小位置方向等方法来实现动态的圆、三角形、星星、花朵等，我还是非常喜欢一闪一闪的星星这个效果的。所以在这个动态绘画系统中创作绘画还是很有趣的，当然，还可以添加跟多图案和效果。

呈现效果当然是动态酷炫的，原版中的圆三角形忽隐忽现，有种黑夜中光影的感觉，我自己改编添加实现的星星与花朵，星星是一闪一闪的，花朵是速度不定地旋转，还是非常美丽有趣的。

这个绘画系统是在VScode中编辑的p5.js代码，编辑调试后，在浏览器中打开.html文件便可以看到这个动态绘图板，所以暂时只能在浏览器页面中实现动态绘图板，还是有一定局限性的。当然这个绘图板还有很多不足，而且我只是在原版的基础上进行了一定的修改调试，编程经验还是不够。而且我也还没尝试生成一个可执行文件.exe，目前只能在浏览器中运行，没有那么方便。画笔的类型上还不够丰富，应该还可以多添加几种。

应用方面，虽然这个绘画系统还有很多不足，但还是可以实现很多基础的绘画功能，其中直线绘画也就是像用铅笔那样画图，还有动态的圆圈、三角形，以及有趣的星星和花朵。还有暂停/播放按钮可以暂停跳动的画面，点击“E”橡皮功能可以擦除画错的部分，实现人性化，点击“C”一键清除画布，非常方便，点击“S”就是保存自己创作好的绘画的图片了。功能简单又丰富，可以进行有趣愉快地绘画创作了！

参考链接：

https://blog.csdn.net/magicbrushlv/article/details/83858469

https://blog.csdn.net/qq_27534999/article/details/79427721

http://p5js.org/zh-Hans/examples/

报告就写到这儿吧~期末就要结束啦！ 提前祝新年快乐  加油。