世界の国旗から2を例にUnityを使った簡単な脱出ゲームの作り方をYouTubeで公開しています。興味があればぜひ! →  動画一覧

アイコンフォント大集合

プレイするにはWebGLに対応しているブラウザが必要です(そんなに古いPCやブラウザでなければだいたい大丈夫です)。

推奨ブラウザ:Chrome   Firefox   Safari   Edge

ゲームが表示されるまで少し時間がかかります。あとブラウザの仕様で音が出たり出なかったりするみたいなのですが、ご容赦願います。音が聞こえなくてもゲームの進行には影響ありません。

攻略動画(Walkthrough)を開く

一昔前はウェブサイトのアイコンといえば画像でしたが、最近はアイコンフォントというものがよく使われています。このサイトも右側にあるメニューのアイコンなどにアイコンフォントを使用しています。

アイコンフォントとは、一言で言うとアイコンのフォントです。まさに読んで字のごとくなんですが、テキストとして扱える画像とでも言えば良いんでしょうか……絵文字ともまたちょっと違うんですが、画像っぽくは見えるけどテキストデータなので、画像よりも軽量で色を簡単に変えたりできるというメリットがあります。こんな感じで。



これは画像編集ソフトで色を変えているのではなく、CSS(ウェブサイトのデザインを作るために使用する言語)で色を変えています。なので自在に色を変えられます。ためしに下のカラーパレットで好きな色を選択してみてください。上のアイコンが選んだ色に変わります。



このフォントアイコン、数がものすごく豊富にありまして、だから思ったんですよ。「こんだけあればアイコンだけでゲーム画面も作れんじゃねーの?」って。

一応それなりに形にはなったんじゃないかと思っているんですが、アイコンフォントって少し抽象化されてるところもありますので、もしかしたら「これは何の画像なん?」って思うこともあるかもしれません。そこは何とか心の目で見ていただければ何の画像か分かるはず……つたわれ〜(声:佐久間一行)

まあ、使用している素材がいつもと違うだけでゲームの内容的には他作品と何ら変わりませんから「へー、アイコンフォント使ってるんだ……で?」とか言われてしまったら何も言い返せないんですけどね。製作者のこだわりなんてそんなもんっすよ(笑)

アイテムの操作に関してですが、いつもなら一回目のクリックで選択、二回目のクリックで詳細表示としているところを、今回は一回目のクリックで選択と詳細表示、二回目のクリックで選択解除となります。詳細に関してもいつもは画面の中央にバーンと出るんですが、今回は画面の右上に出しています。またアイテム取得時は自動的に選択状態になります。

ゲーム内のアイテムやら背景やらは全て以下のサイトのアイコンフォントを使用しています。
Font Awesome
Material Design

効果音は以下のサイトからいただきました。ありがとうございます。
無料効果音で遊ぼう
効果音ラボ
On-Jin ~音人~

以下のサイトで紹介していただきました。ありがとうございます。
iPhoroid
脱出ゲーム大百科
だしゅつ! 無料脱出ゲーム
RAME FEGE
脱出ゲーム始めました!
日本語無料脱出ゲーム

不具合などありましたら問い合わせフォームX(Twitter)からガシガシご報告ください。可及的速やかに対応いたします。