2014/06/11

Googleドライブを使って、ゲームをWebに公開する

＊google ドライブはブラウザゲームを配信するのに適していません。
このページの内容は参考にしないでください。

 安定してブラウザゲームを配信したい方は以下のサービスの利用を検討してください。

 忍者ホームページ（無料）
http://www.ninja.co.jp/hp/

 ロリポップ（有料 月額100円〜）
https://lolipop.jp/





＊google ドライブの仕様に変更があったようです。
途中までは一緒ですが最後のURL取得の部分について

http://matome.naver.jp/odai/2139351957366008801

上記サイトを参考にしてください。


ティラノスクリプトはブラウザゲームとして
インターネットに公開して、世界中の人に遊んでもらう事ができます。

方法はティラノスクリプトのプロジェクトファイルを 
丸ごとアップロードするだけなので、すごく簡単です。 

今回はGoogleドライブを活用する手順について解説していきます。
Googleドライブの特徴として

無料
１５ギガ使える（無料）
Googleということで安心感がある

といった、点が挙げられます。

それでは早速使っていきましょう。
Googleドライブにアクセスしてください。
アカウントをお持ちでない場合は、作成してください。

【GoogleドライブURL】
http://www.google.com/intl/ja/drive/

最初にフォルダを新規作成します。
フォルダ名は「game」としておきます。


作成したフォルダを右クリックします。
そこから、共有　→　共有... を選択してください。



変更をクリック

「ウェブ上で一般公開」を選択して、保存をクリックします。


次に作成したゲームフォルダの中に、ティラノスクリプトのプロジェクトフォルダの中身（index.html等がある階層）を全部そのままアップロードしてください。





アップロードが完了したら、いよいよ完了です。
アップロードしたファイルのindex.html を右クリックしてください。

「開く」→「Googleドライブビューア」　を選択します



開いた画面で、「プレビュー」を選択します。


これでゲームが表示されます。
また、その画面のURLがインターネット上のゲームURLになりますので
公開する場合は、このURLを送りましょう。

ワンダーコレクションで発表する場合も、このURLを使用することができます。


ブログやホームページに貼り付けたい場合は

<iframe src="http://ゲームのURL" frameborder="0" scrolling="no" width="640" height="480"></iframe>

以上のコードをブログやHPのHTMLに貼り付けてください。

src は自分のゲームURLに置き換えてください。
また、width height の値はゲームの画面サイズに合わせて変更してください。







2014/04/01

ティラノビルダー ver 0.1.2 へアップデート

ティラノビルダーを Ver 0.1.2 へアップデートしました。

主な追加機能は、クリッカブルマップへの対応と
グラフィカルに画像サイズや位置を指定できるツールを追加しました。

背景画像をクリックした時にイベントを発生させるゲーム（脱出ゲームみたいなやつ）を作成する場合
クリッカブルマップを使用します。

その際、座標の指定などが面倒なのですが、今回追加された機能を使うとキャプチャ画像のように、背景を確認しながら位置を決定することができるようになりました。



さらに、画像ボタンやイメージ表示も実際に画面を確認しながら配置できるようになりました。



あと、細かいバグ修正とティラノスクリプトの最新版へのバンドルが含まれています。

それでは、よろしくお願い致します。

>> ティラノビルダー公式ページヘ
＊ティラノビルダー最新版へのアップデートについて

以下の手順で実施してください。
ただし、旧バージョンからの移行は正常に動作しない場合がありますのでご注意ください。

①ティラノビルダー最新版をダウンロードして解凍する
②旧ティラノビルダーのmyproject 以下のフォルダを最新版のティラノビルダーへコピーする
③mypeoject 以下のティラノスクリプト本体も最新版に置き換える


以上となります。




2014/03/30

ティラノスクリプト Ver 3.0.1 リリース内容

こんにちは。

2014/3/30  ティラノスクリプト Version 3.0.1 をリリースしました。

変更内容は以下のとおりです。

・コンフィグのcursorDefaultをサポート
　あわせて、[cursor]タグを追加。ゲーム中にカーソルを変更できるようになりました。

・メニュー画面のキャッシュ化と速度向上

