Porque esse modo não está dando certo?

Olá, Arthur, tudo bem?

Agradeço pelo aguardo da resposta.

Analisei o seu código e notei que na função verificaColisãoRaquete(), na primeira condição você colocou xBolinha - raio < = xRaquete + raqueteComprimento ao invés de colocar xBolinha - raio < xRaquete + raqueteComprimento.

Na segunda condição, não tem problema somar o raio com o yRaquete+raqueteAltura, visto que matematicamente o resultado será o mesmo que subtrair o raio do yBolinha, porém, não se faz necessário dividir a raqueteAltura por 2.

Já na terceira condição é necessário somar o raio ao yBolinha e não precisa diminuir a raqueteAltura por 2. Com o devido ajustes a sua função verificaColisãoRaquete() ficaria assim:

function verificaColisaoRaquete(){
   if((xBolinha - raio < xRaquete + raqueteComprimento)&&
     (yRaquete+raqueteAltura + raio > yBolinha)&&
      (yBolinha + raio > yRaquete)){

     velocidadeXBolinha *= -1;
      }

}

Quanto a sua dúvida referente a solução utilizada pelo professor na função verificaColisaoRaquete() a linha &&(yBolinha + raio > yRaquete) faz a verificação da mudança de direção da bolinha no eixo y acima da raquete. Pois a ausência da condição yBolinha - raio < yRaquete + raqueteAltura, quanto yBolinha + raio > yRaquete a bolinha não tocaria na borda lateral, mesmo sem ao menos tocar na raquete.

O código ficaria assim:

//Variáveis da bolinha
let xBolinha = 300;
let yBolinha = 200;
let diametro = 15;
let raio = diametro/2;

//Movimentação da bolinha
let velocidadeXBolinha = 2;
let velocidadeYBolinha = 2;

//Variáveis da raquete
let xRaquete = 5;
let yRaquete = 150;
let raqueteComprimento = 10;
let raqueteAltura = 90;


function setup() {
  createCanvas(600, 400);
}

function draw() {
  background(0);
  mostraBolinha();
  movimentaBolinha();
  verificaColisaoBorda();
  mostraRaquete();
  movimentaMinhaRaquete();
  verificaColisaoRaquete();

}

function mostraBolinha(){

  circle(xBolinha,yBolinha,diametro);

}

function movimentaBolinha(){

  xBolinha += velocidadeXBolinha;
  //yBolinha += velocidadeYBolinha;

}

function verificaColisaoBorda(){

  if((xBolinha > width - raio)||(xBolinha < raio)){

    velocidadeXBolinha *= -1;

  }

  if((yBolinha > height - raio)||(yBolinha < raio)){

    velocidadeYBolinha *=-1;
  }

}

function mostraRaquete(){

  rect(xRaquete,yRaquete,raqueteComprimento,raqueteAltura);

}

function movimentaMinhaRaquete(){

  if(keyIsDown(UP_ARROW)){
    yRaquete -= 10;
  }
  if(keyIsDown(DOWN_ARROW)){
    yRaquete += 10;
  }
}

function verificaColisaoRaquete(){
   if((xBolinha - raio < xRaquete + raqueteComprimento)&&
     (yRaquete+raqueteAltura + raio > yBolinha)&&
      (yBolinha + raio > yRaquete)){

     velocidadeXBolinha *= -1;
      }

}

Espero ter ajudado.

Reforço que estou a disposição para tirar dúvidas.