Aokashi Room

なんでも書き続けるAokashiの部屋

WWA Wing 3.2.0 がリリースされました

インターネットRPG "World Wide Adventure" (WWA) の JavaScript 実装である WWA Wing が 3.2.0 にバージョンアップしました。

本来なら、 WWA Wing 用のブログを設けて、ここでお伝えするべきなんですが、まだ用意していないので、 WWA Wing Team の一員である私がリリース内容をまとめます。

何が変わったの?

ざっくり言えば、 PLiCyWWA Wing と一緒になりました。 ということでしょうか。

例えば、以下のように変更が加わります。

  • 崩れる床が速くなり、難易度が上がります (速度が 1.2 倍になるため、準低速でのご利用をおすすめします) 。
  • GoTo WWA ボタンが Battle Report ボタンになります。スマートフォンでもモンスターとの戦闘予測が表示できます。
  • スマートフォンで Yes/No ボタンが拡大されます。

f:id:aokashi:20190602165838p:plain
スマートフォンでは、 Yes/No ボタンが拡大され、 戦闘予測も出来ます!

制作者にとっては、以下のようなメリットと注意点があります。

  • audio.min.js 及びその関連ファイルの設置が不要になります。
  • プレイするHTMLファイルに data-wwa-use-go-to-wwa="true" とすることで、 GoTo WWA ボタンに戻すことが出来ます。
  • プレイするHTMLファイルを Firefox で直接開いても警告メッセージが表示されなくなります。
  • ゲームスピードが速くなるため、難易度の調整や劇イベントの待ち時間調整が必要になる場合があります。

リリース内容

"これまで" や "従来" とありますが、 これらは WWA Wing 3.1.x 以前を指しています。

新機能追加

  • ゲームパッドが使用できるようになりました。
    • USB接続またはBluetooth接続のゲームパッドをお持ちであれば、接続してみてください。すると・・・?
  • サウンド 20.mp3 を完全版に追加しました。
    • 3.02 以前の 16.au そのままになります。昔遊んでいた人には懐かしい? そうでなくても新鮮に感じるかも?
  • material.gif を完全版に追加しました。
    • WWA イメージ画像を制作する際にお役立てください!

機能改善

  • サウンドの鳴り方が変わります
    • 従来は裏で audio 要素を配置して再生する特殊な方法でサウンドを再生していました。このため、 iOS(iPhone, iPad) や Android は、サウンドが鳴らない場合がありました。
    • 今回からは、ブラウザAPI(Web Audio API) を利用して再生する形に変更しました。iOSAndroid でもサウンドが再生されるようになります *1
    • なお、 Internet Explorer では従来と同じく裏で audio 要素を配置して再生する方法で動作します*2
  • audio.min.js が不要になります
    • サウンドの鳴り方が変わったことにより、 これまで設置をお願いしていた audio.min.js が含まれなくなります
  • スマートフォンでプレイすると Yes/No ボタンが拡大されます
  • WWA Wing をプレイするHTMLファイルをそのまま Firefox で開いても、警告メッセージが表示されないようになります
    • 特にテストプレイを行う場合は Firefox のご利用をおすすめします。他のブラウザをご利用の方は wwa-server を併せてご利用いただくか、 PLiCy に一旦投稿していただく形となります。

f:id:aokashi:20190602170519p:plain
audio ディレクトリのファイルの一覧。 audio.min.js は不要になります!

仕様変更

  • ゲームスピードが変わります
    • これまでは、 Java版の WWA との互換性を確保する目的で、 50FPS で動作していました。
    • これが、 60FPS になります。ゲームスピードが 1.2 倍になるということです。
    • このため、 劇イベントで待ち時間をサウンドの長さに揃えている場合は、動作出来ない場合があります。 3.1.x のままに留めるか、待ち時間の調整をお願いします。
  • GoTo WWA ボタンが Battle Report ボタンに変わります
    • なお、 下図のように、 WWA Wing をプレイする HTML ファイルを加工することで、 GoTo WWA に戻すことができます。
    • 遠くないうちに仮想パッドの実装も予定しています。
  • 完全版の wwamap.dat が少し変化しています。
    • どこが変わったかは載せませんが、比較してみては・・・?
<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"
  data-wwa-use-go-to-wwa="true"> <!--←ここを加えると GoTo WWA に戻せます。 ">" 記号の移動も忘れずに。-->
</div>

仕様変更 (内部)

WWAを遊ぶ側、作る側にはあまりメリットを受けないですが、念の為記載しておきます。

  • $parts マクロの実行速度が最適化されます
  • 描画が全体的に速くなります

不具合修正

  • サウンドが見つからない場合、 WWA Wing のマップデータ読み込みが止まる不具合を修正しました
    • なお、 F12 キーの コンソール で読み込めないサウンド番号が表示されるため、もし表示された場合は 極力修正するようにしてください

f:id:aokashi:20190602171500p:plain
サウンドが見つからない場合は、このように表示されます。

