【初心者向け】プログラミングで絵を描こう!【Processing】

プログラミング言語は色々ありますよね。
プログラミングを学ぶとき、どんな言語でも、まずはHello, World!!を表示して、変数の概念を学んで、if文、for文の制御構文を学ぶ、という流れで進んで行きます。
しかし、この辺りでプログラミング初学者にとって大きな落とし穴があります。

学んだところで、使い道がない…!

本来作りたいものがあって勉強を始めたなら、こんな問題はおきないのですが、「とりあえずプログラミングを学んでみたい」という動機で始めた方々にはこの壁が立ちはだかります。
しかもプログラミングの本というのは、構文を覚えさせるのが目的なので、作らせるモノが抽象的になりがちな印象があります。期待通りに動くものを作る力を身に着けるという点ではもちろん価値があるのですが、作っているモノのが正直よくわからず、あまり楽しくないのではないでしょうか

そこで、楽しくプログラミングするため、Processingを紹介します

Processingって?

お絵かきに特化したプログラミング言語です。基本はJavaベースで動くのですが、 PythonJavaScriptなどをベースに動かすことも可能のようです。他の言語でも絵を書くことは不可能ではありませんが、Processingは絵を書くことを目的に設計されており、簡単です
絵を描くだけならペイントとかイラレとかの描画ソフトで十分じゃん!、と思う方はいると思うのですが、Processingは動画もいけます
というわけで、折角なのでお絵かきを通じてプログラミングを学べる言語としてProcessingを学びましょう。

今回は開発環境のインストールを行い、さらに1つプログラムを実行してみるところまで進めます。

開発環境を整えよう

こちらがProcessingのホームページです。

印をつけている「Download」をクリックします。

次のページで自分のPCのOSを選択します。Windowsの方は、bit数にも注意してクリックしてください。これでダウンロードが始まります。

自分のOSを選択すると、Processingのダウンロードが開始され、下のように寄付金を募る画面が出てきます。このページを無視してもProcessingは利用できます。

ダウンロードが完了したら、保存されたzipファイルを開きます。Mac版ならばアプリケーションファイルが現れるので、これをPC内の「アプリケーション」フォルダに移動しましょう。Windows版ならばインストーラが現れると思うので、開いてインストールを開始してください。
これでProcessingのインストールは完了です。

起動しよう

アプリを起動すると、このような開始画面が現れます。かっこいいですね。

次に統合開発環境が現れます。

これがコードを書いて実行する場所で、スケッチと呼ばれます。小さくシンプルですね。

何か描いてみよう

先ほど現れたスケッチで何か実行してみましょう。

このコードを書き込んでください。

そして、スケッチの左上にある実行ボタンをクリックしてください。

すると、

はい。絵が描けました!!
今回のコードは四角形を一つ書くだけの単純なものですが、とりあえず簡単に絵を描けるということは伝わったと思います。

おわりに

今回は「ひとまず何か描く」という目標で解説しましたが、もちろんProcessingの機能はまだまだあります。
いろんなものの描き方を紹介していこうと思うので、興味のある人は次回の記事も是非読んでみてください。

11 COMMENTS

Processingサンプルコードをわかりやすく解説【Tickle】 | ENjoy ENgine! へ返信する コメントをキャンセル

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA


このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください