TV・映像、Web、広告・出版などのクリエイター･エージェンシーを行う株式会社クリーク･アンド･リバー社と、スマートフォン向けゲームの開発運営を行っている株式会社f4samuraiは8月29日（水）、「デザイン塾×マギアレコード～UI／UXのケーススタディ【実践編】～」を開催しました。

本イベントでは、今年8月22日にリリースから一周年を迎え、iOSアプリストアのセールスランキング1位を獲得した大人気スマートフォンゲーム、『マギアレコード 魔法少女まどか☆マギカ外伝』（以下、『マギアレコード』）のプロデューサー（佐藤氏）とUI／UXの現場リーダー（大橋氏）が登壇。デザイン技術と開発における日々の学びについてお話しいただきました。

ユーザー、そして開発者にとってのBESTを目指すf4samurai

「『世界に、“一番のワクワク”を届ける』という企業理念を持つf4samuraiでは、売上よりもユーザー様にとっての一番、そして自分たちにとってのベストを目指してゲームをつくっています」。
そう語るのは、マギアレコードのプロデューサーを務める佐藤氏。開発者が楽しいと思えなければ、ユーザーにもワクワクできるものを提供できないという考えのもと、チーム一丸となって開発を行っているといいます。

2014年に設立したf4samuraiは、社員数140名ほどの制作会社ですが、今年8月にオフィスを移転、200名以上のキャパシティのある場所で再スタートを切りました。シナリオとイラスト、背景周りの専任チームを社内にもつというf4samuraiは、開発に特化した組織として業界内で地位を確立しています。

そんなf4samuraiに集まるのは、「ゲームを作ることに集中したい人」「開発することが好きな人」だと、佐藤氏は話します。新規の大型タイトルの開発にも着手をしていることも説明し、デザイナーの募集をより積極的に行っているそうです。それを端的にまとめた行動指針8か条を説明すると、「これに当てはまる人であれば、いつでも入社できます」と参加者に向けてf4samuraiへのジョインを誘いました。

▼f4samurai行動指針8か条
https://www.f4samurai.jp/company/identity/

UIがつくる『まどか☆マギカ』らしさとは？

続けて佐藤氏は、「『マギアレコード』の開発において、『まどか☆マギカ』らしさとは？　という考え方が軸になっている」と語ると、UI開発の裏話を紐解き始めました。

「希望と絶望、両方あるテーマの中でどちらを選ぶべきか。バトルありの格好いい路線を進むのであれば、「絶望」に寄ったダークなUIになると当初は考えました」と説明すると、実際に開発初期はダークファンタジー路線であったことを参加者に打ち明けます。しかし、魔法少女の育成を楽しむゲームであり、それを「絶望」に結びつけるべきでないこと、毎日遊んでもらうゲームでありたいという観点から、「魔女にならない街・神浜市」を舞台に、魔法少女たちから絶望を切り離す方向性にシフト。ユーザーに毎日楽しく育成とやり込みをしてもらうことをUIのコンセプトに再始動しました。またUIに使われている素材は、年齢の高い方が遊ばれても違和感がないよう、シンプルにみえて、質感や統一感など、注目しなければ気づかれないような部分で作り込みを行っている、というお話もありました。

『マギレコ』成功の秘訣は、誰でも改善提案できる業務環境

「UIデザインは一般的なユーザー様にとってプレイする動機にはならない代わりに、離脱する要因をもっとも作りやすいセクションです」。
そう話すのは、『マギアレコード』でUI／UXのリーダーを務める大橋氏。
一般的なスマートフォンゲームにおいて、魅力的なシナリオとキャラクターはユーザーにとってプレイする動機になりますが、「キャラクターはすごく可愛いのにUIがイケてない」「シナリオは魅力的だけどスムーズに操作できない」というストレスは離脱の原因になります。そのことを、セミナーに先駆けて参加者に再認識してもらうと、『マギアレコード』におけるゲーム内イベントの静止画デザインや、UIの改善・改修業務について、そのフローや注意点について話し始めました。
本稿では特にUI改善業務について触れていきます。

『マギアレコード』ではどんな小さな改善でも積極的に取り入れ、ユーザーから高い評価を得ています。その評判はSNSで「マギレコさんはアップデートの度に改善しないと死んじゃうの？」と書かれたことも。「もちろんそんなことはないのですが、途切れさせてはいけないと思っています（笑）」と大橋氏がコメントすると、参加者からは自然と笑みがこぼれました。

