手绘vs码绘

手绘vs码绘，你觉得呢

码绘——顾名思义就是用代码画画，第一次接触到码绘的时候还是在MFC上用MoveTo(),LineTo()艰辛地绘画，十分地心酸。
这次幸运地遇上了P5.js, 绘画起来较之之前方便很多

说到P5.js,官网上有十分详细的介绍P5.js官网，在这里不多说了。下载好相关的库在html界面引用就好

当然，你也可以直接在网上进行编辑
网址1
网址2
在这里,我用的代码编辑器是vscode
首先建一个js文件 并在网页中进行引用
那我们开始第一幅码绘作品吧 GO!!!
1.创建你想要的画布大小
function setup() { createCanvas(850, 800); }
2.在function draw(){}函数中进行绘画

设置背景颜色

background(129,193,252);

设置线宽strokeWeight(3);

   //脸
     fill(210,145,14);
     rect(350, 150, 200, 180); 
     fill(0);
    //耳朵
     drawEar();
     //上脸
     ellipse(450,230,130,70);
     fill(255);
     //眼睛
     drawEye1(420);
     fill(0);
     drawEye2(430);
     fill(255);
     drawEye3(435);

//身体
     fill(210,145,14);
     quad(450,330,370,410,450,490,530,410);
     //鼻子
     fill(0);
     drawNose(56);
     fill(255);
     drawNose(20);
    //脚
     fill(117,111,108);
     drawFoot();

    //尾巴
     fill(210,145,14);
     triangle(370,410,270,430,300,480);
     arc(285,455,58,58,HALF_PI/3*2,HALF_PI/3*8);
    //花纹
     fill(255);
     line(420,494,424,488);
     line(426,494,430,488);
     line(480,488,484,494);
     line(474,488,478,494);

     strokeWeight(10);
     line(266,434,296,480);
     line(296,428,314,460);
     line(326,422,334,440);
     strokeWeight(0);
     fill(0,255,0);
     for(var i=0;i<=75;i++)
        grass(i*10+30);
        fill(255);
        for(var i=0;i<=6;i++)
        cloud(i*150);

咳咳，画出来的大致样子就是这样，小老鼠加小浣熊的结合体，手绘。。见笑了。。。

一些画小部件的具体函数代码如下

function drawEar(){
    arc(350, 150, 100, 100, HALF_PI,HALF_PI*4);
    arc(550, 150, 100, 100, -PI, HALF_PI);
  }

  function drawEye1(x){
    ellipse(x,230,56,56);
    ellipse(x+60,230,56,56);
  }

  function drawEye2(x) {
      ellipse(x,230,24,24);
      ellipse(x+40,230,24,24);
  }

  function drawEye3(x){
    ellipse(x,230,10,10);
    ellipse(x+30,230,10,10);
  }

  function drawNose(x){
    ellipse(450,330,x,x);
  }

  function drawFoot(){
      ellipse(430,490,42,15);
      ellipse(470,490,42,15);
  }

  function grass(x){
      triangle(25+x,510,x,580,50+x,580);
  }
  function cloud(x){
    ellipse(50+x,50,50,30);
    ellipse(75+x,50,50,30);
  }

码绘出来的样子是这样滴，我不管我觉得就是很可爱

码绘和手绘根源还是一样的，代码画其实也是在纸上想好所要画什么图形，在技术层面上讲，码绘需要将纸上的画的点转换为坐标，用各种形状函数进行绘制，而手绘除了灵感之外，比较随心所欲。代码理性占的比重较大，更加严谨
本人没有什么对两者其一的偏好，认为各有各的好处，完成后的成就感也是不同的，代码给我的成就感更大。