Aprendendo Muito - Minha Solução

<canvas width="600" height="400"></canvas>

<script>

    var tela   = document.querySelector("canvas");
    var pincel = tela.getContext("2d");

    pincel.fillStyle="lightgray";
    pincel.fillRect(0,0,600,400);

    pincel.fillStyle="darkgreen";
    pincel.fillRect(125,50,300,310);
 /*                          x     y     l   a
    X horizontal - esquerda e direita

     esquerda aumentando o numero
     direita diminuindo o numero

     Y vertical - cima e baixo

     diminuindo vai para cima
     aumentando vai para baixo

     LARGURA
  + largo quanto maior o numero
  - largo quando menor o numero

      Altura 

      + alto quando maior o numero
      - baixo quanto menor o numero*/

      // 1 OLHO

      pincel.fillStyle="black";
      pincel.fillRect(148,110,90,90);

      //              x, y,  l,a

      pincel.fillStyle="black";
      pincel.fillRect(314,110,90,90)


      //NARIZ

      pincel.fillStyle="black";
      pincel.fillRect(235,200,80,100);

      //barba 1

      pincel.fillStyle="black";
      pincel.fillRect(200,255,50,105);

      //barba 2

      pincel.fillStyle="black";
      pincel.fillRect(300,255,50,105);



</script>

Estou muito feliz por ter entendido a logica e conseguir fazer sozinha, foi muito divertido fazer o Creeper, que minha irmazinha tanto joga kkkk