乙女ゲームを作りたいけど絶望的に絵が描けない。

乙女ゲームを作りたいけど絶望的に絵が描けない。

シナリオしか書けないけどやっぱりどうしても乙女ゲーを作りたい。
そんな私が奮闘するブログです。


テーマ:

ものすごく久しぶりの更新になってしまいました…!

毎日毎日「暑いよー」と思っていると1日が終わっています。怖いです。

制作の方もあまり進められていなくてもどかしい思いをしているのですが、焦ってぐちゃぐちゃになるのは嫌なのでのんびりいきたいと思います。

 

ティラノビルダーでは[html]というタグが使える、ということに度々触れていますが、このタグと画像ボタンについてをメモしておきます。

[html]~[endhtml]を使い始めた理由としては、「画面内をスクロールさせたい」というのが主でした。

よく、アイテムショップなどで、画面上部で店員さんが「いらっしゃい!何を買うんだい?」と話していて、その下に枠があり、その枠内がスクロールしてたくさんのアイテムが並んでいる、という状態を作りたかったんです。説明が嘘みたいに下手ですけども。

この、スクロールバーを出す、というのが(多分)ティラノスクリプトのタグではできません。なので、htmlを使ってスクロールバーの設定を行っています。

 

そしてそのhtml内で更に画像ボタンを使いたかったのですが、これが一筋縄ではいきませんでした。

[html]タグ内では、ティラノスクリプトで使われているタグも使えます。htmlの記述としては<span>~とか<div>~なんて書き方をしますが、[emb]や[button]などのタグを書いても通常どおり動きます。

ティラノタグの方で画像ボタンを表示させる方法があり、こちらを使おうと思ったのですが、座標設定(x=100 y=100などの部分)がhtml内で上手くおさまってくれませんでした。

画面に対して絶対位置?を取ってしまうようで、スクロールやhtmlの枠が無視されて表示されてしまうみたいです。当然いくつ画像を並べてもスクロールもできません。

 

そこで、制作wikiにも載っている、ボタンを表示後シナリオジャンプする、という方法を使いました。→wikiはこちらです

まず、htmlタグの前にマクロを記述します。私はこのボタンをかなり多様したのでマクロ用のシナリオを作り、それを[html]の前でcallしています。

マクロ部分は

[macro name=マクロの名前]
[iscript]
$("#"+mp.id).click(function () {
TG.kag.ftag.startTag("jump",{storage:mp.str, target:mp.tgt});
});
[endscript]
[endmacro]
これを記述します。

そしてhtml内の画像を表示させたい部分に

<div id="button_ボタンの名前">ボタンの画像</div>

を記述します。

そして[endhtml]の後に

[マクロの名前 id="button_ボタンの名前" str="ジャンプ先シナリオ名.ks" tgt="*ジャンプ先ラベル名"]

と記述すると、画像ボタンと同様のジャンプシステムができます。

この方法だと、画像をhtmlの記述で表示していることになるので、html内、つまりスクロールする枠の中で画像の位置を決めることができます。

 

画像の表示位置については主にcssで決めるのがいいかと思います。

私はテーブルタグを使い、<td>内に画像を表示させています。これだと均一に縦に並んでくれるのでスッキリするかなと思います。

