Criando botões e Telas

1. Função draw
2. Substitua todo e apenas draw (desde function até a chave {} fechando) pelo código abaixo;

function draw() {
	fill("#ff0000") // Representação da cor vermelha em Hexadecimal
	rect(100, 100, 30);
	background(220);
	console.log("Redrawing");
}

1. Note que, no console, a mensagem “Redrawing” é exibida várias vezes após executar o sketch. Isso acontece, pois o código dentro de draw é executado várias vezes, enquanto o sketch está executando. Pode remover o console.log("Redrawing") após executar.
2. Agora, coloque o background como primeiro comando do draw. Note que o retângulo aparece;

Desenhar botão (retângulo)

1. O p5.js oferece vários comandos para desenhar formas geométricas. Veja a documentação do retângulo aqui;
2. Agora, na função draw, desenhe um retângulo de largura 100 e altura 30.
3. Por padrão, o p5 desenha as formas a partir do canto superior esquerdo. Isso dificulta um pouco o posicionamento das figuras. Para alterar esse comportamento, use o comando rectMode(CENTER). Agora, as figuras serão desenhadas a partir do centro.

Colorindo formas

1. Para colorir um objeto, usamos o comando fill. Veja a documentação desse comando aqui.
2. Note que, ao usá-lo, todas as formas ficarão com a cor definida. Desenhe um segundo retângulo, abaixo do primeiro, com as mesmas dimensões.
3. Agora, no código, acima de ambos os retângulos, use o comando fill para colorir os quadrados de azul.
4. Lendo a documentação, tente colorir o primeiro retângulo de azul e o segundo de amarelo.

Posição do mouse

1. O p5.js oferece duas variáveis que guardam os valores da posição do ponteiro do mouse: mouseX e mouseY.

2. Crie um texto, não muito grande, que será exibido no canto superior esquerdo do seu canvas. Ele deve exibir as posições X e Y do mouse. Isso permite procurar erros que podem aparecer no seu código. Utilize o código abaixo para criar a string a ser exibida.

   let debugText = "X: " + mouseX + "\\nY: " + mouseY;
   

Eventos do mouse

Trocar cor do retângulo quando mouse passar por ele