Web3 | Dencho

Corrupted Realms

Wed, 11 Oct 2023 00:00:00 +0000

Web3 Land Based Map System

Sat, 22 Oct 2022 00:00:00 +0000

Contracted by a startup to RnD and produce a working prototype of an Interactive Map with overlaying hexagonal cells and dynamic states that change based on the live NFT metadata pulled from the blockchain.

This is one of my earliest projects involving Web3, at the time (2022) there was but a handful of blockchain SDKs that were compatible with Unity and C#.

This Map system need to be usable in a way that it helps you setup the map, and hold live data representations synced form the blockchain.

Feature	Description
MapManager Component	In charge of loading terrain prefabs and settings relative to a scene Id, and contains CellData methods/data used to hold serialized data about points on the map.
Custom Inspectors	Includes setup status among the needed controls to specify how to spawn a planar grid of cells across any number of terrains.
Automatic Serialization	Hooks into Unity to serialize/deserialize data with the scene upon save reloading during development.
CellData Saving and Loading	After initial setup, controls allow devs to save the current state of the maps cellData to a serialized array. During runtime upon connection to the blockchain, if supplied with a contract config, will pull the celldata bit by bit from the blockchain to override the default serialized data on the map. Only when data has been synced recently can users interact with cell states via a UI.
Dynamic CellData Status	Upon user interaction, should display the current state of a NFTs land metadata.
Additional WebGL Branch	WebGL support for the map. With deep link for Web3 Wallet connection.
Asynchronous Code	The main thread only haults for saving files to disk. everything else used the async C# pattern to invoke logic overtime till the array queue is exhausted. Thanks to Cysharps UniTask plugin for supporting WebGL and unifying my asynchronous logic between platforms.
Frustrum Culling	Occlusion Culling grass and other map objects based on what the camera sees. Much like the system from ZeroDawnHorizon and other AAA titles with big maps.
AAA Cinemachine Camera System	Uses Cinemachine, which is a popular AAA camera system part of the Unity registry that we can easily manipulate in code.

Rapid Prototyping

It was important to save development time by exploring adaptable plugins from github and the asset store, that might give us a head start. After testing multiple grid based map plugins, we settled on one who's source code was extendable and well documented so we can adapt the plugin to work with NFT metadata.

First step was to generate a map from an array of terrains, thus populating the serialized custom celldata thats compliant to the ERC-721 smart contract. Then a simple controller to navigate around the map, written from scratch using Cinemachine.

After a few months of work we had a working prototype that listed live NFT data synced from the blockchain.

This was the first version of the UX for the Map controls, they were revised later on.

A GUI to compliment the Map so the user can filter out thousands of NFT metadata to find one specifically.

NFT Artisan

Thu, 10 Feb 2022 00:00:00 +0000

This tool allowed the team to easily recreate NFT metadata and media from serialized data types in a Unity project, like an array of CellData or GameObjects.

I learned alot about the growing standard that is NFT Metadata, how its imprinted onto the block chain via a smart contract, the requirements for batch uploading NFT metadata, and even interacting with smart contracts.

Creating NFT media and metadata needs to be consistent in brand and format. This tool allows use to do just that after we make iterative changes to Land or NFT items in a Web3 enabled project.

Features	Description
Batch Generation	Capable of generating over 100,000 NFT images or videos in one session with efficient batch processing.
Format Typing Support	Supports PNG, JPG, and MP4 formats to accommodate various NFT media requirements.
Automatic Framing	Operates independently on its own GameObject, allowing for movement and adjustment within the scene as needed.
MapManager Integration	Utilizes the CellData array from the MapManager component to generate `metadata.json` files and media, processing each cell’s data based on its position and configured settings.
Recording Settings	Offers highly adjustable recording settings to customize recording angles, durations (for videos), and formats, while being stored on a configurable scriptable object.
Scene Interaction	Capable of handling large scale recordings and was tested with with over 100k CellData entries in the MapManager for comprehensive map coverage.
Dynamic Object Handling	Links with an ItemDatabase or an array of Transforms to spawn instances at the recorder’s location, capturing necessary Metadata and Media.
Operational Versatility	Functions both in and out of play mode, providing flexibility across different development stages.
Asynchronous Code	The main thread only haults for saving files to disk. everything else used the async C# pattern to invoke logic overtime till the array queue is exhausted.
Automated Cleanup	Manages the cleanup of spawned instances post-recording to maintain scene integrity.
Export Functionality	Exports generated Media and Metadata to specified folders, organizing assets for efficient access and use.

The end result is 2 folders full of fresh ready to upload NFT Media and Metadata.

Example of live NFTs using Metadata created from this tool.