Raspberlyのブログ

Raspberlyのブログ

Unityネタをメインとした技術系ブログです。にゃんこ大戦争や日常なども。そろそろブログタイトル決めたい

【アセット紹介】PoolManagerでオブジェクトプールを実装する【Unity】

今回はアセットの紹介をしていきます。
紹介するのはPoolManager
大量のオブジェクトを効率よく運用するユーティリティアセットです。

f:id:Raspberly:20201027191929p:plain

 

 

お得なバンドル情報!

現在アセットストアでは、10周年を記念したメガバンドルが発売中です! 終了しました
今回紹介するPoolManagerも含め全20アセットが超お得に手に入るチャンス!
下のバナーリンクからどうぞ。

f:id:Raspberly:20201030030512p:plain

 

 

 

どんなアセット?

大量のオブジェクトをインスタンスする際に活躍する、オブジェクトプールを簡単に実装できるアセットです。
Instantiateしたゲームオブジェクトをプール、再利用することでガベージコレクションを回避し、
パフォーマンス向上が期待できます。

PoolManagerはUnity向けのオリジナルでベストなインスタンスプーリングソリューションで、インスタンスをより効率的に管理してパフォーマンスを向上、シーンヒエラルキーを整理、実装はシンプルです。信じられないようでしたら、わたしたちのウェブサイトやこちらに書かれているレビューをご覧ください。

インスタンスが何度も何度も必要になるのになぜ破棄するのでしょうか?再利用しましょう!PoolManagerは、プリローディングインスタンスなど多くの追加機能で、ゲームプレイとShurikenの自動消去中にインスタンスを作成されないよう、開発を支援してゲームの実行スピードアップを実現します。詳細については以下のリンクをご覧ください。

公式ドキュメントも用意されています。

docs.poolmanager.path-o-logical.com

 

レビューの評価が非常に高く、
2011年の初リリースから現在までアップデートされ続けているため、とても信頼性の高いアセットです。

 

 

 

 

オブジェクトプールとは?

オブジェクトをインスタンス(生成)、プール(溜める)し、
再利用をすることでガベージコレクションを防ぐデザインパターンです。

シューティングゲームで例えると

インスタンスと破棄の場合

弾を撃つたびにInstantiateし、撃ち終わった弾をDestroyすると
メモリの確保と開放が頻繁に起こるため負荷が高くなります。

f:id:Raspberly:20201029210542p:plain

 

オブジェクトプールの場合

オブジェクトプールなら最初にまとめてInstantiateした後、
それらのActiveを切り替え再利用することでメモリ負荷を軽減できます。

f:id:Raspberly:20201029211614p:plain

 

 

オブジェクトプールは複雑な作りではないため自作されている方も多いかと思います。

 

 

 

開発環境

Unity 2020.1.8

PoolManager ver7.0.1

 

 

 

実際に試してみる

オブジェクトプールを使わない場合

まずはオブジェクトプールを使わずに、InstantiateとDestroyで銃を撃つ仕組みを作ってみます。

Bullet

弾はこんな感じ、SphereにRigidbodyとBullet.csをアタッチします。これはプレハブ化しておきます。

f:id:Raspberly:20201030005838p:plain

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class Bullet : MonoBehaviour
{

	[SerializeField] Rigidbody Rb;
	[SerializeField] float m_Speed;
	[SerializeField] float m_AutoDisposeTime = 3;

	//初期化処理
	public void Init(Transform _trn, float _speed)
	{
		transform.position = _trn.position;
		transform.rotation = _trn.rotation;
		m_Speed = _speed;

		Rb.AddForce(transform.forward * _speed);
		StartCoroutine("AutoDispose");
	}

	//終了処理
	public void Dispose()
	{
		Destroy(gameObject);
	}

	//何にも当たらない場合時間経過で消す
	IEnumerator AutoDispose()
	{
		yield return new WaitForSeconds(m_AutoDisposeTime);
		Dispose();
	}

	private void OnTriggerEnter(Collider other)
	{
		StopCoroutine("AutoDispose");
		Dispose();
	}


}

 

銃にはGun.csをアタッチします。銃口となるTransformと先ほど作ったBulletプレハブを紐づけておきます。
見た目はBoxを組み合わせてそれっぽくしました。

f:id:Raspberly:20201030010912p:plain

f:id:Raspberly:20201030010955p:plain

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class Gun : MonoBehaviour
{
    [SerializeField] Transform GunPoint;
    [SerializeField] GameObject Bullet;
    [SerializeField] float BulletSpeed = 1000;


    //マウスクリックしたら撃つ
    void Update()
    {
        if(Input.GetMouseButtonDown(0))
        {
            var obj = Instantiate(Bullet);
            obj.GetComponent<Bullet>().Init(GunPoint, BulletSpeed);
	}
    }
}

この状態でプレイしてみるとマウスの左クリックで弾が出ます。

f:id:Raspberly:20201030012630g:plain

Bulletプレハブが生成され、その後破棄されています。

f:id:Raspberly:20201030032246g:plain

 

 

PoolManagerに置き換える

先ほど作った銃と弾をPoolManagerを使ってオブジェクトプールに置き換えてみます。

SpawnPoolの作成

空のゲームオブジェクトを作成して、SpawnPoolコンポーネントをアタッチします。
このオブジェクトの名前をPoolとしておきます。

f:id:Raspberly:20201030014651p:plain

各パラメータは以下の通りです。

Pool Name : プールへのアクセスに使用する名前

Match Pool Scale : 生成されるオブジェクトをPoolオブジェクトに合わせてスケーリングする
生成するオブジェクトがUIの場合にチェックを入れるとよい

Match Pool Layer : 生成させるオブジェクトのレイヤーを、Poolオブジェクトのレイヤーと合わせる

Don't Reparent : 生成したオブジェクトをPoolオブジェクトの子にしない

Don't Destroy On Load : 生成したオブジェクトのDontDestroyOnLoad(シーン切り替えなどでDestroyされない)を有効にする

Log Messages : PoolManagerが何をしているかログを表示させる

Per-Prefab Pool Options : プールしておくオブジェクトの設定

 

SpawnPoolにBulletの登録

SpawnPoolコンポーネントにBulletを登録して生成させます。
Per-Prefab Pool Optionsを開いて、右の+ボタンを押すとオプション画面が表示されます。

f:id:Raspberly:20201030020510p:plain

prefab : プール対象のプレハブです。今回はBulletを登録します。

preload Amout : 事前にいくつ生成しプールしておくか。

preload Time : 何フレームかけて生成するかと、ディレイの設定。
シーン開始時のスパイクを回避するために、少し遅らせて生成することができます。

f:id:Raspberly:20201030020919p:plain

limit Instances : 生成する数に制限をつけるかどうか
プールしているインスタンス数がこれを超えた場合、SpawnされてもNullを返します。
FIFOを有効にしている場合は、一番古いインスタンスを終了させ即座に使いまわします。

f:id:Raspberly:20201030021219p:plain

cull Despawned : 生成したが使われていないインスタンスを削除するかどうか
下の例の場合、使われていないインスタンスが50以上ある場合、60秒ごとに5づつ削除する。
メモリの問題が発生していない場合は基本的に使わない方がいいらしい

f:id:Raspberly:20201030021845p:plain

log Messages : ログメッセージを出すかどうか

 

 

今回はこのような設定にしました。

f:id:Raspberly:20201030023039p:plain

実行するとBulletが15個生成されプールされているのが確認できます。

f:id:Raspberly:20201030023137p:plain

 

 

 

GunからPoolにアクセスし弾を発射する

スクリプトはBullet.csとGun.csのInstantiateとDestroyの部分を差し替えるだけです。

	//終了処理
	public void Dispose()
	{
		PoolManager.Pools["Pool"].Despawn(transform);
	}
    //マウスクリックしたら撃つ
    void Update()
    {
        if(Input.GetMouseButtonDown(0))
        {
            var obj = PoolManager.Pools["Pool"].Spawn(Bullet);
            obj.transform.GetComponent<Bullet>().Init(GunPoint, BulletSpeed);
        }
    }

SpawnPoolで生成されたBulletが使われているのが確認できました。

f:id:Raspberly:20201030025552g:plain

 

 

 

その他有効な使用パターン

今回は一番簡単な使い方をしましたが、公式で様々なパターンが紹介されているのでこちらもどうぞ

docs.poolmanager.path-o-logical.com


 

 

 

まとめ

・PoolManagerを使うことで、簡単にオブジェクトプールを作成することができる
・オブジェクトプールは、ガベージコレクションを避けメモリ負荷を抑えることができる
スクリプトは、InstantiateとDestroyをSpawnとDespawnに書き換えるだけ

 

 

 

 

参考資料

qiita.com

nobollel-tech.hatenablog.com

docs.unity3d.com

 

 

 

他のアセットの紹介記事はこちら↓

raspberly.hateblo.jp

 

 

 

※本記事にはAssetStoreアフィリエイトリンクが含まれています。
他、間違っている箇所、わかりにくい所がありましたらコメントにお願いします。

Oculus Quest2からPCにスクショや録画ファイルを取り込む (Windows)

