目次
はじめに
クリエイティブコーディングの世界へようこそ！
クリエイティブコーディングはパソコンやタブレットで楽しめるデジタルアートです。プログラムを書いて、絵やアニメーションを制作します。
プログラミングもアートも初心者の方、大歓迎です！一緒に楽しくクリエイティブコーディングで遊んでいきましょう！
本書の構成について
本書はクリエイティブコーディングはもちろん、プログラミングに初めて触れる方にも向けて解説しています。プログラムを書いて、実行結果の「アート作品」を楽しみながら学べるようにしました。プログラムを少しずつ書き足しながら、ステップアップできるしくみになっています。
本書の流れは「プログラムを入力して、実行して結果を確かめて、解説を読んで…」の繰り返しです。入力したプログラムを画面で実際にご覧になりながら、本書の解説をガイドとしてお読みいただければと思います。
本書タイトル「2時間でクリエイティブコーダーになる本」のとおり、2時間くらいでこなせる分量に調整しています。もともとはプログラミング初心者の方向けのワークショップで展開していた内容を、技術書向けにアレンジしています。ただ、「2時間」はあくまで目安なので、ゆっくりやっても爆速でやってもOKです！ご自分のペースに合わせて進めてください。
表記関係について
本書に記載されている会社名、製品名などは、一般に各社の登録商標または商標、商品名です。会社名、製品名については、本文中では©、®、™マークなどは表示していません。
第1章 クリエイティブコーディングとは
プログラミングのことを、別の言い方で「コーディング」と呼びます。同様に、プログラムを「コード」とも呼びます。また、プログラムを動作させることを「実行」と呼びます。
そして、クリエイティブコーディングとは、プログラミングでグラフィックやアニメーション、サウンド、立体物1といったアート作品を制作する活動です。
クリエイティブコーディングに取り組んでいる人は「クリエイティブコーダー」と呼ばれています。クリエイティブコーディングに使われるツールは、ProcessingやopenFrameworks、TouchDesignerなど、様々です。
本書では、クリエイティブコーディングによるグラフィックとアニメーションの制作について触れます。ツールとして、ブラウザーでコーディングできて文法も簡単な「p5.js」を使用します。
p5.jsとは、しっかりいえば「クリエイティブコーディングに特化したJavaScriptライブラリー」です。ざっくりいえば、プログラミングによってブラウザー上でお絵描きしたり遊んだりできる、とっても楽しいツールです。
p5.jsは、Processingというプログラミング言語がルーツになっています。ProcessingはJavaをベースとしたプログラミング言語で、こちらもわんぱくにお絵描きしたり遊んだりできるウルトラハッピーなツールです。Processingは「アート系・デザイン系の学生(=プログラミング初心者)がプログラミングを学びやすいように」というコンセプトで設計されました。そのため、シンプルな書き方でダイナミックなデジタル表現が実装できるようになっています。p5.jsもその流れを汲んでおり、サクッとプログラムを書いてサクッとアート制作ができるしくみになっています。
Processingやp5.jsでは、つくった作品を「スケッチ」と呼びます。これは、スケッチを描くような気軽さでアート制作にチャレンジできる…ということなんです！
第2章 プログラミング、3つの柱
プログラミングの重要な考え方として、3つの柱となる要素があります。本書ではこの3つの柱を軸に、プログラミングの基礎についても解説していきます。
・順次 : プログラムは順番通りに動く
・分岐 : 条件によってプログラムから異なる結果を得る
・反復 : プログラムは繰り返しが得意
今は「へー、こんなのがあるのかー」くらいに考えておいて大丈夫です！p5.jsを動かしながら、実際に体験していきましょう。