Doing a video stream in Decentraland
This guide focuses on the steps to follow if you want to display a video NFT in Decentraland with the 6th version of the SDK
Premise
“Create, explore and trade in the first-ever virtual world owned by its users." With this welcoming phrase, Decentraland invites us to dive into one of the first blockchain-backed platforms that enhance an alternate reality, allowing us to express our ideas and projects to the world.
Launched in February 2020, Decentraland has witnessed its potential grow as a platform to exhibit and showcase cryptoart. Nowadays, you can find NFTs scattered all over the land — some housed inside purpose-built structures, others in parks and open areas and even some in-flight.
A caption of different points where NFT art can be seen, near coordinates 15,44 in Decentraland
The mission
This guide focuses on the steps to follow if you want to display a video NFT in Decentraland with the current version of the SDK (6.4.9 at the time of writing). We will explore what Decentraland can and cannot do and the code snippets required.
Resources
- Unity Editor (2018.3.6f1)
- Unityhub://2018.3.6f1/a220877bc173
- Decentraland SDK 6
- Unity Decentraland plug-in
- Decentraland picture frame display
- Decentraland video stream
Listing your NFTs, knowing your limitations
The most important step initially is to create a list of your desired NFTs to be in placed. Decentraland doesn't have a hard limit regarding NFT placement or video streaming, as they are counted within the entity limitation.
If you are unsure about your limitations, you can find a helpful spredsheet here.
This is the list of assets we are going to display in:
- Token 16973 by ToxSam, Address: 0xb932a70a57673d89f4acffbe830e8ed7f75fb9e0
- Token 92976 by Bananakin, Address: 0xd07dc4262bcdbf85190c01c996b4c06a461d2430
- Token 59183 by kourtin, Address: 0x60f80121c31a0d46b5279700f9df786054aa5ee5
- Token 8552 by Lauretta, Address: 0xb932a70a57673d89f4acffbe830e8ed7f75fb9e0
For our example, we will use a splendid land of 1x1. Here, we will build our environment and decide where to place our finest cryptoart pieces. For this small piece of the metaverse, the platform allows us to have a maximum of 10,000 triangles, 200 entities, 30 bodies, 20 materials and 10 textures in our exported project zip folder.
Caption of the ECS limitations spreadsheet
To have a better understanding of limitations, we have to consider that every "entity" (called gameObject in Unity), which has its own independent transformation node (position, rotation and scale) is considered an “entity”. Even if it doesn't have a 3D mesh (body) attached to it.
This means that every NFT, video stream or model, will count as at least one “entity” each.
So, for now, we know that our NFTs will "size" 4 “entities” within the limitations, and we know that although they are all animated, only one is a video source, and it will be the one to do a video stream. The other three artworks are in GIF format, supported by the “picture frame” by Decentraland.
Extracting the video source
There is one simple rule in Decentraland for displaying NFT picture frames: if it is in OpenSea, it can be shown. This is due to the API used to extract blockchain data to display the artwork, which requires the “entity” to include an NFTShape stating the Smart Contract Address and the Token ID of the artwork. This flexible setup allows you to incorporate NFT assets from platforms such as SuperRare, Rarible, KnownOrigin, Whale, MakersPlace and many more!
For artworks that fall outside the current admitted formats (image file formats), we need to create a video stream of them. However,it’s important to note that video streams also have limitations.
The formats currently supported by the Decentraland API are .mp4 , .mov , .ogg , .webm.
Note: The inclusion of the .ogg format makes it possible to only stream audio :)
To extract the video source of an artwork, it's just as simple as catching the static video source some platforms give you by right-clicking on the artwork.
Original artwork by: Bananakin
Source link
With this source our artwork can be streamed.
Deciding the placing
For this test, we have developed a small environment scenario where we place a "dummy" game object. This object will provide the complete transform data we need, including the position of the video stream, its rotation and its scale. We have named this personal beacon "COG VideoDisplay (1)". This code name will make it easier to find it in the game.ts code the export processes.
Our view with Unity, you can already spot the place where we will place a video stream
The view of the same place for the video stream in the game.ts code
As you may have noticed in the code, rotations are not set in Euler angles. Instead, Unity uses Quaternions to avoid the gimbal issues. If you want to input Euler angles, remember to add .eulerAngles after rotation to indicate that your values are being interpreted differently.
More about Euler vs Quaternions.
Placing the chunk of code
Following the official Decentraland documentation, the code to initiate a stream involves stating the following lines:
This piece of code would generate a video in the position 8,1,8 located in the land with a size of 1 square meter. To adapt it, we extract necessary code for our scene, specifically the part where a plane is spawned at the world position.
This is the original code, indicating that "entity77588n" is called "COG VideoDisplay (1)". This is the entity we need to modify to make it stream a video. To achieve this, we add the following lines:
Instead of spawning a new entity, we have decided to assign a material to the existing one. We instruct it to use a specific material (containing the VideoTexture) and describe the behaviour it should exhibit when the player interacts with it.
Local deploying and debugging
After configuring our code, we can deploy it locally to check if Decentraland executes our segment of code successfully. Fortunately, it works, and the video can be seen in motion alongside the other NFTs.
The primary drawback to streaming a video is the fact that it is not an NFT in essence. One might argue that it breaks the spirit of the blockchain, but currently, it's the only viable method to achieve this.
Another point against its use is the memory usage and potential overload it may cause when playing raw videos or streaming too much data into Decentraland.
Since the platform is already streaming a considerable amount of information, overloading it with additional videos and images can be problematic if a smooth experience is desired.
Additional features to your stream
You can also set different properties to the stream that are not enabled by default. For example, you may want to start the video in a specific position or stream it slower. Here is the complete list of things you can add to you custom stream code:
- videoTextureName.Play(): A simple performer to play the stream, useful for triggering a video with custom events.
- videoTextureName.Pause(): Pause the video.
- videoTextureName.Reset(): Takes the stream to the starting point.
- videoTextureName.Loop: (true or false), set a boolean to indicate if your stream continously loops or stops at the end of the video stream
- videoTextureName.PlaybackRate: The speed of streaming your video has, 1 is the default speed.
- videoTextureName.Volume: The audio volume of the video, with 1 being the default.
- videoTextureName.Seek: Allows you to change the starting point of the video once it's played or reset, with -1 being the default.
Conclusion
Streaming a video source in Decentraland is, among other things to develop on your land, simpler than it may seem at first glance. However, be cautious when placing multiple streaming videos without interruption, as they can overload your scene (and your neighboring lands too!)
