プログラミングB #01
#01 イントロダクションとガイダンス

高尾俊介(takawo@konan-wu.ac.jp)
甲南女子大学 文学部 メディア表現学科 講師

授業概要


  • 現代において、コンピュータは主にマウスやキーボードをインターフェイスとして操作を行うことが一般的です。この授業ではProcessing p5.jsを開発環境として、インタラクティブなアプリケーションや計算によるグラフィックの制作通じて、インタラクションデザインとプログラミングの基礎について習得します。

授業の具体的な内容


  • Processing p5.js p5.jsというJavaScriptベースのアーティストのためのプログラミング環境を利用して作品制作や今後プログラミングを活用するにあたっての基礎的な学習を行います。

キーワード

  • プログラミング、コンピュテーショナルデザイン(コンピュータによるデザイン)、プロトタイピング、インタラクションデザイン、クリエイティブコーディング

授業の到達目標及びテーマ


  • 以下のプログラミングに関連する制作手法や概念について学習します。
  • 変数、繰り返し、条件分岐、配列
  • 自動描画のアプリケーション
  • 画像を再構成しながら描画するアプリケーション

プログラミング一般に関する知識

  • 今回学習するp5.jsに限らず、Webやシステム開発など様々なコンピュータ環境で、人力以外の方法で問題解決を行う際の発想方法につながる非常に重要な考え方
  • 作ることを通じて、段階的・発展的に学ぶこと

Processing p5.jsとは


  • Processing:デザイナーとアーティストのための(≒非プログラマのための)プログラミング言語として当時MITに在学していたBen FryとCasey Reasによって開発
  • MITのジョン・マエダのDesign By Numbersの影響
  • フィジカルコンピューティングのための開発環境であるArduinoや、クリエイティブコーディングのための開発環境openFrameworksへ影響を与えている
  • また他のArduinoなどデザイン/アートのためのプログラミング環境と共通した要素も多く、入門として適している。
  • p5.jsはProcessingのJavascript版,ウェブ上で動作するクリエイティブコーディング環境.

Processing p5.jsでできること


  • コンピュータを使ったビジュアル表現
  • マウス、キーボードを使ったインタラクション
  • 画像、動画や音声などメディアファイルの再生・表示
  • アニメーションやインスタレーション作品、データビジュアライゼーション、グラフィックデザインなどで利用されることが多い
  • また彫刻、ファッションデザイン、建築、プロダクトデザイン、ジュエリー、陶芸など物理的空間的なデザインでも活用されている