前回のレッスンでは、ゲーム画面のサイズをコードに直接指定していました。

createCanvas(800, 800);

今回のレッスンでは、この値を変数に保持しておこうと思います。
変数に保持しておくことで、ゲーム画面のサイズの情報を他の箇所でも利用することができるようになります。

変数とは、値を保持しておくための箱のようなものです。
変数について詳しく知りたい方は、以下の入門コースの解説をご覧ください。
変数とは - 入門コース

それでは、コード全体を次のように変更してください。

let W = 800;
let H = 800;

function setup() {
  createCanvas(W, H);
}

function draw() {
  background(220);
}

コードを解説していきます。

let W = 800;
let H = 800;

この部分で、変数 W と変数 H を宣言し、ゲーム画面の横サイズ800と縦サイズ800を代入しています。
（Wは横幅を意味する英単語widthの頭文字、Hは高さを意味する英単語heightの頭文字です）

createCanvas(W, H);

そしてこの部分で、先ほど宣言した変数 W と変数 H を使い、ゲーム画面のサイズとして800×800を指定しています。

ゲームを起動してみましょう。
前回のレッスンと同じようになれば、成功です！

次のレッスンでは、マウスの動きに合わせて赤い軌跡が描かれるようにしていきます。