ユーニックス総合研究所

宝箱アプリの作成

  • 作成日: 2024-01-03
  • 更新日: 2024-01-03

宝箱を作成し、中に自分の「秘密」を入れて「鍵」をかけることが出来るWebアプリ「秘密の宝箱」を制作しました。
宝箱には「ヒント」が設定されているので、そのヒントを頼りに宝箱を開錠します。
開錠して手に入れられるのは他人の秘密ということになります。
ヒントの難易度はユーザーが自由に設定できるので、簡単な宝箱から難しい宝箱までユーザーは幅広く作成することが出来ます。

Django, Vue, Three.jsによる制作

制作にはDjango(ジャンゴ)Vue(ビュー)Three.js(スリージェーエス)を使いました。

The Web framework for perfectionists with deadlines | Django
Vue.js
three.js – JavaScript 3D library

Three.jsを使った3DCGをアプリに組み込んでいます。
リアルタイムに宝箱の状態をユーザーに通知するロジックを実装しています。
開錠に失敗すると失敗アニメーションに変化し、開錠に成功すると成功アニメーションに変化します。
3DCGのノウハウが欲しくて導入したのですが、この経験はのちのWebアプリ「3Dダンジョン迷路」に継承されました。
Three.jsは比較的に簡単に3DCGを実装できるので、評価が高いJavaScriptのライブラリです。