・[button]タグにrole パラメータを追加
　ボタンに特別な機能を割り当てることができるようになりました。
　　-メニュー表示
　　-セーブ画面表示
　　-バックログ表示
　　-タイトルへ戻る
　　-スキップ
　　-ウィンドウ非表示
です。
これにより、画面上に各種機能のボタンを配置するのが楽になるかと思います。
詳しくはタグリファレンスを確認して下さい。

・[clickable]タグにx y 属性を追加。
    従来通り locate でも指定可能ですが、x y が優先されます。

・バグ修正がいくつか。

以上です。よろしくお願いいたします。
　

2014/03/05

ティラノスクリプト３　リリース予告

２０１４年の３月下旬を目標にティラノスクリプトの新バージョンをリリースします。
新しく搭載される予定の機能を紹介させていただきます。



グラフィックリンクの追加



画像を使用しなくても、カラフルな選択肢ボタンを表示することができるようになります。
サイズや位置も自由に指定可能です。
色はblack gray white orange red blue rosy green pink の９種類を用意しました。



セーブ画面、ロード画面、メニュー画面が容易にカスタマイズできるようになります



 外部HTMLとして編集できますので、HTMLとCSSの知識があればさらに凝ったものも作成可能です。
また、サムネイル表示にも対応します。



その他


バックログを標準搭載
キャラクターface属性追加
ボタンにhint clickse enterse leavese clickimg enterimg 属性を追加
等など



ティラノビルダー 

ゲーム制作は次の時代へ
windows版 MacOS版　同時リリース




概要

  • スクリプトを書かなくてもドラッグ＆ドロップで本格的なゲーム制作を開始できます。
  • スクリプトを書いている中級者の方でも、多彩なサポート機能で開発効率を劇的に改善します。
  • デスクトップからドラッグ＆ドロップするだけで画像や音楽をゲームに反映することができます。
  • 出力させるスクリプトに対して、プリロードなどの最適化処理を自動的に挿入し、ゲームの品質を高めます。
  • 自動的な入力チェックでスクリプト直打ちしている場合は実行するまで気付かなかったケアレスミスを事前に防ぎます
  • 配布はブラウザ、アプリ、iphone、アンドロイドなど、ボタン一つで実行ファイルを作成します。
  • ティラノスクリプトだけではなく、エクスポート機能により（KAG/吉里吉里  AirNovel  AlmightJS などへの変換にも対応予定です。
  • 利用は完全無料です。商用利用にも制限なし（ただし法人は制限あり）


＊当初はα版として提供させていただきます。ぜひとも、フィードバックを頂きながらツールを育てて行ければと考えております。

以上です。ご期待ください！

2014/02/10

【2014年度版】phonegapでアプリ化する　その２（アンドロイド版）

【注意】この記事より新しいアプリ化の手順が公開されています。

Androidアプリ化手順 2015年版


前回までで、アンドロイドアプリ化に必要な開発環境を整えました。

まだの方は　＞＞【2014年度版】phonegapでアプリ化する　その１（アンドロイド版）を先に確認してください。


＊先ほどの動作確認で作成したプロジェクトは削除しておいてください

プロジェクトフォルダの作成

好きな場所に、あなたのプロジェクトフォルダを作成します。
今回は、Dドライブ直下にmyprojectという名前で作成しておきます。



NodeJSのインストール

アプリ化にはNodeJSが必要です。
以下のURLより、NodeJSを取得してインストールしてください。

http://nodejs.org/




環境変数の設定

コントロールパネル　→　システム　→　システムの詳細設定　→　環境変数　を選択してください

以下ようにPATHにすべて追加します。


D:\adt-bundle-windows-x86_64-20131030\eclipse\plugins\org.apache.ant_1.8.3.v201301120609\bin\;D:\adt-bundle-windows-x86_64-20131030\sdk\platform-tools;D:\adt-bundle-windows-x86_64-20131030\sdk\tools; ;%JAVA_HOME%\bin


adt-bundle-windows-xxxxxxxxxxxx などの数字の部分はそれぞれ、環境によって異なるので、読み替えて適切に設定してください。

%JAVA_HOME%にはJDKを指定する必要があります。

index.htmlの編集

ゲームプロジェクトのindex.html の </body>タグの直前に以下のコードを追加してください

<script type="text/javascript" src="cordova.js" ></script>

PhoneGapのインストール

本記事の執筆時点での最新版はphonegap3.3 です。そのバージョンを元に記述していきます。

