Perl Hobby Programming - Games::BeLike::EightBIT ターミナルで8ビット風ゲームをつくろう

Perl Hobby Programming - Games::BeLike::EightBITターミナルで8ビット風ゲームを作ろう
ゲーム製作協力(画像提供): nekokak氏
谷内元 twitter@keroyonn_ / Hokkaido.pm
YAPC::Asia 2011

自己紹介
WEB系プログラマ in Hokkaido.pm
仕事のメイン：Java/Flex/ExtJS-> 最近Perl
趣味のメイン：C# + WPF+ Perl
ちょっとずつ違う素敵なID達
cpan : keroyonhttp://search.cpan.org/~keroyon/
github : keroyonnhttp://github.com/keroyonn
twitter : keroyonn_http://twitter.com/keroyonn_
hatena :keroyon0630http://d.hatena.ne.jp/keroyon0630
YAPC::Asia 2011

Games::BeLike::EightBITその特徴
ターミナルにグラフィックを描いてゲームをつくれるよ! (Curses)
8ビット時代のコンシュマー機と同等以上の解像度でアクションゲームも制作可能
簡単 && perlで全部作れる
(ターミナル上の vim からそのまま実行できる)
スプライト、マップ、スクロール、イベント、キーアップイベントのエミュレーションなど
(将来項目) line & paint スタイルのグラフィック
YAPC::Asia 2011

注意事項
テストもドキュメントも例外処理もないし、APIすらまだあまり決めていないよ
CPU負荷が高いので、本番サーバーに入れて遊ばないでね。
もちろん、新手のワームとして使いたい場合は別だよ!
YAPC::Asia 2011

最近の開発とか
YAPC::Asia 2011
そんなことも
あろうかと

YAPC::Asia 2011
メモリリークだって直してないよ!

作った動機 1
Perlでも気楽にホビープログラミングがしたい。
特に絵が動いたりするやつ。
PlackとかRouter::SimpleでオレオレWAFとか Web::Scraper とか、ホビープログラミングは気軽にできる。
しかし、グラフィックを扱いたい
ゲーム系の書籍に書いてあることが、Perlで気軽に試せるようにしたかった
YAPC::Asia 2011

YAPC::Asia 2011
こういうの

作った動機 2
気楽にできるようにしたい
環境を作るコストを0にしたい
つまり開発用VMとターミナルで動いてほしい。
普段はターミナルしか使わないし、
Windows環境に「そのためにしか使わない」perlとSDLを入れるくらいなら、Flash Builder 立ち上げて作る方がむしろ早くて合理的
学習コストを下げたい
面倒な決りごとや、概念を学習しないで使えるようにしたい
YAPC::Asia 2011

何ができるのか
YAPC::Asia 2011
デモ

YAPC::Asia 2011
DEMO: PuTTYの実行画面
Gradiusゴーファーの野望のパロディです。

YAPC::Asia 2011
「トップを狙え」を意識しています。

YAPC::Asia 2011
こちも「トップを狙え」を意識しています。
VicPHPerはVicviperです。

YAPC::Asia 2011
PHPerが悪のPerlMongerを倒すという誰もが納得の勧善懲悪シューティングとなっております。

YAPC::Asia 2011
クトゥルフの二次創作をしたものは破滅すると言われています。
あっ!やば。俺じゃん。

YAPC::Asia 2011
ステージ1は「省鯖運用的空間」となっています。

YAPC::Asia 2011
フレームレートが30はりつきです。
現在の表示スプライト数は22個です。

YAPC::Asia 2011
背景の星と手前の地形は一応多重スクロールです。

YAPC::Asia 2011
ボスが後方から高速で飛来して駆け抜けていきます。

YAPC::Asia 2011
点滅するワーニング。登場するボスは、ビッグ鯖でんな。

YAPC::Asia 2011
目玉がコアになっています。ビックコアは青白く、銀色に光り鯖に似ているなーと思いました。

簡単なゲームを作ってみるその1 準備
Githubで落してインストール
https://github.com/keroyonn/p5-Games-BeLike-EightBIT
perl Makefile.PL
make
make install
注意：
ドキュメント、テスト、例外処理がなく、APIも決定していません。タグづけもしてません。
依存モジュールは、Curses と Class::Accessor::Fast です。
YAPC::Asia 2011

今回作るゲーム
YAPC::Asia 2011
デモ

