pg02

旧版(2019)

テーマ iPadの子供向けプログラム学習アプリで学ぶプログラム的概念

前回の補足:

Algodooのファイルの保存場所

アルゴリズム データ整列(ソート) 値の交換 スタック スタックオーバーフロー

パリティチェック 誤り検出・誤り訂正 繰り返し処理(ループ)

予告: iPad を持参すること。授業の準備として、次のアプリ

Drop Dots (このアプリ代わりに LaunchPad または Medly でもOK)

CargoBot

Viscuit

Scratch Jr.

を app store からインストールしておくこと。準備できていない受講生は↓のシナリオを目安に、授業中に間に合うように準備する。

※ 当初は アプリ Soundrop を利用していた。Soundropは2010-11年頃から配信されていたミニマルな音とアニメによるメディア作品。

iPadに入れておいて欲しいアプリ Swift Playgrounds 、ピョンキー、Drop Dots、CargoBot、Viscuit、Scratch Jr.

第2回授業シナリオ(予定)

10分: 復習+ Algodoo 作例 + 上級テクニック(スクリプト)の紹介。スクリプト機能は第4回目に利用する予定。

15分: インタラクティブメディア・メディアアート (2017年度は少し短めに紹介)

05分: Drop Dots 実習(ループ音源の作成)

25分: CargoBot 実習(手続き化 と 手続きの呼び出し と スタック)

10分: Viscuit ルールによるアニメーション作成実習

25分: Scratch Jr. 論理的処理の実習

※ かなり忙しい。どこかで躓きそうな予感。

課題提出 WebClassの 第2回課題 4個。 次回授業日まで。

pg01の課題の補足:

https://twitter.com/_kobashi/status/781101085020741632 ビストンで上に押し上げる+複数のピストンをタイミングをずらして作動

https://twitter.com/_kobashi/status/781779590767271936 回転板でボールを弾く(モーターのトルクを強化)

https://twitter.com/_kobashi/status/781783268207190016 レイヤー(部品の重なり設定)を2枚利用。ボールは、レイヤー1の板と、レイヤー2の板との衝突設定をON。レイヤー2の板は、レイヤー1の板とは衝突せずにすり抜ける。

https://twitter.com/_kobashi/status/781793323191152640 チェーンにブラシツールで、ボールをひっかける部品を取り付け巻き上げる。

https://twitter.com/_kobashi/status/783158554270117888 バネ(反発強化)を利用。 左側は、 空気抵抗OFF + 反発係数1.0 に設定した無限に弾む状態。

Algodoo のスクリプト機能(Script)

スクリプトとは: プログラムのこと。プログラムのことを コード(code)と呼ぶこともあります。

スクリプトと呼ばれるプログラムは、特定の用途向きに、特定の処理が手軽にプログラムできるような性質をもつスクリプト言語で記述されることが多い。

例) JavaScript 、ブラウザでWebの利用に関する機能をプログラムするための言語。(注:ブラウザとは独立して動作するJavaScriptのエンジンもある)

NScripter 一昔前、2000年代(ゼロ年代)頃、日本のPC用ノベルゲーム制作で活躍していた言語 http://www.nscripter.com/

ティラノスクリプト スマフォ用ノベルゲームに向けた言語 http://tyrano.jp/

コード code 意味は符号や規則のこと。 単にプログラムというと 実行用プログラム本体 と プログラミング言語で書いたプログラム のどちらの意味にもなる。

ソースコード(コード)といいう場合、プログラム言語の記述をさす。

音楽の和音のコードは chord

ドレスコード(服装規定)のコードは code

コードリール(巻き電線)のコードは cord

Algodoo のスクリプトの解説動画(英語音声。自動字幕+自動翻訳利用可能) 基本編(衝突検知で色変化など) 応用編(衝突検知でフラグON(変数)+モーターON) 解説Blog(日本語)

スクリプトキー F10 で、Thymeスクリプト(Algodooのスクリプト)を入力する為の「コンソール画面」が現れる。コンソール画面に直接スクリプトを記入することができる。

※コンソール画面:機械装置などに取り付けられた操作卓。

昔のコンピュータはキーボード+文字のみで操作(マウスなし、グラフィックなし、CUI 。GUIではない)した。

GUI画面の中で、キーボード+文字画面のコンソール画面表示して、CUIによる操作エミュレートしている。

