8. 2Dワールド作り
17 分
もっと速く、もっと手軽にワールドを作れる2dワールドを公開します。 自分だけの背景画像とポータル接続だけで、素早く簡単にワールドを作ってリリースできます。 既存のビルドイットunityプラグインプロジェクトに2d worldパッケージをインストールして使用できます! 適用方法 unity hubでビルドイットプラグインフォルダを選択し、openボタンを押してください。 📘 note もし初めての場合は、 1 インストール docid\ kpg7fastgn 3gbp2dp8wk に従ってビルドイットunityプラグインを先にインストールし、基本操作を身につけてください。 ビルドイットプラグインプロジェクトが開いたら、上部の zepeto > buildit plugin package manager > 2d world を選択してください。 importを押して、すべての構成要素を取り込んでください。 3番の手順を完了すると、assets > zepeto 2d world フォルダが作成されます。 フォルダ内にある 2dworldscene ファイルをダブルクリックして開いてください。 上部でアカウントにログイン後、マルチプレイサーバーをonにして、playボタンを押すと2dワールドをプレイできます。 2dワールド機能 ビルドイットプラグインの 基本モジュール機能 を使用できます。 ボイスチャット、クイックチャット、ジェスチャー、スクリーンショット/画面録画、ワードローブ、bgm機能を使用できます。 横/縦モード切替機能 を提供しています。 ローディング画面 を変更できます。 マップの 背景 を変更できます。 好きなだけマップを追加し、 ポータル を接続して創造的な空間を制作できます。 マップ数に制限はありませんが、zepeto studioにリリースする際は、ビルドファイル容量が1gb以内で、最適化ガイドを逸脱しない数値である必要があります。 bgm を変更できます。 2dワールドのため、3dオブジェクト配置は雰囲気に合わないのでおすすめしません。 背景とポータル接続だけで素早く簡単にワールドを作ることが目的です。 2dワールドを作る 2dworldsceneの基本構成 基本的にローディング画面および2つのマップがポータルで接続されたサンプルが含まれています。 作業の利便性のため、 unityエディタのsceneの2dメニューをクリックしてください。 ローディング画面 managers > loadingscreen オブジェクトをinspectorで有効化チェックすると、ローディング画面機能を使用できます。 ローディング画像として使う画像をassetsにドラッグして追加し、texture typeを sprite(2d and ui) に変更してから apply を押してください。 managers > loadingscreen > image を選択してください。 先ほど追加したローディング画像をドラッグして、imageオブジェクトの sourceimage プロパティに入れるとローディング画像が変更されます。 managers > loadingscreen > text(tmp) を選択してください。 textmeshpro text(ui) 部分にローディングテキストを入力してください。テキストが不要なら空欄のままでも構いません。 managers > loadingscreen > delay after ready は、zepetoキャラクター生成後にローディング画面が維持される時間(秒)を示します。デフォルト値は 0 1 です。 キャラクター移動速度を変更する managers :キャラクターの移動速度を調整できます。 run speed :キャラクターの走る速度を調整できます。 walk speed :キャラクターの歩く速度を調整できます。 ジャンプ機能 は2dワールドでは 使用できません。 マップを修正する マップの背景画像変更、ポータル変更、キャラクター移動可能エリア変更、bgm変更、マップタイトル変更ができます。 背景画像を変更する hierarchyで zepeto2d bg オブジェクトを選択してください。 sprite renderer > sprite: 任意の画像をドラッグして背景を変更できます。 rebuild borders2d: 画像を変更した場合は 必ず このボタンをクリックしてください。画像サイズに合わせて外枠の移動可能エリアである boxcollider2d を生成 します。 border2d top をmoveツールで移動し、画像上の床境界部分に位置させてください。 他のborderは別途修正しなくても構いません。 マップサイズは元画像サイズに合わせて生成されますが、transformのscale値を入力して希望の大きさに調整できます。 推奨元画像サイズ: 3400×1530px 横スクロール可能な2d背景画像サイズです。推奨サイズと異なっていてもワールド制作には問題ありません。 ポータルを接続する hierarchyで zepeto2d bg オブジェクトを選択してください。 linked portal obj: キャラクターがポータルのbox collider領域内に入るとポータルが有効化され、ボタンをクリックすると接続先へ移動します。目的地ポータルをドラッグして追加してください。 interact button text: ポータルボタンに表示されるテキストです。接続されたポータルがない場合はテキストが表示されません。 show map title toast: チェックするとポータル移動時に入力したmap titleが表示されます。 map title: 名前テキストです。 zepeto2d bg > create portal2d(child) から追加ポータルを生成できます。 bgmを変更する hierarchyで zepeto2d bg > bgm オブジェクトを選択してください。 bgm audio source に任意の音楽をドラッグして変更してください。 マップごとに異なるbgmを設定できます。 マップタイトルuiを修正する managers > uitoolbar > maptitletoast の rect transform の位置値を修正して、タイトルが表示される位置を変更できます。 managers > uitoolbar > maptiltetoast>background でcolorを修正したり、カスタム画像を使用できます。またrect transform値を修正して背景領域サイズを変更できます。 managers > uitoolbar > maptiltetoast>background>text(tmp) を選択して、font sizeとvertex colorで文字色を変更できます。 マップを追加する 上部の zepeto 2d > create bg を押して新しいマップを追加できます。 新しく追加したマップも同じ方法で画像を変更し、ポータルを接続してください。 npcを追加する 2dワールドでは、 会話ができるnpc を使用できます。 サンプルシーンに配置されたnpcを修正するか、上部の zepeto 2d > create zepetonpc をクリックしてzepeto npcを追加してください。 hierarchy で、作成された zepetonpc を選択します。 zepeto id 使用する zepeto アカウントの id を入力します。 npc name 画面に表示される npc の名前を入力します。 dialogue id 使用する dialogue id を入力します。 dialogue id は、 npc dialogue editor で作成された dialogue の固有値です。 📘 note dialogue(対話)設定の詳細については、 npc dialogue の設定 docid\ ys6zo0wwdusltu lt0ldk セクションを参照してください。 sprite npcを追加する sprite npc 機能を使用すると、インポートした任意のカスタム画像を npc にすることができます。 上部のメニューから zepeto 2d > create spritenpc を選択します。 hierarchy で、作成した spritenpc を選択します。 sprite npcとして使用する sprite を設定できます。 npcとして使用したい画像を project パネルに追加します。 背景が透明な png 画像を使用してください。 推奨画像サイズ 720 720 推奨サイズでなくても、テストしながら unity 内で scale を簡単に調整できます。 インポートした画像を選択し、 inspector > texture type を sprite (2d and ui) に変更します。 変更後、下部の apply をクリックして適用します。 sprite npc の inspector > sprite renderer > sprite を、新しくインポートした sprite に変更します。 npcのサイズを調整したい場合は、 transform > scale > x, y の数値を変更してみてください。 inspector > sprite renderer > flip を使用して、画像を水平・垂直方向に反転させることもできます。 play を押して、カスタム画像で作成した sprite npc が正しく表示されるか確認します。 インタラクションの距離を調整したい場合は、sprite npc を選択し、 inspector > box collider > size > x, y, z の数値を調整してください。 npcを配置する際は、ポータルや他のnpcと重ならないように 注意してください。 📘 note dialogue(対話)設定の詳細については、 npc dialogue の設定 docid\ ys6zo0wwdusltu lt0ldk セクションを参照してください。 ad teleport 2dを配置する ad teleport 2d オブジェクトを配置して、2dワールドでも収益を得ることができます。 ユーザーが広告視聴しないと動作しないteleportを通じて、自作ワールドで楽しさと収益を一緒に得てみてください。 ad teleport2d オブジェクトは、既存のadvertisementオブジェクトと同様に動作する2dワールド専用オブジェクトです。 build it asset browser > 2d の adteleport2d オブジェクトを選択してください。 scene で好きな位置にドラッグして配置してください。 hierachy で、 配置したいbgの子要素 として配置したadteleport2dオブジェクトを入れてください。 到着地点にしたい位置に adteleport2d > destination オブジェクトを配置してください。 到着地点を別のbgに配置したい場合は、該当bgの子に空のgameobjectを配置した後、 adteleport2d > inspector > zepeto script > destination に生成した 空のgameobject を入れてdestinationとして使用できます。 adteleport2dオブジェクトのテスト はunityでは不可能で、モバイルで行う必要があります。 zepeto studio にビルドファイルを登録して実施できます。 4 ワールドをテストする docid 3cs1bqivmh ayi7hsehsa 2dワールド制作のヒント 各マップのz座標はデフォルト値の100に固定し、x, y値を調整して配置する方法を推奨します。 sceneでマップが重なる場合、マルチプレイ時に別マップのプレイヤーが画面に見えることがあるため、下の例のように マップ間の間隔 を空ける必要があります。 ai生成画像を使用しても構いません。 zepeto studioにリリースする際、ai画像であることをワールド説明に明記してください。 💡 空間感のあるai画像を生成するには、次のようなプロンプトを使ってみてください。 \[空間コンセプト]のシーン。 広く奥行きが感じられる構図で、カメラ視点が空間の内側へ自然に続く。中央または一点に視線が集まる遠近感(消失点)が強調された構図。床の反射光、空気中の霧や光の筋、影のコントラストによって現実的な空間の奥行きを表現。立体的な照明と写実的な質感が調和し、空間の雰囲気が生き生きと伝わる。シネマティックな構図と写実的な照明、ディテールのある質感表現。高解像度、深い遠近感、前後に自然にボケる焦点効果。 画像追加とポータル接続、bgmだけで、簡単に自分だけの空間を作ってみてください!
