13
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

elm-playgroundで素数ホッケー

Last updated at Posted at 2019-12-21

今日は12月21日ですね。

ということでElm2 Advent Calendar 2019 20日目 の記事です。1

この前のELMP1というイベントで面白いゲームがたくさん紹介されていて、自分も簡単なゲームを作りたくなりました。
実際に作ったものの紹介と、製作に使用したelm-playgroundというパッケージのメリット・デメリットを挙げてみました。

作ったもの

素数ホッケー2です。
PC専用です。スマホでも表示できますが動かしづらいです。

ソースコード
デモ

hockey-demo.png

※読めば分かると思うのでソースコードの説明はしません。

感想

elm-playgroundではThe Elm Architecture(TEA)ではない独自の仕組みで開発していきます。
これは素数ホッケーみたいな小規模ゲームを作る上でとても便利です。

:o: 簡単にゲームが作れる

まず学習コストがめちゃくちゃ低く、

  • view関数内で、一定のルールに従って図形を配置する
  • update関数内で、時間経過とユーザーのアクションをもとにデータを更新する

この構造さえ理解すれば完了です。

素数ホッケーの製作期間は2日くらいでした。
CSSを一切書かなくていいのがとっても楽です。

:o: 安全にゲームが作れる

Elm界ではありがちな話ですが、何も考えずに書いてるのに安全なプログラムが勝手に完成してしまいます。
データの更新がupdateというたった1つの関数だけで行われるので「訳わからんバグを産み出してテンションガタ落ち」を経験することなく作れました。

人々の不幸をぶち壊してくれるEvanさんはすごいです。


一方で、elm-playgroundはTEA以上に外界とのデータのやりとりがすごく制限されているため、次のような不便がありました。
たとえば、

### :x: ランダム要素を持たせることができない

ランダム要素はユーザーをゲーム中毒にして廃課金してもらうには必要不可欠なものと言えますが、elm-playgroundでは乱数を生成することができないみたいです。
したがって、ゲーム製作でお金を儲けたい場合には向いてないと思います。

素数ホッケーでもランダムな値は当然使いたいのですが、今回に関してはソースにベタ書きした乱数のリストと時刻を数値化する関数の1つであるzigzagを組み合わせて擬似的な乱数を作るようにしました。

訂正: 嘘でした。Random.Seedを使えば乱数を生成できます。

:x: ストレージを使えない

TEAではPortという機能を使ってLocal Storageにデータを保管して再利用することができますが、elm-playgroundではそれにあたる機能がありません。
たとえばユーザーの自己ベストスコアを保存しておくみたいなことはできませんでした。

:x: ユーザーのアクションが限定的になる

ユーザーの動きはElm上のComputerという型に渡されますが、マウスの位置やキーボードの上下左右など一部しか格納されていないため、それらのアクションのみで成立するゲームしか作れません。

この素数ホッケーをスマホでやろうとすると、スティック(赤い丸いやつのことです)をうまく動かせません。
これはスワイプアクションを拾えなかったことが原因です。

Computerという型名のとおり、PC上で動くゲーム開発を想定してるんだと思います。

まとめ

elm-playground

  • 簡単にブラウザゲームが作れる
    • プログラミングの楽しさを知ることができる
    • Elmの初期学習に向いてそう
  • 制約がかなり大きい
    • Elmで本格的なゲームを開発するならTEAのほうがいい
  1. 1日遅れで申し訳ありません。

  2. 飛んでくる数が素数かどうか判定して弾き返したり受け入れたりするやつです。

13
1
3

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
13
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?