補完キー Tab キーで途中まで入力したコマンドの続きを自動的に保管できる。コマンドの打ち間違いによるバグ発生地獄から多少救済される。多くのプログラミング用ツールに用意されている便利な機能。

スクリプトによるモーター制御の例)

https://twitter.com/_kobashi/status/783335013362184192 衝突を検出し、モーターの回転方向を切り替える。

(参照)

アニメーションで見る機械メカニズム模型の動き http://www.museum.kyoto-u.ac.jp/collection/materials/mechAnime.html

課題(1/4)

iPadアプリとプログラム学習

講義用メモ:

Soundrop の代わりに Drop Dots を使います。

Soundrop インタラクティブなアニメーション作品

双方向性 相互作用 ボールの落下(キッカケ、アクション) → 人の作用(操作、リアクション) → ボールの反応(リアクションの連鎖) → ...ループ

interactive = inter + action

ゲームもインタラクティブメディア

Soundropの シミュレーションの精度をチェック Bug か仕様か?(古いバージョンではドットのすり抜けが発生していた。)

ミニマリズム → 作品を検索

コンセプチュアルアート → 作品を検索 泉(マルセル・デュシャン、1917年制作) レディ・メイド(既製品)

メディア芸術祭 2015 第19回メディア芸術祭 アート部門 50 . Shades of Grey(作者のサイト) 算道

IAMAS2016 修了制作展 論理憲法

第18回文化庁メディア芸術祭(2014年) http://archive.j-mediaarts.jp/festival/2014/ エンターテインメント部門 超電波砲スーパーDX弐号機 メディアインスタレーション (GOCCO ltd.)

提出物:

ループ音源として、過度に複雑なリズムならないように、線やボールを整理したものを作成する。

Soundrop の紹介ページに制作例が載っている。

この授業では Drop dots を代わりに利用する。実行している様子をスクリーンショットに撮る。後ほどアップロードする。

※ iPad のスクリーンショットは、 電源ボタン と ホームボタン を同時押しで撮影する。画像ファイルはカメラロールに保存される。WebClassにカメラロールから画像をアップロードする。

課題(2/4)

・ CargoBot

ループ処理

手続き呼び出し

スタック処理

・Tutorial を少し取り組む。繰り返し処理、条件分岐まで。 Tutorial の 1~5で説明する。 6は練習ステージ

手続きを連鎖的に呼び出す例) Prog1~Prog4がどのように呼び出されるか確認する。

・Easy の ステージ1 Double Flip は、最小で5メモリでクリアできる(上級者向け)。まずは、8か9メモリ辺りを目標にクリアし、そこからプログラムの効率を上げるとよい。

例) https://youtu.be/A0r9zhX6FPQ (7メモリ) https://youtu.be/KqOE5_t8ddQ (5メモリ)

・Hard の ステージ1 Come Together で、手続き2(Prog2)の呼び出し回数を利用した、繰り返し処理のテクニックを紹介する(上級)。

スタックを利用した、呼び出し回数の記憶例) Hard の ステージ1 Come Together

動作例) https://youtu.be/qFIps0WjQYo なぜ、このプログラムでクリアできるのか、Prog2の呼び出し回数に注目して観察。

提出物:

来週までに、どの問題でもよいので CargoBot の問題をクリアして、動画に保存する。

動画は、CargoBot を早送り>>で実行して記録すること。

※CargoBotのアプリにある動画記録ボタンから動画を保存することができません(iOSのセキュリティが変更されたため)

iPadのスクリーンキャプチャー機能を使用して、プレイ動画を保存してください。

方法:

・設定アイコン → コントロールセンター → コントロールをカスタマイズ → +画面収録 を選択。

・ホームボタンを押す。

・CargoBotを開いて、録画の準備をする。

・画面端を右側上部から 2本指スワイプ してコントロールパネルを表示する。

・録画ボタン ◎ を押す。3秒後に録画が開始する。

・画面をタップする

・CargoBotでプログラムを実行する。

・プログラムの実行が終わったら、

画面端を右側上部から 2本指スワイプ してコントロールパネルを表示する。

録画停止ボタン ◎ を押す。

課題(3/4)

・ Viscuit

※ アプリの利用でネットワーク接続が必要です。NBUWiFiに接続してください。

ルールを作る (メガネで 状況A と 状況B を結びつける)

