”WoT”を手掛ける世界的ゲーム企業「ウォーゲーミング」のリデザインプロジェクト前編：コモンメニュー

（この記事は、ウォーゲーミングによるリデザインプロジェクト裏話・前編です。後編はこちら）

近年、オンライン上でプレイできるアクションゲーム『World of Tanks』 が、ゲーム界におけるもっとも名誉のある賞の一つであるゴールデン・ジョイスティック・アワード（The Golden Joystick Awards）にStill Playingカテゴリーで受賞しました。これは、ゲーム界のオスカー賞に値するもので、本作は3回目の受賞となります。

『World of Tanks』を開発したのは、オンラインゲーム企業の「ウォーゲーミング」です。彼らによって開発されたアクションゲームは、世界中で1.5億人にプレイされています。そのため、世界中のゲーマーの誰もがプレイしやすいデザインを開発するための今回のリデザインプロジェクトは、非常に魅力的で奥深いものでした。

コモンメニュー（CM）の定義

そもそもコモンメニュー（CM）とは何でしょうか？

コモンメニューとは、世界中のウォーゲーミングの様々なウェブサイトにおいて、ユーザーがより便利にナビゲートするためのグローバルメニューを指します。

主なチャレンジポイント

コモンメニュー（CM）のデザインには、以下のようなチャレンジポイントがありました。

• CMは、それぞれ独自のデザインとレイアウトをもつ多数のウォーゲーミング・ポータルと統合できる必要がある
• CMは、それが独立したコンポーネントであることをユーザーに気づかせないまま、ページのトップに表示される必要がある
• CMは様々なデバイスにて表示されるものである。そのため、大型コンピューターのモニターからスマートフォンやタブレットの小型スクリーンまで対応できる、フレキシブルで機能的なデザインである必要がある

旧バージョンのCM

旧バージョンのCMとは

旧バージョンのCMはグリット形式でそれぞれのゲームを表示しており、ゲームのアイコンをクリックすることでそのゲームポータルにジャンプ出来る仕組みでした。シンプルで無駄がなく、これはこれで十分機能していました。

▲旧バージョンのCM

何が問題だったのか？

問題だったのは、CMに次々と新しいゲームが追加されていくということでした。

新しいあまり馴染みのない多数のゲームの中から目当てのものを探しだすことなく、ユーザーが必要な情報により簡単に素早くアクセス出来ることを目指す必要がありました。

そこで、CMにおける機能の数を増やし、その使用用途を増やすことにしたのです。そしてそれと同時に、旧バージョンのメニューのスタイルは保持する必要もありました。

リデザインプロジェクト

「旧バージョンのCMをそのまま基盤とし、新しい機能を追加すれば良いのではないか？」
このような提案を、多くのデザイナーは今まで耳にしたことがあるのではないでしょうか。

しかしウォーゲームはなぜそうしなかったのでしょうか？

旧バージョンのCMをそのまま基盤とし、新しい機能を追加する、という方向性を我々も最初は検討しました。しかし結果として、情報過多で見難いデザインとなってしまったのです。

以下のような問題があげられました。

• 元々のデザインよりブロックが増えてしまった
• 全てのゲームが表示された一方で、新規リンクのためのスペースが確保できなくなった
• ブロック内に大量のデータがあり、ユーザーが必要な情報を探しにくくなってしまった

新しいCMデザイン

最初の失敗ののち、全く異なるアプローチで視覚的にも新しいものを試すことにしました。新しいデザインの原型はここで生まれたといえます。

試行錯誤ののち、以下のような変更を加えました。

• それぞれのゲームをフルスクリーンで表示されるようにした。こうすることで、ゲーム毎の個性がより出る上にカラフルになり、更にはゲームの詳細情報やリンク（ダウンロード、フォーラム、イベント、その他特別情報などへのリンク）のためのスペースがより確保できるようになった
• ゲームの切り替えを水平方向のリストから行えるようにした。こうすることで、将来の新たなゲームの追加を簡単に行うためのメカニズムを確立した

異なるアートへの挑戦

