スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

Almightでスマホ用ノベルゲーム作成「25回目:スマホ用ゲームにして公開してみよう」

25回目にして、ようやくゲームの公開です。そのまえに・・・

↓↓余談ここから↓↓
「飛ばしても制作講座の内容に影響なし」
さて、公開するまでにいろいろ(そしてかなり)時間がかかりましたが、
以前お伝えした通り、ゲーム化すること自体はこの講座を始めた当初からほぼ出来上がっていました。
あくまで、講座用に編集しつつ行ったので、当初のものと概ね同じ代物でした。
それならなぜこんなに遅くなるのか?
答えは一つです。
実はALMIGHTは機種によってはほとんど動かないのです。
これはスマホが市販ゲーム機と違ってスペックからバージョンからなにまで違うために起こる現象です。
特に、ALMIGHTはhtml5依存の、いわば一度ブラウザを立ち上げてさらにそこでソフトを動かすような代物です。
しかしながら、だからと言って動かないのではプレイのしようもないです。
私の手持ちタブレット系端末いろいろ試した結果、
・手のひらに収まる初期型スマホ→めちゃめちゃもっさりだが起動する。
・次に新しいスマホ→即死
・2015年モデルのスマホ→動く
・ipad時間で必ずフリーズ
という具合。単純なスペックの問題ではないのはあきらかです。
何百回とデバッグしましたが、スクリプト的なテクニックではどうにもならんのです。
(たとえばメモリが重いのかと思い、逐一開放したり、レイヤの合成を細切れにするとか、見かけ上の処理を軽くするよくある小技ですが)
動作不安定については、ALMIGHTのアプリレビューを見ればどういう状況かご理解いただけるでしょう。
安定動作を目指そうにも、アプリ自体が動きようがないのではいかんともしがたい。
と、言うわけで、ここまでやってきた講座ですが、これを最後に終わってしまいそうです。
だってこれ以上先に進めないので。

↑↑余談ここまで↑↑


さて、25回目はスマホ用にファイルを変換するやり方と、公開のやり方です。
公式にも書いてあるのですが、もっと細かく順を追って公開したいと思います。
まずはPC用ファイル同様AlmightPackagerを使います。
pack7.jpg


今度はこの画面の時にiPhone/Androidを選ぶだけです。それ以外は前回と変わりありません。

さて、これで二つのファイルが生成されたこととも思います。
・jp.almight.suzumushi.sadame.almight
・index.html
さて、次に問題となるのは公開の仕方です。
どうやったらスマホとかでゲームをインストールできるのか。
編集するのは「index.html」のjほうです。
これを開くとこんなページになっています。

インストールが麺

このページをホームページ等で公開することになります。
といっても、あくまでこれは自動サンプルページで、実際にこのページなければいけないわけではありません。
詳しくは後述。

さて、中のソースを見ると、こんな部分があります。
タップしてインストール


そう、ここの部分がゲームをダウンロードする根幹となる個所です。
ここを編集します。(メモ帳とかで開いてね)
とりあえず、ちゃんとアドレスが書けているかも確かめるため、
http://公開するアドレス/jp.almight.suzumushi.sadame.almight
みたいにしておきます。
保存したら、この
・jp.almight.suzumushi.sadame.almight
・index.html
をホームページで公開します。
公開の仕方がわからない人はホームページの公開の仕方を検索で調べてください。その手のサイトが一生で見切れないくらいでてきますので。
うまくダウンロードできましたか?
そしたら、先ほどの
http://公開するアドレス/jp.almight.suzumushi.sadame.almight
のうち、httpのところをalmightに変えておきます。
そうしたら、あとは実際にスマホでアクセスします。
この時、あらかじめalmightのアプリをインストールしておきましょう。
インストールされてあれば、リンクをタップしたときにゲームがAlmightアプリ内にインストールされるはずです。

これにて、公開は完了です。
スポンサーサイト

Almightでスマホ用ノベルゲーム作成「22回目:Uncaught TypeError: Cannot read property '1' of null」

さて、22回目は、急きょ、エラーについてです。
おそらく、長編を作っている方なら一度は遭遇したことがあるかもしれないエラーです。
今回私が遭遇したのは、「はじめから」を選んで、シナリオファイル「一章.ks」を読み込もうとしたとき、
いくらやっても読み込まなかった状態です。
この状態、フリーズすることなく、ひたすらボタンはクリックできるのに進まない、という状態でした。
試しにデータをロードして先に進もうとすると、ロードしてシナリオを開いた直後に固まります。
しかし、Almight特有の白画面(エラー警告)は出ない。
どうなってるのかなと思ってデバッグを開いたところ、コンソールで以下のようなエラーを吐いていました。