wikiを見ながら四苦八苦したので簡潔にまとめておこうと思ったのですが、かえってややこしくなってしまった気もします(´・ω・`)

 

相変わらず画面のデザインが決まらず苦しめられていますが、シナリオはひとり清書が終わったので、頑張って組み込んでいこうと思います!完成させるぞー!!


テーマ:

ティラノビルダーにティラノストーリーをプラグインとして使ってみているので、自分用のメモも兼ねて詳しく書いておこうと思います。

 

まずは公式さんからダウンロード。もちろんティラノストーリー単体でも充分すぎるほどに遊べますが、私は現在プラグインで使用させて頂いています。

公式ページに詳しい手順が載っているので、導入も簡単だと思います。

dataフォルダの中のothersフォルダの中のpluginフォルダを開くと、chat_storyというフォルダがあります。これを、ティラノビルダーで作っているゲームデータの、data/others/pluginというフォルダにフォルダごと入れます。

導入はなんとこれだけ、簡単…!

これで、ティラノビルダー内で、ティラノストーリーのタグが使えるようになります。

 

チャットを表示させたい部分に[plugin name="chat_story"]というタグを入れると、その場所でチャットが表示されるようになります。

[image]タグや[chat_config]タグで、レイアウトやコンフィグを設定できるので、こちらもセットで書くことになると思います。

そして、表示させたいチャットやアイコンを設定していきます。

 

私はトップ画面に設置し、時間経過で特定のキャラがぴょこぴょこ独り言をしゃべっているような状態にしています。

こちらを、時間がランダム、台詞もランダム、と乱数を使用して表示させています。

[chat_talk pos="left" text="&f.変数名[f.数字用の変数]" face="アイコン画像" se="チャットが出た時に音が鳴る"]

こんな感じのタグを使っています。

ここのランダムには、「変数の配列」というものを使用してみました。こちらはwikiに色々と載っています。

[eval exp="f.変数名=['パターン0','パターン1','パターン2','パターン3']"]というタグを使うと、変数に配列の設定ができます。このパターン0、1、2、3のところに、それぞれ0、1、2、3と配列番号というのが割り振られています。

このパターンをランダムで引き出して、チャットに表示させたいので、乱数を決めるタグを使います。

[iscript]
f.数字用の変数 = Math.floor( Math.random() * 3) + 1
[endscript]

これで、「f.数字用の変数」に1~3のランダムな数字が入ります。ここで0からにする方法が分からなかったので、配列のパターン0とパターン1を同じものにして、1以上の数字で対応できるようにしています。ランダムの整数は0を使えるんでしょうか?(´・ω・`)

この乱数タグを通って、配列の数字をランダムに決め、会話パターンをランダムに引き出す、という方法にしています。ひとりで調べてやっているので強引なやり方なのかもしれませんが…。

 

通常は、画面クリックでチャットが進むものです。私はここに[wait]タグを使って、時間経過で勝手に表示されていくようにしています。

今のところ正常に動いてくれているので、色んな遊び方ができる便利なツールだな~はぇ~と感動しながら使っています。

 

変数の説明みたいになってしまいましたが、これだけがちゃがちゃに変数やらifやらを使っていてもするする動いてくれているので、本当に汎用性の高いすごいツールだなぁと思います。

私も上手く使いこなして、楽しいゲームが作れるように頑張りたいと思います。いつも素敵なツールを使わせて頂いて感謝感謝です!


テーマ:

アイテム錬成画面がへっぽこながらもなんとかまとまりまして、今はTOP画面のシステムを作っています。

ここに、少し前にリリースされた「ティラノストーリー」というものをプラグインで組み込んで動かす予定です。

 

チャット形式で文が流れるんですが、時間経過でログが流れているようにしたくて、[wait]というタグの勉強を少ししていました。

こちら、その名の通り操作を「待つ」タグで、[wait time=1000]のように入れると、このタグを読んでから1秒間待ちますよーというものです。