今回はOculus Quest2のネタをやっていきます。
Oculus Quest2で撮影したスクショや録画ファイルをPCに取り込む方法についてまとめました。

 

去年書いたこちらの記事のリニューアル版です。変更点はあまりありませんが書き残します。

raspberly.hateblo.jp

 

 

 

この記事のまとめ

・Oculus Quest2をPCに接続し、確認ダイアログがQuest側で出るので承認
・Quest 2\内部共有ストレージ\Oculusからスクショと動画ファイルにアクセスできるのでそこからコピーする
・まとめてPCに取り込みたい時は、エクスプローラーから「画像とビデオのインポート」を選ぶ

 

 

Oculus Quest2とPCを接続

Oculus Quest2とPCをUSBケーブルで接続します。
ただし接続するだけではPC側に認識されません

f:id:Raspberly:20201017165717p:plain

 

接続するとQuest側で「データアクセスの許可」を問うダイアログが表示されるので、許可をします。

f:id:Raspberly:20201017170430j:plain

 

Quest側で操作して初めてPCで認識されます。

f:id:Raspberly:20201017165838p:plain

 

Questでデータアクセス許可ダイアログが出ない場合

PCと接続しても何もダイアログが出ない場合があります。
その時はUSBケーブルやPC側のポートを変えてみてください。それで解決することがあります。

 

私の場合では、Oculus Quest2に同梱されているUSBケーブルでは認識されず
Oculus Link用に購入したUSBケーブルでは認識されました

PCとの相性などが関係するのかも。

 

以下Oculus Supportページから転載

Oculus QuestヘッドセットがドライブとしてWindows PCに表示されない場合:

  • Quest 2やQuestに同梱されていたUSBケーブルを使用してください。
  • ヘッドセットからVR内の[承認する]を選択し、ヘッドセットのファイルにコンピューターがアクセスできるよう許可してください。
  • 以下の手順で、デバイスのドライバーをアップデートしてください。
    1. デスクトップPCの場合は、[PC]または[マイコンピューター]を右クリックします。
    2. [コンピューター]を選択します。
    3. [管理]を選択します。
    4. [デバイス マネージャー]を選択します。
      • [管理]オプションが表示されない場合は、直接[デバイス マネージャー]を選択します。
    5. [Oculusデバイス]または[ポータブル デバイス]の横の[>]をクリックして、オプションを開きます。
    6. [Quest]を右クリックし、[ドライバーの更新]を選択します。
    7. [コンピューターを参照]オプションを選択して、[一覧から選択します]オプションを選択します。
    8. [MTP USBデバイス]を選択して[次へ]を選択し、アップデートを完了します。

 

 

 

Oculus Questの内部ストレージの確認

エクスプローラーからOculus Quest2を選択すると、内部ストレージを閲覧できます。

f:id:Raspberly:20201017172220p:plain

 

スクショや動画ファイルの保存場所

間違えやすいですが、
スクショの保存先は「Pictures」ではありません
また、動画の保存先も「Movies」ではありません

 

ルートにあるOculusフォルダの中にある
Screenshots」と「VideoShots」がそれぞれの保存先です。
ここをOculus Galleryと言うようです。

f:id:Raspberly:20201017172900p:plain

 

ここから直接ファイルを選びPCにコピーができます。
Oculus Quest1では、動画ファイルのみここからコピーできません(再生もできなかった)でしたが、
Oculus Quest2では、動画ファイルのコピーと再生ができるようになりました

f:id:Raspberly:20201017173119p:plain

これで完了です。

 

 

 

 

画像とビデオのインポートから取り込む

Oculus Quest1の時に紹介した。「画像とビデオのインポート」でも問題なく取り込むことができました。

 

エクスプローラーからQuest2を右クリックし、「画像とビデオのインポート」を選択します。

f:id:Raspberly:20201017165941p:plain

「次へ」

f:id:Raspberly:20201017165957p:plain

 

インポート可能な画像と動画ファイルを自動的に見つけてくれます。
日付と日時でグルーピングしてくれるので複数のファイルをまとめて取り込むことができます

f:id:Raspberly:20201017170101p:plain

インポートされたファイルは、マイピクチャの中に日付で整理されるので、
日頃からスクショや録画を取っている方には便利かもしれません。

f:id:Raspberly:20201017174201p:plain

f:id:Raspberly:20201017170420p:plain

ちなみにこの方法でファイルをインポートすると、Oculus Quest側のファイルは自動的に削除されます。

 

 

 

まとめ

・Oculus Quest2をPCに接続し、確認ダイアログがQuest側で出るので承認
・Quest 2\内部共有ストレージ\Oculusからスクショと動画ファイルにアクセスできるのでそこからコピーする
・まとめてPCに取り込みたい時は、エクスプローラーから「画像とビデオのインポート」を選ぶ

 

 

 

 

 

Macの場合

私はMacを所持していないため詳しくはありませんが、こちらの記事が参考になりそうです。

oculus.hatenablog.com

 

 

 

参考資料

support.oculus.com

 

 

 

他、間違っている所、わかりにくい所がありましたらコメントまでお願いします。

【アセット紹介】Peek でワークフローを効率化しよう【Unity】

今回はアセットの紹介をしていきます。
紹介するのは「Peek - Editor Toolkit」。
Unityのワークフローを大きく改善・効率化できるユーティリティアセットです。

f:id:Raspberly:20200925023142p:plain

 

 

注意

このアセットは2022年3月31日に非推奨となります。
すぐに使えなくなるというわけではありませんが、今後サポートされなくなるため注意しましょう。

ludiq.io

 

 

 

宣伝!
現在アセットストアにて「Reboot 2020」セールが開催中! 終了しました
2020年にリリースされた新作アセットの中から人気アセット100点以上が50%OFFで購入できます!
10月1日 15時59分まで!

f:id:Raspberly:20200925033312p:plain

 

 

 

どんなアセット?

シーンビューを拡張するアセットです。
インスペクターやヒエラルキーなど他のビューをシーンビュー上に表示させたり、
コンポーネントのアタッチや、参照の紐づけなど一般的なUnityのワークフローを、
シーンビュー上で完結できるようになります。 

 

1月に行われたハイパーカジュアルゲームナイトの、
北米のハイパーカジュアル制作現場で使われているアセット人気TOP30」にて紹介されました。

raspberly.hateblo.jp

 

Humble Bundleでの入手

現在開催中のHumbleBundleにて、25ドル以上支払うと他の大量のアセットと共にPeekを入手できます。

www.humblebundle.com

とてもお得なため参加することをオススメします。
詳しい購入方法や、他のアセットについてはこちら

www.asset-sale.net

 

公式動画とマニュアル

www.youtube.com

Manual | Peek - Ludiq

 

非常に多機能なアセットなため、この記事では基本機能のみ紹介します

 

開発環境

Unity2020.1.4f1
Peek - Editor Toolkit ver1.2.0f2

必要条件

このアセットはUnity 2018.4.14以上で動作します。
公式ではUnity 2019.3まで動作確認されています。

また、ランタイムバージョンは.NET 4.xが必須です。

 

初期設定

アセットをインポートするとこのような画面が出てきます。

f:id:Raspberly:20200915233046p:plain

Nextボタンを押すだけで特に何もせずセットアップが完了します。

f:id:Raspberly:20200916022519p:plain

 

 

 

 

ツールバー(Toolbers)

インスペクターを使わずにゲームオブジェクトやコンポーネントを表示・編集できる機能です。
Sceneビュー上でオブジェクトをクリックするとツールバーが表示されます。
そこからTransformやコンポーネントに素早くアクセスできます。

f:id:Raspberly:20200917023642g:plain

 

ピン留め機能

表示したコンポーネントの左上にあるピンを押すことで、その場に固定することができます。

f:id:Raspberly:20200924231809g:plain

 

 

 

 

タブ(Tabs)

タブは、シーンビューからエディターウィンドウにすばやくアクセスできる特別なツールバーです。

モード

ポップアップモードとピンモードの2つのモードが用意されています。

ポップアップモード

タブは一つまで開くことができます。
ツールバーの横に表示され、移動やサイズ変更はできません。

f:id:Raspberly:20200924233324g:plain

ピンモード

複数のタブを開くことができます。
タブは自由に移動、サイズ変更ができます。

f:id:Raspberly:20200924233357g:plain



 

 

クリエイター(Creator)

シーンビューから新しいゲームオブジェクトを素早く作成する機能です。
プロジェクト内のプレハブ、モデル、スプライトの検索もできます。

 

Ctr+Shiftを押すとSceneビュー上にギズモが表示され、
クリックした場所に素早くオブジェクトやプレハブを配置できます。

f:id:Raspberly:20200925012216g:plain

これの真に素晴らしい所はその検索機能です。
ファジーサーチエンジンという機能によりオブジェクトを素早く検索できます。

例えば、「PlayerCharacter」というプレハブがあったとすると、

f:id:Raspberly:20200925012542p:plain

「PC」という検索で表示されます。

f:id:Raspberly:20200925012843p:plain

略語とイニシャルがサポートされています。

 

 

 

 

