アリソンパリッシュによる このチュートリアルでは、ダニエルハウと貢献者チームによる、p5.jsと互換性のあるJavaScriptライブラリであるRiTaJSの機能のいくつかを示します。その過程では、オブジェクトとデータに […]
続きを読む月: 2019年3月
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のダウンロード方法と初めてのスケッチの作成方法を見ました。このチュートリアルでは、コンピュータプログラムの基本的な概念である、式と変数、ループについて見ていきま […]
続きを読む2:p5.js 初めの一歩 Creative Coding p5.js
アリソンパリッシュによる このチュートリアルは、初めてのp5.jsスケッチを作成しインターネットにアップロードするまでの手順を示します。 p5.jsとは? p5.jsは、クリエイティブコーディングに向けたJavaScri […]
続きを読む1:ブラウザのコンソール内のJavaScript Creative Coding p5.js
このチュートリアルでは、JavaScriptプログラミング言語の基本をWebブラウザのJavaScriptコンソールを使ってみていきます。 Webブラウザの秘密の言語 Webブラウザは、Webページを見たり、ハイパーリン […]
続きを読むクリエイティブ コーディング Creative Coding p5.js
本稿は「Creative Coding」ページで公開されているJavaScriptプログラミングに関する記事の訳文です。 わたしはアリソン・パリッシュです。本稿は元々、わたしが2015年、NYUのIDMプログラムで受け持 […]
続きを読む12:キャンバスを超えて p5.dom.js JavaScript
本稿は、p5.jsに追加して組み込むことで、キャンバス以外のHTML要素へのアクセスや操作を可能にするp5.dom.jsについて述べた「Beyond the canvas」の訳文です。 createCanvas()関数は […]
続きを読む11_2:JSONデータ p5.js JavaScript
JSON(JavaScript Object Notation)形式もまた、データの保持によく使用されるシステムです。HTMLやXML形式のように、要素はそれに関連付けられたラベルを持ちます。たとえば、映画のデータを表す […]
続きを読む