続いて、PhoneGapのインストールを行います。
最初に作成しておいたプロジェクトフォルダを開いて

[ファイル]=>[コマンドプロンプトで開く]　を選択します。


すると、黒いコンソール画面が開いたかと思います。

そこで、以下のコマンドを順番に打ち込んでください。


npm install -g phonegap@3.3.0-0.19.6

*動作が不安定な場合があるので、バージョンを固定してインストールします。


phonegap create myapp
cd myapp
phonegap plugin add org.apache.cordova.media

以上を実行すると、myapp というフォルダができているかと思います。

その中のwwwというフォルダへティラノスクリプトのプロジェクト一式を上書きしてください。




もう一度コンソール画面に戻って

phonegap build android

と打ち込みましょう。


完了したら、次に再度Eclipse を開いてください

[File] →　[Import]→ [Android]　→[Existing Android Code Into Workspace]

そこから、新しく作成されたアンドロイド向けのプロジェクトがあるので、そのフォルダを選択します。




以上で、準備は完了です。
このプロジェクトをアンドロイドアプリケーションとして実行してください。




いかがでしょう。プレイ出来ましたね。

音を鳴らしたい場合は --useaudio　オプションが必要です。
実機確認やアンドロイドマーケットのアップについてはまた後日。アディオス




【2014年度版】phonegapでアプリ化する　その１（アンドロイド版）

【注意】この記事より新しいアプリ化の手順が公開されています。

Androidアプリ化手順 2015年版





ティラノスクリプトで作成したゲームをアンドロイドアプリ化する手順を説明します。

iphoneアプリ化についてはこちら

アンドロイドSDKとEclipseのインストール

以下のURLより、ダウンロードしてインストールしてください。



適当な場所へ回答してください。
今回はD:ドライブ直下に解凍したものとして、解説を続けます。


eclipse ディレクトリの下にあるeclipse.exe を実行してください。
以下のように、起動すれば問題ありません。

うまく起動できない場合は、Javaがインストールされていない可能性があります。
以下のURLよりJavaをインストールしてください。




プロジェクト作成

eclipse が起動したらアンドロイドアプリ用のプロジェクトを作成します
画面上部のメニューから[File] => [New] => [Android Application Project] を選択します。



続いて、プロジェクト名を決定します。ここではmyappという名前をつけて解説を進めます。
以下の画面のようにしてNextを押してください



あとは、適当に進めていって、Finishを押します。

これで、プロジェクトが作成されました。

アンドロイドエミュレーター起動確認

アンドロイドのエミュレーターが起動できるようにします。
画面上部の[Window]=>[Android Device Manager]を選択します。

開いた画面のリストに、AVDが表示されていれば大丈夫です。
存在しない場合はNewボタンをクリックして、適当なデバイスを追加してください。


さて、それでは準備が整いましたので、エミュレータを起動します。
画面左側のmyapp上で右クリックから、[Run As] =>[Android Application] を選択します



エミュレータが起動しましたね？




以上で、基本的な準備は完了です。
次回はいよいよ、ティラノスクリプトのゲームをアンドロイドアプリ化していきます。







【2014年度版】phonegapでアプリ化する (ios編)

警告！！　この記事の内容は古いです。アプリ化する場合は以下の記事を参考にして下さい。



最新版　ティラノスクリプトのアプリ化
http://shikemokumk.hateblo.jp/entry/2016/03/15/111922



ティラノスクリプトで作成したゲームをアプリ化する方法を解説します。
専門的な知識は不要です。だれでもiphoneやipad 向けにアプリを作成することができます。

Androidアプリ化の手順はこちら

まず、iphoneアプリ化するのに、必要なものとして

・Mac PC

が必要です。

はい。Windowsではiphoneアプリは作れません。MacBook等を手に入れよう。もしくは借りよう！

これさえあれば、後は以下の手順で作っていくだけです。
それでは、制作をはじめていきましょう。

Xcodeをインストール

まずは、Macに最新版のXcodeをインストールする必要があります。
Xcodeとは、Macでソフトウェア開発を行うためのソフトウェアです。
それでは、AppStoreを開いて、「xcode」と検索してください













無料ですので、手順にそってインストールを完了してください

phoneGapのインストール