リプレイサー(Replacer)

シーン内の1つあるいは複数のオブジェクトを別のオブジェクトに置き換える機能です。
シーン内の大量の変更を高速に行うことができます。

 

1つ~複数のオブジェクトを選択後、ツールバーの名前の部分を右クリックするとコンテキストメニューが表示されるのでそこからReplaceを選び、置き換えるオブジェクトを選択して完了です。

f:id:Raspberly:20200925013927g:plain

ヒエラルキーからもできます。

f:id:Raspberly:20200925014023p:plain

 

 

 

グループ(Groups)

複数のオブジェクトをグループ化しまとめることができる機能です。
空のゲームオブジェクトを作成し、複数のオブジェクトをその子オブジェクトとしてまとめます。

 

1つ~複数のオブジェクトを選択後、ツールバーの名前の部分を右クリックするとコンテキストメニューが表示されるのでそこからGroupを選び、置き換えるオブジェクトを選択して完了です。

f:id:Raspberly:20200925014916g:plain

複数のオブジェクトを選んだ状態で、ショートカットキーCtr+Gで素早くグループ化ができます。

メニューから、Ungropを選ぶことでグループ化の解除もできます。

 

グローバルグループ

グループには、ローカルとグローバルがあります。通常はローカルです。
ローカルの場合、グループ内のオブジェクトのセンターの位置にオブジェクトが作成されますが、
グローバルはシーンのルート、及びシーンの原点(0, 0, 0)に作成されます。

 

 

 

 

プローブ(Probe)

ビュー上で重なったオブジェクトから目的のオブジェクトを素早く選択する機能です。
シーンビューで右クリックすると、マウスカーソルに重なっているオブジェクトを全て表示します。
これは距離が近い順に並んでいます。深い階層にあるオブジェクトを選択する時などに便利です。

f:id:Raspberly:20200925015919g:plain

ハイライトの色はEditor Settingから変更できます。

 

 

 

 

リファレンスインスペクター(Reference Inspector)

参照フィールドに関連付けられているオブジェクトのインスペクターを出す機能です。
参照フィールドの左にある虫メガネのボタンを押すことで、素早くオブジェクトの表示・編集ができます。

f:id:Raspberly:20200925021859g:plain

 

 

 

ヒエラルキーポップアップ(Hierarchy Popup)

シーンビューからヒエラルキービューに素早くアクセスする機能です。
クリエイターでも紹介したファジーサーチエンジンにより、素早い検索も行えます。
ポップアップには2つのモードがあります。

グローバル

シーン内の全てのオブジェクトを表示します。
シーンビューでCtr+F、あるいは何も選択していない状態でSpaceを押すことで表示できます。

f:id:Raspberly:20200925022340g:plain

ローカル

選択されたオブジェクトの親と子のみ表示するヒエラルキーを出します。
オブジェクトが選択された状態でSpaceを押すと表示します。

f:id:Raspberly:20200925022852g:plain

 

 

 

スティッキードラッグ&ドロップ(Sticky Drag & Drop)

シーンビューでオブジェクト間の参照をスムーズに設定できる機能です。
いちいちインスペクタービューのロックなどをする必要はありません。

f:id:Raspberly:20200925024608g:plain

これはシーン、ヒエラルキー、プロジェクト全てで動作します。
この機能は1秒間の遅延(押しっぱなしにする必要)があり、この時間は設定で調整できます。

 

 

 

 

プレビューアイコン(Preview Icons)

ヒエラルキーやプロジェクトビューで表示されるオブジェクトのアイコンを、
3D・2D・マテリアルのスナップショットに置き換える機能です。
オブジェクトを簡単に区別できるようになります。

f:id:Raspberly:20200925025631p:plain

 

 

 

 

 

ショートカット

ショートカット機能が複数用意されています。
以下マニュアルから引用

Shortcuts

Updated: 2019-08-08
Action Context Shortcut
Creator Scene [Ctrl/Cmd]+Shift+LMB
Replacer With anything selected Alt+R
Probe Scene RMB
Toggle Toolbars Scene B
Navigate Toolbar Scene with a selection Alt+[0-9]
Navigate Tabs Fullscreen Scene Alt+Shift+[0-9]
Group Selection With anything selected [Ctrl/Cmd]+G
Ungroup Selection With anything selected [Ctrl/Cmd]+Shift+G
Group Selection Globally With anything selected [Ctrl/Cmd]+Alt+G
Local Hierarchy Popup Scene with a selection Space
Global Hierarchy Popup Scene Ctrl+F
Global Hierarchy Popup Scene without a selection Space
Close Hierarchy Popup Hierarchy Popup Escape
Maximize Scene Scene Double-Click LMB
Clear Selection Scene / Hierarchy / Project Escape
Pin Inspector Popup Inspector Popup Space
Close Inspector Popup Inspector Popup Escape

 

 

 

 

各種設定

エディター設定、及びプロジェクト設定でPeekの各種機能を調整することができます。

f:id:Raspberly:20200925032112p:plain

f:id:Raspberly:20200925032155p:plain



 

 

まとめ

今回は、ユーティリティアセット「Peek」の基本機能を紹介しました。
操作感はそのままに、オブジェクトの編集が格段に楽になるアセットです。
クリエイターやリプレイサーは少しクセがあるかもしれませんが、
ツールバーやプローブは扱いやすく恩恵がとても大きいので、興味のある方ぜひどうぞ!

 

 

 

他のアセットの紹介記事はこちら↓

raspberly.hateblo.jp

 

 

 

※本記事にはAssetStoreアフィリエイトリンクが含まれています。

他、間違っている箇所、わかりにくい所がありましたらコメントにお願いします。

【勉強会レポ】: 📣 unity1week online共有会 #2-B 📘

勉強会のレポート(メモ)です。
参加したのはこちら「📣 unity1week online共有会 #2-B 📘」

meetup.unity3d.jp

ハッシュタグu1w共有会

f:id:Raspberly:20200913220342p:plain

アーカイブ動画はこちら

www.youtube.com

 

 

1日目はこちら

raspberly.hateblo.jp

 

 

 

unity1week共有会って何?

unity1weekでいろんなゲームを遊んでいると
「どういう実装をしているんだろう」「どんな人が作っているのか」など気になることがいっぱい!

それら気になることを直接聞けばいいじゃん!というのがunity1week共有会の始まりです。


みんなで学んで成長することが趣旨です。

 

 

unity1weekについてはこちら

Unity 1週間ゲームジャム | フリーゲーム投稿サイト unityroom

 

 

 

 

#1 技能向上のためのunity1week

つくったもの

ColorRacer | フリーゲーム投稿サイト unityroom

なぜ私がunity1weekに参加するのかモチベーションのお話をします

いままで参加しなかった理由

作ること事体が好きで、人に遊んでもらう発想になかなか至らなかった。
ジグソーパズルのように作って壊すを繰り返していました。

ただし、ずっと一人でやっていると上達を感じられないため、人から評価を貰って上達を達成するため参加を決意しました。

前回の参加

参加することが目的でした。

ふうせんにゃんこダイブ | フリーゲーム投稿サイト unityroom

絵作りの評価がとても高かったので、ここを伸ばそうと絵作りに挑戦しようと思いました。
絵作りはいろいろありましたが、もともとUnityで慣れていたので3DCGを選びました。

今回の参加

今回のunity1weekは絵作りでランクインを狙うことを目標としました。
絵作り/演出一本で楽しいと思わせる試みをしたので、今回のColorRacerです。
結果として絵作りの評価は4点の壁を超えランクインもできました。

反省点

「100日後に○○する」目標は、達成できない時間が長いため毎日のタスク型の方がよかった 。

まとめ

Blenderの勉強成果としてunity1weekを利用しました。
みなさんも何か技能を極める目的で参加してみてはいかがでしょうか?

 

 

 

 

 

#2 斯くて世界は創られる

つくったもの

隕星アルファルズ | フリーゲーム投稿サイト unityroom

このゲームの世界を作るにあたって何をしたかについてお話します

音楽から世界を作る

このゲームの音楽の特徴として2つがあります。

テキスト演出

主人公の名前が表示される時は主人公を象徴する音を、ボスを出すときは敵を象徴する音を出すなど、
演出に合わせた楽曲構成を目指すこと、楽曲に合わせた演出を作ること、
音自体にも意味や立ち位置を持たせることを意識しました。

インタラクティブミュージック

バリエーション違いの曲を同時に再生し、ゲームの展開に合わせ音量を変えることでシームレスに曲を変える手法をとっています。
ただし、当初から曲数が増えてしまい、作業量が多くなってしまった。

見た目からゲームを作る

全体的な絵作りはモノトーンのため対比や演出は入れやすかった。

テキストから世界を作る

書くときに気を付ける点は
・説明しすぎていないか
・地面が美しいか
・声に出した時の語感がいいか
・語彙が世界観につながっているか

ゲームデザインから世界を作る

ゲームオーバーになるたびにHPが「ふえる」を世界観にしていきます。
ゲームオーバー前提の難易度と、リトライの際に流れを切らないようにしています。

まとめ

