初心者の方でも楽しくゲームの作り方やプログラミングを学べる情報を発信中!

WWA Wing

懐かしいゲームが簡単に作れる!WWA Wing作成ツール講座 #2 ツールの機能解説

今回は、WWA Wing作成ツールの機能について解説していきます。

 

少し難しい部分もあるので、無理のない範囲で進めてください。

ゲームデータの作成

WWA Wing作成ツールを起動すると、最初に説明用のゲームデータが開きます。

このゲームデータで制作をすると、説明が消えてしまいます。

そこで説明用のゲームデータとは別に、制作用のゲームデータを作成します。

 

ゲームデータ(DATファイル)

まず、赤枠内の「ファイル」にある「名前を付けて保存」を選択します。

 

すると保存画面が出るので、他のゲームデータ(DATファイル)と被らない名前にして「.dat」を付けて保存すると、ゲームデータが作成されます。

 

これで次回から「ファイル」にある「読み込み」から開けるようになります。

 

起動データ(HTMLファイル)

次にゲームデータを起動するために必要なHTMLファイルを作成します。

 

一番簡単な作成方法は、他のゲームデータに使用されているHTMLファイルをコピーする方法です。ファイル名と中身を少し書き換えるだけで作成できます。

 

中身の書き換え方は、「メモ帳」か「ワードパッド」で開いて、赤枠内を起動したいゲームデータ名に書き換えます。(画像はワードパッドを使用しています。)
HTMLファイルの中身については、「manual」も参考にしてください。

 

なお、今回ブログ用に用意したHTMLファイルの中身は以下の通りです。

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Cache-Control" content="no-cache" />
    <meta http-equiv="Expires" content="0" />
    <title>World Wide Adventure Wing</title>
    <link rel="stylesheet" href="style.css" type="text/css" />

    <!--  WWA requirements-->
    <link rel="stylesheet" href="wwa.css" type="text/css" />
    <script src="audio/audio.min.js"></script>
    <script src="wwa.js"></script>
    <!-- /WWA requirements -->

</head>
<body>
    <div id="wrapper">
        <!-- WWA -->
        <div id="wwa-wrapper" class="wwa-size-box"
             data-wwa-mapdata="caves01.dat"
             data-wwa-loader="wwaload.js"
             data-wwa-urlgate-enable="true"
             data-wwa-title-img="cover.gif">
        </div>
        <!-- /WWA -->
    </div>
    <footer id="copyright">
        <p> Internet RPG &quot;<a href="http://www.wwajp.com" class="wwa-copyright">World Wide Adventure</a>&quot; &copy;1996-2015 NAO</p>
        <p> &quot;<a href="http://wwawing.com/" class="wwa-copyright">WWA Wing</a>&quot; &copy;2013-2015 WWA Wing Team</p>
    </footer>
</body>
</html>

 

ツール機能の解説

WWA Wing作成ツールの機能について解説していきます。

なお、今バージョンでは「ファイル」にある「マップデータをブラウザで見る」は、使用できませんので気を付けてください。

マップ画面

ゲームマップを作成する画面です。

 

画面を左クリックでパーツの配置、配置されているパーツを右クリックでパーツの編集ができます。

左上にはマウスがある場所のXY座標が表示され、その右にあるボタンで編集方法の変更ができます。

 

物体・背景パーツ選択

マップ画面に配置するパーツを選択するウインドウです。

パーツとはマップを作成するための素材で、マップの背景になる「背景パーツ」とマップ上の物体になる「物体パーツ」に分かれています。

 

左クリックで選択、左ダブルクリックか右クリックでパーツの編集、「選択パーツ 消去」でパーツ自体を消去します。

パーツには「番号」が付けられてあり、ウインドウの左下に表示されています。

 

0番は削除用のパーツで、配置すると配置した場所のパーツが削除されます。

 

パーツの編集

パーツを編集するためのウインドウです。

黒枠内で種類の変更、左上の画像を左クリックで画像変更、他の編集項目は種類によって変わります。
パーツの種類については次回の記事で解説します。

 

クイックビュー

選択されたパーツの編集内容を簡易的に表示するウインドウです。

 

新規作成

ゲームをはじめから作り直します。

「ファイル」の「新規作成」から使用できます。

 

画面がほぼ真っ黒になりますが、パーツが設定されてないからなので安心してください。

 

基本設定の編集

ゲームの基本的な設定を編集するためのウインドウです。

「編集」にある「基本設定の編集」で開きます。

 

名前や使用する画像ファイル、初期ステータスなどの設定ができます。

 

境界線の表示切替

マップ画面に表示されている境界線の有無を切り替えます。

「表示」の「境界線の表示切替」で切り替えます。

 

赤い線がゲーム画面、青い線がパーツの境界線になります。(画像は境界線無し)

 

次回

今回の解説はここまでになります。

説明用のゲームデータにも解説があるので、参考にしてください。

 

次回は、物体パーツについて解説していきたいと思います。

スポンサーリンク
シェアする

関連記事

「WWA Wing」でゲーム制作にチャレンジ [崩れる床]編 #4

今回は、「崩れる床」の作成方法を解説してから「通常ステージ」を作成していきたいと思います。 「崩れる床」は、WWA作成ツールにある基本的な機能だけで簡単に作成することができます。 「崩れる床」の作り方 …

「WWA Wing」がさらに使いやすく!「WWA Wing V3.5.4」までの更新内容について #1

この[ゲーム作りラボ]というサイトでは、「WWA Wing」というゲーム作成ツールについて、WWA Wingを使用したゲームの制作方法について、紹介・解説した記事を作成しました。 しかし、その解説記事 …

「WWA Wing」でゲーム制作にチャレンジ [コマンドRPG]編 #4

今回は、[敵を配置するマップ]と[コマンドバトル用マップ]を作成していきたいと思います。 この2つのマップは、[コマンドバトル]の作成に関係のあるマップなので一緒に作成していきます。 [敵を配置するマ …

「WWA Wing」でゲーム制作にチャレンジ [崩れる床]編 #3

今回は、「初期マップ」を作成していきたいと思います。 今回から、[#1]で説明した内容をもとにしてWWAを制作していきます。 「初期マップ」の作成 「初期マップ」はゲーム開始直後に表示するマップで、ゲ …

WWA Wing作成ツールでゲーム制作にチャレンジ #2

今回は、前回の内容を元にしてゲーム制作を始めたいと思います。   ゲーム制作の最初は、新規作成をする所からになります。 新規作成 新規作成は、画面左上にある「ファイル」の「新規作成」から行い …