1.最初にベースとなる絵を描く。
見たいと思っている人が多い絵にチャレンジするのがコツです。裸の女の子や男の子とかを描かれてる人が多いみたいです。
とはいえ、エッチじゃなきゃダメというわけではありません。機械の中身や卵の中身とか工夫されている方もたくさんいました。
この絵に適当な名前(BASE.JPG等)をつけてJPGで保存します。
tips ファイル名の 大文字と小文字 は違います |
インターネットのサーバーにアップするとほとんどの場合で、ファイル名の大文字と小文字を区別します。もちろん全角と半角の区別もします。
windowsで拡張子が隠されている場合も厳密に区別されますので、ファイル名をフルで表示する設定にするか、アップロード後にリネームしてくださいね。
BASE.JPG≠BASE.jpg≠Base.jpg≠Base.Jpg≠base.jpg≠base.jpg |
|---|
|
2.ブロックにつくる。
ブロックを作る方法は4種類あります。それぞれ一長一短なのでお好みの方法を選んでみてください。
| 手法 | 難易度 | 仕上がり | 特徴 |
| 既成ブロック | 超簡単 | 既成のブロックを表示 | 服の絵は描かなくてもOK |
| 自動認識ブロック | 簡単 | 服の部分を自動認識 | ブロックの位置を指定しなくてOK |
| 透過GIFブロック | 普通 | 255色に減色された画像ブロック | ブロックの位置と画像をGIFで指定します |
| 24bitブロック | 普通+ | フルカラーの画像ブロック | ブロックの位置をGIF、画像をJPGで指定します |
クリックで次の項目へジャンプします。
|
|
|
2A.自動認識ブロックでつくる。
服や泡、壁等の中の絵を見るのを邪魔するものを描き足します。
ブロック有りの絵に適当な名前(FUKU.JPG等)を付けて保存します。HTMLは次のように書いて任意の場所に挿入します。
<applet CODE="UsoMeku.class" WIDTH=320 HEIGHT=479>
<param name=IMAGESOURCE value="BASE">…BASE.JPGの場合
<param name=IMAGEFUKU24 value="FUKU.JPG">…FUKU.JPGの場合
<param name=AUTOFUKU value="5">
<param name=AUTOFUKUDEL value="5">
</applet>
|
HEIGHTは画像の縦幅、WIDTHは画像の横幅に72を足した数字を書き入れます。(72というのはゲーム画面右側のステータスバーのサイズです)
「横248:縦479」の場合は、248+72=320となります。
ブロックの認識がうまくいってない場合はAUTOFUKUとAUTOFUKUDELで調節します。AUTOFUKUを1にすると明るさの差が1%以上でブロックになります。99だと明るさの差が99%必要になります。
AUTOFUKUDELはゴミとして捨てるブロックを指定します。1にすると有効ドットがブロック内の1%に満たない場合は捨てられます。誤認識が多いときにこの値を増やします。詳細はこちら、写真を使った実例はこちら。
うまくいかない場合や、もっと精密なブロックにしたいときは透過GIFブロックか24bitブロックを使います。
|
|
|
2B.透過GIFブロックでつくる。
服や泡、壁等の中の絵を見るのを邪魔するものを描き足します。
「背景」と「服」で変化のない部分を透明にしGIFでセーブします。対応フォーマットは1〜255色の透過GIFです。上下に何もない透明な部分が出来てもそのままフルサイズで保存してください。
ファイル名は拡張子以外を共通にします。
★フォトショップを使う場合
1.背景を下に服レイヤーを上に重ねて、服レイヤーの属性を「差の絶対値」にします。
2.ブロック用に何も書き加えていない部分が真黒になりますので、黒の部分を自動選択ツールでクリックして選択していきます。その際のアンチエイリアスのチェックは外し、許容値は16くらいが自然な感じに選択できるとおもいます。
3.領域選択で細かいゴミが出た場合は手作業でなおします。
4.服レイヤーの選択範囲の画像を消します。これでブロックの画像が出来ます。
5.服レイヤーのみを表示して、透過GIFとしてセーブしたら完成です。
|
★他のお絵かきツールでも同じようなことが出来ると思います。お絵かきツールが透過GIFをサポートしてない場合は、左図のようブロック部分に使われていない色で塗りつぶしてセーブし、フォーマットを変換するフリーウェアなどでその色を透明色と指定して再セーブします。
|
HTMLは次のように書いて任意の場所に挿入します。
<applet CODE="UsoMeku.class" WIDTH=320 HEIGHT=479>
<param name=IMAGESOURCE value="BASE">…BASE.JPG、BASE.GIFの場合
</applet>
|
HEIGHTは画像の縦幅、WIDTHは画像の横幅に72を足した数字を書き入れます。(72というのはゲーム画面右側のステータスバーのサイズです)
「横248:縦479」の場合は、248+72=320となります。
|
|
|
2C.24bitブロックでつくる
カラフルな画像の場合は255色の透過GIFフォーマットでは色が足りなくなるので、Jpeg画像でブロックをフルカラーにします。
基本的な作り方は「2B.透過GIFブロック」と同じですが、以下のようにフルカラー用の画像を追加指定すると、透過GIFで指定されたブロックの画像を上書きします。GIFの色情報は利用されなくなるので、白黒で透明部分だけ抜いた画像にしてしまっても大丈夫です。
<applet CODE="UsoMeku.class" WIDTH=472 HEIGHT=400>
<param name=IMAGESOURCE value="BASE">
<param name=IMAGEFUKU24 value="BASE24.JPG">
…フルカラーでセーブした服の画像
</applet>
|
|
★ オリジナルゲームの完成です ★
これであなただけのブロック崩しゲームが完成したはずです。 完成したゲームはぜひwebに貼ってくださいね。
|