次にPhoneGapというツールをインストールします。
以下のURLがphonegap の公式サイトになります。

http://phonegap.com/

執筆時点の最新バージョンはphonegap3.3ですので、そのバージョンを元に解説していきます。

phonegap を使用するには nodejs が必要です。
以下のサイトから入手してインストールしてください。

http://nodejs.org/




INSTALL　ボタンをクリックしてパッケージをインストールしてください。
後は他のMacアプリと同様にインストールを完了してください。

続いて、アプリ化を実行していきます。
最初にデスクトップなどの適当な場所にフォルダをつくってください。
ここでは、iphoneという名前として説明していきます。

作成したフォルダをツールバーにある黒いアイコン（画像参考）にドラッグ＆ドロップしてください。


真っ黒い画面が出てきたかと思います。



画面が出てきたら、以下のコマンドを順番に実行してください。
コピペで貼り付けて、エンターキーを押します。

（１）phonegap のインストール


sudo npm install -g phonegap

（２）アプリの作成（myappという名前で作っておきます）
phonegap create myapp com.myapp "myapp"
cd myapp
phonegap plugin add org.apache.cordova.media

次にティラノスクリプトのプロジェクトフォルダを用意してください。
以下の画像のように、先ほど作成してiphone/myapp以下のwwwというフォルダに
ティラノスクリプトのプロジェクト以下のファイルをすべて上書きしてください。



さて、ここまでくるとあと少しです。
もう一度コンソール画面（黒いウィンドウ）に戻ってください。

そこで
phonegap build ios

と打ちます。

すると、myapp/platforms/ios/myqpp.xcodeproj

というファイルが作成されていると思いますので、実行してください。
Xcodeが起動します。




あとは、画面左上部分から、再生する機種 (iphone Retina(3.5inch)) 等　を確認して再生ボタンを押してください。


さて、いかがでしょう。
以下のようにゲームが開始されましたね。



いかがでしょう。
アプリ化の準備は以上です。

ここから、実機での確認やAppStoreでの販売などについては
他の解説サイトがたくさんありますので、そちらでご確認願います。
（次回、このサイトでも追記します）

その他、小ワザとして

ゲームを縦、横に固定したい場合は


Deployment Info の部分を上記のようにすると
横固定のゲームになります。その他、時計や電池バーの表示制御なども可能になります。


さらに、昨今のスマートフォンでは画面サイズが一定ではありません。
そのため、作成したゲームのサイズによっては画面に黒い空きスペースができるかと思います。
縦横比を無視して画面いっぱいに拡大したい場合はティラノスクリプトのプロジェクトフォルダ system/Config.tjs の中にある


;ScreenRatio = fix;

の部分を fit に変更することで画面いっぱいに拡大できます。








2014/02/06

ティラノスクリプトVer2.93 をリリースしました。

 以下、主な更新内容です。

画面比率の調整機能追加
Config.tjs の ScreenRatio を調整することで画面サイズの比率を調整できるようになりました。


・fix モード（デフォルト）
画面比率は常に固定されます。スマートフォンなどで見た場合は比率を崩さないで
表示できうる最大サイズに調整されます。ただし、画面サイズによっては空白部分ができます。

・fitモード
画面いっぱいに拡張されます。
スマートフォンなどで比率を気にせず、画面いっぱいに表示したい場合はこのモードを使用して下さい。


アンドロイドアプリ化した際に、一部環境で正常に音楽が再生されない不具合を調整。
phonegap 最新版3.3 に対応

バックログタグの追加 [showlog] 
kag.menu.displayLog() でも標準のバックログを表示します

キャラクター制御の機能拡張

キャラクターをオブジェクトとして扱えるようになりました。
例えば、最初に立ちキャラクターと表情を登録しておくと
表情を指定するだけで、キャラクターの立ち絵を変更することができるようになりました。

;表情の登録
[chara_face name="yuko" face="angry" storage="newface.png"]

;表情の適応
[chara_mod name="yuko" face="angry"]

;発言者の名前も同時にかえたい場合
[chara_ptext name="yuko" face="angry"]

;短縮して書けます。以下も同じ意味
#yuko:angry

;chara_new で登録した画像はdefaultという名前で指定可能
#yuko:default

 以上です。
次回はメジャーアップデートを予定しています。
登録: 投稿 (Atom)