tmlib.js - nicozon

ブロック崩さぬ

ブロック崩し…ではなく崩さないゲーム

下記ページでプレイできます。（スマホ・ＰＣブラウザでプレイ可）
⇛http://cachacacha.com/BlockKUZUSAZU/
本動画は（奇跡的に）入れ食いボーナス後の弾幕に耐えたプレイ動画。

うp主はブログやってます！よろしく！
⇛http://www.neo2184.com

ツイッター@neo2184
⇛https://twitter.com/neo2184

http://www.nicovideo.jp/watch/sm22710118

tmlib.jsでゲームを作ってみよう（１）

その１自機の表示

今回のポイント

(1)tmlib.jsのインクルード
https://rawgithub.com/phi-jp/tmlib.js/0.1.8/build/tmlib.min.jsをscriptタグで読み込みます。

(2)tm.app.CanvasApp
canvasを使ったアプリケーション。コンストラクタ引数にcanvas要素のidを渡しましょう。

(3)scene
エレメント階層の一番上にいるエレメント。app.currentSceneで取得できます。

(3)tm.app.TriangleShape
三角形のエレメントです。addChildTo()でsceneに追加できます。

(4)update()
毎フレーム呼び出される関数です。

(5)app.keyboard.getKey()
キーボードでキーが押されているかどうかを取得することができます。

次 sm22063641
マイリスト mylist/39031781

http://www.nicovideo.jp/watch/sm22063606

tmlib.jsでゲームを作ってみよう〜横スクアクション編(1)

横スクロールアクション編です。

使用するtmlib.jsはこちら
https://rawgithub.com/daishihmr/tmlib.js/feature/fix-mapsheet/build/tmlib.min.js

tmlib.jsにはTiled Map Editorで作成したマップを表示する機能があるので、これを利用していきます。

前 sm22403990
次 sm22557961
マイリスト mylist/39031781

http://www.nicovideo.jp/watch/sm22504751

【JavaScript】戦艦ゲーム作ってみたよ【tmlib.js】

艦これにハマった影響で、戦艦ゲームを作ってみました。

こちらでプレイできます→ http://9leap.net/games/3592

言語はJavaScript。Webブラウザ上で動きます。
ゲームエンジンとしてtmlib.jsを使っています。

俺が作ったゲーム→ mylist/32698857

http://www.nicovideo.jp/watch/sm22031620

【JavaScript】GL-Shooter2 PV【弾幕STG】

Webブラウザで動作する本格弾幕STG「GL-Shooter2」の紹介です。

株式会社CAVE様の「怒首領蜂」シリーズへ最大限のリスペクトを込めて、鋭意開発中！

このゲームはJavaScriptで開発されています。
ゲームエンジンとしてtmlib.jsというライブラリを利用しています。

tmlib.js→ http://phi-jp.github.io/tmlib.js/

ステキなBGMはコチラからお借りしました→ nc54073

http://www.nicovideo.jp/watch/sm21642345

【tmlib.js】電ちゃんAAを作ろう【JavaScript】

tmlib.jsで画像をAA化してみます。

tm.asset.Textureクラス
画像データをロードするためのクラスです。
getBitmapメソッドでBitmapオブジェクトを取り出す事ができます。

tm.graphics.Bitmapクラス
編集可能な画像データを表現したクラスです。
ピクセルデータを一つ一つ取り出したり、画像にフィルタをかけたりすることができます。

前 sm22357101
次 sm22504751
マイリスト mylist/39031781

http://www.nicovideo.jp/watch/sm22403990

TM-Shooter C-S　ALLクリア　1、2面 1兆3046億2139万6272

TM-Shooter
http://tmshooter.net/
HTML5による怒首領蜂再現　をコンセプトとした本格弾幕STG

約1年前に「１兆超え＋オールクリアできるようになったら、また上げようと思ってます」
とコメントしてからついに目標を達成しました。

１、２、３面はかなり参考にできると思いますが、3面は撮り忘れてしまいましたw
#0:00 1面
#3:00 2面

4面 sm25398788

他のプレイ動画 mylist/41537568

http://www.nicovideo.jp/watch/sm25398400

TM-Shooter CBL A-L 真 ALL Stage1～4

TM-Shooter cure black label
http://tmshooter.net/
HTML5による怒首領蜂再現　をコンセプトとした本格弾幕STG

特に稼ぎ重視やクリア重視といったプレイをしているわけではなく適当にプレイしてます。
ここまでは順調ですがStage5から思うように行きませんでした。

Stage1 #0:06
Boss1 #1:45

Stage2 #2:40
Boss2 #5:22

Stage3 #6:42
Boss3 #11:25

Stage4 #13:00
Boss4 #18:00

Stage5 sm25806807

他のプレイ動画 mylist/41537568

http://www.nicovideo.jp/watch/sm25806721

tmlib.jsでゲームを作ってみよう〜横スクアクション編(3)

重力、および床との衝突判定を実装します。

前 sm22557961
次 sm22561649
マイリスト mylist/39031781

http://www.nicovideo.jp/watch/sm22561588

[ブラウザゲー] DeepStriker [STG]

今回は横シューを作ってます。
まだ1面のみですが、こちらのURLでプレイできます。→ http://daishihmr.github.io/jsstg-cannon/

俺の作ったゲーム mylist/32698857

http://www.nicovideo.jp/watch/sm24441616

tmlib.jsでゲームを作ってみよう〜横スクアクション編(2)

自機としてtmlib.jsのマスコットであるひよこちゃんを使用。
tm.geom.Vector2クラスを利用して速度ベクトルを表現していきます。

