Let's start game programming

さぁ, 一緒にゲームプログラミングを始めよう!!


Getting Started





About


  • - アイディアを即座に形にできるゲームライブラリです
  • - 初心者でも手軽にゲームを開発できます
  • - 様々な Web コンテンツ, アプリで多数の採用実績があります
  • - 大学や専門学校といった教育機関で利用されています
  • - 国産かつオープンソースでTwitter 駆動開発なので気軽にコントリビューターになれます







phina.js って何?

ゲームやツールを簡単に作る事ができる JavaScript ゲームライブラリだよ♪

PC とスマートフォンどちらでも動くんだ

『プログラミングって気軽にできるもんなんだ』『ゲームってこんなに簡単に作れるんだ』って感じてもらえると嬉しいな




Getting Started

使い方は, phina.js を読み込むだけです. これで phina.js の全機能を使えるようになります. 下記は最小サンプルになります.
また, テンプレートをダウンロードして使ったり, Runstant で今すぐに使いはじめることもできます.

index.html
<!doctype html>

<html>
  <head>
    <meta charset='utf-8' />
    <meta name="viewport" content="width=device-width, user-scalable=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />

    <title>Getting started | phina.js</title>
    <!-- phina.js を読み込む -->
    <script src='http://cdn.rawgit.com/phi-jp/phina.js/v0.2.0/build/phina.js'></script>

    <!-- メイン処理 -->
    <script src='main.js'></script>
  </head>
  <body>

  </body>
</html>
main.js
// phina.js をグローバル領域に展開
phina.globalize();

// MainScene クラスを定義
phina.define('MainScene', {
  superClass: 'CanvasScene',
  init: function() {
    this.superInit();
    // 背景色を指定
    this.backgroundColor = '#444';
    // ラベルを生成
    this.label = Label('Hello, phina.js!').addChildTo(this);
    this.label.x = this.gridX.center(); // x 座標
    this.label.y = this.gridY.center(); // y 座標
    this.label.fill = 'white'; // 塗りつぶし色
  },
});

// メイン処理
phina.main(function() {
  // アプリケーション生成
  var app = GameApp({
    startLabel: 'main', // メインシーンから開始する
  });
  // アプリケーション実行
  app.run();
});






かんたんに使えるよ♪

phina.js は初心者から上級者まで幅広く使えるライブラリだよ

ファイルを読み込むだけで使えるようになるから, Runstant で今すぐ始められるよ.

Runstant


flash_on

Tutorial

ブログ『phiary』 にて随時更新中...


Blog


insert_drive_file

Documents

api ドキュメントは こちら.

鋭意作成中...


Docs


group

Community

コミュニティは gitter にて活発にやり取りを行っています.

みんな優しいので気軽に覗いてコメントや質問してみてください.


Gitter


Examples

サンプルたくさんあるよ♪




たくさんのひとが協力, 応援してくれてるよ. みんなで大きくしていけると良いなぁ〜

Fork me on GitHub