【第22回】Unity工場パズルに設備詳細UIを実装|価格・能力・サイズを比較して選べるゲームへ

機械設計×ゲーム

前回、第21回では、設備能力のバランスを見直しながら、

  • Lサイズの投入機・加工機
  • 2×2設備
  • Low / Medium / Highの3種類のコンベア

を追加しました。

ここまで来ると、ゲームとして使える設備はかなり増えてきました。
自分としては、このまま次に複数ライン化へ進むつもりでした。

投入機や加工機を複数台置けるようにして、

1本のラインを作るゲーム
↓
工場全体を設計するゲーム

へ進めたかったからです。

ところが、ここでChatGPTからこんな提案がありました。

ChatGPT
ChatGPT

「複数ライン化の前に、設備情報を見て選びやすくするUIを入れるのがおすすめです。」

確かに言われてみると、設備が増えたことで、
「結局、どの設備を選べばいいの?」
という問題が出始めています。

そこで今回は複数ライン化を一度後回しにして、
『 設備詳細UI 』を作ることにしました。


設備が増えたことで「選べるけど分かりにくい」状態になった


最初の頃は、

  • コンベア1種類
  • 加工機1種類
  • ストッパ1種類

くらいしかありませんでした。

そのため、プレイヤーは設備を選ぶというより、
必要な設備をそのまま置くだけでした。

しかし現在は、

  • 投入機S・M・Lサイズ
  • 加工機S・M・Lサイズ
  • Low・Medium・Highコンベア
  • ストッパ
  • 出荷場

と、かなり種類が増えています。

しかも設備ごとに、

  • 価格
  • 能力
  • サイズ
  • 安定性
  • 搬送速度
  • 入出口

などが違います。

設備選びそのものがゲームになってきた一方で、
設備名だけを見ても違いが分かりにくいという状態にもなってきました。


ボタン名だけでは設備を選べない

例えば、

  • 投入機S
  • 投入機M
  • 投入機L

というボタンがあったとします。

S・M・Lという違いは分かります。

でも、それだけでは、

  • Sはいくら?
  • Mは何個/s?
  • Lは何マス使う?
  • どれくらい安定している?

までは分かりません。

加工機も同じです。

さらにコンベアも、

  • Low。
  • Medium。
  • High。

だけでは、「どのくらい速さが違って、いくら高くなるのか」がすぐに分かりません。
これでは設備種類を増やしても、プレイヤーが結局なんとなく選ぶゲームになってしまいます。

今回目指しているのは、数値を見て設備を選ぶゲームです。

なら、その数値をちゃんと見せる必要があります。


「説明書」ではなく「設備のスペック表」にする

ここでUIをどうするかも少し考えました。
設備をクリックしたときに、長い説明文を表示する。

例えば、

「この加工機は高性能な大型加工機です。設置には2×2マス必要で……」

のような文章です。

ただ、それだと毎回読むのが面倒です。
今回のゲームでは、設備を何度も比較します。

なので設備詳細UIは、説明書ではなく、
設備のスペック表という位置付けにすることにしました。

プレイヤーが設備をクリックした瞬間、
必要な情報だけをすぐ確認できる。

これを目指します。


右側に細い「設備カード」を表示する

UIの形としては、画面右側へ細長いカードを
表示する形が良さそうです。

設備を選択すると、右側に
スッと設備情報が表示されるイメージです。

例えば加工機Lサイズならこんな感じ。

数字をずらっと並べるのではなく、
一番重要な数値だけを大きく表示するようにします。

『 加工機Lのイメージ図 』


一番大きく見せるのは「個/s」

今回のゲームで、一番重要な数字は何か。

これはかなり明確です。

『 設備能力(個/s)』 です。

  • 投入機なら
    • 何個/s供給できるのか。
  • 加工機なら、
    • 何個/s加工できるのか。
  • ストッパなら、
    • 何個/s流せるのか。
  • 出荷場なら、
    • 何個/s出荷できるのか。

この数字が、ライン全体を考える基準になります。

なので設備カードでも、
例えば、1.30 個/s を中央に大きく表示します。

価格やサイズはその下。まず能力を見る。

そのあと、

「でも高いな」
「2×2か……置けるかな」

と考える。

この順番の方が、今のゲームに合っています。


設備ごとに「主役の数値」を1つ決める

ただし、すべての設備で「個/s」を大きくすればいいわけではありません。

コンベアは少し違います。
そこで、設備ごとに最初に見てほしい数値を1つ決めます。

設備大きく表示する値
投入機供給能力「個/s」
加工機加工能力「個/s」
ストッパ排出能力「個/s」
出荷場最大出荷能力「個/s」
コンベア搬送速度「×0.5 / ×1.0 / ×1.5」

これなら設備をクリックした瞬間、その設備の一番重要な性能が分かります。

細かい情報はその後で確認すればいい。
UIとしてもかなりシンプルにできます。


投入機なら「能力・安定性・サイズ・価格」

例えば投入機Lサイズなら、

表示する情報は、

  • 供給能力:1.20個/s
  • 安定性
  • サイズ:2×2
  • 価格
  • 出口位置

くらいで十分そうです。

一番目立つのは、1.20個/sです。

その下に、

  • SIZE:2×2
  • PRICE:¥○○
  • STABILITY:○○
  • OUT:右下

