码绘与手绘的对比——动态
版权声明：本文为博主原创文章，未经博主允许不得转载。
图形学最动人的地方就是可以用代码实现图形的动态效果，之前比较了静态效果下的码绘与手绘，传送门：https://blog.csdn.net/weixin_42235718/article/details/84324912
现在比较一下动态效果下的码绘与手绘
普通动态
码绘结果
手绘结果
代码实现
float outerRadius = 9;
int numSpikes = 5;
PVector [] points = new PVector[numSpikes *2 ];
void setup(){
size(640,480);
background(0,0,32);
float angle = TWO_PI /points.length;
for(int i= 0;i<points.length;i++){
float x,y;
if(i%2==0){
x = cos(angle * i) * outerRadius;
y = sin(angle * i) * outerRadius;
}
else {
x = cos(angle * i ) * innerRadius;
y = sin(angle * i ) * innerRadius;
}
points[i] = new PVector(x,y);
}
}
void star(){
translate(width/2,height/2);
smooth();
fill(240,238,31);
noStroke();
beginShape();
for(int i =0 ;i< points.length;i++){
vertex(points[i].x,points[i].y);
}
endShape(CLOSE);
}
void draw(){
for(int j = 0; j<20; j++) {
float dx = random(-320,320);
float dy = random(-240,240);
translate(dx,dy);
float ang = random(5);
scale(ang,ang);
star();
}
saveFrame("star" + ".png");
}
交互动态
码绘结果
由于GIF图片太大无法上传，这里上传简单的几张效果图
手绘结果
代码实现
float innerRadius = 14;
float outerRadius = 36;
int numSpikes = 5;
PVector [] points = new PVector[numSpikes *2 ];
void setup(){
size(640,480);
background(0,0,32); f
loat angle = TWO_PI /points.length;
for(int i= 0;i<points.length;i++){
float x,y;
if(i%2==0){
x = cos(angle * i) * outerRadius;
y = sin(angle * i) * outerRadius;
}
else {
x = cos(angle * i ) * innerRadius;
y = sin(angle * i ) * innerRadius;
}
points[i] = new PVector(x,y);
}
}
void draw(){
translate(width/2,height/2);
smooth();
fill(255,128,0);
noStroke();
beginShape();
for(int i =0 ;i< points.length;i++){
vertex(points[i].x,points[i].y);
}
endShape(CLOSE);
saveFrame("images/star-" + numSpikes + ".png");
}
void mousePressed(){
if(mouseButton == LEFT){
numSpikes += 1; //add an angle
outerRadius -= 10;
PVector [] points1 = new PVector[numSpikes *2 ]; //double the number of the angles
points = points1;
}
if(mouseButton == RIGHT){
innerRadius += 10;
}
setup();
redraw();
}
比较内容
技法
码绘主要就是基于编程能力，绘制图像，将想法通过代码表达出来，其中主要包含了图形中出现的运算，将视觉艺术转化为编程问题，进而变成一部分数学问题；
在码绘动图的过程中：就是考虑所绘图形顶点的个数，然后通过计算将点分类，保存到数组中，最后连接各个定点；此外，星星的出现是动态随机的，设置了随机数循环绘制，最后，设计了交互的部分，点击鼠标左键，就会给星星加一个角，角之间的度数减少10；点击鼠标右键，教的数量不变，但角之间的度数会增加10。
手绘的技法就是个人的绘画水平了，然而直接在平板上绘画和用铅笔在纸上绘画又不太一样。相对而言在纸上画画更容易一些。由于码绘的场景有背景色和图形色，所以我直接在平板上设置了颜色进行绘画。但是手绘星星图案并不止局限于一种顺序，可以凭个人喜好来绘制目标图形，但手绘结果并不是很好看。
虽说手绘的场景也是没有星星顺序的，但凭着个人直觉，会潜意识要求自己下一个星星画在哪里，感性支配的随机并不是真正意义上的随机。
手绘交互那张图的时候，就是通过连接对角线，线条太多的时候已经没办法精确绘制了，整张图就很粗糙。
就技法而言，码绘属于技术范畴，手绘属于艺术范畴，两者其实没有很大的关系。码绘的结果更加规范、美观、严谨；手绘方法较多，有一种涂鸦的乐趣感。
工具
码绘是基于processing实现的，通过setup和draw两个函数，首先设置画布的大小及颜色，再绘制图形函数，最后在draw里面循环调用；通过mousePressed函数实现鼠标交互。
手绘基于平板上的软件，也是设置了背景色和画笔颜色，用触膜笔直接绘画，最后导出文件为png格式。
看下来两者之间并没有很大关系，一个是计算机合成，一个是人工操作，但原理上都是确定两个点，然后连线，只是计算机合成的更加标准。
理念
无论是码绘还是手绘，都是通过一些图形合成自己想要的一幅图像，它蕴含了你在绘画时想表达思想内容,想给欣赏者传递什么信息并在意识上交汇产生共鸣,在确定这些以后用什么的绘画工具风格来表现绘画这题内容。
所以两者的区别在于确定内容后所选择的绘画工具，选择码绘是为了呈现很规范的图形和动态的效果，选择手绘是呈现出每一个图形都不太一样的效果，好像自己在反转。
创作体验
码绘过程中，由于之前没有用过processing编程，然后先去网站上看了几个主要函数的用法和如何通过算法画出五角星；遇到的一大难点就是怎么保留上一帧的绘制并且持续随机绘制，一开始是在循环里面写入算法，发现不行，然后把星星算法写入函数star（），在draw里面调用，尝试了把for循环写到各种地方，把算法写进draw（）函数，都没有想要的效果；还尝试了让星星出现一下再消失，发现闪烁效果不好看，就删掉了那部分代码。交互部分的内容是上网查找资料，然后看到类似代码，直接拿过来用的。
手绘过程中，发现画出来的星星一点都不规范，在远处的小星星就直接用点来表示，涂色过程中，经常涂到外面去，就破环了之前的形状；一开始是一个角一个角的画，发现总是畸形，后来就一笔画完五个角，发现效果反而好一点。
呈现效果
码绘呈现出随机出现星星的动态图，关闭运行之后生成图像，黄色印在深蓝色上面，给人一种发光的效果，有大有小呈现了一部分远近关系，很像童话里的夜晚，坐在山坡上看星星的故事，静谧悠远。
实现交互内容的代码换掉了星星的颜色，他首先形成一个星星，然后点击鼠标左键，会一点一点增加角的数量，中间的图案越来越小。这里先放了三张图呈现总体效果。运行过程中也试了点击鼠标右键的效果，发现很丑，就没有保存。当点击次数达到40以上，就会给人一种太阳发出光芒万丈的感觉，由星星到太阳，也算是收获了意外之喜。还会隐隐觉得线条在动。
手绘就是在“丑陋”中寻找涂鸦的“可爱”，跳跃的孩子，有大有小，动来动去，跳起来、转个方向、坐下等动作（想象）。但是手绘没有码绘产生的一种背景和图形融合在一起、形成一幅完整的星空图的感觉，手绘更像是用黄色的笔在深蓝色的布上绘制的。
手绘的交互场景就比较“惨不忍睹”了，没办法像计算机那样精确的绘制出每个角的度数再呈现在画布中央。像一堆扎在一起的草。
载体
码绘是在processing上运行的，通过鼠标实现交互的功能，计算机自动合成图像；手绘是在平板上绘制的,用画笔实现交互。
局限性
码绘没有动态的展示每一笔的过程，在代码实现过程中，会出错，例如在写如下代码时，出错了好几次，首先是先画star（）在进行平移和缩放，就没有显示，后来直接在star（）里面添加平移和缩放，运行的时候每一个星星显示出来会消失再显示下一个，这并不是想要的结果，尝试了大概五六次，才成功。
手绘的局限性就在于画画过程中，有时候太丑了…画不出有棱有角的五角星，我个人还会纠结下一个星星画在哪里。在绘制交互那个图像时，根本画不出计算机运行出来的x角星，角的大小、线条长度，都是凭感觉画满画布。
但是在国画、水粉、素描方面，码绘是远远不及手绘的，下图是我在假期绘制的一张静物素描，一笔一笔的明暗是代码表现不出来的。
应用
码绘主要应用在规范的场景绘制中，如动画背景、动态的二维或者三维场景、交互等，当需要规范精确的图形图像时，选择码绘是最有效的方法。码绘是学术追求与艺术追求的结合体。
手绘主要源于兴趣，临摹、创作、写生…是一种艺术追求，也是中国的一种传统文化，当今时代比较缺少比较珍贵的手法。
参考文献
1.用代码画画——搞艺术的学编程有啥用？
https://blog.csdn.net/magicbrushlv/article/details/77922119
2.开始第一幅“码绘”——以编程作画的基本方法
https://blog.csdn.net/magicbrushlv/article/details/77840565
3.以编程的思想来理解绘画——（一）用“一笔画”表现“过程美”
https://blog.csdn.net/magicbrushlv/article/details/82634189
4.Processing基本函数绘制图形
https://blog.csdn.net/hewes/article/details/76358957
5.百度——processing交互实现
https://zhidao.baidu.com/question/333052777029474605.html
397
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