ゲームデザインサウンド、グラフィック、設定などなど、
全てが世界を構築する大事な要素なのでどれも大切にしていきたい。
素材を後付けするだけという発想では足りない。
ゲームに合わせて素材を作るだけでなく、素材に合わせてゲームを作る双方向的なアプローチが必要。

 

世界には神が必要。一つ一つのこだわりの積み重ねに神が宿る。

 

 

 

 

 

#3(表) 大切な技術検証 ~本当にそれ動く?~

つくったもの

増えるタスク | フリーゲーム投稿サイト unityroom

VFXを活用したゲームを作りたかったが、WebGLでは未対応。
この時点で残り2日だったため、新しく作り直したのが「増えるタスク」です。

 

VFXを初日に試しておけば、開発の時間も増え、もっと面白いゲームが作れたかもしれない・。

結論

技術検証はきちんとしましょう。VFXのような新技術ならなおさら。

 

#3(裏) 大切なモチベーション ~本当にそれ続く?~

モチベーションが下がると、ゲームが完成せず、完成しないと評価されないためモチベーションが下がる。
そこでおすすめのモチベーション維持法を紹介します。

タスクの可視化

作業タスクの洗い出しをし、進捗を把握する。
(やりたいこと、やっていないこと、やりきったこと、やめたこと)

ブレない面白さを意識する

作り初めに考えた「面白い部分」をメモしておき、迷走した時に振り返る。
「面白い部分」は意地でも貫くため、核になるメイン部分は早めに作っておくこと。

リアクションを得る

進捗をSNSに投稿する。(エフェクトやシェーダーなど見た目に特徴があると反応されやすい)

ハッシュタグを持ちいることでフォロワー外にも届きやすい。

共同開発をする

責任が生じるため、やらないといけない。
日頃から良いコミュニケーションをとる必要があります。

おまけ DOTweenによるゲームループ

GitHub - matsufriends/HueruTask

 

 

 

 

 

#4 7日間でこうなりました

つくったもの

PUZZLE 999 | フリーゲーム投稿サイト unityroom

これが7日間でどうやっていったのかについてお話します。

2日目(重要)

ゲームの基礎部分を完成させる。
ゲームのコアな部分は後からでは取り返しがつかないので早く確認するのが大事。
7日目に気づくパターンは避けなくてはならない。だめならすぐに方向転換する。

ゲームの方向性をなるべく早く確認する

作って形にしないとわからない。全体の2割の時間で8割の全体像を見渡せるようにしましょう。
後になればなるほど修正に時間がかかってしまう。

まとめ

ゲームは動かしてみないとわからない
小さく素早く失敗する
最終日に「なんか違う」と後悔しないように

 

 

 

 

 

#5 なんとなくチームで参加したら1weekデスマになった話

つくったもの

すごいうちゅう彷徨うネコ -ヒューエルスペースキャット- | フリーゲーム投稿サイト unityroom

開発メンバー

ホロウさま🍣Horousamatolune (@tolune) | Twitter

ITSUKI (@itsuki_avo) | Twitter

オータス (@fuzzy_nine) | Twitter

デスマーチとは

納期がやばい、間に合わないから寝ないで魂を加速させろぉォオォォォォォォ!
と無理しないと間に合わない普通じゃない状況。

デスマの原因

工数の見積もりが甘かった。
仕様決めで二日間かかり、チームでは簡単にできると思っていたが実際はプログラムの工数がすごかった。

デスマーチにならないために

進捗を管理する人を決める。
工数を管理するのが大事。

以上を踏まえた反省点

普段から準備できるものは準備しておこう。
サウンドマネージャーやシーンマネージャーなどテンプレートは1week前に用意しておくべき。

チーム開発は諸刃の剣

初心者は一人開発の方がいい。
チームリーダーはきちんと決めよう。

終わりに

失敗しても遅刻してもいいので作りたいものに作ろう

 

 

 

 

 

#6 Unityインターハイ入賞クリエイターが語る!モチベを1週間維持するコツ

つくったもの

人類ゲーム(unityインターハイ入賞者創作) | フリーゲーム投稿サイト unityroom

実装で困ったこと

ルールが単調で飽きられやすい→改造モード(ずっと遊べる)があると飽きられにくい
開発者にとって長く遊んでもらえることはうれしい

モチベ維持の話

#u1wを見ていると、みんなつらそう。そもそも1週間でゲームを作りきることは頭おかしい。
1週間作り続けるためにはモチベ維持が重要

10分タイマーを使おう

10分で何をするか決める、タイマーをつける→その間制作→タイマーが切れる (これを繰り返す)
お手軽にできるのでオススメ。

ハングリー作戦

キリのいいところまで食事をとらない。人は飢餓状態の方が集中力が出る。
節度を持ってやろう。

Twitterで並走者の確認

10分タイマー、ハングリー作戦でもやる気がでない時の最終手段。
#u1wを見てみましょう。絶対に焦ります。

 

 

 

 

 

#7 自分的Unity1Weekでの企画の考え方

つくったもの

スライムギリギリたおせる勇者 | フリーゲーム投稿サイト unityroom

良い企画の作り方

良い企画を作るには、大量の案をだすことと、その中から良い企画を選ぶこと、2つの要素があります。
大量の案を出すこと、これはよく聞くが。真に難しいのは大量の案の中から良い企画を見つけ出すこと。
そこで良し悪しを判断する10個のポイントを考えてみます。

判断ポイント

1. 実現可能か

技術的に実現可能か、自分のスキルで1週間でできそうか

2. 仕様に曖昧さがないか

曖昧なところ、迷走しそうなところはないか

3. 革新的か

何かしら新しい点はあるか?

4. 既存のゲームの劣化版になっていないか

革新性を求めると陥りがり

5. 面白そう を提供できるか

パッと聞いた時の、見たときの印象

6. 面白い を提供できるか

面白さを担保できるか、メカニクスの衝突は起きていないか

7. 面白かった を提供できるか

バズり要素ややりごたえ、達成感

8. ターゲットユーザーにマッチするか

どのようなユーザーを想定するか、unity1weekではそんなに考える必要がない

9. マネタイズできるか

どういった形でマネタイズするか、unity1weekではあまり考えなくてよい
もしアプリ化するのならこのあたりも考える必要がある

10. 直感的によさそうか

言語化できない部分があるので直感も大事

最後

お題にあっているかどうかはどうとでもこじつけられる

 

 

 

 

 

#8 1weekでかわいいアメーバを?できらぁ!〜デザイン奮闘記〜

つくったもの

バイヨウ☆アメーバ | フリーゲーム投稿サイト unityroom

デザイナーとエンジニア両面の資料を用意しました。エンジニアの部分はスライドを確認してください。

 

UI

わかりやすいUIを目指すために意識しているポイント
UI=ロジック。全て理由があり言語化できる。つまりルールを設定できる。

色を考える

どんな色を使うかは、題材や世界感など作るものについて考える必要がある。
配色に迷ったらカラーパレットで検索するとよい。
色の対比が強いほど目につきやすい。

サイズを考える

対比が強いほど目線を誘導しやすくなる。
重要な文字やボタンを大きくするなど。

位置を考える

キーボードで操作するため、現実のキーと同じ配置をする

まとめ

意図をもってUIを作ることで製作時の迷いを減らし、プレイヤーにとってわかりやすいUIになる

アニメーションについて

アニメーションにはSpineを使いました。
機械的な印象を避けるため生きているアメーバを意識し、自然な動きに近づける工夫をしています。

その他 Unity側の実装

・理由と補足以外のコメントを避ける
・細かくシーンをわける それぞれ独立性を高める
・MVPパターンを採用
・AwakeとStartを禁止

 

 

 

 

 

#9 レトロ風ゲーム、作ってみませんか?

つくったもの

88_EightyEight | フリーゲーム投稿サイト unityroom

レトロなグラフィックのゲームで必要になってくるもの

ドット絵のにじまない、劣化していない

Unity上の設定が大事。
FilterModeをno filterにして、圧縮設定をなしにします。

ドットがつぶれていない

 

ピクセルの縦横比が1:1の状態をピクセルパーフェクトと呼ぶ。
この状態で描画をするにはPixelPerfectCameraを使いましょう。

詳しくは公式ブログをご覧ください

blogs.unity3d.com

1スプライトあたりの色数が限られている

Asepriteを使おう
・多機能ドット絵エディター
・アニメーションも作りやすい

まとめ

Spriteの設定に気をつけよう
PixelPerfectCameraでキレイなドットを描画しよう
Aspriteを使いましょう

 

 

 

 

 

#10 「スライム牧場」でそこそこ頑張ったゲームデザインと設計

どういう点にこだわったのか 、どういう風に設計したのかについてお話します。

工夫1

スライムとお金、二つのパラメータを用意しました。
勝手にふえる数値と、プレイヤーが操作してふやす数値の違いを作る。

工夫2

スライムにキャラクター性をもたせた。
声がつくと印象印象が変わり、うろうろするだけでもかわいい。
スライムの可愛さはピクミンをイメージしました。

1weekでの自分ルール

