14:ゲーム制作に役立つp5.play速習 Creative Coding p5.js

アリソンパリッシュによる このチュートリアルでは、パオロ・ペデルチーニのp5.playライブラリを紹介します。このチュートリアルはいささか独断的で、p5.playを面白くする機能の多くを取り上げていません。このライブラリ […]

続きを読む

13_1:RiTaJS 入門 Creative Coding p5.js

アリソンパリッシュによる このチュートリアルでは、ダニエルハウと貢献者チームによる、p5.jsと互換性のあるJavaScriptライブラリであるRiTaJSの機能のいくつかを示します。その過程では、オブジェクトとデータに […]

続きを読む

13:外部ライブラリの使用 Creative Coding p5.js

アリソンパリッシュによる 1つのプログラミングフレームワークに詰め込むことのできる機能性は限られており、p5.jsにも多くの機能が備わっていますが、全部が含まれているわけではありません。このチュートリアルでは、p5.js […]

続きを読む

12_2:ビデオの操作 Creative Coding p5.js

アリソンパリッシュによる p5.jsフレームワークは、スケッチでのビデオ再生制御を容易にします。 ビデオとWebブラウザ コンピュータのビデオと言うと、通常はビデオファイル、つまり動画のエンコーディングされたデータを含む […]

続きを読む

12_1:コントロール要素 Creative Coding p5.js

アリソンパリッシュによる p5.jsフレームワークを使用すると、スケッチを含むページに、HTML5のインターフェース要素が簡単に追加できます。追加したインターフェース要素を使用すると、ユーザーがスケッチを制御できるように […]

続きを読む

11:テキストと文字表現 Creative Coding p5.js

アリソンパリッシュによる このチュートリアルでは、p5.jsを使ってスケッチにテキストを表示する方法と、テキストのさまざまなサイズやフォントの形状にもとづいて、スケッチに異なる振る舞いを与える方法を見ていきます。また、テ […]

続きを読む

10:オブジェクトの工場としてのクラス Creative Coding p5.js

アリソンパリッシュによる (まだ書きかけ。。。) 場合によっては、同じ基本シェイプを持つ多数のオブジェクトを作成する必要が生じるかもしれません。想像されている通り、これを実現する良い方法は、オブジェクトを返す関数の作成で […]

続きを読む

9:メソッドを持つオブジェクト Creative Coding p5.js

アリソンパリッシュによる このセクションでは、オブジェクトの新しい側面、つまりオブジェクトはメソッドを持つことができるという事実を見ていきます。メソッドは通常の関数とよく似ていますが、メソッドにはどの値に対して作用をする […]

続きを読む

8:関数のつづき Creative Coding p5.js

アリソンパリッシュによる パラメータ 前に関数について述べたとき、記述した関数は、一連のステートメントを再利用できるようにすることを意図したものでした。関数には、関数を呼び出すコードから関数に値を渡せるようにすることで、 […]

続きを読む

7:配列とオブジェクト Creative Coding p5.js

アリソンパリッシュによる このチュートリアルでは、スケッチ内のユーザーアクションに関する情報を保持する方法を見ていきます。これを実現するには、配列とオブジェクトという新しいプログラミング概念について知る必要があります。 […]

続きを読む

6:メディア イメージとサウンド Creative Coding p5.js

アリソンパリッシュによる このチュートリアルでは、既存のメディアをスケッチに読み込む方法について見ていきます。 イメージ p5.jsで画像を読み込みイメージとして表示するのは簡単です。以下のサンプルでは、PNGかJPEG […]

続きを読む

5:変換と関数 Creative Coding p5.js

アリソンパリッシュによる このチュートリアルでは、変換の使用方法を見ていきます。変換は、シェイプを画面のどこにどのようにして描画するかを変更するための便利で洗練されたテクニックです。また、関数を記述する基本も見ていきます […]

続きを読む

4_2:インタラクション Creative Coding p5.js

アリソンパリッシュによる このチュートリアルでは、p5.jsを使った、ユーザー入力に応答するスケッチを作成する方法を学びます。 ビルトインProcessing変数 前のチュートリアルでは、スケッチで変数を作成する方法を、 […]

続きを読む

4_1:経時的変化 Creative Coding p5.js

アリソンパリッシュによる このチュートリアルでは、時間の経過とともに変化する、簡単なp5.jsスケッチの作成方法を見ていきます。しかしその前に、Processingにおける時間の働きについて少し説明しておく必要があります […]

続きを読む

3:式、変数、ループ Creative Coding p5.js

アリソンパリッシュによる 前のチュートリアルでは、p5.jsのダウンロード方法と初めてのスケッチの作成方法を見ました。このチュートリアルでは、コンピュータプログラムの基本的な概念である、式と変数、ループについて見ていきま […]

続きを読む

1:ブラウザのコンソール内のJavaScript Creative Coding p5.js

このチュートリアルでは、JavaScriptプログラミング言語の基本をWebブラウザのJavaScriptコンソールを使ってみていきます。 Webブラウザの秘密の言語 Webブラウザは、Webページを見たり、ハイパーリン […]

続きを読む