リリースの目的

WWA Wing 3.1.x 以前は、 Java版の WWA との互換性を確保することが目的だったのですが、この互換性の確保に必要な要素と今のブラウザAPIで持っている要素とでは相性が悪く、今のブラウザAPIと揃えなくてはならなくなりました。

その間に、 PLiCy は PLiCy で利用されている WWA Wing の改良を進めていて、今のブラウザAPIと揃えた実装を進めていました。

しかし、 WWA Wing 3.1.x 以前と PLiCy とでは、実装の差異が災いとなり、 "手元の WWA はテストプレイでは動いたのに、 PLiCy に投稿したら動かなくなった" といったトラブルが発生する可能性があります。

このリスクを減らしたくて、 WWA Wing 3.2.0 をリリースすることとなりました。

また、時代に合わせる形で新機能の追加が必要になるため、追加に合わせた下準備を行うという目的もあります。

このような事情もあって、 これからの WWA Wing のリリースでは Java 版の WWA との互換性が確保できなくなります。 Java版の WWA では動作するけど、 WWA Wing 3.2.x では動作しない といったケースが発生しますが、発生条件によっては解決出来ない場合があります。そのため、 Java版の WWA の作品を Web サイトに設置する場合は、 WWA Wing 3.1.9 をご利用ください

作成ツールについて

WWA Wing に同梱されている作成ツールについては、引き続き キャラバンサークル で提供されている作成ツールと同じになります。

WWA Wing Team が改良を施した作成ツールではありません。現在は、代替になる作成ツールが開発できないか、方法を模索中です。

WWA Phoenix の提供について

f:id:aokashi:20190602180753p:plain
ゲートワールドWWA Phoenix で実行した画面。

WWA Wing 3.2.0 以降、 WWA Phoenix の提供はありません。 ただし、 WWA Phoenix は引き続きご利用になれます。

WWA Phoenix は元々、 Java 版の WWA 作品を WWA Wing で動作することを目的として開発されましたが、上記の事情で Java版の WWA と挙動を揃えるという使命を終えたため、更新する必要が無くなったためです。

致命的な不具合があれば修正するつもりですが、期待しすぎないようにしてください。

既知の不具合

開発について

WWA Wing 3.2.x 以降からは、今の時代に併せて機能追加を進めていくつもりです。

開発に興味がある方は WWA Wing のサイト の Discord のリンクからどうぞ! (WWA FanSquare の Discord のリンクからでも同じ Discord サーバーにアクセスできます。)

wwawing.com

*1:ただし、マナーモードの設定によって再生出来ない場合があります。

*2:開発者の身としては Internet Explorer はサポートしたくなかったんですが・・・!

WWA Message Loader を作ってました

WWAのマップデータから各パーツのメッセージを読むこむだけのWWA Loaderを作りました。

なんで作ったのか

このWWA MessageLoaderの開発がはじめったのは去年の10月中旬で、 WWA COLLECTION の配信に向けて不適切なメッセージが無いか確認する必要がありました。

WWAマップ作成ツールには、メッセージの検索機能を持っていません。

ですので、WWAマップデータのメッセージを出力されたプログラムが開発されたのです。

作り方

まず、WWAのマップデータはWWA Loaderが読み込むと、連想配列 WWAデータ が展開されます。その中の「message」のキーには、配列を持っているのです。

そのメッセージを取って出すだけです。👌

