http://www.dango-itimi.com/download/pictpuzzle/
【 規約 】
ダウンロードしたファイル内に入っているBGM・効果音ファイルはPICTPUZZLE内でのみ使用することができます。
また、swfファイルの再配布は禁止です。無いとは思いますが商用目的での利用はできません故 ご了承ください。
不明な点がございましたら管理人までご連絡ください。
過去のバージョンから ver1.03 へバージョンアップを行うには、pict.zip 内の pict.swf のみを差し替えてください。
自由にカスタマイズ可能なFlashパズルゲームです。ご自分のWEBサイトに簡単かつ自由に貼り付けることが可能です。
三つ以上重なったブロックをクリックして消していき、高得点を目指します。一番上までブロックが積み重なってしまうとゲームオーバーです。
サンプル2のBGMにはoo39ドットコムさんのフリーのmp3を使用させてもらっています。
サンプル2の各データの配布は現在行っておりません。
livedoor Blog : 団子一味のサーバーに配置したswfをLiveDoorのサーバにあるBlogに表示。
ダウンロードしたファイルを解凍後 出来上がったpictフォルダ内のファイル全てをそのままFTPで適当なディレクトリに配置します。
全ファイルを配置したディレクトリを http://www.dango-itimi.com/pict/ とした場合、PICT PUZZLEを表示したい場所に次の二行のJavaScriptをHTMLに記述します。
<script type="text/javascript" src="http://www.dango-itimi.com/pict/pict.js"></script>
<script type="text/javascript">pict("http://www.dango-itimi.com/pict/");</script>
一行目にあるURLにはpictフォルダ内にあるpict.jsファイルまでの絶対パス、二行目にあるURLはPICT PUZZLEファイル一式を配置したディレクトリを記述します。
PICT PUZZLEは 背景画像やブロック画像、BGMや効果音を自由に変更できます。
各ファイルの配置構造詳細はファイルディレクトリ構造の項を参照してください。
使用する画像等の拡張子を変更したい場合は設定ファイルのconfig.xmlを書き換える必要があります。設定ファイル( cnf/config.xml )説明の項を参照してください。
使用できる画像データの拡張子はFlashPlayer7の場合 jpg,swf、FlashPlayer8の場合 jpg,swf,gif,pngが指定できます。
FlashPlayer7の場合、jpgでもプログレッシブjpgは読み込むことはできません。また、FlashPlayer8の場合でもアニメーションgifは読み込めません。
png画像を用いれば アルファチャンネル付の画像をブロック画像に利用することができ、透き通ったブロック画像にしたりすることが可能です。
swfを用いれば 動きのある背景画像やブロック画像にすることが可能です。それにFlashPlayer7対応にした場合でもブロック画像のswf内にpng画像を利用すれば半透明のブロック画像にすることが可能です。
データを入れ替えた後はpict.swfを起動しなおす(ブラウザを立ち上げなおす)と 入れ替えたデータが反映されます。
ゲームの背景画像には /pict/img/bg/ ディレクトリ内のgame.jpg と open.jpg が用いられています。game.jpgがゲーム中の背景画像。open.jpgがオープニングタイトルの背景画像です。これら画像を好きな画像に取り替えれば そのままゲームに取り替えた画像が反映されます。
取り替える画像データの名前に合わせて 設定ファイル( cnf/config.xml )説明の中身を書き換える必要があります。
例えば game.jpg の代わりに aaa.swf という背景画像を用いたい場合、まず /pict/img/bg/ディレクトリ内に aaa.swf を配置します。その後、config.xml内の<game>game.jpg</game>と記述されている所のgame.jpgの部分を aaa.swfと書き換えて保存してください。
背景画像サイズは130x188ピクセルです。
ダウンロードしたファイル内に元から入っているgame.jpgとopen.jpgを参考にカスタマイズしてください。
ブロック画像には /pict/img/block/ ディレクトリ内の 0.swf, 1.swf, 2.swf, 3.swf が用いられています。ブロックに使用する画像データは0～3までの連番にする必要があります。
取り替える画像のデータの拡張子に合わせて 設定ファイル( cnf/config.xml )説明の中身を書き換える必要があります。
例えば 拡張子にjpgの画像を利用したい場合 0.jpg, 1.jpg, 2.jpg, 3.jpg と四種類のブロック画像データの名前を連番にし、/pict/img/block/ディレクトリ内に配置します。その後、config.xml内の <ext>swf</ext>とかかれている所のswfの部分をjpgに書き換え保存します。
ブロック画像サイズは15x15ピクセルです。
ゲーム中に流れるBGMには /pict/music/bgm/ ディレクトリ内の main.mp3 が用いられています。このmain.mp3を好きなmp3ファイルに変更すれば BGMが変更されます。
取り替える音楽データの名前に合わせて 設定ファイル( cnf/config.xml )説明の中身を書き換える必要があります。
例えば aaa.mp3というファイルをBGMに変更したい場合、まず /pict/music/bgm/ ディレクトリ内に aaa.mp3を配置します。その後、config.xml内の<file>main.mp3</file>と書かれている所のmain.mp3の部分をaaa.mp3に書き換え保存します。
ゲーム中にBGMを流さない設定にするには、<bgm dir="bgm/">と書かれた行の次にある<sound>true</sound>と書かれている所のtrueの部分をfalseという記述に書き換え保存します。
BGMのボリュームを設定するには<volume>100</volume>と書かれている所の100の部分を0～100の間好きな数値に書き換え保存します。
BGMのループはデフォルトで行うようになっています。しかしフリーのmp3素材を利用する場合、曲の途中と途中とでループさせたい場合が出てくる場合があります。
その場合、<roop>と書かれている行の次にある<set>false</set>と書かれている所のfalseの部分をtrueという記述に書き換えます。
次に、曲内の10秒目から70秒目を繰り返しループさせたい場合、 <start>0</start>と書かれている所の0の部分を10という記述に書き換え
<end>0</end>と書かれている所の0の部分を70という記述に書き換え保存します。
ゲーム中に流れる効果音には /pict/music/se/ ディレクトリ内の drop.mp3, end.mp3, eraze.mp3, open.mp3, select.mp3, up.mp3 の各ファイルが用いられています。これらmp3ファイルを好きなmp3ファイルに変更すれば 各場面で流れる効果音が変更されます。
各ファイルの役割はファイルディレクトリ構造の項を参照してください。
取り替える音楽データの名前に合わせて 設定ファイル( cnf/config.xml )説明の中身を書き換える必要があります。
例えば bbb.mp3という効果音をdrop.mp3の代わりに変更したい場合、まず /pict/music/bgm/ ディレクトリ内に bbb.mp3を配置します。その後、config.xml内の<drop>drop.mp3</drop>と書かれている所のdrop.mp3の部分をbbb.mp3に書き換え保存します。
また、ゲーム中に効果音を流さない設定にすることが可能です
config.xml内の<se dir="se/">と書かれた行の次にある<sound>true</sound>と書かれている所のtrueの部分をfalseという記述に書き換え保存します。
ゲームを開始する前に一番最初に表示されるNOW LOADING部分の背景色はデフォルトで白色(#ffffff)に設定されています。
これを違う色に変更したい場合は pict.jsファイルの中身を書き換えます。
pict.jsファイル内に#ffffffと書かれた部分が二箇所あります。
例えばNOW LOADING中の背景色を白色から赤色に変更したい場合は
この二箇所の#ffffffという記述を#ff0000に変更して保存します。
ゲーム終了後、一定の得点以上の場合 特定のHTML(ボーナスページ)を表示させるためのリンク用ボタンを表示させることが可能です。デフォルトではボーナスページは表示しない様に設定されています。
ボーナスページを表示させるには設定ファイル( cnf/config.xml )説明の中身を書き換える必要があります。
まずボーナスページを表示するようにするには<end>とかかれた行の次にある<open>false</open>と書かれている所のfalseの部分をtrueという記述に書き換え保存します。
次に何点以上取得したらボーナスページを表示するかを設定します。<score>1000</score>と書かれている所の1000の部分を好きな得点に書き換え保存します。この設定した値がボーナスページを表示するための条件となります。
最後にボーナスページにどのHTMLを表示するかを設定します。<url>http://</url>と書かれている所のhttp://の部分を表示させるURLに書き換え保存します。この設定した値が表示されるボーナスページとなります。
CGIとの連携によりランキング機能を用いることができます。CGI設置経験のある方はお試しください。デフォルトではランキング機能は使用しないように設定されています。
※Flashのセキュリティの都合上 cgiを配置するディレクトリは同一ドメイン配下でなくてはならないのでご注意下さい。
まずお使いのサーバが許可しているcgiを利用できるディレクトリへ /pict/cgi/ ディレクトリ内のファイル全てを移動する必要があります。どのディレクトリからでもcgiが利用可能なサーバをお使いの方は移動する必要はありません。
例えばcgiが利用可能に設定されているディレクトリがhttp://www.dango-itimi.com/cgi-bin/ の場合 /pict/cgi/ディレクトリ内のファイル全てを http://www.dango-itimi.com/cgi-bin/pict_cgi/配下に移動させます。/pict_cgi/というディレクトリ名は好きな名前に設定してください。
次にconfig.xmlファイル内の設定を書き換えます。
<rank>とかかれた行の次にある<use>false</use>と書かれている所のfalseの部分をtrueという記述に書き換えます。
それと、<cgi>http://</cgi>と書かれている所のhttp://の部分を上記CGIディレクトリ設定での例の場合http://www.dango-itimi.com/cgi-bin/pict_cgi/rank.cgiという記述に書き換えます。
rank.cgiファイルの一行めのperlのパスを適切なパスに書き換えます。
「#!/usr/local/bin/perl/」または「#!/usr/local/perl」のどちらかです。サーバの設定にあわせてどちらかを記述してください。
各ファイルとディレクトリのアクセス権限の設定を行います。ファイルディレクトリ構造のcgiディレクトリ以降に記述されている括弧内の数値が設定するアクセス権限の数値です(755等)。CGIの詳しい知識をお持ちの方は、括弧内の数値ではなく適切な値に変更してください。また、サーバでアクセス権限の設定が定められている場合はそれにしたがって設定してください。
DOWNLOADしたファイル解凍後にできるpictフォルダ内のディレクトリ構造は以下の通りです。
cgiディレクトリ以降にある括弧内の数値は、設定するアクセス権限を示します。
[ pict ] ├ pict.swf PICT PUZZLE用Flashファイル ├ pict.js PICT PUZZLE表示用JavaScriptファイル │ ├[ cnf ] 設定ファイル配置ディレクトリ │ └ config.xml ゲーム設定用ファイル │ ├[ img ] ゲーム画像配置ディレクトリ │ │ │ ├[ bg ] 背景画像配置ディレクトリ │ │ ├ game.jpg ゲーム用背景画像 │ │ └ open.jpg タイトル用背景画像 │ │ │ └[ block ] ブロック画像配置ディレクトリ │ ├ 0.swf │ ├ 1.swf │ ├ 2.swf │ └ 3.swf │ ├[ music ] 音楽データ配置ディレクトリ │ │ │ ├[ bgm ] メインBGM配置ディレクトリ │ │ └ main.mp3 メインBGMファイル │ │ │ └[ se ] 効果音配置ディレクトリ │ ├ drop.mp3 ブロックが落ちる音 │ ├ end.mp3 ゲームオーバー時の音 │ ├ eraze.mp3 ブロックを消去した時の音 │ ├ open.mp3 ゲームスタート時の音 │ ├ select.mp3 MENU項目を選択した時の音 │ └ up.mp3 ブロックが上に上がる時の音 │ └[ cgi ](755) CGI配置ディレクトリ ├ rank.cgi(755) ランキング処理用cgiファイル │ ├[ dat ](755) datファイル配置用ディレクトリ │ ├ id.dat (644) id取得用 │ ├ lock.dat (644) ファイルロック用 │ └ rank.dat (644) ランキングデータ保持用 │ └[ lib ](755) ライブラリファイル配置用ディレクトリ └ file.pl (644) ファイル処理用
設定ファイル config.xmlの説明です。PICT PUZZLEをカスタマイズする場合はこの設定ファイルの中の値を書き換える必要があります。
<main> <!-- Flash設定 --> 対応するFlashPlayerのバージョンを設定します。 背景画像やブロック画像に拡張子がgifやpngのデータを使用したい場合8に設定します。 その代わり、FlashPlayer8をブラウザにインストールしていない人はこのゲームは遊べなくなります。 拡張子がgifやpngの読み込みは行わず、jpgとswfのみでいい場合は7を指定します。 現在FlashPlayer8のインストールはベータ版しかできないので7に設定しておきましょう。 <flash> <player>7</player> </flash> <!-- ゲーム画像設定 --> <img dir="img/"> <!-- 背景画像 --> <bg dir="bg/"> <open>open.jpg</open> タイトル背景画像ファイル名 <game>game.jpg</game> ゲーム中の背景画像ファイル名 </bg> <!-- ブロック画像 --> ブロック画像に使用する拡張子を設定します。 設定できる値は対応するFlashPlayerのバージョンにより異なります。 <block dir="block/"> FlashPlayer7対応の場合 : jpg,swf が設定可 FlashPlayer8対応の場合 : jpg,swf,gif,png が設定可 <ext>swf</ext> </block> </img> <!-- サウンド設定 --> <music dir="music/"> <!-- ゲーム中のBGM --> <bgm dir="bgm/"> BGMをゲーム中流す場合 : true BGMをゲーム中流さない場合 : false <sound>true</sound> <file>main.mp3</file> BGMファイル名 <volume>100</volume> BGMボリューム : 0～100 </bgm> <!-- BGMループ設定 --> 曲の指定秒(end)から指定秒(start)へループさせたい場合に設定します。 startとendに設定する値の単位は"秒"です。 end秒からstart秒へループさせる : true 曲の最後まで行くと曲の最初にループする : false <roop> <set>false</set> <start>0</start> <end>0</end> </roop> <!-- 効果音設定 --> <se dir="se/"> 効果音を鳴らす場合 : true 効果音を鳴らさない場合 : false <sound>true</sound> <eraze>eraze.mp3</eraze> ブロック消去音 <drop>drop.mp3</drop> ブロックが落ちる音 <up>up.mp3</up> ブロックが上に上がる音 <open>open.mp3</open> ゲームスタート時に鳴る音 <end>end.mp3</end> ゲームオーバー時に鳴る音 <select>select.mp3</select> MENU等での項目選択音 </se> </music> <!-- ゲーム設定 --> <game> <!-- 色設定 --> <color> <!-- 得点の色 --> ゲーム画面の右下に表示される点数の色 <point>ffffff</point> </color> <!-- ランキング設定 --> ランキングシステムを利用する場合は このページの「ランキング機能を用いる」の項目を参照してください。 <rank> ランキングシステムを利用する場合 : true ランキングシステムを利用しない場合 : false <use>false</use> rank.cgiファイルの配置URLを絶対パスで指定します。 <cgi>http://</cgi> </rank> <!-- ゲーム終了時の特定HTML表示設定 --> ゲーム終了時この項目をtrueに設定しておくと 指定得点以上の時にMENUの[PRESENT]の表記が黄色く点滅します。 <end> ボーナスHTML表示を行う場合 : true ボーナスHTML表示を行わない場合 : false <open>false</open> 何点以上でボーナスHTMLを表示するかの設定 <score>1000</score> 表示するHTMLのURLを絶対パスで指定 <url>http://</url> </end> </game> </main>
随時追加します
Q.rank.cgi, config.xmlが文字化けしてしまいます。
Windowsの場合、メモ帳で開くかUTF-8に対応しているエディタで編集してください。
Macの方はjeditといったエディタを用いると文字化けしないようです。
Q.デフォルトの背景画像にはPICTPUZZLEという文字が入っていますが、自分で好きな背景画像にしたい場合 PICTPUZZLEという文字は入れなくてもいいのでしょうか
A.入れる必要はありません。好きなタイトルをお付けください。
Q.ブラウザのOperaでたまにブラウザごと強制終了するのですが
A.恐らくですが最初のブロック大量生成処理の部分でOperaのFlashPlayerがメモリリークを引き起こし強制終了してしまっているようです。FlashPlayer8あるいは今後のOperaのバージョンアップにより解決してくれることを期待しています。いつまでたっても解決されない場合は対策を考えます。
PICT PUZZLEの効果音作成等に利用できる便利なフリーツールの紹介です。
効果音作成ソフトです。平仮名から簡単な効果音が作成できてお勧めです。
KanaWaveと同じ作者様のソフト。波形から効果音を作成できます。やや扱いに難しいですが、KanaWaveでは作成できない音を作成できます。
wav編集ソフト。作成した効果音のボリューム調整やノイズ除去等に利用します。
wavファイルをmp3に変換するソフトです。
PICT PUZZLEに不具合がありましたら よろしければご連絡ください。このページの説明が少し分かりにくい・間違っている部分等もありましたらお知らせ下さい。
設置方法がわかりません、表示されません、といった質問には申し訳ございませんが手が回らないためお答えできません。自力設置でよろしくお願いします。