で、これを導入したら理想どおりの動きをしてくれて「おおーあっさりできた!」なんて喜んでいたのですが、いざ他のボタンを押そうとしてみたらどこも反応しなくなりました。(´・ω・`)

公式のタグリファレンスを見に行くと、「time属性で指定した時間、操作できなくなります。」とのこと。なんと…!!

TOP画面にはいくつもfixボタンを置いてあって、そこから別の画面に飛べるようにしてあったのですが、[wait]タグが動いている間(例えば5秒間ウェイトを入れたら、その5秒間)はボタンを押せないどころか何の操作も受け付けなくなってしまうんですね。これでは八方塞がりになってしまう!ということで色々調べていました。

 

結果、[glink]というボタンなら動くみたいです!よかったー!

これは、ADV形式で選択肢を表示する時に主に使っているボタンかと思います。

このボタンを置くと強制的にシナリオが停止状態となり、ボタンを押すと自動的に[cm]というタグが作動しボタンが消え、指定したシナリオにジャンプする、というものです。

fixボタンは、ボタンを押した後も、「fixボタンを消す」というタグを入れない限りはボタンが表示され続けるものです。非常に使い勝手がいいのでいつの間にかfixボタンばかり使っていましたが、思えばTOP画面から移動する際はどこの画面に行っても一度画面をクリアしているので、その瞬間にボタンが消えていても問題はありませんでした。つまりfixにする必要が無かったということですね!

 

fixをすべてglinkに変えたところ、全てのボタンとチャットが表示されたのち、チャットだけが[wait]タグに合わせて動き続け、なおかつボタンを押して画面移動ができる、という状態に持っていくことができました。

すぐにボタンを押して移動するもよし、しばらくTOP画面に留まってチャットを眺めるもよし、のシステムを作りたかったので、かなり思いどおりにできたかなーと思います。

ただ、glinkというボタンに画像を指定することができるんですが、ここのサイズ設定がどうにもずれているようですね。pxで指定できるはずなのですが、fixボタンなどと同じ大きさで設定しても、横に伸びたり縦に伸びたり縮んだり、思っていた大きさにならず「???」となりました。

こちらは調べてみると、どうやらcssの方の設定との兼ね合いで、どうしてもずれてしまうそうです。

cssをいじってもよかったのですが、目視で調整すればなんとかなりそうなので、今のところはサイズを調整して使っています。

 

とにかくティラノストーリーの可能性が本当にすごくて計り知れないので、また後日ティラノストーリーについても詳しく記事に書きたいと思います。


テーマ:

システム作りをちまちまとやっています。

スクリプトを組み始めると結構一気に進むんですが、躓くのはいつだってグラフィックですね…!!

画面構成をどうしようとか、どの画像をアイコンに使おうとか、配置をどうしようとか、こちらの方がなかなか進まなくておなじみの牛歩です。

 

現在は、トップ画面のレイアウトが少し固まっていて、採取画面のシステム、ショップ画面のシステム、所持品画面のシステムあたりまでは形になっています。

[html]というティラノスクリプトのタグを駆使しています。以前趣味でhtmlを少しいじっていたことがあったので、多少でもhtmlが分かるのが本当に救いで、このタグのお陰でやりたいことが大幅に表現できたと思います。

今はアイテム錬成の画面(と言ってもひとつの素材がひとつのアイテムになるだけの簡単なもの)を作っているのですが、ここのレイアウトが全然浮かばなくて立ち止まっています。

見た目に可愛いのももちろんですが、操作がしやすいのがいいですよね。あんまり複雑にしたりアニメーションを豊富にすると、手軽にプレイできなくなりそうですし…悩みますね~。

 

[ptext]という、イメージレイヤーに文字を表示するタグをよく使うのですが、このタグに属性として「name」というものが付けられます。

[ptext name="適当な名前"]とつけておくと、それが付箋代わりになって、その名前でひとくくりに処理ができるので、これは特にこだわりが無くても何かしらの名前を付けておいた方がいいなぁと思いました。私は今まで特につけていなかったので最初から全部付け直しました。(´-`)

そうこうしているうちに、やっとレイヤーの仕組みがわかってきたところです。画像関連は一段と難しいですねー。

 

あと数字用に可愛いフォントを入れてみたり、気分転換にBGMを探したりと色々やってみています。システムシステムと言っていますが何よりも大変で時間がかかっているのがグラフィックに他ならないという話でした。私はグラフィッカーさんをこれからも一生崇め奉り続けるのであろう。うーセンスが欲しいよー!


テーマ:

先日、最後のひとりの下書きが終わり、やっとシステムの制作に入れました!

慣れていないキャラだったこともありかなり手こずりましたが、無事にまとまったのでよかったです。

これで攻略キャラ6人分の下書きは終了です。最初にキャラを選んで、条件を満たすごとにストーリーが解放されていくシステムになる予定です。

分岐を入れようかまだ迷っているのですが、あんまりごちゃごちゃしてしまってもプレイしにくいような気がするので、分岐は無しのまま行くかもしれません。

ただ、それだと少し味気ないので、派生ストーリーをいくつか作ろうとは考えています。

つまるところ、まだまだシナリオには手がかかるということですね…!ひとまずは下書きが終わっているので、清書をするときに追加分も考えようと思います。今まで書いていた量に比べたら微々たるもの…のはず…!

 

ということで、今はシステムを作り始めています。

今回のゲームに「ティラノストーリー」というツールを取り入れてみたく、とりあえず導入だけしてみました。

ティラノビルダーで作っていますが、こちらにプラグインとして導入することによって、ビルダーの中で動かせるようになるそうです。

動作は確認できたので、これからじっくりとカスタマイズしたいですね。

 

そして、以前少し作ってあったシステムを整理したり、UIを作ったりというところから手をつけています。

ボタンなどの配置を決めるにしても、画像を用意するにしても、本当にことごとく自分のセンスの無さが際立ちますね!とにもかくにもセンスが!

画像やアイコンはすべて素材としてお借りしているものなので、すごく可愛いんですが、上手く活かせないのが本当にもどかしいです。

ですが悩んでいても時間が過ぎていくだけですので、まずは仕上がりそうなところから順に仕上げていきたいと思っています。

やることは山積みですが、ひとつひとつ丁寧に!頑張るぞ!

Ameba人気のブログ

Amebaトピックス