前 sm22504751
次 sm22561588
マイリスト mylist/39031781

http://www.nicovideo.jp/watch/sm22557961

TM-Shooter CBL A-L 真 ALL Stage5

TM-Shooter cure black label
http://tmshooter.net/
HTML5による怒首領蜂再現　をコンセプトとした本格弾幕STG

特に稼ぎ重視やクリア重視といったプレイをしているわけではなく適当にプレイしてます。
中ボスでコンボ維持したかったけど、見事に撃ち返しにやられました。
あとハイパー４発動状態で真ボス突入したかったけどいろいろミスってます。

Stage5 #0:00
Boss5 #8:22

Stage1～4 sm25806721

他のプレイ動画 mylist/41537568

http://www.nicovideo.jp/watch/sm25806807

tmlib.jsでゲームを作ってみよう〜横スクアクション編(4)

キャラクターの側面・上面と地形との衝突判定を実装します。
あわせてジャンプも実装していきます。

前 sm22561588
次 sm22562013
マイリスト mylist/39031781

http://www.nicovideo.jp/watch/sm22561649

tmlib.jsでゲームを作ってみよう〜横スクアクション編(13)

遅くなってゴメンナサイ。
仕事とこれ（http://tmshooter.net）が忙しくてなかなか時間が作れませんでした。

今回は敵を踏んで倒せるようにします。

前 sm22611151
次 sm25738659
マイリスト mylist/39031781

http://www.nicovideo.jp/watch/sm22928803

tmlib.jsでゲームを作ってみよう〜道中を重視したSTG(1)

おひさしぶりです。

今回からはまたSTGを作っていきます。
敵の配置やパターンの実装を見せてほしいというリクエストを頂いたので、道中を重視した弾幕STGを作っていこうと思います。
名づけてドチューン！！です。
よろしくお願いします。

tmlib.jsのダウンロードはコチラから→https://raw.githubusercontent.com/phi-jp/tmlib.js/develop/build/tmlib.js
使用する画像素材はコチラ→ http://static.dev7.jp/docyuun_assets.zip
利用条件はREADME.txtを読んでね。

前 sm22928803
次 sm25791488
マイリスト mylist/39031781

http://www.nicovideo.jp/watch/sm25738659

tmlib.jsでゲームを作ってみよう（３）

その３自機のショット

今回のポイント

(1)tm.app.CircleShape
円形のエレメントです。tm.app.TriangleShapeの親戚です。

(2)敵とショットの衝突判定
あらかじめenemiesという配列に敵を格納しておき、ショットのupdate関数内で衝突判定をしています。
　衝突判定にはisHitElement()関数を使用しています。

(3)配列スキャン中に要素を削除する
concat関数で一旦配列をコピーしてからループ処理を行います。
　要素の増減による添字のズレを防ぐことが出来ます。

前 sm22063641
次 sm22206747
マイリスト mylist/39031781

http://www.nicovideo.jp/watch/sm22160827

tmlib.jsでゲームを作ってみよう（２）

その２敵の出現

今回のポイント

(1)tm.createClass()
クラスを作る関数です。
親クラス(superClass)、コンストラクタ(init)などを定義することが出来ます。

(2)TriangleShapeコンストラクタの第３引数
fillStyleで塗りつぶしに使われる色を指定することが出来ます。

(3)tweener
エレメントにアニメーションを設定するためのプロパティです。
指定したプロパティを絶対量として変化させるtoメソッド、相対量として変化させるbyメソッドなどを持ちます。

(4)Math.rand(a, b)
整数aからbまでの範囲から、ランダムな整数を返します。範囲にはa、bともに含まれます。

前 sm22063606
次 sm22160827
マイリスト mylist/39031781

http://www.nicovideo.jp/watch/sm22063641

tmlib.jsでゲームを作ってみよう〜道中を重視したSTG(3)

敵キャラを出します。

tmlib.jsのダウンロードはコチラから→https://raw.githubusercontent.com/phi-jp/tmlib.js/develop/build/tmlib.js
使用する画像素材はコチラ→ http://static.dev7.jp/docyuun_assets.zip
利用条件はREADME.txtを読んでね。

前 sm25791488
次未定
マイリスト mylist/39031781

http://www.nicovideo.jp/watch/sm25926183

TM-Shooter CBL A-S 真ボスサカガミハイパー手動ボム禁止縛り

TM-Shooter cure black label
http://tmshooter.net/
HTML5による怒首領蜂再現　をコンセプトとした本格弾幕STG

真ボス出現条件はノーコンティニュー2ミス以内でビギナースタイル以外です。
トレーニングモードはビギナー以外で必ず出現します。
この動画はトレーニングモードStage5のrank50で開始。
ハイパーと手動ボム禁止の縛りです。
できるだけ弾幕を覚えられるように撮りました。

他のプレイ動画 mylist/41537568

http://www.nicovideo.jp/watch/sm25744409

tmlib.jsでゲームを作ってみよう〜道中を重視したSTG(2)

横スクロールアクションの時と同じように、今回も Tiled Map Editor と tm.display.MapSprite を使っていきます。

tmlib.jsのダウンロードはコチラから→https://raw.githubusercontent.com/phi-jp/tmlib.js/develop/build/tmlib.js
使用する画像素材はコチラ→ http://static.dev7.jp/docyuun_assets.zip
利用条件はREADME.txtを読んでね。

前 sm25738659
次 sm25926183
マイリスト mylist/39031781

http://www.nicovideo.jp/watch/sm25791488