レイアウトツールでUIを作る！【Bakinでゲーム開発】

どこここゲーム開発チャンネル

13 Apr 202312:01

Summary

TLDRこの動画では、RPG開発者がゲームのUIデザインと実装について話しています。特に主人公の表情とライフゲージ、バッテリーゲージの表示方法に焦点を当てています。ライフゲージは被ダメージを直感的に判断できるように数値ではなくゲージの減少だけを表示する仕様にしています。バッテリーゲージはゲームの重要な要素で、時間経過で減少し、ステータス異常にも影響します。UIの拡張性についても触れており、アイテムを集めることで最大値が増やせるなどの成長要素を今後追加する予定です。レイアウトツールの使い方やイベントの設定方法も説明しており、ゲームの完成に向けてのプロセスが分かります。

Takeaways

🎮 この動画は、RPG開発者がゲームのUIデザインについて進捗報告を行っている内容です。
🖼️ UIに主人公のイラストとヒットポイントゲージ、バッテリーゲージを配置し、プレイヤーの視覚的フィードバックを強化しています。
🐭 被ダメージ時のヒットポイントゲージの減少と主人公の表情の変化を実装し、プレイヤーに状況を直感的に伝えています。
🔋 バッテリゲージはゲームの重要な要素で、時間経過や特定のアクションによって減少するように設計されています。
🌐 ヒットポイントとバッテリーゲージには拡張性を持たせ、アイテムの集め方などによる最大値の増加を予定しています。
💰 所持金の表示は、獲得時にフェードアウトするようにして、プレイヤーに金銭の増減を視覚的に伝えています。
🛠️ UIのレイアウトは刃牙のレイアウトツールを使い、簡単に管理・編集が可能です。
🎨 ゲーム内のイベントや状態異常を視覚的に表現するアイコンやキャラクターの変化を細かく調整しています。
🔧 ゲームのUIデザインには、デフォルトのメーター画像をカスタマイズし、ゲームのテーマに合わせた画像を使用しています。
🌟 この動画では、UIデザインの柔軟性とカスタマイズの自由度を高めるためのレイアウトツールの強さを強調しています。

Q & A

どのようなゲームのUI開発について話されていますか？
-探索アドベンチャーゲームのUI開発について話されています。
UI開発で苦手と感じている部分は何ですか？
-主人公の考慮やゲーム制作において避けられないUIの設計が苦手と感じられています。
ゲーム内のヒットポイントはどのように表示されますか？
-赤いゲージで表示され、ネズミに襲われると減少し、マルタの表情が変わります。
バッテリーゲージは何を表していますか？
-ゲームの肝となるバッテリーゲージで、何もしなくても時間経過で減少します。
ヒットポイントとバッテリーにはどのような拡張性がありますか？
-特定のアイテムを集めることで最大値が増やせる拡張性が設けられています。
所持金の表示はどのように実装されていますか？
-お金を手に入れた数値だけプラスで表示され、そのままフェードアウトします。
レイアウトツールの機能についてどのように説明されていますか？
-レイアウトツールを使ってUIを管理し、移動中もHPとMPのゲージを表示できるように設定しています。
デフォルトメーターの背景画像はどのように使われていますか？
-ゲージの伸びる部分と変わらない部分を分けて使用され、画像の分割とスライスがウィンドウで行われています。
イベントのテンプレートを使用して何を実装しましたか？
-イベントのテンプレートを使用して所持金の表示を実装し、木箱を調べると所持金が増える処理を追加しました。
マルタの顔グラフィックはどのように管理されていますか？
-コモンイベントでイメージを使用して管理されており、メッセージウィンドウに直接顔グラフィックを表示する必要がなくなりました。
UIデザインの変更はどのような影響を与えていますか？
-UIデザインの変更により、メッセージウィンドウに顔グラフィックを表示する必要がなくなり、吹き出し式の表示が可能になりました。

Outlines

00:00

🎮 UIの実装とゲームの進捗

RPG開発の進捗報告を行い、特にUIの実装に苦労した点を説明。主人公のキャラクターデザインからゲーム内のヒットポイントとバッテリーのゲージの実装まで、1週間かけて完成させた。ヒットポイントは数値でなくゲージの減少感でプレイヤーにダメージを伝え、バッテリーはゲームの重要な要素として扱う。さらに、ヒットポイントとバッテリーには成長要素を加える予定で、特定のアイテムを集めることで最大値が増やす。

05:03

🛠 レイアウトツールの活用とカスタムUIの作成

刃牙のレイアウトツールを使ってUIを実装し、ゲームのイベントや状態変化を表示する方法を解説。ヒットポイントの減少やバッテリーの残量をUIに反映させる方法、さらには所持金の表示方法も説明。レイアウトツールを使ってカスタムUIを作成し、ゲームのさまざまな状態を視覚的に表現する。

10:05

🌟 UIの拡張性とデザインの柔軟性

