環境／
macOS Ventura, Processing, VSCode

  1. ProcessingとVisual Studio Codeをダウンロード
  2. processing-javaをインストール
  3. VSCodeでProcessing Languageをインストール
  4. サンプルファイル作成
  5. tasks.jsonファイルを作成
  6. Run 実行
  7. Other

1. ProcessingとVisual Studio Codeをダウンロード

それぞれ下記よりインストールを行います。Install each of them.

Processing Website

Visual Studio Code Website

2. processing-javaをインストール

・Processingを起動したのち、上記のtoolsより Install “processing-java” を選択し、インストールします。PCのパスワードを要求されるのでパスワードを入力します。

After starting Processing, select Install “processing-java” from the above tools and install it.

・正しくインストールされたか確認のため、ターミナルにて、processing-javaと打ち込み下記通りエラーが出てなければ完了です。

To verify that it was installed correctly, type processing-java in the terminal, and if no errors are displayed as shown below, the installation is complete.

3. VSCodeでProcessing Languageをインストール

次にVSCodeの拡張機能としてProcessing Languageをインストールします。
EXTENSIONSよりProcessing Languageを検索しインストール。

Install the Processing Language as an extension to VSCode.
Search for and install Processing Language from EXTENSIONS.

のち、VSCodeを再起動します。

Restart VSCode.

4. サンプルファイル作成

・名前の同じファイルとフォルダを作成します。シンプルな作り方としては、Processingで新規で作成すると良いです。

Create a file or folder with the same name. An easy way to do this is to create a new one in Processing.

・VSCodeにてフォルダ開きpdeファイルにサンプルコードを作成し保存します。
テストコードなので、画面中央に円を描くサンプルコードを下記通り作成しています。

Open the folder in VSCode, create a sample code in a pde file, and save it.
This is a test code, create the following sample code that draws a circle in the center of the screen.


void setup() {
    size(512, 512);
}

void draw() {
   ellipse(width/2, height/2, 100, 100); 
}

5. tasks.jsonファイルを作成

VSCodeにてtasks.jsonファイルを作成します。

Create tasks.json file on VSCode.

・上記のViewよりCommand paletteを選択（Shift + ⌘ + P）し開きます。
・Processingで検索をかけ、Create を選択しtasks.jsonファイルを作成します。

Select Command palette from the above view (Shift + ⌘ + P) and open it.
Search for “Processing” and select “Create” to create a tasks.json file.

不可視ファイルの.vscode の中にtasks.jsonが確認できます。

You can see tasks.json in the invisible file .vscode.

5. Run 実行

フォルダを選択し、Shift + ⌘ + B にて実行します。

Select a folder and execute with Shift + ⌘ + B.

Other

pdeのファイル名とそれを格納しているフォルダ名は必ず同じ名前でないと実行できないので注意が必要です。先ほど行ったProcessingでの新規ファイル作成が一番確実に作成できます。

Note that the name of the pde file and the name of the folder containing it must be the same name to execute. The most reliable way to do this is to create a new file with Processing as described earlier.

ProcessingのIDEも使いやすいですが、自身の使い慣れたエディター（VSCode）で制作するのも良いです。

The Processing IDE is easy to use, but it is also a good idea to create the code in an editor you are familiar with (VSCode).

barbe_generative_library

Processing 参考書籍
[Book] 数学から創るジェネラティブアート – Processingで学ぶかたちのデザイン

mathmade-processing_gizyu-image

初版／ 2019.4.17
ページ数／304ページ
出版社／技術評論社
言語／日本語

【Amazon.co.jp で購入】

ーーーーー
”Books”では、”barbe_generative_Library”として、
barbe_generative_diary の創作において実際に購入し、読んだ本を紹介します。

ーーーーー