手绘VS码绘【动态】

手绘VS码绘【动态】

绘画对比

手绘

码绘

比较
对没有手绘功底的人来说，码绘呈现效果会更好，在动态图形中，手绘很难表现，而码绘却可以表现出各种各样的动态效果，码绘的创作能力更高。

实现过程

完整代码

ar l=500;
var w=500;
var a=100;
var px=l/2;
var py=w/2;
var px1=l/3;
var py1=w/6;
var Vx=-2;
var Vy=-3;
var Vx1=-8;
var Vy1=8;
let snowflakes = []; // array to hold snowflake objects
function setup() {
  createCanvas(l, w);
}
function draw() {	
  background(77,707,707,66);
  {let t = frameCount / 60; // update time

  // create a random number of snowflakes each frame
  for (var i = 0; i < random(5); i++) {
    snowflakes.push(new snowflake()); // append snowflake object
  }

  // loop through snowflakes with a for..of loop
  for (let flake of snowflakes) {
    flake.update(t); // update snowflake position
    flake.display(); // draw snowflake
  }
}

// snowflake class
function snowflake() {
  // initialize coordinates
  this.posX = 0;
  this.posY = random(-50, 0);
  this.initialangle = random(0, 2 * PI);
  this.size = random(2, 5);

  // radius of snowflake spiral
  // chosen so the snowflakes are uniformly spread out in area
  this.radius = sqrt(random(pow(width / 2, 2)));

  this.update = function(time) {
    // x position follows a circle
    let w = 0.6; // angular speed
    let angle = w * time + this.initialangle;
    this.posX = width / 2 + this.radius * sin(angle);

    // different size snowflakes fall at slightly different y speeds
    this.posY += pow(this.size, 0.5);

    // delete snowflake if past end of screen
    if (this.posY > height) {
      let index = snowflakes.indexOf(this);
      snowflakes.splice(index, 1);
    }
  };

  this.display = function() {
    ellipse(this.posX, this.posY, this.size);
  };
}


  taiji(px,py,a);
  taiji(px1,py1,a);
  px+=Vx;
  py+=Vy;
	if(px>width-a/2||px<0+a/2){
		Vx*=-1;
  }
  if(py>height-a/2||py<0+a/2){
		Vy*=-1;
  }
  taiji(px1,py1,a);

  px1+=Vx1;
  py1+=Vy1;
	if(px1>width-a/2||px1<0+a/2){
		Vx1*=-1;
  }
  if(py1>height-a/2||py1<0+a/2){
		Vy1*=-1;
  } 
  s=sqrt((px-px1)*(px-px1)+(py-py1)*(py-py1));
   if(s<a){
		Vx1*=-1;
    Vy1*=-1;
    Vx*=-1;
    Vy*=-1;
  }
 }
function taiji(px,py,a)
{
   
fill(255);
arc(px, py, a, a, 0, PI, OPEN);
fill(0);
arc(px, py, a, a, PI, 2*PI, OPEN);  
fill(0);
arc(px-a/4, py, a/2, a/2, 0, PI, OPEN); 
fill(255);
arc(px+a/4, py, a/2, a/2, PI, 2*PI, OPEN); 
fill(77,707,707,66);
ellipse(px-a/4,py,a/7,a/7); 
fill(77,707,707,66);
ellipse(px+a/4,py,a/7,a/7); 
}

总结分析
技法：不考虑美观的话手绘比较方便，可以怎么想怎么做，而码绘却比较复杂，需要转换为代码。
工具：手绘可以用笔，数位板等等，码绘是代码和编程工具
理念：手绘怎么想怎么画，码绘需要转换思维，用数学的思想考虑
创作体验：手绘更加友好轻松，画了会马上呈现效果，而码绘却只能面对代码，需要运行才知道效果
呈现效果：对没有手绘功底的人来说，码绘呈现效果会更好，在动态图形中，手绘很难表现，而码绘却可以表现出各种各样的动态效果，码绘的创作能力更高。
应用：手绘可用于静态绘画，更容易表现精细细节，而码绘更擅长动态几何图形的表现，可用于动画，游戏，动图，动图界面展示等等方面，适用范围很广。