yoyo note

AotumeDoll よよ の情報ノート 実際に着た衣類やAotumeドールに関する情報をまとめています

USAYUMI-うさ弓の的当て

/

USAYUMI -うさ弓の的当て-

FullScreen
window

※表示されない場合は更新して下さい

内容

ウサギの弓使い(よよ)を操作し、的を落としてスコアを競います。

「正月？よよはうさぎの国で的射ちしてた」

ストーリーはありませんが壁絵がランダムで変わります。

※音出ます

※表示されない場合は更新してみてください。初回の画像読み込みに失敗している可能性があります。

※iphone非対応　m( _ _ )m sorry!!

操作方法

PC・スマホ共通

タイトル

画面左上の「FullScreen」で全画面になります。スマートフォンは強制的に横画面になります。

全画面中は「Window」が表示され、押すとWindowに戻ります。

PUSH STARTをクリックでゲームへ

ゲーム中

ウサギの弓近くにある円を、ウサギの背中側にドラッグすると弓を引くことができます。

マウス・タップを離すと、引っ張った距離(パワー)と角度で矢を放ちます。

的に接触すると、中心からの距離で点数が入ります。

三つの的を撃ち落とすとゲーム終了です。

映像

iPhoneでプレイできない方の為にも映像を用意しました。

PV

声:つくよみちゃん@COEIROINK

プレイ動画

補足

ブラウザ・OSの種類によっては正常に動作しない可能性があります。

iphoneはブラウザを変えても表示されませんでした。セキュリティの観点からiphoneはいろいろ難しい。

  • このゲームはthree.jsをメインにしたjavascriptで作成されています。
  • three.jsのサンプルをベースにして作成されています。
  • ページにtwitterPlayerCardのタグを仕込んでtwitter上で開くように仕組みを利用していますが、このプログラム自体にtwitterとの関連性はありません。
  • 背景・中央イラストは写真+AI画+加工です。
  • ウサギ弓(よよ)はSpineアニメーション+three.js上のボーン操作です。
  • 的と矢はblenderで作成されています。
  • 効果音はフリー素材を使用しています。

問題

「衝突判定がうまくいってない」

three.js上の線分と動的なメッシュの当たり判定に問題があり、解決の為に迷走する。

わざわざ線分と面の衝突判定を自力計算しています。が、結果的にに違和感がある判定になっています。

「中央に当てたのにずれた」「どこ当てても点数に差が出ない」「なんかすり抜けた！？」と

ゲームとして致命的な感じになったりしてます。ごめんなさい。


「モデル破綻問題(これは単に技術不足)」

Spineアニメーションにプログラム上でIK操作を行っている関係もあり

腕が潰れてたり、パーツが変なところに出現したりしてます。終わらないのでパス。

余談

・Unityでやれ→twitter連携前提で、Web上で完結して、ロゴなどの邪魔も入らないとなるとthree.js等を直接試すべきという事から。

・UnityWebでもiPhoneで動かない事は多々あるらしい。

・twitterPlayerCardの規約的にゲームは黒よりのグレーか→今後は「触れる絵」ぐらいの規模にする。

・マテリアルスナイパーみたいな動きを作りたかった。


環境によってはバグがあると思います。

報告はtwitterかお問い合わせでお願いします。