>   >  新人講師がゼロから挑むUnityによる人材教育:No.09:レベルデザインで変わるゲーム体験
No.09:レベルデザインで変わるゲーム体験

No.09:レベルデザインで変わるゲーム体験

ゲーム専門学校の新人講師がUnityを勉強しながら、「ゲームのおもしろさとは何か」について授業を行う泥縄式レポートの第九弾。水先案内人になるのがユニティ・テクノロジーズ・ジャパン(以後、ユニティ)から提供中の無料教材「あそびのデザイン講座」だ。今回はスタート画面からリザルト画面までの一連のながれを実装しつつ、試遊会を実施するまでの過程をレポートする。

TEXT_小野憲史 / Kenji Ono
EDIT_尾形美幸 / Miyuki Ogata(CGWORLD)

ワイヤーフレーム演習と組み合わせる

月日の経つのは早いもので、あっという間に2019年になってしまいました。皆さん、如何お過ごしでしょうか? 泥縄式授業が身上のゲームジャーナリスト兼、専門学校東京ネットウエイブ非常勤講師の小野憲史です。自分はといえば、なんとか2018年の授業が12月21日で終了し、ほっと一息といったところ。まだ2019年も3回ほど残っているのですが、2018年度も終わりが見えてきたかなという感じです。

ちなみに皆さん、去年はどんな年でしたかか? 自分にとっては最初から最後までUnityのスクリプトが吐き出すエラーに悩まされ続けた1年だったように思います。それでも、何回も何回も「あそびのデザイン講座」の内容を繰り返すうちに、だんだんとスクリプトの作成にも慣れてきて、簡単なエラーなら自分で直せるようになりました。いやはや、継続は力なり、ですね。

▲授業の模様


さて、2018年の授業は「あそびのデザイン講座 第11回」を残すのみとなりました。ここで学ぶのはスタート画面からゲームを実際にプレイして、リザルト画面が表示されるまでの、一連のゲーム体験におけるプロセスです。具体的には難易度別に2つのステージをつくり、それらをスタート画面とリザルト画面でサンドイッチして、実行ファイルに書き出すまでのやり方を学ぶことになります。


これをいつものように「スクリプト篇」と「レベルデザイン篇」に分けて、授業で進めていきました。そのためにはスコアやタイムもさることながら、スタート画面に戻る「MENU」ボタンや、ステージクリア後に次のステージに移動する「Next Level」ボタンなど、ビジュアルUI(ユーザーインターフェイス)や画面遷移の概念が必要になってきます。そこで、座学篇で合わせて解説することにしました。

11月30日 あそびのデザイン講座 第10回「『リザルト』と『ハイスコア』」【レベルデザイン篇】
ハイスコアが保存・更新され、リザルト画面で表示されるようになったことで、ゲーム体験がどのように変化するか確認し、それに適したレベルデザインを工夫する。

12月07日 あそびのデザイン講座 第11回「シーケンス」【スクリプト篇】
スタート画面からステージ1、ステージ2、リザルト画面にいたる一連のながれを組み立て、実行ファイルにビルドする。

12月14日 あそびのデザイン講座 第11回「シーケンス」【レベルデザイン篇】
ひとまずビルドができるようになったところで、改めて低難度のステージ1、高難度のステージ2を作成し、実行ファイルにビルドしなおす。

12月21日 試遊会

▲筆者が自作した第11回のプレイ動画


すでに前回の連載で解説した通り、遊びやすいゲームには「自機」「ゲーム世界」「コントローラー」との間で相互関連性が見られます。その中でも気付きにくいのが、ゲーム世界とコントローラーの関係性です。これは一般的に入力コントローラーとビジュアルUI(=HUD)の関係性とに置き換えられます。ひらたく言えばコントローラーの特性に合わせたメニュー画面をつくる必要がある、というわけです。

もっとも、実は「あそびのデザイン講座」で制作するピンボールゲームは、両者の関係性があまりよくないんですね。というのも本演習では操作に「カーソルキー」と「マウス」が併用されているからです。そのため、普通につくると画面のあちこちに「MENU」「Next Level」といったメニュー類が散らばることになります。それでも、あまりストレスを感じずにプレイできるのは、マウスで操作できるからです。

ただ、本ゲームでは自機をカーソルキーで操作します。そのため、本当だったらメニューもキーボードから手を放さずに操作させるべきなんですよね。そのためにはメニューもカーソルキーで選択しやすい配置にして、キーを押したら反応させたいところです。とはいうものの、今からスクリプトを改造するのは少々、荷が重い。そこでUnity演習に合わせて、ワイヤーフレームのグループ演習をしてもらうことにしました。

ワイヤーフレームとはIT業界でよく使われる専門用語で、ひらたく言えばwebページのレイアウトを定める設計図のことです。画面のどこにどんな情報を配置して、どのボタンをクリックすると、どの画面に遷移するのか、といったことを紙・鉛筆・付箋などを使ってデザインしていきます。ホワイトボードや模造紙を使って、必要な画面を必要な枚数だけ書き、それぞれを矢印でつないでいくのがポイントです。

※本格的なワイヤーフレームの作成ではパワーポイントや専用ツールを使用しますが、ここでは紙ベースで簡易的にすませています。ワイヤーフレームのテンプレートはWeb上で様々なものが公開されています(例:www.wireframeshowcase.com/)。

その上で本演習では、「仮に今つくっているピンボールゲームをスマートフォン上で楽しめるようにしたら」というテーマのもと、スタートからリザルトまでの必要な画面をあらかじめ用意したものを配布しました。そして、画面遷移図にメニューやボタンを加えて、それぞれを矢印でつないでいってもらいました。また、新たに「バーの耐久度」と「ショップ画面」というメカニクスを加えてみました。


このようにゲームのビジュアルUIはメカニクスが固まらなければデザインできません。その上でメカニクスは特定のユーザー体験の創出、すなわち「おもしろさ」の創出のためにデザインされます。つまり、ゲームのビジュアルUIはおもしろさを創出する手段のひとつだと位置付けられます。すなわちIT業界でよく言われる「UI/UX」(ユーザー体験に基づくUIデザイン)の考え方が重要になるというわけです。

なんだか、当たり前のことを言っているような気がしますが、実はこれって、非エンタメ領域では革新的な考え方だったんですね。銀行ATMの操作パネルは好例で、すべてのボタンが同じ大きさで配置されており、操作に迷いやすい製品が当たり前でした。UIとUXがバラバラにデザインされていたからです。これが変わってきたのは、iPhoneの登場以降のこと。企画志望の学生なら、こんなところも意識してほしいなあと思います。

※スライド内の画像は、以下のWebサイトより引用させていただきました。
www.rakuten-bank.co.jp/guide/cashcard/atm.html
www.shikokubank.co.jp/newsrelease/4584.html


次ページ:
トラブル続きの試遊会開催

その他の連載