タグ JavaScript が登録されている動画 ： 624 件中 161 - 192 件目
種類:
- タグ
- キーワード
対象:
東方風STGブラウザゲームをJavaScriptとHTML5で作成中 その4
ライブラリなど使わず0から作っています。
前: sm21834381 次: sm22039412
mylist/38547755
前回からの更新点はマイリストを参照。
使用素材はその1の親作品参照。
詳細やプレイは下記リンク先で。ウェブブラウザ(Chrome)上でプレイできます。
http://d.hatena.ne.jp/takahirox/20130819/1376894048
1面は魔理沙、2面は霊夢でプレイしています。
背景変更のせいで弾やアイテムが見辛くなったかも。
ブラウザMMDビューア→mylist/49125767
【JavaScript】戦艦ゲーム作ってみたよ【tmlib.js】
艦これにハマった影響で、戦艦ゲームを作ってみました。
こちらでプレイできます→ http://9leap.net/games/3592
言語はJavaScript。Webブラウザ上で動きます。
ゲームエンジンとしてtmlib.jsを使っています。
俺が作ったゲーム→ mylist/32698857
東方風STGブラウザゲームをJavaScriptとHTML5で作成中 その5
ライブラリなどは使用せず0から作っています。
前: sm21892468 次: sm22137339
mylist/38547755
更新点はマイリスト参照。
使用素材はその1の親作品参照。
詳細やプレイは下記リンク先で。Chrome上でプレイできます。
http://d.hatena.ne.jp/takahirox/20130819/1376894048
今回はリプレイ機能を実装しました。
サーバに登録することで、他プレイヤーにリプレイを見せることができます。
#0:00 ブラウザ上で動くアピール
#0:03 リプレイ垂れ流し
#4:33 リプレイ登録方法
録画環境が酷い。実物はもっと快適な動作です。
ブラウザMMDビューア→mylist/49125767
Leap Motionでゾウさんをシコシコするゲームを作ってみた
Leap Motionを利用したブラウザゲームを作りました。leap.jsというJavaScriptのライブラリを使用しています。
HTML5ブラウザ対応です。ぜひ体験して楽しんでいただければ光栄です。
サイト ⇒ http://azunyan.sitemix.jp/leapmotion/shikoru.php
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
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
ネットワークトラフィック可視化ツールcobain
ネットワークトラフィックの可視化。計測地点は東京の某所。ブラウザで閲覧している様子をキャプチャ。音源は次の2曲。てってて～原曲、じゅるP氏作：Gene-Revolutionary
ネットワークトラフィック可視化ツールMap
ネットワークトラフィックの可視化。計測地点は東京の某所。ブラウザで閲覧している様子をキャプチャ。音源は次の2曲。てってて～原曲、じゅるP氏作：Gene-Revolutionary
ネットワークトラフィックを可視化してみた
ネットワークトラフィックの可視化。棒が長いほど通信量が多い。計測地点は東京の某所。音源は次の2曲。てってて～原曲、じゅるP氏作：Gene-Revolutionary
東方風STGブラウザゲームをJavaScriptとHTML5で作成中 その6
ライブラリなど使わず0から作っています。
前: sm22039412 次: sm23482639
mylist/38547755
更新点はマイリスト参照。使用素材はその1の親作品参照。
詳細やプレイ(only Chrome)は下記リンク先。
リプレイをサーバに登録することができるのでお試しあれ。
http://d.hatena.ne.jp/takahirox/20130819/1376894048
高速化のためにメモリ管理手法を変えた結果、
メモリの使用量を25%、GCの負荷を99%カットできました。
他にも細かいチューンを行い、高速化は一段落したので、ようやく次のステップに進めそうです。
今回も相変わらず霊夢と魔理沙のリプレイを垂れ流しています。
ブラウザMMDビューア→mylist/49125767
tmlib.jsでゲームを作ってみよう（３）
その３ 自機のショット
今回のポイント
(1)tm.app.CircleShape
円形のエレメントです。tm.app.TriangleShapeの親戚です。
(2)敵とショットの衝突判定
あらかじめenemiesという配列に敵を格納しておき、ショットのupdate関数内で衝突判定をしています。
衝突判定にはisHitElement()関数を使用しています。
(3)配列スキャン中に要素を削除する
concat関数で一旦配列をコピーしてからループ処理を行います。
要素の増減による添字のズレを防ぐことが出来ます。
前 sm22063641
次 sm22206747
マイリスト mylist/39031781
tmlib.jsでゲームを作ってみよう（４）
その４ 敵弾
今回のポイント
(1)敵弾の移動
弾の向かう方向をdとし、X座標にcos(d)、Y座標にsin(d)を足していくことで任意の方向に弾を動かすことが出来ます。
前 sm22160827
次 sm22256498
マイリスト mylist/39031781
tmlib.jsでゲームを作ってみよう（５）
その５ 爆発
今回のポイント
(1)爆発
円形（CircleShape）を爆発として使います。
時間とともに拡大し、透明度（alpha）を0に近づけていきます。
前 sm22206747
次 sm22311216
マイリスト mylist/39031781
Leap Motionで野球拳（じゃんけんゲーム）を作ってみた
Leap Motionで、じゃんけんを認識する野球拳ゲームを作ってみました。
leapjsというJavaScriptのライブラリを使用しています。
HTML5対応ブラウザで動作します。ぜひ体験して楽しんでいただければ光栄です。
サイト ⇒ http://azunyan.sitemix.jp/leapmotion/strip.php
前回作った「ゾウさんシコシコゲーム」動画 ⇒ http://www.nicovideo.jp/watch/sm22043764
tmlib.jsでゲームを作ってみよう（６）
その６ ゲームオーバー
今回のポイント
(1)ゲームの終了
app.stop()でアプリケーションが停止します。
前 sm22256498
次 sm22357101
マイリスト mylist/39031781
Leap Motionで脳トレじゃんけんゲームを作ってみた
Leap Motionで、脳トレ用のじゃんけんゲームを作りました。
leapjsというJavaScriptのライブラリを使用しています。
HTML5対応ブラウザで動作します。ぜひ体験して楽しんでいただければ光栄です。
サイト ⇒ http://azunyan.sitemix.jp/leapmotion/jankenboth.php
前回作った「野球拳ゲーム」動画 ⇒ http://www.nicovideo.jp/watch/sm22260884
tmlib.jsでゲームを作ってみよう（７）
その７ スコアの表示
今回のポイント
(1)tm.app.Label
文字列を表示するエレメントです。
setAlign()で左右寄せの指定、setBaseline()で上下寄せの指定を行います。
前 sm22311216
次 公開未定
マイリスト mylist/39031781
【tmlib.js】電ちゃんAAを作ろう【JavaScript】
tmlib.jsで画像をAA化してみます。
tm.asset.Textureクラス
画像データをロードするためのクラスです。
getBitmapメソッドでBitmapオブジェクトを取り出す事ができます。
tm.graphics.Bitmapクラス
編集可能な画像データを表現したクラスです。
ピクセルデータを一つ一つ取り出したり、画像にフィルタをかけたりすることができます。
前 sm22357101
次 sm22504751
マイリスト mylist/39031781
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
tmlib.jsでゲームを作ってみよう〜横スクアクション編(2)
自機としてtmlib.jsのマスコットであるひよこちゃんを使用。
tm.geom.Vector2クラスを利用して速度ベクトルを表現していきます。
前 sm22504751
次 sm22561588
マイリスト mylist/39031781
tmlib.jsでゲームを作ってみよう〜横スクアクション編(4)
キャラクターの側面・上面と地形との衝突判定を実装します。
あわせてジャンプも実装していきます。
前 sm22561588
次 sm22562013
マイリスト mylist/39031781
tmlib.jsでゲームを作ってみよう〜横スクアクション編(5)
スクロールの実装。穴に落ちた時のゲームオーバー処理 。
前 sm22561649
次 sm22572354
マイリスト mylist/39031781
tmlib.jsでゲームを作ってみよう〜横スクアクション編(6)
今後敵キャラクターを実装するにあたり、自機クラスと共通となるであろう処理を抽出してスーパークラスを作っておきます。
前 sm22562013
次 sm22573815
マイリスト mylist/39031781
tmlib.jsでゲームを作ってみよう〜横スクアクション編(7)
前回作ったGObjectを継承して敵キャラを実装していきます。
前 sm22572354
次 sm22580851
マイリスト mylist/39031781
tmlib.jsでゲームを作ってみよう〜横スクアクション編(10)
敵に触れると自機がダメージを受けるようにします。
前 sm22587737
次 sm22602367
マイリスト mylist/39031781