最終バージョンでは、デザイン上もっとも論理的で明確なエレメントの構成を選択しました。このデザインを、それぞれのゲームデザインに適用することが次のステップです。

そこで、決定したデザインがきちんと機能するかテストするために、ゲーム毎の異なるアートへ適用していきました。

以下、『World of Tanks Blitz』でのテスト例です。

アート部門の挑戦

次のステップでは、ウォーゲーミング のイメージを作成したアーティスト達をプロジェクトに呼び込み、素晴らしいバックグラウンドイメージを作成することに成功しました。新しいバックグラウンドイメージのいくつかは既存のアートに乗っ取っている一方で、今回のCMにあわせた全く新しいデザインも生まれました。

全てのゲームはマーケティング部門によって承認されたロゴやカラーを持っています。以下の例では、アート部門とマーケティングチームによって統合された新しいCMです。

様々なデバイスへの適用

最後に、それぞれ異なるブレークポイントをもつ様々なデバイスへ、この CMを適用していきます。

ベーシックなレイアウトを採用し、PCでは左から右へ表示されるブロックを、モバイルでは上下に表示されるようにしました。また、ブランディングとゲーム毎のスタイルを維持し、それぞれのアートが表示されるように調整されました。

▲PCで水平方向にレイアウトされるゲームリストを、モバイルなど小さなスクリーンでは上下に表示されるように改良

▲モバイルデバイス上でのデザイン

ユーザーの利便性を考慮し、デフォルトでは決まった数のゲームのみリストに表示されるようにしました。ユーザーがリストをタップした場合のみ、全てのゲームが表示される仕組みがとられています。

今回のデザインプロジェクトの学び

今回の複雑かつワクワクするプロジェクトを終えて、いくつかの学びがあったので紹介します。

1. インスピレーションを探すこと
   さまざまな問題に対して新しい解決策を提示することを恐れないようにしましょう。古いレイアウトやグリットシステムからは卒業し、新鮮なアプローチで物事に取り組むべきです。
   もしあなたがゲーム会社に勤めているのなら、自社のゲームをもう一度プレイし、ガイドラインを勉強し、同僚がしていることに気を配り、世界のトレンドを意識してみましょう。最も成功したテキスト、アイコンやアートなど、使用するリソースから良いエレメントを選択肢、それらをジグソーパズルのように組み合わせることで全体として筋の通ったものを作りましょう。
2. たまには頑固になること
   頑固さは、デザイナーにとって強みにも弱みにもなります。例えばクライアントやチームなどが、古いデザインの一部のみを変更するように言ってきたとしましょう。その時、もっと良いものを一から作れる確信があるのならば、それをやってみるべきです。
   古いデザインと新しいプロトタイプを比べて、その違いがよくわかるように提示しましょう。仕事は増えるかもしれませんが、その分の価値があるはずです。
3. 批判を受け入れること
   自身の仕事に誇りとプライドを持つデザイナーであればあるほど、「良い仕事」をビジネスディレクター、アートディレクター、チームによって却下されると不満を感じることがあるでしょう。しかしこうした場合、大抵はそのデザイナーは良いデザイナーではありません。
   批判は、ほとんどのケースにおいて仕事の質や進捗に良い影響を与えます。疲れて思考が止まってしまったり、物事がよく見えなくなった時に、質の高い批判は力強いパワーを持ちます。「全てだめだ！」という質問に対しては、具体的な質問を返しましょう。ここから、プロジェクトの突破口が見えてきます。
4. 全体像を把握すること
   デザインとは問題を解決する仕事です。特定の課題に固執する以前に、なぜその要望が出てきたのかの元々の理由と今後の展開を理解するべきです。
   会社はどこへ向かっているのか？デザインに関連する課題は何か？ユーザーは一つの言語を使い続けるのか、それともローカライゼーションが進むことが考えられるのか？など、全体像を理解するための問いを投げ続けましょう。
   
5. 自分の原則を守ること
   クリエイティブに働くためには、デザイナーは自分の信条を守る勇気を持つべきです。あなたの原則の強さは、才能と共にあなたのクリエイティブな能力の源となるでしょう。

（翻訳：Mariko Sugita）

後編はこちら↓