unity1weekで作る時に必ず設定しているルールです。
・左クリックのみでできるゲーム
 スマホから来た人でも遊んでもらえるようにする
・音量調整は必ず入れる
 同僚の耳を破壊したことがあったため 

実装の目標

マルチシーンエディティングとExtenjectを試しました。
ロジックとビューを分けるにはClean Architectureでやりました。


インターフェースについはこちらの記事がすごいよかったです。

qiita.com

画面作りの効率化

Nested Prefabで分割できる最小単位で作っていきます。これは全て単独で動作します。
画面を作る時はこれらをポチポチ置くだけ。

まとめ

・ゲームの操作、デザイン1つ1つそれぞれに理由があって目的がある、なんのためにあるのか言語化する。
・引き出すを増やすためにもチーム開発は有効
・1週間あれば割と勉強できる(下準備は必要)

おまけ

qiita.com

ソードコード : GitHub - sai-maple/SlimeFarm

 

 

 

 

 

 

 

 

 

 

 

他の方の感想ブログとか

note.com

note.com

kugi-masa.hatenablog.com

nightscraper.fanbox.cc

 

 

 

間違っている箇所、消してほしいツイートがありましたらコメントにお願いします。

【勉強会レポ】: 📣 unity1week online共有会 #2-A 📕

勉強会のレポート(メモ)です。
参加したのはこちら「📣 unity1week online共有会 #2-A 📕」

meetup.unity3d.jp

ハッシュタグu1w共有会

f:id:Raspberly:20200913220342p:plain

アーカイブ動画はこちら

www.youtube.com

 

2日目はこちら

raspberly.hateblo.jp

 

 

unity1week共有会って何?

unity1weekでいろんなゲームを遊んでいると
「どういう実装をしているんだろう」「どんな人が作っているのか」など気になることがいっぱい!

それら気になることを直接聞けばいいじゃん!というのがunity1week共有会の始まりです。


みんなで学んで成長することが趣旨です。

 

unity1weekについてはこちら

Unity 1週間ゲームジャム | フリーゲーム投稿サイト unityroom

 

 

 

#1 実装1日でゲームを作り上げた備忘録

 

ことばのクイズもじぴったし | フリーゲーム投稿サイト unityroom

こういうゲームを作りました。これを1日で作ったお話をします。

1日で作るためにしたこと

あらかじめ必要な処理を実装しておく

オプション画面、ランキング、ツイート機能などはどのゲームでも使うのであらかじめ実装しました。

「この機能を使いたい、試したい」といったことことを決めておく

 

DoTweenのアップデートがきていたのでこれを使いたかった。
モックはあらかじめ作って起き、あとはこじつける。

全体のデザインテーマをきめる

もじぴったんというゲームが好きだったので参考にしました。
音楽や背景など

DOTwennを使っているところ

UIや演出など動きのある所は全部DOTween

ある程度テーマが整ったら

感謝のWebGLビルドを行います。
async/awaitなどWegGLでは使えないものがある。

forum.unity.com

実装はシンプルに余計なことはしない。

やればよかったこと

問題文の作成が大変だったので、スプレッドシートからScriptableObjectに変換する機能を作ればよかった。

モバイル向けの操作感になってしまったので、WebGL向けにキーボードで正誤判定もいれればよかった。

 

 

 

 

#2 「かたぐるまクローンズ」開発ふりかえり

作ったもの

かたぐるまクローンズ | フリーゲーム投稿サイト unityroom

 

今回はパズル制作と絵作りの話をします。

作っていて感じたこと

パズルゲーム

良い点

・スケジュール管理がしやすい
 何ステージつくるか決まってないので、実装とステージ作りをわけることができる
・一定の楽しさが担保されている

悪い点

・パズル作りが大変 難易度調整など
・ランキングに向いていない
・ありがちなものになりやすい

ドット絵

良い点

・なれれば短時間で素材を作れる
・雰囲気を統一しやすい 工夫しだいで全体を統一しやすい

悪い点

・ドット絵特有の難しさ
RPG以外の素材がみつけにくい

ドット絵パズルに興味を持った方へ

パズル製作のコツ

基本的な処理が実装できたらリトライ機能をつけイテレーションをあげる
ScriptableObjectでパズルデータを管理する
 エディタ実行しながらステージを作成する(ScriptableObjectならプレイモードを終了しても保存される)

絵作りのコツ

死んだ画面を作らない
 画面で何も動かない状態を作らない
 パズルゲームは考える時間が長いが何かを動かしておくとよい

ドット絵の練習方法

10分ドット絵というオンラインイベントがあります。
ギルドにドット絵部があるので詳しくはそちらへ

scrapbox.io

まとめ

ドット絵描こうぜ
パズル作ろうぜ

けど一番は自分が作りたいゲームを作ろう

 

 

 

 

#3 過去の失敗作と今回の成功作から学んだこと

こういうゲームを作りました

Psyber Zone | フリーゲーム投稿サイト unityroom

 

初参加 第12回「あつめて」

あつめて、「あ」つめて | フリーゲーム投稿サイト unityroom

初参加の時は「あつめて」がテーマ。参加することが目的。

2回目参加 第14回「逆」

MEIDAI MAZE | フリーゲーム投稿サイト unityroom

目標は「ちょっといいゲームを作ろう」
未完成のままリリースしてしまった。

次回への内省点

「遅刻未完成OK」という言葉を鵜呑みにしない
未完成でもアップデートはおこたらない
いらすとやを使用しない
BGMをしっかり組み込む

3回目参加 第15回「密」

タイピングADV・少女剣士アヤカ・密林の隠者ヒソカの秘密計画 | フリーゲーム投稿サイト unityroom

 

未完成状態で公開してしまった

次回への内省点

グラフィックやサウンド、演出を最優先する
グラフィックに統一性をもたせる
余計な機能はとにかく却下

内省での閃き

ランキングに入るためにはシンプルかつユニークがいいのではないか

シンプルであることのメリット

ルールが簡単で理解しやすい
昨日の実装時間が短縮できクオリティを追求できる

ユニークであることのメリット

飽きにくい、発想力がプレイヤーにささる
アピールポインとになる。

ただしシンプルかつユニークは難しい

4回目参加 第16回「ふえる」

今回おこなったこと

・グラフィックに統一性をもたせた
・グラフィックサウンド演出などに尽力した
・完成状態でリリースし、アップデートも行った

内省点

・操作性が地味に低かった
・斬新さも地味に低かった
・お盆の時間を開発に費やして疲れた

 

ここで時間切れ 詳しくは動画をどうぞ

 

 

 

 

 

#4 神は細部に宿る

今回作ったもの

ヒメをゴールへつれてって | フリーゲーム投稿サイト unityroom

今回は1Weekでこだわっていることをお話します

 

・・・

文章だとこの発表のすごさが伝わらないと思うので、ぜひ動画を見てください。

・・・

 

 

 

 

 

#5 「それふえてね?ゲーム」はどうやってできたのか

こんなゲームを作りました

それふえてね?ゲーム | フリーゲーム投稿サイト unityroom

これができるまでのお話をします

お題発表前

TAXI in the RAINをリリースしました。

TAXI in the RAIN

TAXI in the RAIN

  • Hiroshi Ideno
  • ゲーム
  • 無料

apps.apple.com

コーディング効率化のためImtStateMachineを検証しようとしていた。

お題発表後

8月10日に寝ながら仕様を作りました。

制作上の問題点

・ゲームと成立するような絵をたくさん用意できるか
・時間がない(使える時間は2人日)

8/11~14日

寝ながら設計しました。

8月15日

想像していた通りにUnityで実装しました。
ImtStateMachimeも使いました。

qiita.com

kazupon.org

8月16日

お絵描き。全部描き上げるのに6時間かかりました。
結果土曜日の22時ころにリリースできました。
アップデートで音楽とオンラインランキングもつけました。

全イラスト20種類公開

スライドをどうぞ。事前にゲームを遊んでおくことをオススメします。

 

 

 

 

 

#6 初心者向け、もっと遊ばれるゲームにするために

つくったもの

ノワのお花畑大作戦! | フリーゲーム投稿サイト unityroom

話すこと

今回は技術ではなく、初心者に向けた心構えだったり思考法についてお話します。

あまり話題にならない、遊ばれていないゲームの多くは「魅力がない」あるいは「魅力を伝えきれていない」と考えています。
この二つをどう改善するかについてお話します。

選択と集中

そもそも1週間でゲームを完成させるのは常人の発送ではない

1週間ですべての要素を完璧にすることはできない、
今できることで自分のゲームを最も魅力的にするにはどうすればいいかを考えてください。

強みを活かす

あなたの強みを一番活かせる方法を考える!+それ以外の部分は徹底的に手を抜く。

「お花畑大作戦」は絵で魅せるゲームを最初に決めていたので、
絵作り以外は楽な方法を使いました

自分の得意なもので勝負しよう。

<プレイヤー目線>で魅力を伝える

魅力が伝わらないゲームとはプレイヤーがゲーム没入できないもの。
なのでプレイヤー目線を常に考えながら設計・実装をしましょう。

「お花畑大作戦」で意識した点

