七夕ゲーを作ったよ「Ori☆Star2011」
七夕なので七夕にちなんだゲームを作ってみました。
【ゲーム紹介】
天の川の星をよけながら短冊をすべて取りましょう。
短冊をすべてとってから織姫と彦星が出会うとクリアです。
なぜ二人に短冊回収業務が課せられているのかはあまり考えないようにしましょう。
【操作方法とルール】
マウスで彦星を移動してください。
彦星はマウスカーソルに近づきます。
織姫は彦星を追いかけます。
画面右上に表示されている残り時間(Time)が、０になる前に短冊をすべてとりましょう。
ただし！
彦星は、青い短冊。織姫はピンクの短冊をとってください。
※ 短冊は最初は取れない状態（暗い色）で１秒ごとに取れる短冊が増えていきます。
短冊をすべてとってから、織姫の隣にいくとクリアです。
一度も星にぶつからないでクリアするとノーミスボーナスです。
違う短冊をとったり、星にぶつかると画面が黄色く光、残り時間が減少します。また、せっかく取った短冊をひとつ落としてしまいます。
短冊をとると残り時間が回復します。
【画像について】
七夕のイラスト 織姫と彦星/無料イラスト・フリー素材を使用させていただいたおります。
【HISTORY】
2009.07.07 ver.1.00 OriStar 2009年版公開
2010.07.07 ver.2.00 OriStar 2010年版公開
2011.07.07 ver.3.00 OriStar 2011年版公開
見ての通り、2010年版の焼き直しですｗ
僕がProcessingを使うのも１年に１回になりつつあるな・・・
あと、今日はFM-77の日かな
七夕ゲーを作ったよ「Ori☆Star2010」
七夕なので七夕にちなんだゲームを作ってみました。
【ゲーム紹介】
天の川の星をよけながら短冊をすべて取りましょう。
短冊をすべてとってから織姫と彦星が出会うとクリアです。
なぜ二人に短冊回収業務が課せられているのかはあまり考えないようにしましょう。
【操作方法とルール】
マウスで彦星を移動してください。
彦星はマウスカーソルに近づきます。
織姫は彦星と逆に移動します。
画面右上に表示されている残り時間(Time)が、０になる前に短冊をすべてとりましょう。
※ 短冊は最初は取れない状態（暗い色）で１秒ごとに取れる短冊が増えていきます。
短冊をすべてとってから、織姫の隣にいくとクリアです。
一度も星にぶつからないでクリアするとノーミスボーナスです。
星にぶつかると画面が黄色く光り、残り時間が減少します。また、せっかく取った短冊をひとつ落としてしまいます。
短冊をとると残り時間が回復します。
【画像について】
七夕のイラスト 織姫と彦星/無料イラスト・フリー素材を使用させていただいたおります。
【HISTORY】
2009.07.07 ver.1.00 OriStar 2009年版公開
2010.07.07 ver.2.00 OriStar 2010年版公開
見ての通り、2009年版の焼き直しですｗ
月面着陸40周年記念ゲーを作ったよ
今日は月面着陸40周年ということで「月面軟着陸ゲーム」を作りました。
【ゲーム紹介】
月面軟着陸ゲーム。
宇宙船を操作し燃料がなくなる前に月に着陸してください。
【操作方法とルール】
自分の操作する宇宙船は、最初画面の下の方にいます（点滅する赤い○で囲まれています）。
月（黄色い○）まで上手く操縦してい軟着陸してください。
マウスをクリックすると、カーソルの位置に向かってエンジンをふかします。
エンジンをふかすと、画面左上の「FUEL(燃料)」が減っていきます。０になるとゲームオーバーです。
画面左下の表示は、「DIST(月表面までの距離)」と「SPEED（宇宙船の速度）」です。
月に着陸する際は、SPEEDが 100以下である必要があります。
無事着陸できるとゲームエンドです。
着陸速度に応じて、RANKが表示されます。
※ 慣れるまで結構難しいです。頑張ってください。
【HISTORY】
2009.07.21 ver.1.00 公開
Processingを使用して開発しています。なんかどっかで見た様な画面ですが・・・
七夕ゲーを作ったよ「Ori☆Star」
七夕なので七夕にちなんだゲームを作ってみました。
【ゲーム紹介】
天の川の星をよけながら短冊をすべて取りましょう。
短冊をすべてとってから織姫と彦星が出会うとクリアです。
なぜ二人に短冊回収業務が課せられているのかはあまり考えないようにしましょう。
【操作方法とルール】
マウスをクリックすると彦星がマウスカーソルに近づきます（ボタンは押しっぱなしにする感じで）。
織姫は彦星と逆に移動します。（ひょっとしたら仲が悪いのかもしれない・・・）
画面右上に表示されている残り時間(Time)が、０になる前に短冊をすべてとりましょう。
短冊をすべてとってから、織姫の隣にいくとクリアです。
一度も星にぶつからないでクリアするとノーミスボーナスです。
星にぶつかると画面が赤くなり急激に残り時間が減少します。
短冊をとると残り時間が回復します。
【画像について】
七夕のイラスト 織姫と彦星/無料イラスト・フリー素材を使用させていただいたおります。
【HISTORY】
2009.07.07 ver.1.00 公開
Processingを使用して開発しています。とりあえず２時間で完成
流体シミュレーションみたいなもの「STORM」
風の流れをシミュレーション？するアプレットを作りました。
画面内をドラッグすると、そこに風が起こります。風同士ぶつけたりして遊びます。
→http://dokokano.com/ftlabo/applet/Storm/
【スクリーンショット】
(二つの流れがぶつかった状態)
(中央でぐるぐるした場合)
【画面のみかた】
風は色付で表示されます。
横方向の風は赤、縦方向の風は緑。斜め方向の風は赤と緑がまじって黄色になります。
左下の数値は、画面内で風が起きているセルの数です(アクティブセル)。セルは400x400で最大160000個あります。
右下は、FPSです。
通常は30FPS程度。アクティブセルの数が10万を超えると5FPSくらいに落ち込みます。
【操作方法】
画面をドラッグ（クリックしながらマウスを動かす）すると、その位置にマウスを動かした速度に応じた風がおこります。
【その他】
・初期状態に戻す場合は、ページをリロードしてください。
・いろいろ無茶しているので非常に重いです。Pentium4 3.06GHzマシンでアクティブセルが10万の時に4.8FPSになりました。最近のマシンではどんな感じでしょう？よかったら教えてください。
・シミュレーションは適当ですｗ。詳しくはソースを見てください。(「Source code:」のリンクから見られます)
・これをつかってなんかゲーム作りたいなあ。ゲームに使う場合は、セルはもっと荒くてもよいはずです（現状400x400を40x40程度に落とすなど）。
# 今日はWonderWitch 10周年だって。いろいろゲームつくったなあ。WWGPに出たりとか。ナツカシス。
プログラムの書き初め「観覧車脱輪シミュレーション」（ぉ
あけましておめでとうございます。
お正月は当然プログラミング三昧ですよね。
僕も早速プログラム作ってます。
今年のプログラム書き初めは「観覧車脱輪シミュレーション」です。
● なにそれ？
先日の打ち上げの際に、観覧車が支柱から脱輪してごろごろ転がりだしたらどうするかという話になりました。
僕はゴンドラが地面についているときは、地面に対して静止しているので、その隙に脱出したらよいのではないかと話をしたのですが、あんまり納得してもらえませんでした。
横方向の加速度とかが脱出の妨げにならないか？というのです。
（まっすぐ転がるのか？とかゴンドラ壊れないか？とかいった疑問にすいては瑣末なことですので、ここでは検討しません）
そこで、実際にシミュレーションプログラムを作って検証してみました。
● 動画
● 実際に動かしてみる
上記ページで、ブラウザ上で動かすことが出来ます。
JavaAppletですので、もし動かない場合は以下のサイトからJavaソフトウェア(JRE)をダウンロードしてインストールしてください。
→Java ソフトウェアの無料ダウンロード
● 解説
【これは何？】
観覧車が支柱からはずれてごろごろ転がりだしたらどうしますか？
あわててはいけません。
ゴンドラが地面についたとき、ゴンドラは地面に対して静止しているのです。
あわてず降りましょう。でも、観覧車の回転があまりに速い場合は、かなりのＧを受けます。
チャンスは一瞬。
このシミュレーションを用いてタイミングを体で覚えてください。
(全景)
(ゴンドラ拡大：速度、加速度のベクトルも表示されます)
(脱輪！)
(観覧車の大きさや回転速度も指定できます)
【画面のみかた】
画面中央で回転しているのが観覧車です。
観覧車には12個のゴンドラがぶら下がっています（常に下を向くような機構を持っています）。
赤いゴンドラがあなたの乗っているゴンドラです。
なかの白い顔があなたです。加速を受けると上下左右に振られます。
【操作方法】
画面をクリックすると観覧車が脱輪し、ごろごろ転がり出します。
恐ろしいことです。マウスを画面中央にいれると、ゴンドラの速度や加速度ベクトルが表示されます。
a)水色の線：速度ベクトル
b)赤い線：加速度ベクトル
c)緑の線＋○：重力加速度
d)緑の線＋●：重力加速度と加速度を合成したベクトル通常は、d)のベクトルはほぼc)の重力加速度と同等です。
普通に地上にいるのと大差ありません。
しかし、観覧車の回転速度があがると大きく振られいます。
d)のベクトルが、中央にある場合自由落下状態です。
【各種設定】
画面の4隅の項目をクリックするとこで、設定を変更できます。
・左上：[MODE] NORMAL / GONDOLA
視点を変更します。
NORMAL→観覧車を中心とした視点
GONDLRA→ゴンドラを中心とした視点・右上：Scale [+][-]
表示の拡大率を変更します。[+][-]ボタンをクリックして下さい。・左下：[+][-]SPEED
観覧車の回転速度を変更します。1分間に回転する回数(RPM)で指定します。・右下：SIZE {+][-]
観覧車の大きさを変更します。巨大観覧車を作ることも出来ます。
【備考】
・観覧車を脱輪状態から復帰させたい場合は、SIZEを変更するとリセットされ元に戻ります
・観覧車本体やゴンドラは絶対壊れないと仮定
・ゴンドラは常に下を向くような機構を搭載している
・実はサイズ・重力加速度の定数は適当
話題のProcessing.jsを試してみた（あわあわデモ作った）
processingという開発環境があります。
これは、Javaベースの統合開発環境で、グラフィック系の独自のライブラリを搭載することで、イメージ処理が簡単に出来るのが大きな特徴です。メディアアート界隈でよくつかわれています。
エディターも内臓していて、スケッチ的に小さなプログラムを作っていけるのもお手軽でいいですね。完成したプログラムは、アプレットとして生成できます。
【最近作った作品】
→椅子取りゲームシミュレーション
→ゲーム「Amoeba#1」
アプレットが簡単に作れるのはいいのですが、最近はアプレットも冷遇されてるような気がしますし、プラグインインストールしないといけないのが面倒です。
せっかく作っても、プラグイン入れてないから見れないよーって言われたら悲しいですしね。
（でも、プラグインはダウンロードしてインストールするだけだから入れてくれよぅ→Java ソフトウェアの無料ダウンロード）
それは、ともかく・・・
最近ちょっとした話題になっているのが「Processing.js」。
これは、なんとProcessingで作ったJAVAソースをJavaScriptに変換して実行してくれるものなのです（Processingの独自ライブラリも搭載している）。
これなら、JavaScriptが動くブラウザ = IEやFireFoxなどのほとんどのブラウザで、そのまま実行できますよ。
僕は↓のブログの記事で知りました(解説わかりやすい）。
[javascript] ブラウザでお絵描きプログラミング！ Processing.js 登場！
● あわあわデモ作った
それならばと早速作ってみましたよ。
白い画面をクリックすると泡ができて、泡同士がぶつかると弾かれるというデモです。
で、Processing.js をつかった、JavaScript版がこちら。
→Bubbles_JS
まったく同じ動作をしています。すげー！！！
これなら、お手軽に公開できますね。
※プログラムは、HTMLのソースを見てください。
● 問題点
ただ、問題点もなきにしもあらず。
(1) ちょっと遅い、IEだと超遅い
JavaScriptの性能ゆえか、ちょっと遅いです(FireFoxでは)。
でも、FireFoxはまだいいです。IEで動かすと、超絶遅いです。
画像表示にはXHTMLのCanvasっての利用しているのですが、IこれはIEには搭載されていないので、JavaScriptでエミュレートしているのです。遅くないわけがない。
まあ、そんなわけで出来ればFireFoxで見てください･･･。
(2) Processingで用意されている関数以外使えない
Appletでは、Javaのライブラリが利用できますが、Processing.js版ではProcessingで用意されている関数のみしか使えません。
Vectorクラスとかは使えないってこと。
でも、自分でClassの定義はできます。これはびっくり。JavaScriptに、そこまでコンバートできるんだ・・・
マウスやキーボードイベントもちゃんととれます。
(3) デバッグがしにくい
エラーがあってもなにも表示されないので、なにがいけないのか調べるのが大変。
Processingで作ってから、JavaScriptに持ってきたほうがいいかなあ。（でも、互換性の問題でひっかかると厄介ですね）
(4) マウスの座標がうまくとれないことがある
Canvasをテーブルの中とかにいれると、マウスクリックした際の座標がずれることがある
いまのところこんな感じかな。
でも、Java知ってれば、JavaScript使えなくてもお手軽に映像系（ゲームも作れますよ）が作れるのは大きい。
Processing & Processing.js を活用していろいろ作っていきたいと思います。