error.jpg

ちょっとでかいですが、文字がつぶれて見えなくなるといけないのでそのまま貼り付けました。
さて、注目すべきは赤枠をつけた部分。
Uncaught TypeError: Cannot read property '1' of null

なんのこっちゃ!?
ネット先生で調べると、jsファイルのエラーだとかが出てきてさらに意味不明に。
そもそもこのエラー、何か読み込もうとしたときに例外エラーが起きたという意味。
しかしnull(中身が空)の1が読み込めんとはよくわからないものです。
何か設定し忘れたファイルか、存在しないものを読み込もうとしたかを疑い、ファイル名がおかしくないかや、
以前# Almightでスマホ用ノベルゲーム作成「18回目+α:ファイルの文字コード」
でもやっていた文字コードバグが混じっているのかと思い、全ファイルを調査。
しかし、問題はない。

途方にくれ、しょうがなく正常なAlmightのフォルダをコピーし、100行くらいをコピペしては起動を繰り返し問題個所を捜索。
すると………………

…………そこには………

「えぇーーーっ!!!」

驚きのエラーが!

さて、Almightでは構文を書く際の約束があります。
それは、構文は「@」で書き始めるか、「[ ]」で囲うかです。
察しのいい人はもう気づいたかもしれませんね。
VOIDさんは癖と言うか、見た目から感じる生理的な印象から「[ ]」派です。
さて、これは必ず「[ ]」で囲わなければいけません。
そうです。
「[ 」だけになっていた箇所がありました。
今回のエラー、ようするに何の例外エラーかというと、構文を書き始まる個所があったけど、終わりが見えなくて参照ができなくなってますよ、みたいな意味だったようです。

しかし、普通のプログラムはファイルを読み込んだときではなく、その構文に到達した時にエラーを吐いて固まるものだけど、
Almightは高性能にもファイルを読み込んだ瞬間エラー箇所があればエラーを吐いて止まってくれるようです。
こういうエラーは見つかりにくいのに、案外しょうもないことがエラーであることが多い気がします。
みなさんも、数100数1000行書いてからデバッグするのではなく、新しい変数や処理を入れたらすかさずデバッグをしたほうがいいかもしれませんね。

……えっ、ただの書きミスじゃないかって?

大丈夫、まだ人生をミスしたわけじゃないさ。

それでは、おあとがよろしいようで~。次回へ続く。
次回こそは1章を無償公開予定?!

Almightでスマホ用ノベルゲーム作成「20回目:ゲームデータの整理」

さて、20回目でさっそく一章を公開!
……といきたいところですが、
その前に細かい設定のあれこれを変えたいと思います

1.ゲームの入っているフォルダの書換え
いつまでのtutorialというフォルダでは、今後ゲームデータ公開したさいに何のゲームかわからないので
「SADAME」というフォルダにゲームデータを入れていくことにします。
そのままフォルダを作ってもゲームが起動できなくなるだけなので、
公式サイトではこのページの
http://almight.jp/tutorial/setup/
作業フォルダを確認する
に書いてあります。
……ちなみに、以前苦戦した文字コード関連の話もここに出ていました。
うっかり見落としてました(汗

閑話休題、まずは
almight-sdk-4.2-beta-win\projector\data
フォルダの中に
CefResources.rcというファイルがあると思います。
これを開いてみます。
すると

WINDOW_X : auto
WINDOW_Y : auto
WINDOW_WIDTH : 1024
WINDOW_HEIGHT : 768
INDEX_PASS : \tutorial\lib\index.html
DECODE_FLG : 1
DEBUG_FLG : 1

と書いてあるのがわかります。
それぞれの解説は省きますが、
WINDOW_X : auto
WINDOW_Y : auto
はゲームを起動したときのウィンドウの位置です。
あえて指定する必要は特にないと思います。
スマホだと強制フルスクリーンですし。

WINDOW_WIDTH : 1024
WINDOW_HEIGHT : 768
は画面サイズです。
ここを変えると、ゲームの画面サイズを変えることができます。
なるべくデフォルトを弄らない方針なので、今回はこのままです。

INDEX_PASS : \tutorial\lib\index.html
今回目的の変えたい場所です。
ここのtutorialをSADAMEに変えてあげます。
これで目的は完了です。
ちなみに
DECODE_FLG : 1
DEBUG_FLG : 1
の二つはデコードやデバッグ用のパラメータのようなので、書き換えないほうがいいでしょう。

あとはゲーム用のフォルダをSADAMEに書き換えれば終わりです。


# Almightでスマホ用ノベルゲーム作成「19回目:タイトル画面」

19回目はタイトル画面の制作です。
あくまで今回はデフォルトの設定のまま、うまく動作させることを目的とします。

16~18回目でコンフィグをやりましたが、
その中でtitle.htmlを使えるようにするというのがありました。
コメントアウトしている箇所を直すというものでした。

1.first.ksの中身はりつけ

@call storage="macro.ks"
@call storage="macro2.ks"

;ADVタイプのウィンドウにする
[type_msg type="adv"]
;タイトル画面では使わないので消しておく
[hide_msg]
[action]

;SUZUMUSHIのロゴの表示
[show_bg file="SUZUMUSHI.jpg"]
[action time = 2000]
[wait time=300]

;暗転させる
[show_bg file="ブラック.jpg"]
[action time = 2000]

;SADAMEのタイトル画面の表示
*タイトルへ|タイトルへ

[show_bg file="title.jpg"]
[action time = 2000]
[playbgm storage="SADAME.ogg"]

[showtitle storage="一章.ks" target="*game_start"]
[s]

さて、こんな感じです。
それでは詳しく紹介していきます。

2.ロゴなどの表示

[show_bg file="SUZUMUSHI.jpg"]
[action time = 2000]
[wait time=300]
の部分で、ロゴを表示して数秒待ってから次に行くようにしています。
rogo.jpg
こんな画面になります。

3.タイトル画面
[show_bg file="title.jpg"]
[action time = 2000]
[playbgm storage="SADAME.ogg"]

title5.jpg
[showtitle storage="一章.ks" target="*game_start"]
[s]


背景をロゴからタイトル用に変えたのち、
BGMを鳴らしてタイトル画面用のボタンを表示しています。
title.htmlはCSSで書かれているので、実は画像をボタンにすることもできます。
……が、今回の移植は凝ったことをしないことを目的としているので、あえて変えません。
これは、凝りだすとボタン効果音とかもつけたくなってしまい、修飾に際限なくなりそうなので線引きしています。
本当は公式にない個所なので説明したい気持ちもあるのですが、また今度ということで。
極力設定関係はいじらないで作ることを目指します。

3.タイトル用のタグについて
[showtitle storage="一章.ks" target="*game_start"]
[s]

さて、重要なタイトル用のメニューを表示させるタグですが、これはあくまでタイトル画面の表示に使います。

<余談>珍しいことに、actionタグを必要としません。
これは画面効果とは別で動作を定義しているものだからで、要するにactionはレイヤーに対する表示命令全般を担うタグであり、
今回のタイトル画面の読み込みはhtmlの表示までを一括して行う形になっています。
……厳密に詳しく中身を見ているわけではないのですが、html関係はactionとは表示のさせ方が違うということだけ覚えておけばいいと思います。
<余談終わり>

4.さて、このタイトル画面の「はじめから」を押すと、ゲームが始まります。
一章の出だしだけ、このように書いておきます。
*game_start
[stopbgm]
[hidetitle]
[show_msg]
[action]

[hidetitle]はタイトルのボタンを画面から消します。
これをやらないと、永遠に画面に残るので注意しましょう。
また、メッセージ画面を出すために、
[show_msg]
[action]
を使います。
後はゲームを進めていくとこのようになりました。

story01.jpg

さて、次回は変数を追加しつつ、一章を公開していきたいと思います。

# Almightでスマホ用ノベルゲーム作成「18回目+α:ファイルの文字コード」

さて、19回目の前に、重要なことに気付いたので、ここで書いておきます。
Almightでシナリオ等を書くファイル「○○.ks」ですが、ファイルを保存するさいの文字コードは必ず「UTF-8」にしてください。
実は吉里吉里でSADAMEを作っていたときは「SHIFT-JIS」で作っていました。理由は、出先用のサブマシンがデフォルトでSHIFT-JISでテキスト保存していたからなだけなのですが、このままファイルを使い回すと、日本語部分が確実に文字化けします。
というわけで、余程自力で設定を変えるわけでもないなら、UTF-8にしておいたほう良さそうです。
最新記事
カテゴリ
プロフィール

VOID

Author:VOID
同人サークルSUZUMUSHIです。オリジナルノベルゲームを作っています。コミケ等で配布予定です。作品に興味がわいたら
公式サイトへ。
(・ω・)ノ

Twitter
公式Twitterです。関係ないつぶやきもしばしば。
最新トラックバック
カウンター
RSSリンクの表示
検索フォーム
QRコード
QR
RSSリンクの表示
ブロとも申請フォーム

この人とブロともになる

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。