・ルールは簡潔に直感

「手を動かしているうちにどんなゲームかわかる」ことを目指した
unity1weekではゲームのとっつきやすさや敷居の低さが重要なポイント

 

 

 

 

#7 マルチシーンエディティングを採用した共同開発について

6人チームで開発をしました。

マルチシーン エディティングとは

複数のシーンを同時にロードして1画面を構成する仕組みです。

開発初日~開発終了まで

終了3日前の金曜日にunity1week参加を決めました。
誰も作ったことのない音ゲーに挑戦することになりました。
あまり使ったこのないMVPアーキテクチャの導入もきめました。(UniRx/UniTask)

 

さわったこのない技術だらけだったので、
昨日単位で実装を分担して、担当のエンジニアが我流で好きなように作れる環境を整えた。

マルチシーン エディティングを採用した理由

この記事を見つけました.
大規模開発でもマルチシーン エディティングが採用されている記事です。

gamebiz.jp

よかったところ、改善したいところ

よかったところ

インタフェース定義のすり合わせをしておけば、だれがどういうデータを持っているかなどの共通認識があったため自由に実装を定義できるためスムーズに開発は進んだ。

改善したいところ

異なるシーン感の参照には基盤となるコードが必要。
事前の準備、事前の知識があると楽。

 

 

 

#8 RAYSER(V2)で追加した演出周りについて

つくったもの

RAYSER(V2) | フリーゲーム投稿サイト unityroom

タイトル画面にDoozyUIとDOTweenを入れてみた

DoozyUI

UIを作るアセット、ノンコーディングで作ることができる。

DOTween

ゲームオブジェクトやUIにアニメーションを簡単に追加できるアセット

最初はDoozyUIで全部アニメーションを作ろうとしたが、Viewが調べきれなかったので最初の所だけ、
後はDOTweenで作りました。

レーザー表現

LineRendererでつくりました。レーザー用のマテリアルを適応するだけでレーザーっぽい見た目になります。
当たり判定はRayを使いました。

バリア表現

ShaderGraphでバリアを作りました。

爆発処理

WarFxで爆発処理を実装しました。

マズルフラッシュ

 レーザー発射時のマズルフラッシュはMuzzle Flashesというアセットを使いました。

動く背景

自作で動く背景を作ってみました。

docs.unity3d.com

テクスチャを貼ってスクリプトを回転させる処理を入れています。

gametukurikata.com

背景にはSolar Texturesというサイトのテクスチャを使いました。

www.solarsystemscope.com

ボスキャラのパーツ破壊

部分的にパーツを破壊する機能です。
Ultimate Spaceship Creatorというアセットを使っています。パーツで組み立てることができるアセットです。

最後に

・導入した演出は難しいことはしておらず、アセットやちょっとの力技を多用している
・地味な演出でも全体の印象がよくなるきっかけになるかも
・ゲームを作るだけでも、公開するだけでもすごい

おまけ

スクリプトを公開しています。

github.com

ブログを書いています。

cz-mirror.hatenablog.com

 

 

 

 

 

#9 Unity歴1か月でUnity1Weekに参加して分かったこと

つくったもの

ブロックのぼり | フリーゲーム投稿サイト unityroom

unity1wwekの感想

参加したきっかけ

入門書を終えた後で、ちょうど時間もあったため

参加後の感想

Unity1weekはすごい 

全てのゲームの評価結果が見えるので、ランキングに載っているものと自分で比較することができる。
差を直視するとつらいので、どの程度時間をかければ評価が上がるかを意識しました、

具体的にイメージするためにやったこと

ゲームを遊ぶこと

「遊んだら評価する」を繰り返し、☆5をつけたものがあったら、なぜつけたかをメモする。
普通に遊んでしまうことがよくあるので、ゲームタイトルだけメモするのもよい。

自分のゲームも評価する

次伸ばしたいポイントを探すことを観点に。
次はこういうことを試したいということを意識するとよい

最後に

・今回は時間内に完成させることが目的は達成できた
・参加を通じて同じ方向を見ている多くの人を知ることができた
・作りたいことを作りきるには引き出しが大切だと感じた
・今後もさらに発展しそう・・・

 

 

 

 

 

#10 ゲーム開発の最短記録を更新したお話

つくったもの

トレ忍 | フリーゲーム投稿サイト unityroom

1日目

投稿できる最低の条件を決めた
・最低限遊べること
・テキストのアニメーションをつける

決めた後に作るジャンルを決めました。(2Dの弾避けゲーム)

2日目~3日目

プレイヤー、弾、スコア、ゲームの遷移など投稿できる条件を全て満たしました。
4日もあり、どんな絵を作るか、どんなツールを使うかを考えました。
会社の同期がExcelでドット絵を作っていたので、Excelをツールに決めました。

4日目~5日目

背景、手裏剣、忍者のドット絵・アニメーションを作りました。

6日目

ゲームタイトルはゲームの様子からつけました。
今まで9か月かけて作るのがやっとでしたが、今回は6日でできました。

 

 

次回の開催

次回は9月19日にあります。

meetup.unity3d.jp

 

 

 

 

他の方の感想ブログとか

note.com

emphasison.hateblo.jp

note.com

 

 

 

 

 

間違っている箇所、消してほしいツイートがありましたらコメントにお願いします。

【アセット紹介】Joystick Pack でバーチャルスティックを実装する【Unity】

今回はアセットの紹介をしていきます。
紹介するのはJoystick Pack。
バーチャルスティック(バーチャルパッド)を簡単に実装できる無料アセットです。

f:id:Raspberly:20200907111119p:plain

Asset Store

 

Twitterでも話題!

 

 

 

どんなアセット?

スマホ向けゲームで多く実装されているバーチャルスティックを簡単に実装できるアセットです。

↓にあるのがバーチャルスティック、コントローラーがないスマホでも本格的なアクションゲームが作成できます。
バーチャルスティックとボタンを組み合わせてバーチャルパッドと呼ばれることもありますね。

f:id:Raspberly:20200907021448g:plain

以下Asset Storeページから引用

 ジョイスティックパックには、ドラッグアンドドロップでプロジェクトで簡単に使用できる複数の異なる仮想ジョイスティックが含まれています。
このパックには18のバックグラウンドと6つのハンドルスプライトが付属しており、多くのカスタマイズが可能です。

 

 

開発環境

Unity2020.1.4f1

Joystick Pack ver2.1

 

デモシーンの確認

アセットインポート完了時はこんな感じです。
ドキュメントに目を通しておきましょう。

f:id:Raspberly:20200904014718p:plain

 

デモシーンはExamplesの中にあります。

f:id:Raspberly:20200906221019p:plain

 

実行してみるとこんな感じ、スティックを倒すとボールがコロコロ転がります。

f:id:Raspberly:20200906005501g:plain

画面の左上には、モードやスティックの値が表示されています。

 

3つのモード

このJoystickには3つのモードが用意されています。
デモシーンでは左上から変更することができます。

f:id:Raspberly:20200906230134p:plain

Fixed

スティックは常に表示され、位置が固定されているモードです。

f:id:Raspberly:20200906005501g:plain

Floating

スティックはタップされるまで非表示。
タップされたらその場にスティックが表示されるモードです。ぷにコンみたいな感じ。

f:id:Raspberly:20200907005655g:plain

Dynamic

スティックはタップされるまで非表示。
タップされたらその場にスティックが表示され、ドラッグ時に追従するモードです。

f:id:Raspberly:20200907005752g:plain

 

FloatingとDynamicは、デフォルトだと画面左側のみ反応します。
これは、VariableJoystickコンポーネントがアタッチされているオブジェクトの大きさを変えることで調整できます。

 

 

主要コンポーネント

このアセットを使いこなすうえで重要なコンポーネントを紹介します。

Variable Joystick

f:id:Raspberly:20200907013302p:plain

このコンポーネントがJoystickの挙動を管理しています。

Handle Range

ハンドル(スティックの中央の点)が動く範囲です。デフォルトで1ですが、3にすると↓のようになります。

f:id:Raspberly:20200907013848g:plain

Dead Zone

スティックの値が指定した値以下の場合反応しなくなります。
つまり、0.5を指定した場合スティックを0.5以上方向けないと反応しません。

Axis Options

軸を限定します。Bothの場合X軸Y軸ともに動作します。

Snap

通常スティックは-1~1まで値が変動しますが、
有効になっている場合、-1か0か1で取得するようになります。

MoveThreshold

スティックが移動する時しきい値です。Dynamicモードでのみ使われます。

Joystick Type

上記の3つのモードを指定します。

Background & Handle

スティックの画像を指定します。画像素材は数種類用意されています。

f:id:Raspberly:20200907024149p:plain



 

 

実際に試してみる

開発中のゲームへの導入方法ですが、付属のPrefabをシーンに追加するだけです。
Canvasの下に追加してください。

f:id:Raspberly:20200907014954p:plain

スティックの値の取得は付属のスクリプトを参考にするといいでしょう。

public class JoystickPlayerExample : MonoBehaviour
{
    public float speed;
    public VariableJoystick variableJoystick;
    public Rigidbody rb;

