本日 JavaScript ゲームライブラリ『phina.js』をリリースしました!
今日から phina.js Advent Calendar 2015 が始まりました♪
記念すべき1日目のエントリーです. ってことで, 本日『phina.js』 をリリースしました!
2日目はこちら -> ManagerSceneでゲームの流れを管理しよう | daishi blog
phina.js とは？
phina.js(フィナ ドット ジェイ・エス) は, JavaScript で作られた国産のゲームライブラリです.
プログラミング初心者でも始めやすく, それでいて上級者のハイレベルな要求にも 応えられる, 柔軟な設計と豊富な機能を備えています.
使い方はカンタン! あなたの HTML ファイルに <script> タグで phina.js を読み込むだけ でで導入でき,
あとは公式サイトで提示しているサンプルコードをベースに, あなたがやりたいことを追加していくだけです.
phina.js は, ゲームで必要となる個々の機能をただ提供するだけにとどまりません.
ゲームプログラミングをする上で, 「ゲームの作り方」の大まかな枠組みも提供しています.
『ゲームプログラミングといっても, まずどこからどんなふうにコードを書いていけば良いか分からない』 という初心者の方でも, phina.js の枠組みに従ってコーディングしていくことでとてもカンタンにゲームを作ることができるのです.
また, phina.js は「オブジェクト指向」を意識して作られています. シーンやレイヤー, UI 部品といったゲームに必要な要素を「実際の物を扱うような」感覚で 組み合わせていくイメージでゲームを作ることができます.
上級者は, phina.js の提供するクラスを継承して拡張することで, より多彩な表現を実現できます.
初心者でもカンタンに扱えて, 上級者であれば自分好みにカスタマイズできる, そんな幅広いニーズに応えるべく開発が続けられているゲームライブラリ. それが phina.jsです!!
- Author ... phi
- Official ... http://phinajs.com
- Github ... https://github.com/phi-jp/phina.js
- Gitter ... https://gitter.im/phi-jp/phina.js
- License ... MIT
phina.js の主な機能
それぞれリンク先がサンプルになっています.
基本機能
ゲーム開発
- 解像度を維持して自動で画面にフィット(PC, スマホ同時対応)
- 親子構造(Node)
- 画像やラベル, 図形といった要素のサポート
- ボタンやダイアログ, ゲージといった便利クラス
- 衝突判定処理
- トゥイーンアニメーション
- 行列やベクトル計算できるクラスを内包
- サウンドの再生(WebAudio wrapper)
- 入力系(キーボード, タッチ, アクセラレーション, ゲームパッドなど)のサポート
- マルチタッチのサポート
- Three.js とのお手軽連携
などなど
phina.js の使い方
下記のコードを追加するだけで使えるようになります.
<script src="http://cdn.rawgit.com/phi-jp/phina.js/v0.1.0/build/phina.js"></script>
cdn から phina.js を読み込んでいるだけです.
また, ファイルを用意するのが面倒だという方は, テンプレートをダウンロードして使ったり, Runstant で今すぐに使いはじめることもできます.
phina.js サンプル
こういったことができるよーっといったカンタンな例です.
particle
パーティクルを表示するサンプルです. マウスに追従して動くのがわかるかと思います.
walk tomapiko
phina.js のマスコットキャラクタートマピコが移動するサンプルです.
画像読み込み, 表示の参考になるかと思います.
Break out
ブロック崩しですね. こういったゲームも簡単に作ることができます.
もっと色々なサンプルを見たいという方は公式サイトへぜひ.
phina.js の学び方
残念ながら, チュートリアルはまだまだ少ないです. このブログにて随時発信していきますので, たまに覗いてもらえると幸いです.
また, API Docs もあります. こちらも随時更新中です.
外部ブログによる入門エントリー
phina.js コントリビューターである @alkn203 san が自身のブログで phina.js の入門エントリーを書いてくれています.
良かったら参考にしてください.
- 【phina.js】ゲーム作成チュートリアル（ブロック崩し）第0回 | Keep Coding
- 【phina.js】ゲーム作成チュートリアル（ブロック崩し）第1回＝テンプレートから作成する＝ | Keep Coding
- 【phina.js】ゲーム作成チュートリアル（ブロック崩し）第2回＝ブロックの配置＝ | Keep Coding
- 【phina.js】ゲーム作成チュートリアル（ブロック崩し）第3回＝パドルの作成＝ | Keep Coding
- 【phina.js】ゲーム作成チュートリアル（ブロック崩し）第4回＝ボールの作成＝ | Keep Coding
- 【phina.js】ゲーム作成チュートリアル（ブロック崩し）第5回＝ボールとブロックの反射処理＝ | Keep Coding
- 【phina.js】ゲーム作成チュートリアル（ブロック崩し）第6回＝Tweenerを使ったアニメーション処理＝ | Keep Coding
- 【phina.js】ゲーム作成チュートリアル（ブロック崩し）最終回＝ゲームオーバーとクリア処理＝ | Keep Coding
- 【phina.js】ゲーム以外の作成サンプル（カレンダー） | Keep Coding
phina.js Advent Calendar による関連エントリー
今日以降, phina.js Advent Calendar 2015 にて毎日 phina.js に関するエントリーが投稿されていく予定です.
よかったら読者登録して覗いてみてください.
- 1日目 本日 JavaScript ゲームライブラリ『phina.js』をリリースしました! | phiary
- 2日目 ManagerSceneでゲームの流れを管理しよう | daishi blog
- 3日目 ゲーム開発 - 気鋭の新JSゲームライブラリ「phina.js」の概要を自分なりにまとめてみた - Qiita
- 4日目 【phina.js】Gridクラスを使いこなそう - Qiita
- 5日目 phina.js で Webフォント を使ってみるよ！ - Qiita
- 6日目 [phina.js] Tweenerを使いこなそう! [Tweener 基本編] - Qiita
- 7日目 [phina.js] サンプルから覚えるphina.js - Qiita
- 8日目 とりあえず試してみたいって方のための phina.js 入門 | phiary
phina.js コントリビューター達による協力なサポート体制
phina.js はオープンソースとして開発しております.
開発初期の段階から Gitter にてコミュニティを作り活発にやり取りしながら開発してきました.
なので, メイン開発者の私以外(以上?)に, 内部構造まで知り尽くした優秀なコントリビューターたちがたくさんいます.
なので, とりあえず困ったら Twitter で #phina_js ハッシュタグを含めて疑問を投げかけてみてください.
なんでも構いません.
自分はもちろんのこと, 下記の強力な開発者たちがサポートしてくれます(って勝手に言っちゃってごめんなさいw)
@daishi_hmr san, @minimo san, @simiraaaa san, @alkn203 san, @emadurandal san, @utyo san, @omatoro san
phina.js のこだわり
まず, 独自実装になりすぎないように気をつけています.
私自身, 以前はコンシューマ業界で C/C++ を使ったゲーム開発を経験し, 様々なライブラリに触れてきました.
OpenGL や DirectX といったコアな部分から, 非公開の3Dエンジン, 社内の独自ライブラリ, Havok や Bullet Physics といった物理エンジン, ActionScript, 最近では cocos2d や cocos2d-x, Unity などなど.
そんな中で, 良いとこ取りといったらなんですが, 使いやすいな, これは一般的だな というのをもりもりに盛り込んだライブラリが phina.js です.
なので, 今まで他の開発環境や他のライブラリでゲームを作った経験のある人, もしくは熟練したゲームプログラマであれば, それこそドキュメントを見なくても phina.js を使ってゲームを作ることができるかもしれません.
また, ゲームライブラリである以上, 速度にも気をつけてインターフェースに影響のない範囲でゴリゴリに高速化しています. 実際に使ってみると, 他の JavaScript ゲームライブラリと比べても遜色のない速度で動くのが分かるかと思います.
tmlib.js との違いは？
このエントリーの読んでくれている方の中には, tmlib.js というライブラリをご存知の方も多いかもしれません.
実は tmlib.js も, 以前から私主導で開発していたゲームライブラリです.
phina.js は, この tmlib.js の正式な後継ライブラリに当たります.
基本的な設計, 思想は同じですが, tmlib.js でボトルネックだった箇所を改善して高速化したり, バージョンによる差異, 細かなバグなどを修正しています.
使い方はほとんど同じなので, tmlib.js を使ってくれていた方は, ぜひ phina.js も使って頂けると幸いです.
まとめ
phina.js は他のゲームライブラリと違って個人で作ってるライブラリだから,
使うのはちょっと不安だと言われることがあります.
- ちゃんとメンテしていくのか?
- もしも phi の身に何かあったら開発はどうなるのか??
確かにそういった不安はごもっともです.
ですが, 個人から始まり, 草の根ベースで少しずつ活動を広げてきたからこそ得られた利点もあります. 企業や巨大なコミュニティが主導しているオープンソースプロジェクトでは, その活動に参加することに敷居の高さを感じることも多いものです.
phina.js は違います. 興味を持たれた方は誰でも, ごく気軽にコミュニティに参加することができます.
現在も, 先ほど紹介したメンバーたちが, phina.js の使い方, 開発について まるでサークル活動のような楽しい雰囲気で話し合いを行っています.(たまに飲み会もw)
もし, あなたがオープンソース開発活動をしたことがない, これから体験してみたい, っと思われているのであれば phina.js はうってつけと言えるでしょう.
Github や Twitter, Gitter などで, ぜひ気軽にコメント下さい.
オープンにしずらい質問であれば直接私に メール( phi1618jp@gmail.com ) を送ってもらっても構いません.
phina.jsは, みんなで意見や要望を交わし合って成長してきた
~みんなで作る, みんなのためのライブラリ~
なのです!!
ですので, もし仮に将来何らかのことが起きて, 私 phi の存在がある日, 欠けるようなことがあったとしても... このコミュニティにいる人たちの熱意によって phina.js の開発はその後も継続されていくだろうと, 私は確信しています.
そんな, みんなの好奇心と熱意によって成長を続けていくphina.js をよろしくお願いします.
そして, phina.js をキッカケに少しでもゲームプログラミングの楽しさ を感じてもらえると幸いです.