Ordem e Progresso

Olá pessoal, segue a minha resolução

Preferi não olhar a resolução do instrutor e tentar fazer sozinha, as coordenadas foram diferentes porém deu certo rs.

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

<script>

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

//retangulo verde
pincel.fillStyle = 'green'
pincel.fillRect ( 180, 50, 600, 300)

//losango amarelo cima
pincel.fillStyle ='yellow'
pincel.beginPath();
pincel.moveTo(390, 80)
pincel.lineTo(580,200) // right
pincel.lineTo(210,200) // left
pincel.fill();

//losango amarelo baixo
pincel.fillStyle ='yellow'
pincel.beginPath();
pincel.moveTo(390, 320)
pincel.lineTo(580,200) // right
pincel.lineTo(210,200) // left
pincel.fill();

// bola
pincel.fillStyle ='darkblue'
pincel.beginPath();
pincel.arc(390, 200, 70, 0, 2*3.14);
pincel.fill();
</script>