    public void FixedUpdate()
    {
        Vector3 direction = Vector3.forward * variableJoystick.Vertical + Vector3.right * variableJoystick.Horizontal;
        rb.AddForce(direction * speed * Time.fixedDeltaTime, ForceMode.VelocityChange);
    }
}

 

 

下記の参考資料を見ながら、ユニティちゃんをスティックで操作するものを作ってみました。
スマホ向けのバーチャルスティックは初めてですが、15分ほどで簡単に作成できました。

f:id:Raspberly:20200907021448g:plain
スクリプトはこんな感じ、スティックの傾きに合わせて向きと移動、アニメーションを行っています。

using UnityEngine;

public class UnityChanController : MonoBehaviour
{
    [SerializeField] VariableJoystick m_VariableJoystick;
    [SerializeField] Animator m_Animator;
    [SerializeField] float m_Speed  = 1;
    private CharacterController m_Controller;
    private Vector3 m_Direction;
    
    void Start()
    {
        m_Controller = GetComponent<CharacterController>();
    }
    
    void Update()
    {

        if(m_Direction != new Vector3(0, 0, 0))
        {
            transform.localRotation = Quaternion.LookRotation(m_Direction);
        }
        m_Animator.SetFloat("isMoving", Mathf.Max(Mathf.Abs(m_Direction.x), Mathf.Abs(m_Direction.z)));

        m_Controller.Move(m_Direction * m_Speed * Time.deltaTime);
    }

    public void FixedUpdate ()
    {
        m_Direction = Vector3.forward * m_VariableJoystick.Vertical + Vector3.right * m_VariableJoystick.Horizontal;
    }
}

 

 

もちろん実機でも動作します。

f:id:Raspberly:20200907023601g:plain

 

 

 

 

 

 

デモの解説 (2021/08/30 追記)

上記のデモの作り方を解説します。

開発環境

Unity 2020.3.14f1

Joystick Pack ver2.1

SDユニティちゃん 3Dモデルデータ ver1.01

 

ステージの作成とキャラクターの配置

最初にステージを作成します。
床用のオブジェクトとしてPlaneを配置し、Cameraは見下ろす形に配置します。

f:id:Raspberly:20210830212837p:plain

 

プレイヤーキャラクターのユニティちゃんも配置します。
Assets/Optimize SDKohaku-Chanz/Prefab/UTC_Defaultをシーンに配置します。

f:id:Raspberly:20210830213001p:plain

f:id:Raspberly:20210830213104p:plain

 

 

ジョイスティックの配置

Canvasを作成し、Assets/Joystick Pack/Prefabs/Variable JoystickCanvasの子オブジェクトとして配置します。

f:id:Raspberly:20210830222325p:plain

f:id:Raspberly:20210830213323p:plain

 

ジョイスティックはデフォルトで真っ白なのでやや見えづらいです。
なので色を変えておきます。(お好み)

f:id:Raspberly:20210830213518p:plain

ついでに大きさやスティックの位置も整えておきましょう。

f:id:Raspberly:20210830213616p:plain

 

 

AnimatorControllerの作成

ユニティちゃんをアニメーションさせるためAnimatorControllerを作成します。
Projectビューで右クリックしCreate/Animator ControllerからAnimatorControllerを作成します。

f:id:Raspberly:20210830213808p:plain

名前を「UTC_Animator」に変えておきます。

f:id:Raspberly:20210830213901p:plain

 

この「UTC_Animator」をダブルクリックして、Animatorビューを開きます。

f:id:Raspberly:20210830214339p:plain

パラメータの作成

Animatorビュー左上のParamertersボタンを押して、+ボタンからFloatを選びFloat型のパラメータを作成します。

f:id:Raspberly:20210830214510p:plain

パラメータの名前は「isMoving」にします。(作り方までGIF参照)

f:id:Raspberly:20210830214758g:plain

BlendTreeの作成

BlendTreeを作成します。BlendTreeはパラメータを元にアニメーションを自然に切り替える機能です。

Animatorビューの何もない所で右クリックしCreate State/From New Blend TreeからBlendTreeを作成します。

f:id:Raspberly:20210830215014p:plain

作成したBlendTreeをダブルクリックします。

f:id:Raspberly:20210830215057p:plain

 

するとBlendTreeの編集画面が開けます。

f:id:Raspberly:20210830215238p:plain

InspectorビューからMotion Fieldを2つ追加します。(GIF参照)

f:id:Raspberly:20210830215456g:plain

 

モーションを設定するフィールドが2つできたので、
止まっているモーション「StandA@loop」と、
走っているモーション「run_front@loop」をそれぞれ設定します。

f:id:Raspberly:20210830222103p:plain

モーションは2つともユニティちゃんのアセットに含まれているものです。

 

AnimatorControllerの設定

作成した「UTC_Animator」をユニティちゃんのAnimatorにアサインします

f:id:Raspberly:20210830214056p:plain

 

 

Scriptの作成

ジョイスティックの入力を受け取り、アニメーションの再生とキャラクターの移動を行うScriptを作成します。

以下のUnityChanController.csを作成します。(ちょっと改良しています)

using UnityEngine;

[RequireComponent(typeof(CharacterController))] public class UnityChanController : MonoBehaviour { [SerializeField] VariableJoystick m_VariableJoystick; [SerializeField] Animator m_Animator; [SerializeField] float m_Speed = 1; private CharacterController m_Controller; private Vector3 m_Direction; void Start() { m_Controller = GetComponent<CharacterController>(); } void Update() { if(m_Direction != new Vector3(0, 0, 0)) { transform.localRotation = Quaternion.LookRotation(m_Direction); } m_Animator.SetFloat("isMoving", Mathf.Max(Mathf.Abs(m_Direction.x), Mathf.Abs(m_Direction.z))); m_Controller.Move(m_Direction * m_Speed * Time.deltaTime); } public void FixedUpdate () { m_Direction = Vector3.forward * m_VariableJoystick.Vertical + Vector3.right * m_VariableJoystick.Horizontal; } }

 

作成したUnityChanControllerをユニティちゃんオブジェクトにアタッチします。
同時にCharacter Controllerという移動を制御するコンポーネントも自動でアタッチされます。

f:id:Raspberly:20210830220514p:plain


参照の紐づけ

最後にUnityChanControllerのVariableJoystickに、Canvasの中に配置したVariableJoystickを、
AnimatorにユニティちゃんにアタッチされているAnimatorを紐づけて完成です。

f:id:Raspberly:20210830221237p:plain

Speedはデフォルトで1になっていますが、結構遅いので3とかにしておくといいかも。

 

 

完成

これで完成です。ゲームを起動するとジョイスティックの傾きに反応して移動とアニメーションが行われます。

f:id:Raspberly:20210830221438g:plain



 

まとめ

Joystick Packを使うことで簡単にバーチャルスティックを実装することができました。
スマホ向けアクションゲームを作る時などにご活用ください。

 

 

 

参考資料

light11.hatenadiary.com

tsubakit1.hateblo.jp

enjoy-freely.com

 

 

 

他のアセットの紹介記事はこちら↓

raspberly.hateblo.jp

 

 

他、間違っている箇所、わかりにくい所がありましたらコメントにお願いします。

【勉強会レポ】: xR Developers Community Conference VRM勉強会

勉強会のレポート(メモ)です。
参加したのはこちら「xR Developers Community Conference」。
xR Tech Tokyo・Tokyo HoloLens ミートアップ ・VRM勉強会・withARハッカソンの合同オンライン勉強会です。

このレポではVRM勉強会をメインにしています。

vrtokyo.connpass.com

ハッシュタグ : #xRDCC, #VRM勉強会

 

 

それぞれのコミュニティの紹介

以下イベントページからの引用です。

xR Tech Tokyo

xR Tech Tokyo は、2016年からおおよそ隔月で開催している VR, AR, MR 関連の開発者向け勉強会イベントです。
現在は WebXR に特化した WebXR Tech Tokyo という形で実施しています。

https://vrtokyo.connpass.com/

個別ハッシュタグxRTechTokyo

運営: @ikkou

HoloLens ミートアップ

HoloLensアプリ開発で著名な方々に登壇いただき、HoloLensに向いたアプリ、VR/MRに向いたアプリの特長や、HoloLensアプリ開発の裏話をお話しいただきます。

HoloLensを持っていない方も参加可能です!ご興味のある方は是非ともご参加頂き、HoloLensを含めたWindows MixedRealityの世界を覗いてみてください!

https://hololens.connpass.com/

個別ハッシュタグHoloMagicians

運営: @morio36

VRM勉強会

VRアバターの共通規格「VRM」に関する知見共有やアプリ自慢をする勉強会

https://vrm.connpass.com/

個別ハッシュタグVRM勉強会

運営: @nkjzm@toRisouP

withARハッカソン

ARエンジニアと異業種のクリエイターが共創するハッカソン。 8/30~9/6に夏まつりwithARハッカソン開催中!

https://withar.connpass.com/

個別ハッシュタグwithARハッカソン

運営: @iwaken71@Ossy_Oshida@tom_nike@expo2025jp

 

 

 

