• 開講学科 : 建築・都市・環境工学群
• 標準対象年次: 2年
• 単位数: 2単位
• 担当教員: 田所　淳
• 学期: 前期
• 曜日時限: 木曜3限

授業の概要

情報メディアデザインでは、様々なメディアを用いたデザインや表現のための基礎を学ぶ。情報メディアを用いた様々な作品の実例を紹介しながら、実際にプログラミングを用いて簡単な作品制作を通して情報メディアデザインについての導入を行う。プログラミングの演習では、初心者を対象に、環境構築からプログラム構造の基本、アルゴリズムを用いたデザインや形態の生成などを学ぶ。

この講義はプログラミング初心者を対象としている。プログラミングの経験や習熟度は問わない。

授業の教育目的・目標

情報メディアデザイン分野の導入を目的とする。プログラミングを通してメディアを活用したデザインの基本を理解することを目標とする。

学科の学習・教育目標との関係

建築・都市・環境工学群では建築、土木、工学デザインと多岐に渡る専門分野が用意されている。現在は自分にはプログラミングは関係無いと考えていたとしても、実際にはどの分野に進むにしてもプログラミングで表現する能力はとても重要なものである。この講義はどの分野を専攻するかに関わらず履修して学習することを推奨する。

キーワード

情報メディアデザイン、コンピューテーショナルデザイン、クリエイティブコーディング、メディアアート、プログラミング

最終課題

パラメーターがなめらかに変化することでアニメーションする、あなた自身のロゴ (VI, Visual Identity) をデザインしてください。制作した作品はOpenProcessingに mitmedia23final のタグをつけて投稿してください。投稿したURLを以下のフォームから提出してください。提出の締切は、2023年7月26日 (最後の授業日の前日) とします。

• 最終課題提出フォーム

講義資料

• オリエンテーション、生成系AIとプログラミング
• コードによる表現 – Creative Coding
• かたちとコード / 基本図形と色彩による画面構成
• 反復と乱数
• 動きを生みだす – アニメーションとベクトル
• 課題: アニメーションで表現する
• いろいろなアニメーションのアイデア
• デジタル・ハーモニー、振動によるアニメーション
• 最終課題出題 : 「パラメトリック・ロゴデザイン」
• 最終課題制作演習 : パラメータの変化によるアニメーション
• Beyond p5.js – 次のステップへ！ 

受講条件・関連科目

• 自分のノートPCを授業に持参してくること (BYOD)
• PCの基本操作は理解していること

授業方法

• 受講者のノートPCを使用したBYOD形式で講義室で授業を行う

参考書

• 田所淳 Processingクリエイティブ・コーディング入門: コードが生み出す創造表現. (2017). Japan: 技術評論社.
• 田所淳 Beyond Interaction: クリエイティブ・コーディングのためのopenFrameworks実践ガイド. (2020). Japan: ビーエヌエヌ新社.
• 田所淳 演奏するプログラミング、ライブコーディングの思想と実践: Show Us Your Screens. (2018). Japan: ビーエヌエヌ新社.
• Fry, B., Reas, C. (2014). Processing, Second Edition: A Programming Handbook for Visual Designers and Artists. United States: MIT Press.
• McCarthy, L., Reas, C., Fry, B. (2015). Getting Started with P5.js: Making Interactive Graphics in JavaScript and Processing. United States: Maker Media, Incorporated.

成績評価

• 履修態度と課題の制作・プレゼンテーションを総合的に評価する。