JavaScript
mrdoob/stats.js - GitHub https://github.com/mrdoob/stats.js 使用メモリの表示も可能ですがChromeとMac版のSafariのみ対応で加えて、別途設定が必要です。詳しくは配布サイトを参照下さい。 使い方 HTMLでbuildフォルダに有るStats.jsを読み込み、JavaScr…
1つのHTMLでPC、iPhone、Android、BlackBerryに対応するスライドショーを作成出来るライブラリ。 PhotoSwipe from Computerlovers on Vimeo. PhotoSwipe http://www.photoswipe.com/ 読み込むファイルは以下の3つ。 <script type="text/javascript" src="simple-inheritance.min.js"></script> <script type="text/javascript" src="code-photoswipe-1.0.9.min.js">
配列リテラルとカンマの組み合わせについての「なんでこんな動作するんだーっ」という話。読んでみると確かになんだか不思議に感じる挙動でした。 Javascriptが難しくてわからないので誰か教えてください — Aduca http://www.aduca.org/article/wtfjs/ 回答…
こちらのライブラリは以前紹介したEaselJSと一緒に使います。 gskinner/TweenJS - GitHub https://github.com/gskinner/TweenJS/tree/ 読み込みはこの様にeasel.js、Tween.jsの順番で行います。 <script type="text/javascript" src="easel.js"></script> <script type="text/javascript" src="Tween.js"></script> 前回のEaselJSと同様のアニメーションを行う場合この様な記…
EaselJS: A Javascript Library for Working with the HTML5 Canvas Element. http://easeljs.com/ Flash界の凄い人が作ったそうです。 fladdict » GSkinnerの作ったJavaScriptライブラリが素敵すぎる件 http://fladdict.net/blog/2010/12/gskinner.html こ…
14歳からはじめるHTML5 & JavaScriptわくわくゲームプログラミング教室Windows／Macintosh対応作者: 大槻有一郎出版社/メーカー: ラトルズ発売日: 2011/06/24メディア: 単行本（ソフトカバー）購入: 2人 クリック: 30回この商品を含むブログ (5件) を見る「1…
Hello, want to kill some time? http://erkie.github.com/ 自分の好きなサイトを表示して、そのページを破壊するゲーム。 遊び方 1. ブックマークレットのリンクをブックマークバー(ブックマークツールバー)にドラッグする or 適当なブックマークを作成後こ…
HTML Validatorの様にJavaScriptの記述が正しいか、非推奨の書き方がされてないかの構文をチェックをしてくれるツールです。 JSLint: The JavaScript Code Quality Tool http://www.jslint.com/ ちなみに基準となるルールはこちら。 JSLint: The JavaScript …
HTML5 canvas sprite optimisation | Seb Lee-Delisle http://sebleedelisle.com/2011/02/html5-canvas-sprite-optimisation/ こちらのブログで「サブピクセルを含んだ描画だと処理速度が落ちる為、整数に補正して位置指定をすべき」という話を見かけました…
Azoff Design | The HTML5 Piano | A piano that runs in your browser http://www.azoffdesign.com/piano ここをクリックすると音が鳴ります。 ソースコードはこちら。 azoff/HTML5piano - GitHub https://github.com/azoff/HTML5piano
通常はiPhone/iPadのSafariで一部だけのスクロールを実装しようとするとその場合の操作方法は指2本でドラッグとなってしまいます。しかし、「Overscroll」では通常のブラウザ操作と同様に指1本でスクロール可能です。 Azoff Design | Overscroll | An iphone…
現在、 mozRequestAnimationFrame や webkitRequestAnimationFrame などのメソッドがFirefoxやChromeに実装されています。これは最近追加されたアニメーション処理向けのメソッドです。存在は知っていたのですがまだ、最近のFirefoxやChromeじゃないと使えな…
Google Code Playground http://code.google.com/apis/ajax/playground/ Google Code PlaygroundはGoogleが提供しているAPIのJavaScriptサンプルの実行環境です。サンプルソースは編集可能で、編集後のプログラムをそのままオンラインで実行出来ます。 機能…
※JavaScriptでは整数が符号付き32bitで有るためにマイナスの値が発生する事が有ります。JavaScriptで使える乱数(Math.random)は希望する乱数の種が指定出来ません。 その為、常に同じパターンの乱数を順番に欲しい様な場面には使えません。という事でXorshif…
自分はiPhoneでWebで音を鳴らしたい場合には埋込みプレイヤーが表示されるかプレイヤーが立ち上がってしまうものだと思っていました。しかし、9leapに投稿されたこちらの id:nanmo さんのJavaScript製のゲームをプレイするとiPhoneでも音が鳴っています。も…
ゲームエンジンから画像、サウンドデータなど幅広いサイトが紹介されています。 Resources for javascript games http://gitcp.com/sorenbs/jsgames-articles/resources
「JavaScript ゲーム製作勉強会 Vol.1」でUnityの話をしました。 JavaScript ゲーム製作勉強会 Vol.1 - [PARTAKE] http://partake.in/events/0fd0a387-a43c-4405-8750-34131fb8bde6 「Unityの話を…」とリクエストを貰った時は一瞬、「えっ？」って思ったので…
Pirates Love Daisies: An HTML5 Tower Defence Strategy Game http://www.pirateslovedaisies.com/ 海賊を上手く配置し、悪の手からデイジーの花を守るゲームの様です。画面右上に有るコレがデイジーです。これを守ります。 マウスで操作しても良いですがキ…
ECMAScript 5からは宣言を強制する事が可能と成りました。以下の記述をすると宣言を強制されます。 "use strict";例えば、 var hoge; などと事前に宣言しないで変数を使用するとエラーとなります。 "use strict"; hoge = 10; 以下の様な記述の場合、 hoge = …
console.log() は良く使ってるのですがもっと便利な console.dir() というものも有るみたいです。例えば、以下の様なプログラムを実行すると var v = {i: 10, str: 'hoge'}; console.dir(v);Firebugにはこの様に出力されます。 log() と異なり、全てのプロパ…
EffectGames.com http://www.effectgames.com/effect/
オライリーの「ハイパフォーマンスJavaScript」で紹介されていたツール。こちらの本によるとjQueryのファイルを圧縮した場合にgzipで圧縮した場合と同等のファイルサイズになるとの事。しかし、JSファイルの実行時に一定のコストがかかる。その為、gzip圧縮…
こちらのブログで紹介されていた最適化方法をテストしてみました。 HTML5/JavaScript platform game optimised for iPad | Seb Lee-Delisle http://sebleedelisle.com/2011/04/html5javascript-platform-game-optimised-for-ipad/ 最適化の方法はHTMLのエレ…
こちらで実際に試せます。最適化手法はこちらに記載されています。必見な内容です!! HTML5/JavaScript platform game optimised for iPad | Seb Lee-Delisle http://sebleedelisle.com/2011/04/html5javascript-platform-game-optimised-for-ipad/
「WASDのキー」もしくは「カーソルキー」で自機を移動。自機の位置からマウスの位置に向けて弾を発射。 Arena5 - HTML5 Canvas JavaScript Game Demo! http://www.kevs3d.co.uk/dev/arena5/
こんな感じにバーチャルパッドを使う事が出来ます。サンプルでは左手で自機のコントロール、右手で弾の発射となっています。実際に試してみましたがとても操作しやすかったです。 Multi-touch game controller in JavaScript/HTML5 for iPad | Seb Lee-Delis…
「ハイパフォーマンスJavaScript」、取り敢えずタイトルとオライリー本って所で購入決定。 内容はこの様なものになっているみたいです。 JavaScriptのパフォーマンスにおけるボトルネックを解消するテクニックとアプローチを解説します。 実行時間、ダウンロ…
Coil - An addictive HTML5 canvas game. http://hakim.se/experiments/html5/coil/
カーソルの左右で移動。スペースキーでジャンプ。敵は上から踏むと倒せます。 Berts Breakdown http://www.paulbrunt.co.uk/bert/
JavaScriptによるゲーム作り講座。ページの最後でソースコードも配布されています。 Part 1ではキャラクターのアニメーションの解説。「Blink」ボタンを押すとキャラクターが瞬きをします。 Create a Game Character with HTML5 and JavaScript { William Ma…
