[Proyecto] ¡Ya que va, ya que vuelva!

le agregue cambio de color, mas velocidad, lo centre y lo hice mas grande

<script>

    var pantalla = document.querySelector("canvas");
    var pincel = pantalla.getContext("2d");        
    pincel.fillStyle = "lightgrey";
    pincel.fillRect(0,0,600,400); 

    function diseñarCircunferencia(x,y,radio,colr){
        pincel.fillStyle = colr;//var para cambiar el color
        pincel.beginPath();
        pincel.arc(x,y,radio,0,2*Math.PI);
        pincel.fill();
    }    

    function limpiarPantalla(){

        pincel.clearRect(0,0,600,400);

    }

    var x = 0;
    var dirx = 1;
    colr = "blue";//var para cambiar el color


    function adelantarCirculo(){

        limpiarPantalla();

        //este ciclo hace que cuando llegue al final del canvas se regrese ó avance
        if(x > 600){
            dirx = -1;
            colr = "red";//var para cambiar el color
        }else if(x < 0){
            dirx = 1;
            colr = "blue";//var para cambiar el color
        }

        diseñarCircunferencia(x,200,20,colr);
        x= x + dirx;//es importante recordar que a la variable donde se posiciona x se le va sumando o restando

    }   

    //setInterval sirve para decirle al programa que espere 10 milisegundos para hacer la función
    setInterval(adelantarCirculo,0.5);

</script>