YAPC::Asia 2011
高品質なことでは定評のあるシンプルシリーズを
つくってみましょう。

YAPC::Asia 2011
シンプルシリーズの名を汚さぬよう精一杯頑張りました!

YAPC::Asia 2011
エラー
鬼がアニメーションしながら追いかけてくる!
そして鬼につかまると、エラーで停止しまう!

簡単なゲームを作ってみるその2 プレイヤーの移動
#!/usr/bin/envperl
use Games::BeLike::EightBIT;
my $stage = create_stage('stage1');
my $plane = create_plane('stage1:main');
my $player_bitmap = create_bitmap()->load_text("111n222n333");
my $player = create_sprite({bitmaps => $player_bitmap, x=> 20, y=>10});
$plane->add($player);
$stage->keymap( {
h => sub { $player->{x} -= 2 },
l => sub { $player->{x} += 2 },
j => sub { $player->{y} += 2 },
k => sub { $player->{y} -= 2 },
q => sub { $stage->exit; },
});
$stage->run;
YAPC::Asia 2011
適当なステージ名
ステージ名:プレーン名

簡単なゲームを作ってみるその3 敵キャラと当り判定
#!/usr/bin/envperl
my $stage = create_stage( 'stage1', { debug => 1 } );
my $player_bitmap = create_bitmap( undef, [ { x => 0, y => 0, w => 6, h => 3 } ] )
->load_text("111n222n333");
my $player = create_sprite({ bitmaps => $player_bitmap, x => 20, y => 10, is_hit => 1 } );
$player->on_hit( sub { $stage->exit; } );
my $oni_bitmap = create_bitmap( undef, [ { x => 0, y => 0, w => 6, h => 3 } ] )
->load_text("444n555n666");
my $oni = create_sprite( { bitmaps => $oni_bitmap, x => 40, y => 10, is_hit => 1 } );
$plane->add($oni);
キーマップは省略
$stage->run;
YAPC::Asia 2011
当り判定領域
当り判定ON

簡単なゲームを作ってみるその4 敵キャラの移動
$oni->animation(
'moving',
{
type => 'custom',
on_frame => sub {
my ($sprite) = @_;
my $dx = $player->{x} - $sprite->{x};
my $dy = $player->{y} - $sprite->{y};
my $d = sqrt $dx*$dx + $dy*$dy;
my $vx = $dx/$d;
my $vy = $dy/$d;
$sprite->{x} += $vx;
$sprite->{y} += $vy;
},
}
)->play;
YAPC::Asia 2011
スプライト
property, keyframe, custom
かもしれない
フレームごとのハンドラ
プレイヤーを追いかける

簡単なゲームを作ってみるその5 タイトルの追加1
#!/usr/bin/envperl
while (1) {
create_title()->run;
create_stage1()->run;
create_gameover()->run;
}
YAPC::Asia 2011
無限ループにする

sub create_title {
# ステージとプレーン
my $stage = create_stage( 'title', { debug => 1 } );
my $plane = create_plane('title:main');
# タイトル
my $message = create_message({ message => 'The Onigokko', y => 15 } );
$plane->add($message);
$stage->keymap( { 'any' => sub { $stage->exit; }, } );
return $stage;
}
YAPC::Asia 2011
文字を描画したビットマップをセットしたスプライトを返す

sub create_gameover {
# タイトル
my $message = create_message({ message => 'GAME OVER', y => 15 } );
$plane->add($message);
return $stage;
}
YAPC::Asia 2011

sub create_stage1 {
省略ーさっきのメインプログラムがここに全部入る
return $stage;
}
YAPC::Asia 2011

簡単なゲームを作ってみるその6 画像を利用する1
YAPC::Asia 2011
画像はPNGで書き出したものを独自形式(gb8形式)に変換します。
実績があるのは Fireworks ですが、通常のパターンエディタでも(PNG書き出しができれば)いけます。
ゲームの実行ファイルのある場所に、images/ と patterns/ というフォルダを作成し、images に pngファイルを入れ、patterns に gb8 を書き出すのが推奨です。

sub create_title {
# タイトル
my $title = create_sprite(
{
bitmaps => create_bitmap('oni_title.gb8')
}
);
$plane->add($title);
return $stage;
}
YAPC::Asia 2011
独自フォーマット

YAPC::Asia 2011
1) ANSI の256色カラーテーブル作成
同梱された mk_ansi_act.pl を実行し、act ファイルを作成する
17番目の色を (0,0,0) ではなく(0,0,1)にし、透明色として利用している