パターンマッチング (ステージから メガネの左側の 状況A を検索して 状況B に変更)

提出物:

Viscuit を実行している様子をスクリーンショットに撮る。後で、Webclassにアップロードしておくこと(眼鏡ルールもスクショに記録しておくこと)。

移動しながら増殖するルールの例)

非決定的なルール(ランダムに動く)の例) 偶然にぶつかった場合は、☆に変化させる。

非決定的なアルゴリズムについて → 複数のルール(移動方向など)を同一のオブジェクト(部品)に設定するとどうなるか試す。

※確率的アルゴリズム(乱択アルゴリズム)についても調べてみるとよい。

2進数のカウントを利用して信号機と自動車を作成した例を見つけました。

文字を回転させて模様に変換する例

ドロップ系の簡単なパズルゲームの作成例

自動演奏(オルゴール)の作成例

課題(4/4)

・ Scratch Jr.

選択1 テーマ「ストーリー」

ステージにキャラクター(または物)を配置し、ステージとキャラクター応じたアニメーションを作成する。

選択2 テーマ「論理的条件 を 描く」

反転動作(トグル動作) ON → OFF OFF → ON

論理条件 NOT

オブジェクトをタッチすると移動開始、再びタッチすると停止するキャラクター(以下の説明では三角形△) のプログラム例)

1.水色三角は メッセージ(青)で移動開始 メッセージ(赤)で移動停止

タッチされると、赤(移動) か 青(停止) か判断する部品に、メッセージ(黄色)を送る。

↑に必要な補助部品のプログラム

2.赤い輪は メッセージ(黄)を受け取ると 右に1つ動く

右に2つ移動すると 緑の四角と衝突するように距離を調整しておく。

衝突したら、元の位置に戻る。

→ 1回目の黄色のメッセージで、衝突が発生せずに、メッセージ(青)を水色三角に送り移動開始。

→ 2回目の黄色のメッセージで、衝突が発生して、メッセージ(赤)を水色三角に送り移動停止。

※ バグる場合があります。

例) 三角を触ると動き始めるが、再び触っても停止しない。→

対策: 〇と□の距離を少し話す。 三角を触ると、青のメッセージ(進行)と赤のメッセージ(停止)の両方が送信される。

どちらのメッセージを先に受け取るかで三角の挙動は変化する。

赤のメッセージを後で受け取る場合: 停止

青のメッセージを後で受け取る場合: 進行

距離を話すことで、衝突のタイミングを遅らせて赤のメッセージ送信を青よりも後になるように調節する。

論理条件 AND

(X AND Y) → Xの条件クリア かつ Yの条件クリア の場合のみ、 条件(X AND Y)全体が条件クリアと判定される

ちょっと難しいかも。

1 緑の四角は、タッチすると、透明化し、メッセージ(緑)を送る。

2 水色の三角は、メッセージ(青)を受け取ると、表示される。

3 左上コーナーの赤い点は、メッセージ(赤)を受け取ると、右に4回動き、初期位置に戻る動作の無限ループを開始する。

4 左上コーナーの黒い点は、最初は透明化され非表示である。メッセージ(緑)を受け取ると、表示される。

何かと衝突すると、メッセージ(青)を送る。

上記の、1~4をまとめると。

条件X: 赤の輪をタッチ → 赤点の移動(ループ)開始

条件Y: 緑の四角をタッチ → 黒点が画面に現れる。

条件X AND 条件Y : 赤点が移動中 かつ 黒点が表示中 なら衝突発生 → メッセージ(青)により 水色三角が表示される。

提出物:

Scratch Jr. でインタラクティブなアニメーション作品を制作する。

シンプルな作品でOKです。

提出方法は、WebClass に3個ファイルをアップロードできるようにしておきます。

・キャラクターやオブジェクトが3つまでなら、それぞれのプログラムがわかるように、スクリーンショットを撮りアップロードする。

または

・スクリーンショットのスライドショーや、Scratch Jr.を実行している様子を動画で撮影し動画ファイルをアップロードする(10MBまで)

キャプチャ方法:iPadの動画キャプチャ(https://support.apple.com/ja-jp/HT207935

スマフォのカメラやパソコンのWebカメラで撮影

提出期限

次回授業日までをめどとします。再提出OK。 あとから提出された課題で採点します。