Resultado do desenho do creeper, alterei algumas coisas pra ficar mais centralizado.
<!DOCTYPE html>
<html lang="pt_BR">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Creeper</title>
</head>
<body>
<canvas width="800" height="700"></canvas>
</body>
</html>
<script>
var tela = document.querySelector("canvas");
var pincel = tela.getContext("2d");
pincel.fillStyle = "darkgreen";
pincel.fillRect(0, 0, 800, 700);
pincel.fillStyle = "black";
pincel.fillRect(100, 100, 200, 200);
pincel.fillRect(500, 100, 200, 200);
pincel.fillRect(300, 300, 200, 100);
pincel.fillRect(200, 400, 400, 100);
pincel.fillRect(200, 500, 100, 100);
pincel.fillRect(500, 500, 100, 100);
</script>
