KAEDE Hack blog

JavaScript 中心に ライブラリなどの使い方を解説する技術ブログ。

人生初ゲームを作った話

 ご無沙汰ですKEIです!初めてのゲームを作って、一応公開ができました!

残念ながらHatenaブログでは動画がはれないのでサムネだけ。

f:id:kei_s_lifehack:20180905053448p:plain

降ってくる火球から地表を守る為に、丘の上の大砲からクリックで砲弾を発射して、火球を消し去り、地表を守るゲームです。

(Version 4では)消費した大砲の弾数と、消し去った火球の数が左上にカウントされます! 砲弾が画面から消えたら再発射できます!

全画面にはならないので多少左下の大砲側に寄せて遊んでもらう必要がありますが、 一応こちらで公開しています

codepen.io

参考文献はこちらです。2012出版。

f:id:kei_s_lifehack:20180905053401j:plain

https://www.amazon.co.jp/dp/4777516911/ref=cm_sw_r_tw_dp_U_x_snVJBb08AZQWP

サンプルからの変更点は主に

  • 画面のスケール(400 x 400 から2000 x 1000に)

  • 弾速度 高速化

  • 弾とターゲットを大きく
  • 得点表示位置を下から右上へ
  • 青いUFOから赤い火球へ
  • 背景を黒に
  • 地面を追加

などです。

課題が結構たくさんあって、挙げると

  • 集中して作れていない
    • 飽きて他のことに手を出して、何ヶ月もかかってしまった。
  • ログイン画面がない
  • 時間制限がない
    • フォロワーにこれらをつけるとゲームらしくなると教えてもらったが、今の所実装の仕方がわかっていない
    • 多分最優先
  • そもそも公開できてるか微妙
    • サーバー公開覚えてないし、GitHubも覚えてない。Git管理もできていないでHTMLファイルのコピペでVer.名増やしてUpdateしている。
  • スマートフォンに対応させる
    • 今の所、横2000, 縦1000のスケールでしか表示できない。
    • 二番目に優先。
  • 火の玉が火の玉になってない
    • 炎っぽいエフェクトになっていない。
  • 地面が苔むしてない
    • グラデーションとか、画像の連続とかで対応して、火球落としたら大変な感じを出したい。
  • 得点画面が可愛くない
  • 砲台がかっこよくない
  • 炎を潰した時のエフェクトがない
    • 爽快感は楽しませる為に重要なはず
  • 地面に被弾した時のダメージがない
  • 弾数制限を変えられない

改善点

  • 画像の並べ方を覚える
  • サーバーから公開する方法を学ぶ
  • 最初に説明画面を出す方法を学ぶ
  • 時間切れでresult画面にする
  • 体力切れでresult画面にする
  • できればTw共有を出す
  • 画像の並べ方を覚える
  • Devise-width, hightにする (変数にちゃんと組み込む?)
    • またはスマフォで別表示する
  • 当たった時のエフェクトを考える
  • 放水エフェクト考える
  • 効果音を出す
  • ソシャゲのようなクールダウンのエフェクトを出す
  • 夜モードと昼モード
  • 月や雲を描く

以上です!課題は変えたいことはいっぱいありますが!それを把握できたのと改善すればいいゲームができるワクワク感が得られたのは作った(そしてブログにまとめた)大きな成果だと思います!

うちょさん

cachacacha.com

の様な楽しいゲームサイトを作るのを目標に頑張っていきます!!

乞うご期待〜!

--END--