みなさまこんにちは。
アメーバピグ（以下ピグ） でFlashディベロッパーをしております、
2012年入社のスズキヨシフミと申します。
私の所属するチームでは、ユーザビリティ向上のために既存機能のUI改修や
基盤部分の新機能開発、運用などを行っています。
今回は、前回 の鈴木彩夏さんに引き続き、
ピグのミニゲームとしてリリースされたピグ麻雀についてご紹介します。
技術的な真新しさはありませんが、一つのプロジェクトのリリースまで、
フロント面を一から作り上げる過程を感じ取っていただけたら幸いです。
2012年新卒入社の、デザイナー、ディベロッパー、エンジニアの各一名ずつでした。
麻雀は非常に複雑な通常のルールに加え、ローカルルールがあり、それらを採用するかどうかはサービス毎に異なります。（トランプの大富豪でいう8切りや11バックなどのルールです）
これらのルールの選定は麻雀ゲームとしての面白さに直結する部分であり、非常に難しいものでした。
詳しい人にアンケートをとったり、他のサービスのルールを調査することも大事ですが、私たちは実際に雀荘に通い、その場の雰囲気や卓を囲んでいる楽しさを体感し、それをいかにオンラインで表現するかを考えながら、ゲームの企画をしていきました。また、プロジェクト管理については、責任者として開発を任される機会を得る事ができたことも、とても貴重な経験でした。
「こういう世界観で統一していきたいね」
「あのエリアで出しても面白いんじゃない？」
といった会話もあり、今後新しい世界観で作る時のために、大きな改修を行わずにリリースできるようにしました。
例えば、前回の記事 では麻雀牌のフォントデザインについて触れていましたが、仮にもっとポップな文字と柄のものをリリースしたいとなった時に、麻雀牌のflaデータをコピーする、又は作り直すとなっては非常に手間が掛かります。
そこで麻雀牌のアニメーションが入った牌のベースとなるデータと全ての柄が入ったデータを分けて作成しました。
上記の構成にすることで、柄のデザインができるだけでアニメーションの入った別の麻雀牌を簡単に置き換えることができます。また、UIや演出部分についても同様に設計されており、色味や読み込むUIを、エリアに置かれている麻雀卓の家具の設定データを変更するだけで反映させることができます。
企画やキャラクター等とのコラボレーションが多いピグにとっては、このような運用を考えた開発が後々の拡張性や開発効率に大きく影響し、スピード感を持って開発を進めることに繋がるのだと思います。
・ギャンブル
・リアルさ
といったイメージが強かったです。私は元々ギャンブルが好きだったこともあり、高揚する演出はユーザとして数多く目にしていたので苦労せずに進められると思っていました。
こちらは麻雀のリアルな倒れる感じを表現した牌の動きですが、ゲームの流れの中で目にするとこの部分だけに生々しさが残ってしまい、ピグのゲームとしての全体的なリズム感が崩れてしまいます。
そこで最終的な完成イメージに近いものがこちらになります。
・麻雀牌の倒す時のワクワク感を保つ
・ピグらしくポップさのある動き
・UIとして場の構成を破綻させずに魅せる
アニメーションを作る過程では、違和感のない動きに加えてその世界観にマッチした演出、デザイナーのデザインを忠実に表現する事の難しさを体感しました。
また、モック作成の段階で出てきた演出のアイディアを実装し、わかりづらさやゲームの流れの中での問題点を早期に解決できた、「ポン」の一例をあげたいと思います。
こちらが改善前の演出、
こちらが改善後の演出になります。
一見改善前の演出の方が大きく目立ち、アバターが表示されるのでわかりやすく感じられるかもしれませんが、この「ポン」とは簡単に説明すると相手の捨てた牌を持ってくる行為であり、ここで重要なのは誰が、どこにいる人がしたのかということ、またゲームにおいてそこまで重要な局面ではない事から他の重要な演出との差別化をはかり、テンポ感を壊さないことの方が重要となります。
このように、実際に動かしてみないと気付きにくいことにもモックの段階から演出のパターンを比較して、ゲーム全体のバランスを調整していきました。
最後までお読みいただき、ありがとうござます。
引き続きアメーバピグ を宜しくお願い致します！
アメーバピグ（以下ピグ） でFlashディベロッパーをしております、
2012年入社のスズキヨシフミと申します。
私の所属するチームでは、ユーザビリティ向上のために既存機能のUI改修や
基盤部分の新機能開発、運用などを行っています。
今回は、前回 の鈴木彩夏さんに引き続き、
ピグのミニゲームとしてリリースされたピグ麻雀についてご紹介します。
技術的な真新しさはありませんが、一つのプロジェクトのリリースまで、
フロント面を一から作り上げる過程を感じ取っていただけたら幸いです。
麻雀の開発について
今回このプロジェクトの立ち上げを担当した開発メンバーは、2012年新卒入社の、デザイナー、ディベロッパー、エンジニアの各一名ずつでした。
麻雀は非常に複雑な通常のルールに加え、ローカルルールがあり、それらを採用するかどうかはサービス毎に異なります。（トランプの大富豪でいう8切りや11バックなどのルールです）
これらのルールの選定は麻雀ゲームとしての面白さに直結する部分であり、非常に難しいものでした。
詳しい人にアンケートをとったり、他のサービスのルールを調査することも大事ですが、私たちは実際に雀荘に通い、その場の雰囲気や卓を囲んでいる楽しさを体感し、それをいかにオンラインで表現するかを考えながら、ゲームの企画をしていきました。また、プロジェクト管理については、責任者として開発を任される機会を得る事ができたことも、とても貴重な経験でした。
運用を見据えた開発
私がピグ麻雀開発時、特に心掛けていたディベロップメントのポイントは、サービスの今後の拡張性です。麻雀ゲームはローカルルールが変わることはありますが、基本的にゲーム自体が大幅に変わることはありません。そのため、リリース後に継続してユーザに楽しんでもらうための一つの運用方法として、麻雀ゲームの面白さに加え、ピグの特徴であるエリアや世界観を最大限に活かしたいと考えました。企画の段階でもゲーム自体の方向性を考える際に、「こういう世界観で統一していきたいね」
「あのエリアで出しても面白いんじゃない？」
といった会話もあり、今後新しい世界観で作る時のために、大きな改修を行わずにリリースできるようにしました。
例えば、前回の記事 では麻雀牌のフォントデザインについて触れていましたが、仮にもっとポップな文字と柄のものをリリースしたいとなった時に、麻雀牌のflaデータをコピーする、又は作り直すとなっては非常に手間が掛かります。
そこで麻雀牌のアニメーションが入った牌のベースとなるデータと全ての柄が入ったデータを分けて作成しました。
上記の構成にすることで、柄のデザインができるだけでアニメーションの入った別の麻雀牌を簡単に置き換えることができます。また、UIや演出部分についても同様に設計されており、色味や読み込むUIを、エリアに置かれている麻雀卓の家具の設定データを変更するだけで反映させることができます。
企画やキャラクター等とのコラボレーションが多いピグにとっては、このような運用を考えた開発が後々の拡張性や開発効率に大きく影響し、スピード感を持って開発を進めることに繋がるのだと思います。
ピグらしさのある演出
次に、麻雀の重要なポイントであるツモやポンといったユーザの重要な行為と麻雀牌の動きなどの演出表現をどうまとめていったかをお話ししたいと思います。企画段階で、様々な麻雀コンテンツを見ていた際に感じた事としては、・ギャンブル
・リアルさ
といったイメージが強かったです。私は元々ギャンブルが好きだったこともあり、高揚する演出はユーザとして数多く目にしていたので苦労せずに進められると思っていました。
こちらは麻雀のリアルな倒れる感じを表現した牌の動きですが、ゲームの流れの中で目にするとこの部分だけに生々しさが残ってしまい、ピグのゲームとしての全体的なリズム感が崩れてしまいます。
そこで最終的な完成イメージに近いものがこちらになります。
・麻雀牌の倒す時のワクワク感を保つ
・ピグらしくポップさのある動き
・UIとして場の構成を破綻させずに魅せる
アニメーションを作る過程では、違和感のない動きに加えてその世界観にマッチした演出、デザイナーのデザインを忠実に表現する事の難しさを体感しました。
また、モック作成の段階で出てきた演出のアイディアを実装し、わかりづらさやゲームの流れの中での問題点を早期に解決できた、「ポン」の一例をあげたいと思います。
こちらが改善前の演出、
こちらが改善後の演出になります。
一見改善前の演出の方が大きく目立ち、アバターが表示されるのでわかりやすく感じられるかもしれませんが、この「ポン」とは簡単に説明すると相手の捨てた牌を持ってくる行為であり、ここで重要なのは誰が、どこにいる人がしたのかということ、またゲームにおいてそこまで重要な局面ではない事から他の重要な演出との差別化をはかり、テンポ感を壊さないことの方が重要となります。
このように、実際に動かしてみないと気付きにくいことにもモックの段階から演出のパターンを比較して、ゲーム全体のバランスを調整していきました。
最後に
以上がディベロッパーとして一つのサービスのリリースまでに学ぶことができたことです。最後までお読みいただき、ありがとうござます。
引き続きアメーバピグ を宜しくお願い致します！