--- title: 製品サンプルの活用 slug: world-sdk-guide-ja/TFAbqvKH6P1iPr_mnq6kC docTags: createdAt: 2024-09-02T08:34:13.134Z --- ## ステップ 1 : ZEPETO製品サンプルの開始 :::hint{type="info"} - ZEPETO製品サンプル - [https://github.com/naverz/World-Tutorial/tree/main/Product](https://github.com/naverz/World-Tutorial/tree/main/Product) - ZEPETO製品APIリファレンス - [\[ZEPETO製品API\]](https://developer.zepeto.me/docs/product/) ::: 以下はZEPETO製品のサンプル実装です。 ZEPETO製品システムを理解するために、サンプルの実装を理解するためのガイドに従うことをお勧めします。 サンプルには、通貨システム、在庫システム、アイテム取得、購入、UIリソースの例が含まれています。 ![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-nFL9nvfD-mKEV78j1QqD6-20240904-102419.png) :::hint{type="danger"} **❗️ 注意** - ZEPETOワールドを作成する際に、サンプルで提供されているUIリソースやスクリプトを自由に使用してください。 - ただし、ZEPETOワールド以外の公開サンプルのリソースを使用することは禁止されています。 ::: ### ZEPETO製品のサンプルを適用する方法 1. サンプルで使用されているのと同じ名前の通貨と製品をZEPETO Studioに登録してください。（通貨IDと製品IDが異なる場合、サンプルとリンクできません。） - 通貨 | **ID** | **通貨名** | | ------ | ------- | | 星 | 星 | | エネルギー | エネルギー | - アイテム製品 | **ID** | **名前** | **販売通貨** | **価格** | **タイプ** | | ------ | ------ | -------- | ------ | ------- | | ノート1 | ノート1 | 星 | 10 | 非消耗品 | | ポーション4 | ポーション4 | エネルギー | 4 | 消耗品 | | ポーション3 | ポーション3 | エネルギー | 3 | 消耗品 | | ポーション2 | ポーション2 | エネルギー | 2 | 消耗品 | | ポーション1 | ポーション1 | エネルギー | 1 | 消耗品 | - 通貨パッケージ製品 | **ID** | **名前** | **販売通貨** | **価格** | **パッケージ構成** | | ------- | ------- | ---------- | ------ | ----------- | | energy4 | energy4 | ZEPETO ZEM | 4 | energy, 40 | | energy3 | energy3 | ZEPETO ZEM | 3 | energy, 30 | | energy2 | energy2 | ZEPETO ZEM | 2 | energy, 20 | | energy1 | energy1 | ZEPETO ZEM | 1 | energy, 10 | - アイテムパッケージ製品 | **ID** | **名前** | **販売通貨** | **価格** | パッケージ構成（アイテム） | | ---------- | ---------- | ---------- | ------ | ------------- | | ポーションパッケージ | ポーションパッケージ | ZEPETO ZEM | 3 | ポーション4, 3 | ::Image[]{src="https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-8CgcTFQAASqbsgbGvqqWb-20240904-102419.png" size="92" width="704" height="465" position="center" caption="パッケージ構成の例" showCaption="true"} 2\) アセット/ProductSystem/Prefabにある製品キャンバスをシーンにインポートします。 ![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-aAFHUauSvVyZd_gPb4BgU-20240904-102419.png) 3\) プロジェクトのプロジェクト設定 > ZEPETOサービスを開いて、ワールドが正しく接続されているか確認してください。 ![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-rdtsmEyEXSdMq9z3h6-0x-20240904-102419.png) 4\) Unityメニューバー > ZEPETO > 製品 > 設定を実行します。 - 通貨と製品リストが正しく表示されていれば、リンクは成功します。 ::Image[]{src="https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-nh1t1NNg_Cmj5I69FmvJ3-20240904-102419.png" size="80" width="445" height="179" position="center" showCaption="false"} - Assets>Product>Resourcesフォルダー内のアイコン画像が設定されていることを確認できます。 ::Image[]{src="https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-XiPj2cHCp4Xsq8wRH1uZd-20240904-102419.png" size="64" width="518" height="540" position="center" showCaption="false"} - お好きな画像を使用して製品のアイコン写真を登録できます。 ![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-kUSSiKBhBObiHCoLKSGrP-20240904-102419.png) :::hint{type="danger"} **❗️ 注意** - 製品が正しく表示されない場合は、以下を確認してください。 - Unity Editorにログインしているアカウント情報が、World idの作成者の情報と同じであることを確認してください。 - Project Settings > ZEPETO Serviceの接続されたWorld ID情報が正しいことを確認してください。 - サンプルで使用されているのと同じID通貨と製品を登録していることを確認してください。 ::: 5\) マルチサーバーをオンにして、サンプルを実行するために再生ボタンを押してください。 ![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-72OBUpZxoQ5VhFaD5dq4l-20240904-102419.png) ## ステップ2 : ZEPETO製品サンプルの理解 ::embed[[https://www.youtube.com/watch?v=JIzXEaq_nv8](https://www.youtube.com/watch?v=JIzXEaq_nv8)]{url="https://www.youtube.com/watch?v=JIzXEaq_nv8"} ◦ エネルギーを得る : ボタンをクリックすると、エネルギー製品が1つ得られます。 ◦ エネルギーを使用する : ボタンをクリックすると、エネルギーアイテムを1つ差し引くことができます。 ◦ EXPを増加させる : ボタンをクリックして、経験値を10得ます。経験値を得てレベルが上がると、5つのスター通貨が得られます。 ◦ ランダムアイテムを取得する : ボタンをクリックして、4つのポーションアイテムのうちの1つをランダムにインベントリに追加します。 ◦ 即時購入 : ボタンをクリックすると、エネルギーアイテムを1つ差し引いてポーション1を購入できます。購入ウィンドウは表示されず、購入したアイテムはすぐにインベントリに入ります。 ◦ UIを通じて購入 : ボタンをクリックすると、購入ウィンドウが表示されます。購入ウィンドウから10スター通貨を差し引いてノート1を購入できます。 ![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-d40fwF8IohTCVjFlC2Gmi-20240904-102419.png) ◦ アイテムパッケージを購入 : ボタンをクリックすると、購入ウィンドウが表示されます。購入ウィンドウからZEPETO ZEMを差し引いてポーションパッケージ製品を購入できます。 ![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-N1PK3aQ1VvMLbKX3Kz1JT-20240904-102419.png) - バッグアイコン：ボタンをクリックすると、インベントリウィンドウが表示されます。所持しているアイテムのリストを確認し、選択して使用することができます。 ![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-ai2kdRVt2Qamm31-D2vAA-20240904-102419.png) - ショッピングカートアイコン：ボタンをクリックすると、エネルギー通貨の購入ウィンドウが表示されます。購入ウィンドウからZEPETO ZEMを差し引いて通貨パッケージ商品を購入できます。 ![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-8aWczQeydOhHMFdB6d8FG-20240904-102419.png) ### ZEPETO製品テストの注意事項 - マルチサーバーがオンのとき、ZEPETO製品テストはサンドボックスサーバーで可能です。 - エディターで行った変更はZEPETOスタジオに反映されません。 - プレテストおよびリリースされたワールドに対する変更はZEPETOスタジオに反映されます。 - マルチサーバーがオフのとき、サンドボックステスト環境が初期化されます。（ZEPETOスタジオのデータで初期化されます。） - 消耗品でないアイテムのテスト - マルチサーバーがオンの場合、一度購入すると再度購入することはできません。 - マルチサーバーをオフにすると、テスト環境が初期化されるため、再度マルチサーバーをオンにすると購入できます。 - ワールドカバー画像を登録しないと、製品テストを適切に行うことができません。ワールドカバー画像がZEPETOスタジオに正しく登録されているか確認してください。 ![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-nb8KoXn2I06B4uYkuoGt8-20240904-102419.png) ## ステップ 3: 商品購入後のコンテンツの実装 サンプルは、アイテム使用後のコンテンツを実装しません。 その部分は、世界の製作者が意図した通りに直接実装する必要があります。 UICommonBtn.tsのスクリプトを参照してください。 ```typescript this._multiplay.Room.AddMessageHandler("SyncInventories", (message) => { this.OpenInformation(`${message.productId} がインベントリで ${InventoryAction[message.inventoryAction]} されました。`); // アイテム使用サンプル if(message.inventoryAction == InventoryAction.Used){ if(message.productId == "potion1"){ console.log("ポーション使用！"); } } }); ``` 商品の使用時に、商品IDに応じてコンテンツコードを実装することが重要です。 potion2を使用する際に実装したい場合は、以下の変更を行ってください: ```typescript this._multiplay.Room.AddMessageHandler("SyncInventories", (message) => { this.OpenInformation(`${message.productId} がインベントリで ${InventoryAction[message.inventoryAction]} されました。`); // アイテム使用サンプル if(message.inventoryAction == InventoryAction.Used){ if(message.productId == "potion2"){ console.log("ポーション2使用！"); } } }); ``` ZEPETO製品を使用した経済システムをサーバーと通信するには、サーバースクリプトとクライアントスクリプトを別々に実装する必要があります。 スクリプトの実装については、ZEPETO製品サンプルおよびZEPETO製品APIに実装された例のスクリプトを参照してください。