のように補助情報を並べます。

これなら、投入機MとLサイズをクリックして見比べたときに、
能力差と設置サイズの違いがすぐ分かります。


加工機なら入出口も見たい

加工機Lサイズでは、前回、

入口 → 2×2中央 → 出口

という内部経路も作りました。

そのため加工機カードでは、能力や価格だけでなく、
現在の入口と出口も見られるようにしたいです。

例えば、

IN:左下
OUT:右下

さらに、

左下 ─────→ 右下

のような簡単な矢印表示にしても分かりやすそうです。

Lサイズ加工機は、Rで入口。Fで出口。を変更するため、
設備情報カードを見ながら操作できれば、
「今どこから入って、どこから出る設定なのか?」を確認できます。

これはかなり便利そうです。


コンベアはもっとシンプルでいい

コンベアの場合は、そこまで情報を増やす必要はなさそうです。

例えばHighなら、

高速コンベア

×1.5
搬送速度

PRICE
¥100

SIZE
1×1

くらい。

一番見たいのは、 ×1.5です。

Lowなら×0.5。
Mediumなら×1.0。
Highなら×1.5。

これなら3種類の違いを一瞬で比較できます。


配置前でも配置後でも確認できるようにする

設備詳細UIは、配置済み設備をクリックしたときだけでは少し不便です。

購入する前にも性能を見たい。

なので、

設備パレットで選択したときも、マップ上の設備をクリックしたときも、
同じ設備カードを表示できるようにします。

つまり、買う前に確認もできる。
置いたあとに確認もできる。ということです。

これなら、初心者でも、
「とりあえず買ってみないと性能が分からない」
という状態になりません。


情報を増やしすぎない

設備詳細UIを作ると、ついつい色々な情報を表示したくなります。

  • 設備ID
  • 内部タイマー
  • 処理状態
  • 座標
  • 耐久値
  • 効率
  • 電力
  • 稼働率

など。でも、今回はできるだけ入れません。

プレイヤーが設備選びで必要なのは、
「この設備を使うと何が変わるのか」だからです。

なので現段階では、能力・価格・サイズ・特徴を中心にします。

将来、本当に必要になった情報だけ追加する。
このくらいの方がUIとしても見やすそうです。


「設備カード」でゲーム性そのものを見せる

今回のUIは、単なる便利機能ではないと思っています。

なぜなら、このゲームでは、

  • 安い設備にする?
  • 高性能設備にする?
  • 大きい設備を置く?
  • 高速コンベアを使う?

という、設備選定そのものがパズルだからです。

その設備差が画面から分からなければ、
せっかく性能差を作っても意味がありません。

逆に、設備をクリックした瞬間に、

  • 0.45個/s
  • ¥200
  • 1×1

と見えれば、

プレイヤーは自然に比較します。

「こっちは安い」
「こっちは速い」
「Lは大きすぎるな」

と考える。

設備カードそのものが、ゲームルールを説明するUIになってくれそうです。


数字を見て設計するゲームへ


ここまで設備能力を、「 個/s 」で統一してきた理由も、
今回のUIでさらに活きてきます。

例えば・・・

  • 投入機をクリック。
    • 1.20個/s
  • 加工機をクリック。
    • 1.30個/s
  • 出荷場をクリック。
    • 最大1.50個/s

と表示される。

プレイヤーは、それだけでも、

「この加工機なら投入を処理できそう]
「まだ出荷場には余裕がある」

と判断できます。

これまでの記事で何度も考えてきた、
ライン能力を数字で読むという部分が、
ようやく実際のゲームUIとして見えてきました。


ゲーム画面はできるだけ邪魔しない

設備カードは便利ですが、
常に大きなウィンドウが表示されていると、
肝心の工場が見づらくなります。

そのため、右側に細いカード。

必要なときだけ表示。

選択を解除したら閉じる。

という形が良さそうです。

設備を比較したいときは見る。

ラインを眺めたいときは消える。

ゲーム画面を邪魔しないことも重要です。

今回のUIでは、ユーザビリティとシンプルさをかなり意識していきます。


複数ライン化は、その次へ

今回、自分としては本当なら、複数ライン化へ進むつもりでした。
でも設備詳細UIを先に挟んだことで、設備選びの基礎を一度整理できそうです。

これから投入機や加工機を複数台置けるようになれば、
当然、画面上の設備数もさらに増えます。

そのとき、各設備の能力を簡単に確認できる
仕組みがあった方が、絶対に分かりやすい。

なので今回は、少し地味ですが、
複数ライン化の前準備として設備詳細UIを作りました。


次はいよいよ「複数ライン化」へ

設備情報を見ながら選べるようになれば、次はいよいよ、
投入機・加工機の1台制限を解除していきたいと思います。

S・M・Lサイズを組み合わせながら、1本では足りない能力を、
2本、3本のラインで補う。ここまで来ると、今までの、
「1本の生産ラインを調整するゲーム」から、
「工場全体の能力を設計するゲーム」へ大きく変わってきそうです。

まずは今回、設備をクリックすれば、性能がすぐ分かる。

そんなシンプルな設備情報UIを作って、
次の複数ライン化へ進む準備を整えていきます。

コメント

タイトルとURLをコピーしました