バーチャル広島市の作り方（Blender + Unity + cluster）

公開日： 2022/02/24 : 最終更新日：2022/04/02 blender, cluster, Unity

cluster にこんなワールドをアップしてます。

バーチャル広島市です。

https://cluster.mu/w/1c122c1c-4648-4bdf-9b01-92679e347c64

バーチャル広島市を新幹線から広島に降り立ったイメージにしてみました。路面電車、JR、車、タクシーに乗れますよ。 #cluster https://t.co/4FSsKVndVU pic.twitter.com/s0NRdXzVBl

— たつや (@tatsuya1970)

January 22, 2022

路面電車に乗れます。

JRにも乗れます。

マツダロードスターもどきでドライブもできます。

とはいえ実は私は１つもモデリングしてません。

全部、Unity アセットストアや、BOOTH などから頂戴してます。

では、まだまだ未完ですが、自分の備忘録を兼ねて、ざーっと雑に作り方をご紹介します。

環境・使用ソフト

・Windows 10 （Macでは後述のアドオンが使えないらしい　※未確認）

・Blender 3.00

・Unity 2019.4.22f1　※clusterのワールド対応のUnityのバージョン

※clusterにワールドをアップロードするには、別途clusterSDKが必要。

詳しくはこちら

Cluster Creators Guide

「cluster」のアカウントを作成する

https://creator.cluster.mu/2020/04/01/「cluster」のアカウントを作成する/

「Creators Guide」は、バーチャルSNS「cluster」で「つくる」ことにチャレンジしてみたい方…

広島市の地図をインポート

まずは、Blender を開き、地図３Dデータの取得します。

以下のサイトを参考にしました。

https://styly.cc/ja/tips/jp-blender-gis-2/

https://snownotes.org/how-to-make-3d-terrain-using-blendergis/

標高を考慮したデータを作る場合はOpenTopography のアカウントが必要なので、アカウントを作成しAPIキーを入手する。

https://opentopography.org/

以下のGITHUBからZIPファイルをダウンロード（ZIPファイルは解凍しなくてもいい）

https://github.com/domlysz/BlenderGIS

Blenderを開き、

編集→プリファレンス→インストールから、ダウンロードしたアドオンを選択し、インストールする。

187b33dbc369850cfd5b603fa195ffae

次に、プリファレンス画面の
BasemapsのCache folderに、PCのどこかのフォルダを割り当てる。

Acb2a9567a701b4b464084d97904587a

Elevation serverの部分で「OpenTopography SRTM 30m」を選択し、Editを選び、URL templateに以下のURLと自分のAPIキーを入力する。

さきほど紹介した参考サイトでは、APIキーを以下の２パターン紹介してる。

パターン１

https://portal.opentopography.org/API/globaldem?demtype=SRTMGL1&west={W}&east={E}&south={S}&north={N}&outputFormat=GTiff&API_Key=自分のAPIキー

パターン２

https://portal.opentopography.org/API/globaldem?demtype=SRTMGL1&west=1&east=2&south=3&north=4&outputFormat=GTiff&API_Key=自分のAPIキー

04b531f74a7c6daa88aa677bad6fc88a

これで準備完了。

GIS > Web geodata > Basemap

GoogleMaps など選べますが、

著作権の扱いが怖かったので、OpenStreetMapを選びました。

OpenStreetMap のサイトを見る限り、clusterの　本ワールドのトップページにコピーライトを記載してるから大丈夫だと思う。（違ったら教えてください）

https://www.openstreetmap.org/copyright/ja

モデル化したい範囲を出して、

「E」を押すと

切り出してくれます。

広島市内全域を切り出したかったのですが、

Too Large Extent

とエラーが出て断念しました。

高低差の情報を取得します。

GetSRTMを選択

高低差の情報が埋め込まれ、メッシュが変形しました。

Web geodata > GetOSM

建物や道路、線路、川の情報を読み込みます。

建物は読み込めたのですが、道路、線路、川の情報は読み込めなかったようです。

（よく分かってない）

※FBXにしたとき、地図のテクスチャは読み込めなかったので、直接こちらから画像を取得して、自分でマテリアルを作りました。

C532e63b3141c6f5fd2077468dfc064c

川

belnderでさきほど読み込んだ Open Street Map に穴を開けて川を作りました。

オブジェクトモードで、

追加＞メッシュ＞立方体

川のところへもっていく

穴を開けるほうを選択し、

モディファイアプロパティ（スパナアイコン）＞モディファイアーを追加

ブーリアンモディファイアを選択

差分　＞　オブジェクトのスポイトを選択

スポイトでさきほどの立方体を選択

ドロップダウンで「適用」を選択

立方体を移動または、消去すると

このように穴が開きました。

Unity にインポートし、穴が開いたところに、Planeオブジェクトを重ね、PlaneのMesh Renderer の Material に水のシェーダーをかけると、以下画像のようになります。（雑）

水のシェーダーはこちらを使いました。

https://booth.pm/ja/items/2184916

路面電車

こちらのモデルを使いました。

https://booth.pm/ja/items/2611961

Inspector はこちら

実際の市電の路線を通るようにアニメーションをつけてます。

路面電車の席に座れる設定をしてます。

座りたいところに cube 、　座るポジションに空のobjectを配置、

Inspector に　clusterSDK の Item と　Ridarble Item　を付けてます。

これでこんな感じに座れます。

「バーチャル広島市」で路面電車に乗れるようにしました。
広島駅から原爆ドームまで路面電車の旅。（1.7倍速）#Cluster https://t.co/4FSsKVFna2 pic.twitter.com/A0GtGP8eVo

— たつや (@tatsuya1970)

January 5, 2022

JR電車

モデルはこちら

https://booth.pm/ja/items/3247209

これも座れる設定にしてます。

設定方法はさきほどの路面電車と同じ。

実際のJRと同じ軌道を走ります。

さきほどの路面電車と同じくアニメーション設定をしています。

あとは、自動ドアを実装したいところです。

今日は「バーチャル広島市」にJR電車を追加しました。
広島駅から西広島駅まで（1.7倍速）#Cluster https://t.co/4FSsKVFna2 pic.twitter.com/H1TSTzcmxO

— たつや (@tatsuya1970)

January 6, 2022

呉行きのJRに乗ると、他のワールド（バーチャル呉）へワープする設定にしてます。

異動したいところにこのアセットを置いて、

https://assetstore.unity.com/packages/vfx/shaders/time-reality-warping-effects-138314

Box Collidar を入れて、

cluster SDK の World Gate をアタッチしてます。

バーチャル広島市から呉線に乗ってバーチャル呉へワープするのを追加しました。途中沿線にはマツダスタジアムもどきもw　#cluster https://t.co/4FSsKVFna2 pic.twitter.com/iBSaUigHha

— たつや (@tatsuya1970)

January 10, 2022

自動車

マツダロードスターっぽい自動車のアセットはこちら

https://assetstore.unity.com/packages/3d/vehicles/land/gr3d-convertible-sports-car-011518sscr-140511

運転できるようにしてます。

設定方法は　以下のInspector を参考にしてください。

「バーチャル広島市」でドライブできるようにしました。是非遊びにきてください！！
Be a driver! 　#cluster https://t.co/4FSsKVFna2 pic.twitter.com/Myc2JqTl3c

— たつや (@tatsuya1970)

January 9, 2022