クリエイター手抜きプロジェクト[499]IoT編 IchigoJamでキャラクタを動かす/古籏一浩

投稿:  著者:  読了時間:7分(本文:約3,100文字)



今回は、IchigoJamでキャラクタを動かしてみましょう。ゲームなどでは、キー入力によってキャラクタが動きますが、IchigoJamでもキャラクタを動かすことは可能です。

まず、動かすキャラクタを決めます。といっても、IchigoJamは文字しか表示できませんので、とりあえずアルファベットのAを動かすことにします。アルファベットのAを左から右に動かしてみましょう。

文字を動かすには、表示する位置を変化させます。とりあえず、文字を表示する座標を入れておく変数としてXを使います。IchigoJamは変数名1文字でA〜Zまで使うことができます。(他にも配列変数がありますが、これは別の機会に説明します)

IchigoJamの座標系は左上が原点(0,0)で、右下に行くに従って座標が大きくなります。つまり、一般的なコンピューターで使われる座標系と同じです。数学座標系だと上に行くに従ってY座標が大きくなるので、ちょうど上下が反転した状態になります。




それでは実際にプログラミングしてAの文字を動かしてみましょう。

10 X=0
20 LOCATE X,0
30 PRINT "A"
40 X=X+1
50 GOTO 20

RUNとして実行すると、画面の一番上にAの文字がずらっと表示されます。とてもAの文字が動いているようには見えません。速すぎるのでしょうか。少しウェイトを入れて実行してみましょう。

10 X=0
20 LOCATE X,0
30 PRINT "A"
40 X=X+1
50 WAIT 20
60 GOTO 20

今度はAの文字が動いていくのが分かります。が、Aの文字がずらっと表示されるだけです。

WebでおなじみのJavaScript+DOM操作では、要素の座標を指定するだけで画像やテキストを動かすことができます。しかし、IchigoJamの場合は座標を指定するだけでは駄目です。「消す」という処理が必要になります。

HTML5で多く利用される、canvas要素を使った2Dグラフィックと同じということです。JavaScript+DOMの場合は「消す」という処理をブラウザが自動的に行ってくれているのです。何かを移動させる場合、「消す」という作業がないと凄く楽です。

30年以上前のコンピューターでも、「消す」という作業を行わなくて済む機能がありました。

すべてのパソコンに搭載されているわけではありませんでしたが、「スプライト機能」というものです。スプライト機能を使えば、座標を指定するだけでよく「消す」処理が要りません。

キャラクタを動かす場合は「描く」「消す」という処理が必要になりますが、この「消す」作業がなければ、速度は2倍以上になります。

昔のゲームセンターのゲームや家庭用ゲーム機などでも、このスプライト機能のおかげで、高速にキャラクタを動かすことができたのです(ゲームセンターの場合はスプライトでなく別の呼称だったはずですが、忘れました。オブジェクトという呼称だったかもしれません)。

さて、話を戻しましょう。IchigoJamではスプライト機能がないので、描画したAの文字は消さなければいけません。

文字を消すには、表示された座標に空白を表示します。先ほどのプログラムを改良し、Aの文字を消すようにしたのが以下のプログラムになります。

10 X=0
20 LOCATE X,0
30 PRINT "A"
40 WAIT 20
50 LOCATE X,0
60 PRINT " "
70 X=X+1
80 GOTO 20

RUNとして実行すると、画面の一番上でAの文字が左から右に移動していくのがわかります。今度は消す処理を行っているため、Aの文字で埋まってしまうことはありません。

この方法だと「描く」「消す」という処理が必要になるので、リアルタイム性を求めるゲームでは処理速度が遅くなってしまいます。そこで、「描く」「消す」を同時に行うように工夫します。

今回の場合は、Aの文字を表示した左側に空白を描画することによって「描く」「消す」処理をまとめておこないます。

10 X=0
20 LOCATE X,0
30 PRINT " A"
40 WAIT 20
50 X=X+1
60 GOTO 20

一見良さそうな処理ですが、問題もあります。特に横に空白を表示するためゲームなどでは移動できる範囲(表示できる範囲)が1文字分狭くなります。

シューティングゲームなどで、自機を左右に移動させる場合は両側に空白が必要になります。また、背景があるゲームの場合、単純に空白を表示するわけにはいかないので、何かしらの工夫が必要になります。

でも、このような問題は、上手にゲームデザインを行えば対処できる部分です。機会があれば昔のゲームでは、ハードウェアによる制限をどのように回避したのか調べてみるとよいでしょう。現在でも使える技があるかもしれません。


【古籏一浩】openspc@alpha.ocn.ne.jp
http://www.openspc2.org/

老人向けのドラマ(?)「やすらぎの郷」というのが始まった。見たいという人がいたので録画することに(&見ることに)。

・やすらぎの郷
http://www.tv-asahi.co.jp/yasuraginosato/

“やすらぎの郷”という理想の老人ホームに入った石坂浩二(脚本家という役)。しかし、ボケ気味の老女達(往年の名女優達)に迫られちっとも安らげない。……という老人向けのドラマが始まった。

恐怖ドラマなのかサスペンスなのかわからないけど(理想の老人ホームそのものが恐怖とサスペンスなのかもしれない)。団塊の世代も老人なので、ここらへんはかなり需要がありそう。団塊ジュニアもいずれ老人になるので先々、老人向けドラマはいいのかもしれない。

どうせなら、老人向けに過去のドラマをリメイクして作ったらどうだろう。で、タイトルだけ考えてみた。

・101歳のプロポーズ
・東京デスストーリー
・渡る世間は年寄りばかり
・天の国から
・爺メン75
・君の名は?
・大量にぼけろ

After Effects自動化本発売中です。が、紙版は最初に注文した人だけ(それも上巻だけ)届いたみたい。なぜか一週間ほど発売日が延びて今週末になったようです。

・After Effects自動化サンプルプログラム 上巻
https://www.amazon.co.jp/dp/4844397591

・After Effects自動化サンプルプログラム 下巻
https://www.amazon.co.jp/dp/4844397605

・IchigoLatteでIoT体験
https://www.amazon.co.jp/dp/B06X3X1CHP
http://digiconcart.com/dccartstore/cart/info/2561/218591

・みんなのIchigoJam入門 BASICで楽しむゲーム作りと電子工作
http://www.amazon.co.jp/dp/4865940332/

・Premiere Pro & Media Encoder自動化サンプル集
http://www.amazon.co.jp/dp/4802090471/

・Photoshop自動化基本編
http://www.amazon.co.jp/dp/B00W952JQW/

・Illustrator自動化基本編
http://www.amazon.co.jp/dp/B00R5MZ1PA/

・Adobe JavaScriptリファレンス
http://www.amazon.co.jp/dp/B00FZEK6J6/

・4K/ハイビジョン映像素材集
http://www.openspc2.org/HDTV/

・クリエイター手抜きプロジェクト
http://www.openspc2.org/projectX/