ドラクエ風ゲームで知る、今までに無い全く新しい『FileAPI』と『Drag&Drop』の使い方

HTML5の技術を駆使した面白いWEBゲームをご紹介。コンセプトはどうやらドラゴンクエストの様ですが、プレイ方法にHTML5の技術が取り入れられています。

HTML5であそんでみたクエスト

サウンドが流れますので、音量に注意してからプレイしてください。
勿論サウンドのON・OFFを切り替える事も出来ますので、安心してプレイできます。

まずはゲームをするにあたって、主人公の名前を決めましょう。
この画面も昔懐かしいドラゴンクエストを再現していますね。

そして敵との対戦です。
ここではHTML5の「FileAPI」と「Drag&Drop」を使ってコマンドを入力し、
アクションを起こしていきます。
やり方としては、ローカル環境にある画像を、画面の右側にある破線の中に
ドラッグ&ドロップします。
ドラッグ&ドロップされた画像ファイルの拡張子によって、
どのコマンドを指定したのか判別されます。

また、ファイルの重さによって効果も変わり、より容量の多いファイルを
入れれば、高い効果が得られますが、容量の少ないファイルを入れれば
効果は少ないです。

また、このファイルの容量によって、読み込み時間が変わるので
あまりにも重いファイルだと敵に攻撃のチャンスを沢山与える事になります。
逆に、軽いファイルだと細かな攻撃を何回も与える事が出来ます。

こういったゲーム性も「FileAPI」と「Drag&Drop」を上手く使う事で出来るんですね。
作者のセンスの良さに関心します。

今まではビジネスツールや管理ツールで注目を浴びがちだった「FileAPI」と「Drag&Drop」ですが、
このサイトによって「新しい使い方」を提案された気がします。
本当に、HTML5はアイデア次第なんだとつくづく感じさせられます。

これからはアッと驚くようなサイトが沢山出てくると良いですね。
HTML5には、それだけの可能性があります。

HTML5であそんでみたクエスト

カテゴリー: ギャラリー   パーマリンク