Processingという言語を使って、プログラミングの基礎を学んでいくシリーズ。
第1回目はスイス国旗を描いていきます。

目次
  1. 1. ウィンドウを作成し背景の色を付ける
  2. 2. 中央の横長の長方形を描く
  3. 3. 中央の縦に長い長方形を描く
  4. おわりに

1. ウィンドウを作成し背景の色を付ける

まずはウィンドウを作成し、背景の色を付けていきます。
ウィンドウは500×500とします。

ウィンドウの指定にはsizeを使用し、
size(横の長さ, 縦の長さ)で指定することができます。

背景の赤色はbackgroundを使用し、
background(r, g, b)で指定することができます。

size(500, 500);
background(255, 0, 0);

2. 中央の横長の長方形を描く

次に横長の長方形を描いていきます。
長方形を描画するには、rectを使います。

rect(長方形の左上のx座標, 長方形の左上のy座標, 横の長さ, 縦の長さ)の形で、
4つの数値を指定してあげます。

白色にしたいので、fill(r, g, b)も前に書いてあげましょう。
なお白色の場合はfill(255)と省略することができます。

図形の枠線を消してあげたいので、noStroke()も追加してあげてください。

fill(255);
noStroke()
rect(100, 200, 300, 100);

ここまでで以下のような横長の長方形ができます。

3. 中央の縦に長い長方形を描く

次に縦長の長方形を描いていきます。
先ほどと同様にrectを使います。

rect(200, 100, 100, 300);

これで今回の目的だったスイス国旗を描画することができました！

おわりに

プログラミングはトライ・アンド・エラーの繰り返しです。
最初は図形を描画するだけの、簡単なプログラムであっても自分の意図した箇所に
描画されず、もどかしい思いをするかもしれません。

しかしながら、学び続けた先に自動化やアプリ開発、プログラミングを通した自己実現など道が開けるので楽しんでコツコツ続けていきましょう〜！