wwaData.wwaData['message'].forEach((text, number) => {
  if (text === '') {
    return;
  }
  // number で番号が表示されるはず。
  let textLines = text.split('\n');
  textLines.forEach((textLine) => {
    // textLine で各行出力されるはず。
  });
}

パーツ番号の表示

しかし、そのメッセージがどのパーツのメッセージなのか分かりません。

WWAデータには、先程説明した「message」以外にも、「objectAttribute」と「mapAttribute」をキーとした配列があるのです。前者は物体パーツの属性、後者は背景パーツの属性です。「属性」と書いてますが、 メッセージ以外すべての値が各パーツごとに格納されています

興味のある方は、下の記事を見ると分かると思います。

github.com

つまり、WWAデータは、メッセージとメッセージ以外でパーツのデータを分けているんですね。

メッセージ以外にあたるパーツの属性からメッセージへ辿るには、各パーツ属性にある数値から message 配列の中を探します。👉

f:id:aokashi:20190224182907p:plain

そのまま上図の通りなんですが、パーツ属性の各パーツの6番目、プログラム内だと0から始まるので5番目に message 配列内の場所が記載されています。上図だと「10」なので、 message 配列のインデックス10にパーツのメッセージが含まれているのです。

ちなみに、WWAマップ作成ツールの仕様上、 どのパーツにも参照されないメッセージ もありますのでご注意ください。パーツを削除したり、移動したりすると発生します。

Vue.js によるコンポーネント

機能は整ったこととして、メッセージ一覧を表示する方法なら、Vue.js とかのビューフレームワークで構築したら、いい感じ*1のプログラムになるんじゃないか?と思い、学習を兼ねて Vue.js のコンポーネント機能を利用して作り直してみました*2

のはずが、上手く進まず、去年10月の開発から今までこれが原因で放置していました。

(ここから先は、コンポーネントの仕組みを理解していることを前提に話します。)

コンポーネントの仕組みについて

f:id:aokashi:20190228232452p:plain

今回の WWA MessageLoader は上記のパーツ番号の表示でどう設計しようか長時間悩んでいました。

とりあえず、上図のように親コンポーネントWWAパーツ一覧、子コンポーネントWWAパーツとしましょうか。

当時の設計では、 WWAパーツ一覧はWWAのデータを渡すだけで、WWAパーツはパーツ情報の表示と必要に応じてデータの取得を行う と考えていました。WWAパーツでは「パーツ情報の表示」なので、下図のようにWWAパーツが親からパーツ番号やパーツ種類を参照できないか実装していましたが、全然上手く行かず・・・。😇

f:id:aokashi:20190224203804p:plain
当時考えていたコンポーネントのデータの渡し方。今これ書いてて恥ずかしいな。

後に、コンポーネントは親子関係を持つことが出来るけど、データは親コンポーネントから子コンポーネントに一方通行しか渡せない。逆方向の場合は、イベントを利用する必要がある。 ということが分かりました。イベントを利用してみるも、こちらも上手く渡せず・・・。🤔

設計がいけなかった

去年11月上旬で放置した後、今年2月に大学から Vue.js 入門を貸出して再び学習しました。📖

gihyo.jp

最近のWebアプリケーションは、サーバーはJSONとかで返すAPIスタイルで、表示をすべてクライアントサイドで済むのか、だったりと今の事情を理解しつつ、コンポーネント周りについて読みました。

「あ、そうだったんだ。子コンポーネントに渡した時点で親コンポーネントからデータは渡せないのか・・・」と。

と気付いたこともそうですが、何よりももう長時間放置していたので、当時の設計の考え方を忘れた🤷‍♂️ というのもあります。

とは言え、下図のように設計を改め、WWAパーツ一覧では各WWAパーツ毎に表示するべきデータを渡して、WWAパーツはそれを表示するだけに済ませる方法で実装できました。👏

f:id:aokashi:20190224203836p:plain

WWAパーツ一覧のソースコードでは、以下のメソッドで各WWAパーツにデータを渡します。

  computed: {
    partsObjects: function() {
      let result = {};
    
      for (let key in this.wwaData['message']) {
        if (this.wwaData['message'][key] === '') {
          continue;
        }

        // makePartsNumber はメッセージ番号を渡すとパーツ種類とパーツ番号を返してくれるメソッド。 methods の中に定義されている。
        let partsInfo = this.makePartsNumber(parseInt(key));
        // 検索条件に満たないパーツをここで continue で弾く

        // こんな感じでまるごとまとめてしまう
        result[key] = {
          number: key,
          message: partsMessage,
          partsType: partsInfo.partsType, // パーツ種類は partsType.js の中に定数定義が入っている。
          partsNumber: partsInfo.number
        };
      }
      return result;
    }
  },

一応教訓としては、 コンポーネント間で受け渡しを行う回数を少なくする ことが大事だと分かりました。

最近オブジェクト指向の扱い方について考え直しているところなんですが、疎結合に作ることがオブジェクト指向とそっくりなんですね―。

検索機能の実装

上記のことがやっと分かり、検索機能も実装しました。ここは イベントの呼び出し を利用して、子である検索ボックスコンポーネントから親であるWWAパーツ一覧コンポーネントへ渡す形としました。

この時点でもエラーは起きましたが、タイプミスだったり、カンマの付け忘れだったり、v-on ディレクティブに付ける要素を間違えたりしただけです。

f:id:aokashi:20190228233102p:plain

検索ボックスのソースコードでは、以下のメソッドでイベントが呼び出されます。

  methods: {
    searchEvent: function() {
      this.$emit('search', { // $emit でイベントを親コンポーネントに呼び出す。ここなら 'search' イベント。
        query: this.query,
        type: this.type,
        onlyPartsMessage: this.onlyPartsMessage
      });
    }
  }

検索ボックスコンポーネントの親にあたるWWAパーツコンポーネントには、 v-on ディレクティブでメソッドが呼び出せます。

  template: `
    <div class="parts-list">
      <search-box v-on:search="setSearch"></search-box>
      <!-- WWAパーツ一覧のコンポーネントの部分 (長いので書かない) -->
    </div>
  `

今の所、検索で渡すデータが「キーワード」「タイプ」「パーツから参照されてないメッセージを除く」の3つの値の配列を毎回キーを書きながら渡していて、冗長になっていますので、そこあたりをきれいにまとめたいなあ。

将来はどうしよう?

当サイトの素材一覧 を、Vue.js で作り直して、素材を探しやすくしたいなあと思います。

恐らく、素材一覧ページと素材情報ページが必要になるので、ルーター機能を学ばないとなあ。

リポジトリ

リポジトリは以下になります。あまり期待しないでください。

github.com

*1:語彙力不足です。すみません。

*2:既存の処理は持ってきているので、作り直しとは言い難いかも?

カエルの為に鐘は鳴る はWWAとそっくりなのか調べてみた

f:id:aokashi:20190201233818j:plain

WWA COLLECTION 配信開始以降、WWAについて説明する機会が何かと増えてきましたが、説明すると「カエルの為に鐘は鳴る と似ているね」と耳にすることがありました。

名前は聞いたけど、マイナーなゲーム?今遊べるの?と思っていましたが、調べると、Nintendo 3DSバーチャルコンソールで配信されている、任天堂ゲームボーイソフト ということが分かりました。

しかも、スマブラ(SPECIAL) ではこのゲームの主人公がアシストフィギュアとして乱闘に入ってくれるというのだ。

調査(?) のこともあってか、1月18日金曜日に購入。プレイしました。

軽い説明

カスタード王国の王子(リチャード王子)とサブレ王国の王子が(いい意味か分からないけど)争っている中、ミルフィーユ王国がやばいので突撃しにいくという、いつもよくありそうなパターンのRPGです。

フィールド内や街の中はいつものRPGのように、上下左右プレイヤーが動けます。

しかし、洞窟の中や城の中では、アクションゲームのように左右移動やジャンプができます。

そして、主人公がカエルやヘビに変身します。この変身できる主人公をどう扱うかが最大のポイントになるわけです。

敵との戦闘もあり、あれこれしながらティラミス王国を攻撃しに来る(?)ゲロニアン軍、そしてボスのデラーリンを倒すことになります。

プレイした際の印象

カエルの為に鐘は鳴る」と検索してたどり着いた方のために、プレイしてどんな感じだったか感想を書こう。

イベント

序盤から激しいイベントが多いかなと感じました。

一応伏せておくと、主人公の多くの○○を○に渡す、ゲロニアン兵を倒した後に○○が起きて隣の街が○○を受ける、○のスイッチを入れた後に○○○の住民から○○○○にされる・・・。

また、おばけの木のように少しトリッキー(?)な操作をしないとたどり着けない箇所があったかなと感じました。

同じ任天堂ゼルダの伝説 時のオカリナでも、最初のデグの樹の地下1階で蜘蛛の巣が開けられなくて詰まったことが多かったです。

そして、後半へ進んでいくと、ミスするとすぐに病院送りというシビアな箇所が多く存在します。

しかし、VCまるごとバックアップを利用すれば復帰が簡単なので是非利用しましょう。

3つの姿に変えられる

前述に書いたように、主人公がカエルになったりヘビになったりできます。

かといって、すぐに出来るわけではなく中盤になると変身できるという感じです。

力の強い人間、水中で泳げて高く飛べるカエル、狭い空間の中を移動できて弱い敵を固めてしまうヘビの3つを上手に利用しないと物語は進められません

人間からカエルになるには水に浸す必要があり、カエルへの変身場所は限定されます。

しかし、水辺があるということは「ここでカエルになりなさい」とアドバイスを示していることでもあるのです*1

パーティを組むことがある

複数人加えて行動したり、巨大動物を連れて行動したりすることがありますが、その光景は圧巻かもしれません。

この場合、敵を一撃で倒すことができます。

その他

このRPGは、主人公が喋ります

しかし、会話になると誰がしゃべっているのか分からないことが多かったです。

一応、人によって話す音を変えているのですが、最初は戸惑うかもしれません。

あと、フィールドの音楽がすごく好き。

WWAとの共通点

WWAとは、公式サイトの通りなんですが、ユーザーが自由にRPGが作成出来るシステムのことです。

ゲームのレイアウトや操作方法、敵の戦闘方法は(変なことをしない限りは)誰が作ってもほぼ同じになるため、ゲームエンジンと言うには自由度が低いかな、でも頑張ればRPG以外も作れるかな、という感じです。

ここで本題ですが、WWAと類似している箇所が多いのです。

もしかして、NAOさんそのゲームを参考してたのかな?と思ってしまうのですが・・・。

  • 画面は撮影です。光が不均等だったりして見辛いです。

マップ画面

f:id:aokashi:20190202021453j:plainf:id:aokashi:20190202021457j:plain
プレイヤーが中央にいないのは仕様です・・・!

画面毎にカメラが移動端に来ると隣の画面へスクロール

キャラクターに触れると話してくれるし、敵に触れると勝手に戦闘が始まる

Aボタンとかを押す必要はありません。

ダンジョンでも同様で、画面上端近くでジャンプしたら上の画面に移動します。

かえってやりづらいですが。

f:id:aokashi:20190202021516j:plain
街のアイテムショップ。リストと比べたら、アイコンが出ていて分かりやすい?

各街にはアイテムショップがありますが、画面のように販売アイテムがカウンターに置かれて、触れると「買いますか?」みたいなメッセージが表示されます

上記の仕様、この時点で分かる方もいますがすべてWWAとほぼ同じです*2

f:id:aokashi:20190202115118p:plain
例えばファンタジーアイランド。カウンターに商品が置かれています。

違いがあるとするなら、プレイヤーやキャラクターの移動単位が0.5マスであることと、画面の移動で弱い敵の配置がリセットされてしまうくらいでしょうか?*3

戦闘

f:id:aokashi:20190202021528j:plain
戦闘中のボコボコ演出。

敵と始まると、自動で開始どちらかの体力が無くなるので戦闘が続きます

そして、後述の先制を除き、何度戦っても同じダメージを受けます。なので戦闘にはランダム性はありません

この仕様もWWAでは同じです。ただし、Bボタンを押すと中断し、逃げる、もしくはアイテムの使用ができます

ダメージの計算式は不明です。素早さの概念が用意されていることもあって、ダメージの出し方はWWAと結構異なっていると思います。

また、先制攻撃が自分か相手かはあまりはっきりしていません。一撃で倒せても相手に先制攻撃されることはあります。

しかし、一撃で倒せる辺りから更に強化すると敵は弾かれます。画面のようなボコボコ演出が消えるので爽快かもしれないです。

メニュー(アイテムボックス)

f:id:aokashi:20190202021542j:plain
メニュー。バラバラに配置されていること、わかりますか?

STARTボタンを押すとメニューが開きますが、各アイテム決まった位置に置かれます

WWAはアイテムを持つと基本的に空いたところに適当に入れる仕様のため、違うんじゃないかと思いますが、作品によってはアイテムの位置を固定にする、つまり決まった位置に置くことが出来るのです。

また、メニューには「KEY」の欄がありますが、鍵を持つと鍵と対応する扉が開き放題。しかも、複数種類あります。ただ、鍵の出番は結構後になります・・・。

作品次第では

f:id:aokashi:20190202021608j:plain
WWAの脱出ゲームであったかもしれない?謎解き

ダンジョンに入ると、プレイヤーはアクションゲームのように横からの視点で動けます。

WWAでは非公式的な方法になりますが、下に進むジャンプゲートを敷き詰めるとそれっぽく扱うことができます。

また、WWAでは特に多い崩れる床もこのゲームにはありますが、WWA作品でよく見かける「連続で配置されていて、落ちるまでに走る」ものとは違います。

その他にも、上の画面のように、数字と記号が並んだ謎解き迷路もあります。WWAでも脱出ゲームではあったかもしれません。

まとめ

忙しい人向けに言うと共通点は以下の通り。

  • カメラの移動方法
  • カメラの移動アニメーション
  • キャラクターのメッセージの出し方
  • アイテムショップの販売方法
  • 戦闘の基本ルール (最初の攻撃が誰かはあまり分かってない)
  • 戦闘のランダム要素の有無 (どちらもランダム要素は無し)
  • アイテムの配置方法 (すべて位置は固定)
  • 鍵の概念 (ただし、アイテムとは別枠で配置される)

逆に、違う箇所は以下の通り。

  • キャラクターが移動する単位 (プレイヤーなら0.5マス、モンスターだと1ドット単位かな?)
  • メッセージの出し方 (このゲームではデカ文字が使われる事もあって迫力がある)
  • ステータス (このゲームには素早さの概念がある)
  • 戦闘途中の操作の可否 (Bボタンを押すと逃げるかアイテム使用が可能)
  • 戦闘1ターンで出すダメージの回数

RPGのアニメーション挙動や戦闘ルール、パーティ構成の仕組みなど、RPGで個性が出せる各項目や各ステータスをすべて調べたり出したりすることはできないため、何%そっくりか数値化することはできません。

ですが、上述の通り類似点はかなり多く、作り方次第では、WWAカエルの為に鐘は鳴るっぽく再現することが可能では無いでしょうか。

そうでなくても、WWAのゲームを遊んでいたり、作っていたりした人には「おっ?」と思う箇所があるかもしれません。

気になったなら、購入してみよう!価格は411円だ!

www.nintendo.co.jp

ちなみに、WWA COLLECTIONの収録作品には、この「カエルの為に鐘は鳴る」の仕様を持った作品が含まれています。収録作品一覧を見ると分かるかも?

  • Nintendo 3DS任天堂株式会社の商標です。不要じゃないかと思いますが、念の為。

*1:すべてがそうとは限りませんが・・・

*2:アイテムショップは作品によって違ってくるかな?

*3:つまり、弱い敵を倒しても別の画面に戻ってまた来れば復活するわけです。

年末、2018年。

f:id:aokashi:20181231171126j:plain

2018年が終わり、2019年に変わろうとしています。

毎年年末だったらこの年を振り返る形になるんですが、こんなの書いてもあまり見ないかなーと最近思っているので、今年は軽く伝えようかと思います。

  • ThinkPad Yoga 260 が何度も修理出しても治らない
  • インターンシップを始めた
  • 初めて北海道へ旅行に行った
  • WWA COLLECTION の開発に協力した

ThinkPad Yoga 260 が何度も修理出しても治らない

現在、メインで稼働しているデスクトップPC1台とノートPC2台を保有していますが、そのうち1台のThinkPad Yoga 260は度重なる原因不明の故障が相次いでいるため、今は使っていません。

aokashi.hatenablog.jp

aokashi.hatenablog.jp

aokashi.hatenablog.jp

この問題は購入した2016年の11月から起きていて、最初はSSDが認識しない(2101: Detection error on SSD(m.2)) 」とエラーが発生していて、OSが起動できませんでした。

2017年の7月に修理に出し初めて、治ったと思ったら1ヶ月後に故障。今度は自動修復が働いてしまい、Windowsが正常に起動できなくなりました。稼働できても、ブルースクリーンが多発していて、普段使いできる状態にならなくなりました。

f:id:aokashi:20180805011658j:plain

この後修理して、また1ヶ月後に故障して・・・の繰り返しで、6回修理に出しましたが、治る気配は無し。あの後1回Webで修理依頼を出しましたが、受信できませんとの返事が来てしまいました。

今は諦めて3年前に購入したMacBook Proに頼っています。しかし、家族共用のため、ストレージの4割が音楽制作に使われてしまい、仮想環境が作れず、Dockerでイメージが置きづらく、不便を強いられてます

本当に・・・どこが悪いのか特定してほしいです*1

ちなみに、あのPCを購入する前に ThinkPad Bluetooth トラックポイントキーボードを購入しましたが、これはインターン先で利用していますし、故障は今の所起きていません。

aokashi.hatenablog.jp

インターンシップを始めた

去年までスーパーで清掃のバイトをしていたのですが、エンジニアとしてアルバイトをしたほうが楽だと思い6月にはじめました。一応インターンシップという形態で働いています。

しかし、始めるまでが結構大変でした。就職活動をする必要がなかったので面接の練習や就職活動のマナー確認無しで選考に進んだところ、会社からの連絡が来なくなったり、不採用通知が来たりしてつらい思いをしました。

就職活動の練習ぐらいはしたほうが良いと思ったことと、当時の自分が何も方向性も知らずに行動していて後悔したなあと感じています。

それと、スマートフォンXperia Z2からXperia XZ2に機種変更しました。分割支払は携帯料金を親が支払っている都合上、認めてもらえず、一括は高すぎて貯めたお金も全部学費に消えるので4年間同じスマートフォンを使い続けました。ただ、この機種に変えた後にXperia XZ3が発表されましたが、有機EL 6インチディスプレイと大型化したことを見ると少し後悔してます。

初めて北海道へ旅行に行った

部活の都合もあって、初めて北海道に行きました。北海道までは東北本線津軽海峡フェリーで移動しました。

個人的には北海道よりも東北本線(+いわて銀河鉄道青い森鉄道)の移動が印象的で、都心から次第に離れていくと、あっ、車両が3ドアになったなあとか、車両の色が変わったなあとか移り変わりが楽しかったです。そして最終的に青森駅になるとこういう風景になるのか!となってわくわくしてました。

f:id:aokashi:20181231171710j:plainf:id:aokashi:20181231171719j:plain
仙台市地下鉄旭ヶ丘駅津軽海峡フェリー

北海道も見どころがあって

  • すごくうまかった函館ラッキーピエロ
  • 1日1本しか走らない新十津川駅
  • 意外と都会で整備されてた旭川駅
  • 建物の歴史そのものよりも移築して集めたことにパワーを感じた北海道開拓の村

とかもありました。ちなみに北海道の中で一番良かったと感じたのは函館でした。

f:id:aokashi:20181231171754j:plainf:id:aokashi:20181231171826j:plainf:id:aokashi:20181231172025j:plainf:id:aokashi:20181231172643j:plain
函館と南平岸新十津川駅までの移動で見つかった於札内駅小樽市総合博物館の謎のオブジェ・・・

次北海道に行くとしたら、帯広とか根室とかに行ってみたいですね。津軽海峡も次は新幹線で越えてみたいですね。それよりまずお金を集めるところからだが・・・。

WWA COLLECTION の開発に協力した

以下の記事を見てほしいです。WWA COLLECTION は様々な方が協力してできたゲームで、割とできるまで系の記事が分散してしまっているので、いい機会でまとめてみたいです。

aokashi.hatenablog.jp

これに合わせて、兄弟と協力してNintendo Switch買いました。スマブラSPポケモンLet's Go ピカチュウも買いました。楽しい。

最後に

2018年は、去年のトラブルがあって積極的に情報発信ができなかったせいでブログが寂れていたので来年は積極的に情報発信できるようにしたいと思います。あとは外部の情報を鵜呑みにし過ぎて自分にプレッシャーを掛けて失敗することが最近あるので、可能な限りマイペースで進めたいなと。

しかし、卒業研究の発表会が迫っているので、まずはそこを片付けます。

それと・・・インターンシップの件で察しが付いていると思いますが、来年4月からは大学院に進学する予定です。あと2年は続くんじゃ・・・。

それでは、関係者の皆さん(関係者でなくてもいいけど)、来年もお会いしましょうー

*1:ちなみに、最近外付けSSDから起動できないか確かめてたんですが、ダメでした

WWA COLLECTIONを作ったお話

WWA COLLECTIONが配信されました。🎉🎉🎉🎉🎉

WWAとは

ここでは説明しないので、WWA公式サイトのこれとか、自分のサークルにある解説記事とか見てください。

WWA COLLECTIONとは

WWA作品45作品を集めた、Nintendo Switchのゲームソフトです(以降、WWA COLLECTIONのことを今作といいます)。

簡単に言うと、ニンテンドークラシックミニやPlayStation Classicとかの旧作品の詰め合わせを、それっぽく行った感じです。

しかし、専用のハードウェアを用意するのではなく、あくまでゲームソフトという形態を取っています。また、旧作品の詰め合わせかというと、ちょっと誤りがあって、2008年〜2018年で作られた旧作のアレンジと、その作品向けに用意した新作を詰めた形になっています。名作倉庫で出ているWWA作品は入っていないです。ごめんなさい。

www.wwafansq.com

Nintendo Switchで遊べるので、テレビに繋げて大画面で楽しんだり、外出先で楽しんだりできます。

パスワードセーブには対応していない分、各作品のプレイ時間は1時間以内に収めています。Quick Save、Quick Loadにはちゃんと対応しています。

開発について

開発はPLiCyに任せているため、どんな内容なのかは自分もはっきり分かっていないです。

自分はどうしたかというと、以下のように収録作品の制作や今作の企画の協力を行いました。

  • 収録作品の1つ「食べ物を取り戻せ!!」の制作を担当しました。
  • 収録作品の制作メンバーに、今作の開発について説明の協力をしました。
  • 収録作品の制作において、デバッグやアドバイスをしたりしていました。
    • しかし、デバッグやアドバイスは制作メンバーが積極的に行ったため、自分はあくまで補助的な立場だったと思います。
  • 収録作品の1つ「Final Stock Game」(ヒラリラー氏作)の画像周りの修正を担当しました。
  • 公式ページ の制作を担当しました。

食べ物を取り戻せ!! について

f:id:aokashi:20181217144147g:plainf:id:aokashi:20181217145338p:plainf:id:aokashi:20181217145344p:plainf:id:aokashi:20181217145341p:plain
食べ物を取り戻せ!!のスクリーンショット

今作用のWWA作品です。悪い動物に食べ物を持っていかれた地域を救うために、旅行中の主人公が行動するゲームです。

WWAにちょっと慣れてきた」方をターゲットとしています。最初はうろつくモンスターの中を歩くけど、ゲームを進むとダンジョンを探索するという設定になります。ただ、今作を始めたときは開放されておらず、チュートリアルとかの低い難易度のWWA作品をクリアしておくことで開放されると思います。

現代を舞台にしたWWA作品で、なるべく古い時代のアイテムは排除しています。例えば、攻撃力や防御力を上げるものはりんごやぶどうにしたり、武器や防具の概念をなくしたりしています*1

グラフィックは一昨年や去年制作したWWA作品を利用していて、画像素材はすべて自分のもので調達しています。

制作にあたっては、変な行動をした際のメッセージ作成が楽しかった一方で、攻撃力と防御力のバランスや、メッセージ内容の矛盾の確認やその代替策で苦戦しました。

Aokashi Homeに公開する予定は今の所無いですが、それっぽいものを制作しようかなと思っています。

最後に

PLiCyスタッフや収録作品の制作を担当したメンバーの方々、ご協力いただきありがとうございました。🙇‍♂️🙇‍♂️🙇‍♂️

www.wwafansq.com

ということで、今日配信です。是非お買い求めください!

ec.nintendo.com

Nintendo SwitchWWA風のドット絵をおいて終わりにします! 任天堂の商品なので素材として使わず見るだけにしてください!

f:id:aokashi:20181219220556g:plain

*1:しかし、宝箱は宝箱のままです。ダンボールでも良かったのかな...

WWAのアレ

お久しぶりです。前の投稿から半年以上経っていましたが、この間に

  • エンジニアのバイトが見つからなくて絶望的になったり
  • PCが6回も修理に出してもすぐに壊れて、最終的に修理に出せず放置したり
  • そのせいで残りのPCが容量不足とかで不便を強いられたり
  • エンジニアのバイトが見つかって働き始めたり
  • ShufLarをプレイしてたり
  • スマートフォンを4年ぶりに買い替えたり
  • 北海道へ旅行に言ったり
  • 学費を支払うときに所持金の少なさに親に怒られたり
  • せっかく働いた金が全部学費に持っていかれてやる気を失ったり
  • MinecraftのSnapshotで新しい村の建物が凝ってて生成される建物を調査したり

・・・してましたが、これらの記事を書く時間が無く、書こうとしても多分反発受けるんじゃないかとか、他の人がそれっぽく書いてあるからもう良いやとか、そう思って投稿しないまま下書きで放置してました。

ですが、WWA作品を集めたゲームソフトがなんとNintendo Switchソフトとして販売*1することになりましたので、とりあえず報告だけ書こうかなと思ってこの投稿を書きました。

明日配信日です。明日どんな感じで企画してたか、作ってたか報告したいなあと思います。ちなみに、下のページは公式ページです。自分が作りました。💪💪💪

www.wwafansq.com

・・・

と、来月が卒業研究の発表で、9月や10月がサボっていたのが原因で今どうしようかと慌てています。単位落ちて卒業できなかった、という事態にならなければいいけど。

*1:ダウンロード販売のみなので、正確には配信ですが。

WWASAVE.js のdocker対応とフロントエンドの修正を担当しました

WWASAVE.js を docker に対応したり、フロントエンド部分を修正したりしました。

github.com

  • 現時点では develop ブランチにマージしてません。試してみたい方は fix-css ブランチからどうぞ。
  • ちなみに docker 対応とフロントエンド部分修正は1つのブランチでやっちゃいました。ごめんなさい。

WWASAVE.js とは

WWASAVE.js は、WWA Wingのセーブデータを即時に保存できるWebアプリで、hirarira が開発しました。WWAJavaアプレットだった時代に開発された WWASAVE CGIWWA Wing向けに移植したものです。

これまでWWA Wingのゲームを中断したい時はセーブデータを保存するためのパスワードを取得し、一旦テキストファイルに置く必要があります(下図参照)。再開したい時もテキストファイルを読み込む必要があります。

f:id:aokashi:20180419143621p:plain

WWASAVE.js はセーブデータの保存と読み込みを簡単にしてもらえます。中断したいときはゲーム画面にある「保存」ボタンを押すだけ。読み込みたいときは保存したデータをそのまま遊べばすぐに再開できます。

担当したところ

docker 対応

WWASAVE.js を docker-compose に対応しました。これまでWebアプリを動作するには

  1. 実行環境の構築(apache, php, mysql)と設定
  2. Webアプリのソースファイルのダウンロード
  3. (必要に応じて) 1. の設定を元に 2. の設定ファイルを修正
  4. アドレスを打ち込んで接続!

と手間が掛かりましたが、docker-compose だとソースファイルのダウンロードと設定ファイルの修正、コンテナの起動だけで済みます。

docker 自体の詳しい説明は割愛します。扱いにはコンテナやイメージについて知っておく必要がありますが、知っておくと便利です。

フロントエンドの修正

f:id:aokashi:20180419141101p:plain

CSSがヘボいとのことでしたので修正しました。

ボタンやヘッダーなどのCSSコードは、全ては自分の手で入力せずCSSフレームワークBootstrap を使用しました。フロントエンドの修正の中で一番大変だったのは Bootstrap のCSSの配置方法でした。

CSSフレームワークをWebアプリ上で使うには様々な方法があります。

  • CSSファイルを直接配置
    • 今後、CSSファイルのアップデートする際にまたダウンロードする、これは大変
  • CDNCSSファイルを持っていく
    • ネットワーク環境が乏しいと読み込みに時間が掛かる
  • bowerCSSファイルをインストール
    • bower 自体アップデートが行っていないみたいで、Yarnwebpackを使ったほうが良いと案内されている
    • つまり時代遅れ...?

以上のようなことから、アップデートを少ない操作で済ませられる方法として、Yarnとwebpackでjsファイルを作る方向で行きました。しかしながら、webpackの設定ファイルがうまく記述できなかったり、なぜCSSファイルもJavaScriptファイル1つにまとめるのか理解できなかったりして、躓いてました。YarnでインストールしたCSSファイルをコピーで持っていく方法もありましたが、あまり推奨するものではありません。

f:id:aokashi:20180419141702p:plain

production ビルドだとビルドに時間が掛かったり、HTMLの出力が結構見辛かったりと、課題はまだまだありますが、なんとか形にすることが出来ました。現時点では雑に作った感じがしますが、またある程度勉強出来たら、もっと改良してみたいですね。

おまけ: webpack の設定項目名の疑問

ちなみに、CSSを読み込む際に使う css-loader や style-loader を設定する際に、style-loader の記事では対象のファイルを正規表現で指定する項目名が test になっていて、これが不自然に思ってたことがあります。

これについて聞いたところ、どうやら正規表現で指定するメソッド名の test から持ってきたそうです。

developer.mozilla.org