p5.js 实现动态互动画板

目标

编写一个“绘画系统”，提供一系列绘画材料（例如画笔/颜料/滤镜）给用户操作，以创作出动态/交互的绘画作品。这个绘画系统是对“绘画”的概念的扩展，但仍然体现出与传统绘画系统的相似性；
在材料/交互方式/作品呈现/作画者四个方面中，至少有两方面要体现出与通常的国画/水彩/油画/素描/数位板+电脑作画/钢笔画等大家熟知的绘画形态有较高相似性；
在材料/交互方式/作品呈现/作画者四个方面中，至少要有一方面要体现出不同于通常绘画的特色；
在作品呈现方面，必须体现出动态效果，最好能体现出交互性；

思路

总的来说，大作业实际就是将实验二的内容充实了一下。

读完具体要求之后，我的想法就是用代码实现传统作画的流程，并在过程中尽量像传统绘画靠拢。

于是，我在脑海中走了一遍流程。

首先

传统的绘画方式是在一张纸上完成的。纸所具有的特点是十分独特的。
在传统水墨画中，墨的颜色深浅，力道的大小等等是可以体现在纸面上的。
而且，在纸上留下的痕迹是很难被抹去的。即使是素描等铅笔画，橡皮也无法完全抹去痕迹，这也就让许多人下笔谨慎。
所以我需要一个带有“纸”属性的画板，并在绘画上体现出来。

其次

绘画不仅需要纸，还需要墨，或者说颜色。我看了相关的作品，发现其他作品全是事先给好颜色，而不是允许绘画者自定义颜色。即使有些可以调色，也都是r g b调色法，对一般人来说是很难做到从数值到颜色的转换的。所以，我需要一个直观的方便的调色盘，可以人性化的显示颜色。

总结

了以上想法后，我又看了一下老师给的demo。尤其是p5.js的demo1，黑白的画风与水墨的质感我十分喜欢。
综合了我的想法与“动态”的要求后，我参考了网上的一些作品，做了这个。
从上至下来看
首先是调色盘。显而易见的，我的调色盘可以对颜色的三要素进行简单的调节。在我的室友讨论他们的作品（小王子星球调色）时。我也参与了讨论。关于颜色的三个维度的调节方法有许多，我觉得这个最简单，最直观。
而且，在了解了一些关于现实中调色盘的资料之后，我加入了一个保存以往颜色的功能，以免需要用到之前的一个颜色是还需再配，还不一定能完美还原。

再往下就是画板，操从左至右来看。
首先是“选择画笔”按钮，一共有三种动态画笔可选，分别是圆，三角，线，这点我参考的是别人的方法。然后是“eraser”橡皮擦按钮，可以擦去一些不满意的地方。重点是，它无法完全擦去绘画的痕迹。可以看到，笔墨在纸上留下的“晕染”无法被擦去，有点真实。
如果想完美修改的话，只能按“clear”清除键，重启一张画布，强迫做到下笔谨慎。
而且，可以看到，画笔的墨的确在画板上留下了“晕染”，而且由于画笔的动态效果，晕染