YAPC::Asia 2011
2) Fireworks で、一枚のPNGに、スプライトを書く
適当なサイズのキャンパスを作成(800x600とか)
前述の act ファイルを最適化パネルにロードする
「未使用のカラーを削除する」のチェックを外す
17番目の色(0,0,1)を透明に変更する
スウォッチを「現在の書き出しパレット」に変更する -> これでスポイトできるようになる
スウォッチを分離して拡大する
ウィンドウメニューで、「ウィンドウを複製」する
複製されたウィンドウをドラッグし、別ウィンドウにして重ねる
鉛筆ツールと消しゴムツールでパターンを描画する

YAPC::Asia 2011
3) PNG8ビットで256色に最適化する
マットを透明に変更する
透明は、インデックス透明カラーを利用する
透明色を、17番目のカラーに変更されていることを確認する
各キャラクタにスライスを切り、画像を書き出す
4) GB8形式のバイナリデータに変換する
同梱された png2gb8 を実行しする
png2gb8 –output pattern/ images/

簡単なゲームを作ってみるその7 もっと複雑なゲームを作るには1
YAPC::Asia 2011
sub create_stage1 {
# プレイヤー
my $player = Player->new;
# 鬼
my $oni = Oni->new;
$plane->add($oni);
# キーマップ
$stage->keymap(
{
'h' => sub { $player->left; },
'l' => sub { $player->right; },
'j' => sub { $player->down; },
'k' => sub { $player->up; },
'q' => sub { $stage->exit; },
}
);
return $stage;
}
継承クラスを作成して利用
継承クラスを作成して利用

YAPC::Asia 2011
package Oni;
use base 'Games::BeLike::EightBIT::Sprite';
sub new {
my ( $pkg, $args ) = @_;
my $self = {
name => 'oni',
x => 450,
y => 190,
on_hit => &_on_hit,
is_hit => 1,
};
$self = $pkg->SUPER::new($self);
return $self;
}

YAPC::Asia 2011
sub _init_bitmap {
my $hitareas = [ { x => 0, y => 0, w => 32, h => 16 } ];
my @bitmaps = ();
for my $index (1..3) {
push @bitmaps, create_bitmap( "oni${index}.gb8", $hitareas);
}
return {
default => [$bitmaps[0]],
walking => [$bitmaps[2], @bitmaps],
};
}
ハッシュを返す

YAPC::Asia 2011
sub _init_animation {
my ($self) = @_;
$self->animation( 'walking‘, { duration => 0.5, repeat => 1 })->play;
$self->animation( 'moving',
{
type => 'custom',
on_frame => sub {
my ($sprite) = @_;
my $player = get_sprite('stage1:main:player');
省略
$sprite->{x} += $vx;
$sprite->{y} += $vy;
},
}
)->play;
}
1;
walkingビットマップを勝手にアニメーションしてくれる

今後の展望
YAPC::Asia 2011
テスト、ドキュメント、例外処理 -> cpanうp
ゲーム開始時のシステムチェック(画面解像度、256色)
line と paint を実装して、古くさい懐しいグラフィックを実現
全方向のスクロール(実は今横スクロールしか作ってない)
雛形作成用スクリプトの作成
配布用スプリプトの作成(パッケージングしてくれるやつ)
ひらがなとカタカナ、記号の表示(美咲フォントを組込予定)
レベル(マップ)エディタへの対応
RPGなどのゲームを作る際の便利な Util(吹き出しとか)
公式サイトの開設(ゲーム紹介のポータルサイト)
ネットワークとか？
アニメーションのバリエーションを拡充(easein/outとか)
年末の Advent Calendar あたりまでに何とかしたい

ご清聴ありがとうございました
YAPC::Asia 2011

http://d.hatena.ne.jp	149
http://yapcasia.org	55
http://a0.twimg.com	5
http://paper.li	5
http://translate.googleusercontent.com	1
http://webcache.googleusercontent.com	1

Perl Hobby Programming - Games::BeLike::EightBIT ターミナルで8ビット風ゲームをつくろう

by keroyonn on Oct 17, 2011

Accessibility

Categories

Tags

Upload Details

Usage Rights

6 Embeds 216

Statistics

Perl Hobby Programming - Games::BeLike::EightBIT ターミナルで8ビット風ゲームをつくろう — Presentation Transcript