ピゴニャンのスケッチ
p5.jsのウェブエディターが開くので、［ファイル］メニューから「別名で保存」を選択してください。
サンプルコード
各レッスンのサンプルコードは以下のリンクボタンから見られます。
練習問題
練習問題は、サンプルコードと同じページ（の最後）にあります。以下のリンクボタンからも移動できます。
その他の情報
この本で最後に作るプログラム
画像をクリックしたらデモが開きます。ゲームのほうはカーソルキー（矢印キー）で操作してください。
クリエイティブコーディングについて
この本で紹介した作品については以下のリンクを参照してください。
エラーメッセージ
p5.jsのエラーメッセージは次のページにまとめています。
この本を終えたあとに…
この本を終えて、p5.jsでグラフィックスのアニメーションを作ってみたり、JavaScriptでウェブアプリを作ってみたりしたい人は、著者のオンラインテキストも参考にしてください。
「文系大学生のための…」と書かれていますが、この本を最後まで読んだ人なら小学生〜高校生でも読めると思います。「p5.js入門」のほうは基本的な文法の復習にもなります。
JavaScriptについてさらに詳しく知りたい人は、以下のオンラインテキストが参考になります。ひとつめは「入門書」と名前にありますが、かなり詳しく説明がされています。
p5.jsのウェブエディターを使わない方法
学校から配布されているノートパソコンでは、p5.jsのウェブエディターが開かない（ファルタリングされている）場合があります。その場合には、以下の手順にしたがって、ウェブエディターを使わない方法でプログラミングを進めてください。
正誤表
本の間違いの修正です。
| 場所 | 誤 | 正 |
|---|---|---|
|
p.37、39 |
ウェブエディターが更新され、ぴごにゃんのおまじないのうち「/* jshint esversion: 8 */」は不要となった。 | |
|
p.96 ミニコラム |
サンプルコードの実行例（コメント）が「➡ -3」など、すべて負の値になっている。 | 「➡ 3」など、すべて正の値が正しい。 |
|
p.123 コードC6.cのキャプション |
論理演算子と三項演算子 | 論理演算子と条件分岐 |
|
p.194 コード10.14の6行目のコメント |
// ➡340➡120➡skyblue | // ➡240➡280➡pink |
|
p.247 図13.4の関数定義の中 |
let nn = n n; （イラスト） |
let nn = n * n; （イラスト） |
|
p.298 コード40〜41行目 |
間違いではないが、ここまでのサンプルコードと条件式のxとyが上下（前後）入れ替わっている。結果は同じ。 | |
p5.jsのバージョン2への対応について
p5.jsのバージョンは、大きく 1 系統と 2 系統に分かれています。
本書はバージョン1を想定して書かれており、バージョン2では動作やふるまいが異なる部分があります。
| 場所 | 変更点 |
|---|---|
|
p.69 図4.8（とそれ以降） |
p5.jsのバージョン2の内部で「step」という関数が使われており、警告（けいこく）が出る。無視してよい。 |
|
p.136 右段の上から6行目〜 |
バージョン2からは keyIsPressed は最後に押されたキーの値を保持せず、キーを離すと自動的に空文字 "" になるため、if (keyIsPressed == true) の条件ブロックは不要。 |
本書のScratchのコードについて
本の全体をとおして、Scratchのサンプルコードにはより適切な書き方があります。
本の中では、左側のように、2つのブロックのかたまりをいずれも「緑の旗」のイベントブロックではじめていますが、このままでは、どちらのかたまりが先に実行されるかわかりません。下のかたまりの先頭に［1秒待つ］ブロックを付けているので、たいていは上のかたまりの実行が終わってから下のかたまりが動き出すのですが、より適切な書き方はメッセージ機能を使った右側のようになります。
