2018年03月16日

ほぼみっかリメイク進捗日記3

月一の更新になってきた進捗日記です。主要キャラの表情差分が大体できてきたので、動画にしてみました。



サムネの藤宮君が坊主ゲーであるかのような存在感を放つ。
今回キャラ数が多いので、Web Animation API(polifill使用)で目パチと口パクやってみたのですが、このアニメのオブジェクトが複製できないみたいで、ゲーム変数に突っ込んだら見事にセーブ時強制終了しました。おお。statのextendで死にます。危ない。理解しないまま使うとダメですね。というわけでとりあえず一時変数に入れることにしました。そしてロード時に復元。これでいいのだろうかという不安はありますが、動くのは動くのでまあとりあえず。毎度場当たりです。
やってみてから思うと俺ギャルのようにaddClass,removeClassでやった方が手間がなかったかもなーと。ただ今回パーツを一枚画像にして、CSSスプライト的にbackground-positionで表示変更してみたのですが、この場合アニメ開始位置のyなりxなりを動的に変更する必要があるので、どちらにしてもJS上からの定義じゃないと無理かなとも。CSSアニメをJSで指定できればそれでいいような気もします(やり方がよく分からなかった)。

t2.png
相変わらずインデントが崩壊している!
Web Animation APIだとCSSアニメっぽい指定でいけるので何となくでも何となく動きますね。でもスマホでの動作とかどうなんでしょうね。よく分かってません。危ない。

t1.png
chara_modはこういう風になってます。leftかtopかを手動で分けてるので汎用性がないですね。それを言うと元のwidthとheightも手動指定なのでもう。あふれ出る動けばいいや感が残念です。

t7.png
パーツ分けはこんな感じで。CSSスプライトにした理由は個別に結合して保存して出力して管理してが面倒だったからなのですが、結果的な作業量的にはそんなに変わらないかもしれません。でもまとめた方が分かりやすさはありますね。ファイル数も増えないので迷わない。画像サイズが大きくなるとスマホとかでメモリ消費が懸念ですが、その辺はまあ完成が近づいてから考えます。まだ遠いです。

t5.png
表情確認用シナリオファイルでは、こんな感じで適当に(効率は無視で)定義されてる分の表情を配列で抜いて、buttonを荻原さんのforプラグインでループ配置しています。超楽です。これで初めてbuttonのpreexpを使いました。preexpに格納した変数をボタンが押された時?にexpで使えるというものなのですが、ループで回しても個別に変数渡せるので、飛んだ後のシナリオで変数による分岐ができるんですよね。

t4.png
前はこの表情変更実行を全部手打ちで羅列していたので、その時に比べて見通しの良さが半端ないです。ミスもないので超便利です。

chara_mod_allは一括表情指定のために作ったタグで、先にchara_face_allというタグを作り表情名で眉・目・口パーツごとの表情を登録、それを元にchara_modで変更するというものです。(汗・照れ・鼻はshow,hideのみ)

t6.png
これにより、
#キャラ名:表情
という風にシナリオ上で全変更できるようになりました。前はマクロ作っていたのですが、こっちの方がミスが減るかなあと。でも今の仕様がマルチプラットフォーム的にヤバそうならこの辺全部変わるかもしれません。ブラウザでの挙動が鬼門です。

あとはゆっくりやっていくので、次の日記は二か月後あたりかもしれません。ではまた。
posted by SOrow at 19:57| Comment(0) | ほぼみっか

2018年03月04日

マサオたたきKSG賞!

先日第四回PLiCyコンテストにて、マサオたたきがKSG賞をいただきました!



何か賞貰えたら嬉しいなあと思ってはいたのですが、シナリオはないしシステム部門といってもギミック豊富というわけでもないしアクション部門といっても言うほどアクションでもないし、KSG賞……はKSG度足りないだろうしなあ……無理そうだなあ……という感じだったので、受賞の連絡頂いた時にはもう本当にびっくりしました。KSGか! マジか! KSG賞なのか! いいのか! 貰っていいのかー! と一人でツボってました。マサオ君がKSG賞! やったぜ! 個人的KSG賞はシグラルさんのmemesoらんどだったのでちょっと申し訳なさもありますが、本当に嬉しいです。ありがたき幸せ!

というわけでマサオたたきの裏話など。といってももう書いてることが多いので、表話な感もありますが、ゴウ。

マサオたたきの最初アイディアとしては、animate.cssのアニメでランダムにインしてくるマサオ君をクリックするとanimate.cssのアニメでランダムにアウトする、という感じでした。ティラノのbgのmethodとか確認するやつ作ってた時に、そういうの面白そうだなあと思い軽くやってはみたものの、それがあまりうまくできなかったのと、中途で放置してたらファイル整理した時に間違って削除してしまったのとで、あれどうしようかなーまあいつかでいいかーと放置&放置。で、しばらく経ってSVGをちょっと触った時に、「これパスで当たり判定できるのでは?」と思いついたので、それでインしてくるマサオ君をクリックしたらアウトさせられる感じのを改めて作ってみよう、となった結果が今のマサオたたきです。どうせなら軽い方がいいなーと立ち絵も一種類に限定。BGMは丁度動画作った時に「これゲームでも使いたいなあ」と思ったぐるぐるぺったんこオンリーに決定。ひたすらぐるぐるぺったんこ。最初の構想とはちょっと違いますが、やりたいことはできたので良かったです。ただそんな感じで自分の中でマサオ君を叩くのが当たり前になりすぎて、「何で叩くの?」と聞かれた時に「……何でだろう?」となってしまったのが反省点でしょうか。何でだろう。自分でもよく分からない!(白目 叩かせてくれるマサオ君は太っ腹です。ありがとうマサオ君! ありがとうカブ!

制作中は付け焼刃情報を駆使しまくったので、今ファイルを見るともう「うわあ」ってなります。自分でよく読めない! ひどい! でも一応SVG使えるスマホからでもプレイできるくらいの軽さにはできたかなあと。ゲームにもよりますが、瞬発系は快適性の維持が難しいですね。今回作ってみて、場当たりだとやっぱり調整が壁だなあと感じました。アクションゲーム作ってる方すごいです。

制作自体は途中まで一発ネタになればいいかなという感じで、大体できて「もういいか!」となっていたのですが、テストプレイしてもらってそこで色々ご意見頂いて、確かにもうちょっとちゃんとできた方が面白いかなあ、折角だし、と思い直して、また諸々やった末に今の四ステージ(?)となりました。一発ネタだけど一発ネタに終わらないゲームにできたのは、本当にもうテストプレイヤー様のおかげです。ありがたい限りでした。

あとランキングの設置法とかググってもサッパリだったのですが、ティラノのオンラインランキングのプラグインを配布してくださった方がいらして、それを元にPLiCyさんの方からアクセスする形で実装できました。本当にあのプラグインがなければオンラインランキングは無理でした。ありがたさがもはや天井突破です。スクショ撮るJSアップデートプラグインまで! 宇宙にいくしかない!
ランキング設置後にやり込んでくれる方もいて、非常に嬉しかったです。モード的にスコアはほとんど頭打ちにはなってしまうのですが、ちょっとした時にやってもらえたらそれでもう幸せマックスです。

折角なので数値とかカスタマイズできる感じで公開しようかとも思ったのですが、全体的にコードがしっちゃかめっちゃかでもう手が付けられませんでした。何という分かりづらい作り方をしてるのか! 無駄多い気がしてならない! そんな感じでアレですが興味ある方がいらっしゃればゲーム部分だけでもアップしようかとも思うので、お気軽にお声がけくださいー。
posted by SOrow at 19:29| Comment(0) | 日記