11
Help us understand the problem. What are the problem?

More than 3 years have passed since last update.

posted at

updated at

Processingの導入方法

Processingってなに?

Processingはもともとは電子アートのためのプログラミング言語でした。
アニメーションなどの視覚的な表現を得意とし、プログラマーではないデザイナーでも扱えるように工夫されています。

Processingを学ぶメリット

プログラマー向けではないので、プログラミング初心者にも非常に扱いやすくなっています。
かといって、ただただ易しいプログラミング言語という訳ではなく、本格的なプログラミングも可能です。
ProcessingはJavaをベースに作られているため、オブジェクト指向での開発も可能です。

またProcessingがビジュアル的表現を得意としているため、すぐに画面に表示できてプログラミングのフィードバックが受けられます。たった1行のコードで四角形や丸を描くことができます。

Processingは、余計なおまじない抜きにすぐに動かせて成功体験を積むことができます。
慣れてくれば本格的なプログラミングまで可能ですので、PythonやRubyといった他の人気プログラミング言語へ移行する際も、Processingで学んだ知識をそのまま活かせます。

また、ProcessingはProcessing.jsというJavaScriptへの変換プログラムも用意しておりますので、そのままスマホ用ブラウザゲームにしたりなど、アウトプットの場面が多く用意されています。

Processingが動く環境を整えよう

ダウンロード

まず以下のリンクにアクセスしてください。

アクセスすると下記の画像のような画面が表示されます。画面の左側にある「Download」をクリックしてください。

スクリーンショット 2019-04-19 22.36.42.png

Windowsならば「Windows 64-bit」。Macならば「Mac OS X」を選択しましょう。

スクリーンショット 2019-04-19 22.37.20.png

インストール

Windowsの場合は、ダウンロードが終わったら、適当な場所に展開しましょう。
展開したフォルダにprocessing.exeが入っていますのでダブルクリックで起動します。

Macの場合は、ダウンロードしたzipファイルを展開すると、「Processing」というアプリケーションが生成されます。「Processing」というアプリケーションはアプリケーションフォルダーに移してください。

Javaのインストール(不要な場合もあります)

もしProcessingがうまく起動できない場合はJavaがインストールされていない可能性があります。
Processingが起動できた方は、このJavaのインストールは不要です。

Javaのインストールをする場合は、JavaのインストーラーをOracle社のページよりダウンロードします。

スクリーンショット 2019-04-23 14.48.19.png

スクリーンショット 2019-04-23 14.48.36.png

Accept License Agreementにチェックを入れ、
Windowsであればexeファイルを、Macであればdmgファイルをダウンロードします。

ダウンロード後、インストーラーを起動し、指示に従ってインストールを完了させます。

Processingを動かそう

size(600, 400);

この1行だけで、ウィンドウを表示することができます。
入力して、再生ボタンを押して実行しましょう。空白の画面が表示されます。

スクリーンショット 2019-04-19 22.44.36.png

続けて、

size(600, 400);
text("HELLO WORLD", 100, 100);

こうするだけでテキストの表示もできます。

スクリーンショット 2019-04-23 15.02.44.png

どうでしょうか?簡単そうでしょ?

あなたのプログラミング学習の最初の一歩に、Processingを選択してみてはいかがでしょうか?
きっと無駄になることはないと思います。

日本語が使えるようにする

Processingのプログラミングコードのフォントがデフォルトだと「Source Code Pro」になっており、日本語が使えません。日本語が使えるようにしておきましょう。

フォントは、Windowsであれば「MSゴシック」、Macであれば「Menlo」などが良いでしょう。

Windowsの場合は、ファイル>設定>エディタとコンソールのフォント、
Macの場合は、Processing>環境設定>エディタとコンソールのフォント、からフォントの設定ができます。

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Sign upLogin
11
Help us understand the problem. What are the problem?