１. はじめに

1-1. 授業の概要

1-2. なぜプログラミングの知識が必要なのか

2. カリキュラム構成のキーワード

【表現的側面】
点、線（直線・ベジェ曲線）、図形、色彩、アニメーション、インタラクション1（キーボード入力）、インタラクション2（マウス入力）、画像、サウンド、ビデオ入力、ネットワークコミュニケーション

【アルゴリズム的側面】
変数、変数の型、if、else、for、while、switch、配列（1次元配列 〜 n次元配列）、三角関数、モジュール化、クラス、メソッド

3. スケジュール

4/24 – 第1回　初めに

なぜインタラクティブアート／ネットアート／ハイブリッドアートにプログラミングが必要か
なぜprocessingなのか
事例の参照

processingのダウンロード、インストール
processingの基本的な使い方
参考書・参考サイト
【技術的側面】processingとJavaの関係、変数、if, else if, elseの理解、デバッグ、コメントアウト、コードを分かりやすく書くということ
【課題】Processingの課題をアップロードするためのサイトを作成する（次週まで）。
自身の現在までの活動をウェブサイトにまとめる（第3週まで）。
体裁は自由。htmlで書いてもいいし、ソフトウェア（Dreamweaver等）やブログで作ってもかまわない。

5/8 – 第2回　点の表現1

【表現的側面】いかに簡単な要素で豊かな表現を行なうか
【参考作品】1　2　3　4
【技術的側面】while, forの理解
【サンプル】dotSquare　pointPattern
【課題】点によって表わされるパターンの表現を追求する。if, else if, else, while, forを組み合わせて使う。5個以上のバリエーションを作る。3×3ピクセルの黒い円を使用する。
背景は白。
画面は400 x 400ピクセル。
自分なりに、美しいと思えるパターンを見つけ出すこと。

5/15 – 第3回　点の表現2

【表現的側面】運動の記述
【参考作品】oskar fischinger – Removable Tongue　Oscar Fischinger – Danse Macabre
Norman McLaren – Mosaic

【技術的側面】setup()とdraw()、変数のスコープ（範囲）
【課題】運動のパターンの表現。複数のオブジェクトをアニメーションさせる。
5個以上のバリエーションを作る。3×3ピクセルの黒い円を使用する。
背景は白。
画面は400 x 400ピクセル。
自分なりに、美しいと思える運動やパターンを見つけ出すこと。

5/22 – 第4回　点の表現3

【表現的側面】 運動の記述
【技術的側面】 1次元配列の理解
【課題】配列によって表現される運動のパターンの表現。複数のオブジェクトをアニメーションさせる。5個以上のバリエーションを作る。3×3ピクセルの黒い円を使用する。
背景は白。
画面は400 x 400ピクセル。
自分なりに、美しいと思える運動やパターンを見つけ出すこと。
（注）この回の授業では1次元配列までしか出来なかったので、この課題は1次元配列を使ってやるように。2次元配列は使わなくていいです。

5/29 – 第5回　点の表現4

【表現的側面】 運動の記述
【技術的側面】 2次元配列の理解
【課題】この回は1次元配列もあまり分かっていない人が多かったので、先週の課題と同じものをやってくるように。余力がある人は2次元配列もやって下さい。合計で５パターン以上作ること。

6/5 – 第6回　色彩の表現

【表現的側面】色彩のコントロール
【技術的側面】RGB, HSB, Alphaなど
【サンプル】rect_sample
【課題】400x400pixelの画面内で、40×40の正方形による色彩構成を行なう。
・正方形の数は自由。
・RGBやHSB、Alphaなど、色彩のモードの選択は自由。
・正方形を描く際にstrokeは描かない（noStroke()）
・色のみのアニメーション。形態はアニメーションさせない。
・5パターン以上作る

6/12 – 第7回　点の表現5

【表現的側面】曲線運動による表現のバリエーション
【技術的側面】sine, cosine
【サンプル】sin_cos_sample
【課題】曲線運動を使って、有機的な運動を行なうオブジェクトを生成する。5個以上のバリエーションを作る。
色彩の選択は自由。
直径1〜5ピクセルの正円を使用する。
軌跡を残す、残さないの設定は選択自由。

6/19 – 第8回　点の表現6

【表現的側面】インタラクション
【技術的側面】キーイベント、switch、マウスイベント
【サンプル】mouseEvent_sample
【課題】キーイベント、マウスイベントのどれかを使って、インタラクションのあるオブジェクトを生成する。
5個以上のバリエーションを作る。
色彩の選択は自由。
直径1〜5ピクセルの正円を使用する。
軌跡を残す、残さないの設定は選択自由。

6/26 – 第9回　点の表現7

【表現的側面】運動の記述
【技術的側面】モジュール化 （関数）、クラス、メソッド
【サンプル】object_pressed_circle
【課題】今まで自分が書いたコードを関数を使って書き直す。3つ以上書くこと。

参考デモンストレーション：　画像処理
【表現的側面】コンピュータヴィジョンによる様々な表現
【技術的側面】2値化、エフェクト、背景差分、物体の追跡

7/3 – 第10回　　点の表現8

【表現的側面】運動の記述、インタラクション
【技術的側面】クラス、メソッドの続き。TCP/IP、UDP、ライブラリの理解
【課題】クラス、メソッドを使って自立的な運動を行なうオブジェクト複数生成させる。アニメーションのみでも、インタラクションがあってもどちらでもいい。色彩の選択は自由。
直径1〜5ピクセルの正円を使用する。
最低一つは作る。余裕のある人はいくつ作って来てもかまわない。

7/10 – 第11回　3年生合同発表

合同発表会で出すものは、前期の課題ををwebサイトでまとめたものとする。

【10日までにやること】
1. 今までの課題の中で、規定の数を作成していない場合には残りのものを作っておく。最終的に数が足りているかを確認します。
2. コードを整理する。コメントが不十分な場合には、コメントを付けておく。
3. 自身のウェブサイトの見栄えを良くする。中間発表会の際に展示するので、鑑賞に耐えられるものにしておく。バナーなどは出ないように設定するか、バナーのないサイトを使用する。

4. 受講生作品

伊久美 光　http://hikal.mine.nu/another.html
内田 葵　http://tokotoko.fine.to/usan/
内野 洋子　http://yok.noor.jp/
大塚 敦美　http://nzpf.tobiiro.jp/
小野 夕香　http://uca.sadist.jp/processing/index.html
島谷 高史　http://ainuton.exblog.jp/i8/
中澤 邦夫　http://nkzw920.exblog.jp/
橋本 藍　http://mwch.web.fc2.com
宮本 慶　http://miyamotokay.active-h2o.jp
武藤 有記　http://vte.sakura.ne.jp/yuki/