そのような改善ができる背景には、「職種関係なく誰でも改善を提案し、進めることができる」というf4samurai独自の業務環境が深く関わっています。
［改善提案］⇒［画面設計（プロトタイプ作成）］⇒［デザイン］⇒［実装］⇒［テスト］という、改善フロー自体はどの会社でも見る一般的な流れですが、f4samuraiの場合、改善提案や画面設計をどの職種の誰がやらなければいけないという決まりはありません。「言い出した人がやる」という社風から、誰もが積極的に改善に参加することができるので、無駄な待ち時間を必要とせずにユーザーが求めるアップデートを提供できるのだといいます。

では、実際にどのような改善が過去に行われたのでしょうか。セミナーでは、その具体例をご紹介いただきました。

改善案①エンジニア発案で改善を行った例

課題：欲しい強化素材がどのクエストでドロップするのか探すのが面倒

⇒素材別のクエスト一覧の追加
⇒強化素材を使用する画面から逆引き画面へのリンクを追加

この改善では、「ユーザーが必要としている時に、必要としている機能や情報を追加するのはユーザビリティの基本」という考えのもと、強化素材を使用する画面に素材の逆引き画面へのリンクを追加して、素材が足りない場合に攻略サイトを見なくても済むようにしました。
本改善でUIデザイナーは、エンジニアと詳細を詰め、プロトタイプの作成を行っています。

改善案②デザイナー発案で改善を行った例

課題：1キャラにつきメモリア装備枠が最大4つあるため、チーム編成に時間がかかる

⇒1画面内で4つの装備枠をセットできるように改善
⇒あらかじめ装備の組み合わせをセット登録できる機能を追加、装備時に登録したセットを呼び出せるように改善

マギアレコードでは、魔法少女一人につき4つのメモリアを装備することができます。改善前では、一つ装備するごとに編成画面と装備画面を行き来しなければならず、最大で16回行き来していました。これを一画面で4つの装備ができるようにして、さらに、装備内容の保存と呼び出し機能を追加しました。
既存のゲームを参考にすることは完成への近道であることは確かですが、それが結果的に不便なものになることは多い。最終的に開発しているゲームに沿った形でチューニングしなければいけないと思った事例です。

『マギアレコード』では、プロトタイプの作成にAdobeXDを使用しています。大橋氏曰く、言語化しづらいイメージの共有がすぐにできて、チーム全体で共有すべき課題の洗い出しも容易にできる便利なツールなのだとか。Excelで設計仕様書を作成する会社もあるようですが、それでは、読み手によって認識の齟齬が起きてしまい、のちのち大きな問題に発展してしまう可能性もゼロではありません。実際に触れることができるプロトタイプをつくることで齟齬をなくし、開発メンバーに「これならできそう」とイメージをもってもらうことで、意思決定の時間を短縮しているのだといいます。

また、便利なツールを用いることも確かに大事ですが、それよりも開発メンバーの技術力やモチベーションはUI改善やゲームそのものの方向性を大きく左右すると大橋氏は強調します。

たとえば、大きな改善であれば、既存の機能を壊さない画面設計力や安定した動作を可能にする技術力が問われ、細かい改善であれば、どんな些細なことでも改善しようとするモチベーションが必要とされます。f4samuraiでは、全社部門を横断してUI/UXの改善意見を募り、担当部署以外の意見もユーザー視点で取り入れることで、アプリをより良くするよう努めているそうです。

「ゲームはユーザー様がいなければ終わってしまいます。使いづらかったUIでも辛抱強くプレイしてくれたユーザー様方がいたからこそ、今日まで続けてこられたのだという感謝の気持ちをもって、既存もしくは新規のユーザー様に信頼してもらえる改善を行っていきます」とセミナーが締めくくられると、会場からは盛大な拍手が送られました。

株式会社f4samuraiとは

2010年設立、「世界に、“一番のワクワク”を届ける」をミッションとして、スマートフォン向けゲームの企画・開発・運営を行っております。

《代表的なタイトル》

  • 大人気アニメの外伝RPG『マギアレコード 魔法少女まどか☆マギカ外伝』
  • 海外版も好調。800万DLを突破したオリジナルRPG『オルタンシア・サーガ -蒼の騎士団-』
  • アニメ化もされた美少女バトルRPG『アンジュ・ヴィエルジュ～ガールズバトル～』

『マギアレコード 魔法少女まどか☆マギカ外伝』とは

2017年8月にリリース。
大人気アニメ『魔法少女まどか☆マギカ』のストーリーから分岐した新たな物語が展開するオリジナルスマホRPG。
開発・運営をf4samuraiで担当し、キャラクターデザインやアニメーション等で原作アニメの制作陣が多数参加する作品。

お問い合わせ

株式会社クリーク･アンド･リバー社
デザイン塾担当
TEL：03-4570-7087　平日10時～18時
Email：rteam_dg@hq.cri.co.jp