アーカイブ動画

全てアーカイブとして残っています
セッション間の雑談も見どころです

xR Tech Tokyo

公開されました

www.youtube.com

HoloLens ミートアップ

www.youtube.com

VRM勉強会


【VRM勉強会枠】xR Developers Community Conference #xRDCC #VRM勉強会

withARハッカソン


【withARハッカソン枠】xR Developers Community Conference #xRDCC #withARハッカソン

 

 

 

 

C-1 VRM 1.0で使用可能になるConstraintについて

VRM 1.0はどうなっているの?

運用体制に問題がありしばらく動きがありませんでしたが
現在はGitHubのissueベースで進めています。

↓こちらで、企画に関してのissueを受け付けています。
https://github.com/vrm-c/vrm-specification/projects/1

VRM 1.0におけるConstraint

現在議論・実装が進んでいます。具体的な議論はこちら。

github.com

 

現在決まっているConstraintがこの3つ

・Position Constraint ソースとなるノードの移動に追従
・Rotation Constraint ソースとなるノードの回転に追従
・Aim Constraint ソースとなるノードの位置を向くように回転させる

ただしVRMに載せるにあたり制約をしています。
様々なプラットフォーム、実装、アプリケーションでリアルタイムに処理をするためにシンプルにしています。

UniVRM 1.0の試し方

Unity2019.4以降で、Packagesフォルダのmanifest.jsonに追記するだけ。
UniVRM 0.xxで作られたVRMファイルも読み込めます。

SpringBoneのカプセルコライダやConstraintが使うことができます。

 

ここでデモタイム(動画を見てね)

 

注意事項

VRM 1.0のフォーマットはこれから変更される可能性が高いので、
(混乱のもとになるので)流通させないでください。

フィードバックをください

GitHubのissueや、「#VRMなんもわからん」でつぶやいてください

Issues · vrm-c/vrm-specification · GitHub

 

 

 

 

C-2 「VRMアバター時代のPNG」から考えた、透過撮影アプリ制作の話

 

VRMを読み込んで、透過しながらポーズや表情を切り替えて撮影をできるアプリを作りました。

booth.pm

 

今回は「アバター時代のPNG」と概念からどういうアプリが作れるか考えたことをお話します。

VRM いろいろある

モデルには身長やアクセサリーなど様々なものがある。やれることも様々ある(ポーズやライティングなど)

VRMアプリを作るときに、様々なモデルに対応することは必須として、「なにをするか」に焦点を絞らないと作れなくなってしまう

アバター時代のPNG」とは

これはエクシヴィの@GOROmanさんの発言です。この思想にかなりの影響を受けました。

PNG感覚で使えるデータで考えた場合Instagramnをイメージしました。
同じようにVRMでポーズとアプリを選んで良い感じの画像を作れるアプリを作ってみようと立ち上げました。

やらないことを決めた

プログラミングや3DCGができる人が考えるようなことを考えなくても使えるようにしました。
微調整などはカットしています。

カメラ・ライティング・ポージング・切り抜きなどについて考えなくてもいいことを目標にしました。

どういう風に実装したか

FOVの設定

一番困ったところです。VRMはいろいろあるので最適な設定というものがない。
なので並行投影にしどんなモデルでも許容範囲になるようにしました。

ライティング

サムネやグッズを作ることを想定したので影はでないほうが扱いやすいため出ないようにしました。

カメラの画角

勝手にいい感じに画面に収まるようにしました。
頂点座標とワールド座標を求めて、それが収まるようにカメラをサイズを変更するようにしています。
アクセサリーや武器を持っている場合、普通のMeshRendererのことがあるのでMeshFilterも計算対象にしています。

Standard Shaderのハマりどころ

 

ビルド時にStandard Shaderが含まれていないとエラーでハマリます。
Project Settingで設定しましょう。

VRMのライセンス表記

えむにわさんのVRMLoaderUIで解決しました。

github.com

これを呼ぶだけで、ファイル選択とライセンスの表示とシーンの読み込みをお任せできます。

ドキュメントにない変数を探す

VS Codeの補完機能に頼り探しました。
初心者の方には有効な手だと思います。

 

 

 

 

 

C-3 モバイルファーストなアプリを作るためにvearがしたこと

vearとは

iOS向けのアプリで、アバターをフェイスモーフィングし撮影や配信をするアプリです。

vear - バーチャルライブ配信アプリ

vear - バーチャルライブ配信アプリ

  • Tomoya Hirano
  • ユーティリティ
  • 無料

apps.apple.com

アバターから意識を逸らせる理由

撮影や配信といった提供したい価値にフォーカスさせるため
アバターのアプリは動かして満足してしまいがちで、本来の目的に到達できないことも多い

アバターを使ったアプリは大きく分けて2つある

着ぐるみ式

人間とアバターを同期させる手法、キャラクターになりきることが特徴
動かしたうえで演技や行動をすることが目的

パペット式

アバターを第三者視点で操作する
動かすことが目的

 

着ぐるみ式の方では、動かすことにフォーカスしてしまうと目的に到達することができない。
なので、アプリを起動したらすぐにアバターが動く状態にしておくのが(重要)

着ぐるみ式の弱点

没入感から放り出されやすい、特にアバターをメタ視点で見せてしまうと没入感が損なわれる

没入感が損なわれるとどうなるか

「なにをしようか」ではなく「誰になろうか」という点に関心が向いてしまう。
スマホアプリの場合、起動してから落とすまで3分から10分とライフサイクルが短い。
なのですぐに没入させて、それを維持するのが大事。

違和感を減らすためにしたこと

ARKitから取れる情報はなるべく反映する

回転のみでなく、位置情報、瞬きなどを反映するとユーザーとのシンクロ率が上がります。

現実と乖離する部分は隠す

ラッキングが外れてもホームポジションに移動させたり、画面端に出しっぱなしにしない。

できない事はしない

操作している感じを出さない、シンクロできる動きだけを実装する。中途半端になるなら実装しない。
全身のトラッキングはできないので、できない部分は隠す。

違和感をなくした後

この時点で普通のカメラアプリと同じ土俵に立てます。
ユーザーがアバターなのか人間なのか気にする必要がなくなるため、
人間向けのカメラアプリの機能(フィルターやジェスチャーなど)を再利用できる。

共通認識を上手に使う

カメラアプリらしい見た目からはずれない。どこを押せばシャッターが切れるかわかりやすいようにするなど。
OSのデザインに沿ったUIを使いましょう。iOSの場合はヒューマンインターフェースガイドラインに沿うといいです。
これに沿わないとアプリの世界観に合わず、ゲームっぽく見えてしまう。

 

 

 

 

C-4 Unityで作ったVRMポーズをUE4でも使う!

www.slideshare.net

話すこと

UE4でゲームを作る話とVRM4Uについてはお話しません。
それらについてはこちらをご覧ください。

www.youtube.com

ruyo.github.io

 

COCOPStudioで作ったポーズをUE4で使うお話を今回はします。

COCOPStudioとは

Unity製のアプリです。ポーズの作成・修正・保存・読み込み・透過PNGの出力ができます。
出力してゲームに取り入れたり、マンガの制作に使うことができます。
AndroidWindows向けに配信しています。iPad版はもう少しで公開できるかも。

ポーズの集合サイトも作っています。

cocop.site

UnityからUE4へポーズを渡す

ポーズのデータを渡す時に問題になるのが軸の違い

Unityは左手系のYup、UE4が右手系のZupです。これを変換してあげればよい。
UnityのRotationを、UE4のRotationを変換してもうまくいきませんでした。
Unityは内部でQuaternionを使っています、なのでRotationではなくQuaternionを使うことにします。
UnityのQuaternionをUE4のQuaternionに変換し、そこからRotationに変換してできました。

 

これはCOCOPStudioの方に自動化機能として組み込んでいます。

 

受け取り側 UE4のエディタ拡張

COCOPStudioから出力されたJSONUE4にD&Dするだけ。
後はボタンを押したらポーズが全て読み込まれるエディタ拡張を作りました。

これは9月中にデスクトップ版で配布予定です。

 

 

 

 

C-5 USBカメラモーションキャプチャー「ThreeDPoseTracker」

ThreeDPoseTrackerとは

USBカメラでモーションキャプチャができるソフトウェアです。
動画からもキャプチャできます。対象は一人のみで、強いPCと撮影環境が必要です。
ソースはGitHubにあります。

github.com

使い方

※デモ動画流れるのでアーカイブ動画を参照してください

 

宣伝

Hubs Cloudとは
ブラウザで動く開発中のソーシャルVRです。
インストール不要でスマホのブラウザからも動きます。
評価用のサイトを立ち上げています。

https://digi-rooms.com/

最後に

まだまだベータ版です
動画の投稿をしてもらうと励みになるのでお願いします。

 

 

 

 

 

 

他の感想ブログとか

chomado.com

ja.algonote.com

 

 

 

 

おまけ

Quaternionについてはこちらがとても参考になります。

www.youtube.com

 

 

 

間違っている箇所、消してほしい所がありましたらコメントにお願いします。