ヒットポイントとバッテリーのUIが拡張性を持っていることを強調し、ゲームの進行に合わせて成長する要素を紹介。レイアウトツールを使って斜めのゲージやカスタムデザインを実装し、より自由なデザインが可能であることを示す。また、UIデザインの変更によりメッセージウィンドウに顔グラフィックを表示する必要がなくなり、吹き出し式のイベント演出が可能になった点を触れる。

Mindmap

Keywords

💡RPGデベロッパー

RPGデベロッパーとは、ロールプレイングゲーム（RPG）を開発する人のことです。このビデオでは、RPGの開発者がファンからの募金を通じてゲームを制作する進捗を報告しています。RPGデベロッパーは、ストーリー、キャラクター、ゲームシステムなど、ゲームの様々な要素を設計し、開発に携わります。

💡UI

UIとは、ユーザーインターフェースの略で、コンピュータやゲームの操作画面のデザインを指します。ビデオでは、UIの設計がゲーム制作において避けられない重要な要素として触れられ、開発者が苦手意識を持っていたものの、ゲームの進行状況を視覚的に表現するために実装を進めています。

💡ヒットポイント

ヒットポイント（HP）は、ゲームのキャラクターが受けるダメージを示す指標であり、0になるとキャラクターは死亡または戦闘不能になります。ビデオでは、ヒットポイントが減少することでキャラクターの状況を表現し、プレイヤーに直感的な判断を促すため、数値ではなくゲージで表現しています。

💡バッテリー

バッテリーは、ゲーム内のエネルギー源やリソースを意味しており、ビデオではその重要性と成長要素として触れられています。バッテリーの量は時間経過で減少する一方、特定のアイテムを集めることで拡張可能で、ゲームの進行に影響を与える重要な要素です。

💡成長要素

成長要素とは、ゲーム進行に伴いキャラクターやアイテムの能力が向上するゲームの仕組みです。ビデオでは、ヒットポイントやバッテリーの最大値が増加するような成長要素が、ゲームの魅力を高めるために追加される予定と説明されています。

💡レイアウトツール

レイアウトツールは、ゲームのUIを作成するためのソフトウェアツールであり、ビデオではその使い方と利便性が強調されています。開発者はこのツールを使って、ゲーム内の各種ゲージやステータスの表示を設計し、実装しています。

💡イベント

イベントは、ゲーム内で特定の条件を満たすと発生するシナリオやアクションを指します。ビデオでは、イベントを使ってゲームのUI表示を制御し、キャラクターのヒットポイントの減少や所持金の変化をトリガーに動作するように設定しています。

💡パーセンテージ

パーセンテージは、バッテリーの残量を示す単位であり、ビデオではバッテリーゲージに加えてパーセント表示されることで、プレイヤーにより明確な情報提供が行われています。

💡アイコン

アイコンは、ゲーム内のステータス異常や特定の効果を視覚的に表現する小さな画像です。ビデオでは、毒などのステータス異常が発生した際にアイコンが表示されることで、プレイヤーに即時のフィードバックが提供されます。

💡コモンイベント

コモンイベントは、ゲーム内で繰り返される共通の処理や表示を管理するための仕組みです。ビデオでは、マルタの顔グラフィックをコモンイベントで管理し、UIの簡素化に貢献しています。

💡吹き出し

吹き出しは、キャラクターの台詞を表示する方法であり、ビデオでは吹き出し式のメッセージウィンドウが採用されたことで、顔グラフィックを描かなくて済む利便性が得られています。

Highlights

RPG開発者による募金で作る探索アドベンチャーの進捗報告を行いました。

UIの設計は苦手だと公言しつつも、ゲーム制作で避けられないため、実装を頑張って進めています。

1週間かけて、左下に主人公のイラスト、左側に2つのゲージ、右下にお金の表示を実装しました。

ヒットポイントは数値ではなく、ゲージの減少と表情の変化で表現する仕様にしました。

バッテリーゲージはゲームの重要な要素で、時間経過で減少するようにしています。

ヒットポイントとバッテリーには成長要素を設け、特定のアイテムを集めることで最大値が増やすことができます。

所持金は手に入れた数値だけプラスで表示され、その後フェードアウトするように設定しました。

刃牙のレイアウトツールを使ってUIを管理し、移動中もHPとMPのゲージを表示するように設定しました。

イベントのテンプレートを使って所持金の表示を簡単に実装できました。

ヒットポイントバーの背景画像を調整し、デザインに合わせてカスタマイズしました。

デフォルトメーターの画像を編集して、斜めにデザインしたゲージに対応させました。

画像のスライスを正確に設定し、ゲージの表示を綺麗に見せる方法を学びました。

ヒットポイントとバッテリーのレイアウトを分けて用意し、それぞれに異なる成長要素を持たせています。

メッセージウィンドウに顔グラフィックを表示する必要がなくなり、吹き出し式に変更しました。

UIの実装が刃牙の魅力であり、強みの一つだと感じています。

次回の動画でお会いするという結びの言葉で終了しました。