From Fun Web2 to Web3 Browser Game in Under an Hour by Jay Albert

nice nice it's gonna be interesting yeah all right so I guess anything I need to wait for nope all right cool hello everyone in the crowd uh thank you for showing up today we're about to begin uh the workshop on how to turn a web 2 asset into a web 3 game my name is Jay Albert I am a project manager from the god welcome blockchain it's a blockchain focus on gaming and creatives and today we're going to go over how to turn a web 2 game into a web 3 game there's going to be a bunch of steps involved so first let's make sure we're all on the same page we'll be setting up some storage with a nft storage Unity SDK downloading a free asset that you can use in unity setting up your nft storage account configuring that scene so that you can publish anything you save onto nft.storage we'll be creating a wallet from scratch acquiring pckb which is our native token we'll be launching a smart contract putting together a mint function within Unity we'll build your game and then we'll preview your nfts so there's a lot that we're going to cover and because of that I put together this guide for everyone to follow along with so if you're building live with us make sure you scan this guide it's going to be the same guide I'm following along with uh throughout the demo so you'll see me kind of flip back and forth between the demo between unity and the different assets we'll have to download so I see a couple of people downloading it now I'll give you a minute and I put this together because I've been part of several different workshops and sometimes people fall behind sometimes you miss the word that the speaker said so I figured I'd give you every single step you need to do this even if you've missed it I think we have one more person scanning [Music] all set all right so let's jump into how to turn this web 2 asset into a web 3 testing um okay yeah I think you can hear me better now so if you follow that link then you'll open up this guide to install Unity by now you should have had Unity installed because it may take a bit of time if you have a newer version of unity then you're gonna have to uh update it with one of our packages in The Next Step so look out for that stuff so first we want to install our nft storage Unity SDK it's an SDK that we put together and this is going to interact between unity and nft.storage so if you click on the link here you can navigate to the actual files click on code download zip and unzip it I've already done this on my side so instead I'm going to go straight to the unity hub I have it download here in the section that I put together for this tutorial let's extract it here so it's going to be a zip file extractor zip file and what's that's ready we're going to want to open that file in unity Hub so go over to your Unity hub go to open add project from disk and we're going to add in that SDK so that's our starting ground so we don't have to kind of put together scripts from the beginning we'll have this as our basis now what's in this project is uh basically a script that's going to allow the user to take a screenshot of what they're seeing so think about like maybe Pokemon where they want to capture what's going on or race car where you want to capture a high score you'll be able to capture that event and Minted as an nft so I have it here I have the proper version but if not you're going to have to follow this next step where you upload the package so as it's loading it's going to take a minute or two I want to go over the unity hub for those who haven't seen it who haven't built the game ever before here you'll have your projects listed then you'll have different versions of unity so that if you release an old version of unity even if there's updates that maybe make your scripts uh deprecated you can still use that over version still run it without running into any issues so I have two different versions here we have this learn section where there's a bunch of tutorials on Unity anything from augmented reality to making 3D objects 2D objects animations music anything that you think of that's involved in a game you can find lessons on here in unity lastly we have this community section where you can find free assets that either you or others can publish we have some newsletters some blogs on updates for Unity a couple of forums where you can see the most recent conversations going on in unity you can ask your own questions a section for you to publish your games so once you're done you can find your audience and unity pulse where you can reach out to the team contact them provide them some feedback on your experience it's still important give it a minute and it's starting to load up Unity so Unity is great for indie game designers anyone can use it it's a free asset you can build your games out in here export it to several different platforms from webgl to even Facebook games PS5 Xbox so it's a great way to get started in building and to publish your games so it's taken a bit longer than I hoped if you have a newer version of unity now's your chance to go into your packages and add in your uh the missing files there's additional instructions that I've included in the documents and now we have our Unity open so really quick if you've never seen Unity again here's a brief overview everything on your left hand column are your assets in your game so think about your assets as what's being involved in your scene think of a movie scene or a game scene if it's a race car then you're gonna have maybe some cars you're going to have a road you're gonna have some background scenery so this is where you can put all of your assets that are going to be included in your scene right now over here you have a list of different assets this is where everything is stored so that you can pick and choose what assets you'd like to use and then on the right hand panel it has the details for each one of the assets so see we've picked on the main camera it shows that we can move our camera anywhere we want make some changes to how it's configured add some scripts to it some audio and this is essentially our Unity interface so uh first thing we're going to do is add in our free asset so we've opened up with our camera capture now we want to download the asset that we're going to use in our game so I'll go back to our guide now and I provided a link here so that you can go to the free asset it's going to be a simple drawing asset just to convey the idea of what's possible so this is what it'll look like once you start the game you'll be able to draw whatever you want and then the next challenging piece of this is making sure that that drawing is minted on our blockchain so let's open this in unity it'll open up your package manager so this is where you have several different things installed if you're maybe messing around with virtual reality you'll have some packages there in this case you know there's even blockchain sdks uh really anything you download from the unity asset store you'll find in this section this is the game that we're going to work on right now so let's import this it's free draw import these are all the assets that are going to come with it so it's a bit of a preview click Imports and it'll save all the files in your storage so now that we have our Unity assets let's set up our storage so we have the game that we're going to be drawing we have the nft storage SDK that's going to be able to communicate with our storage but now we have to set up our actual storage so as many of you know uh it's pretty common in the space to use ipfs to save your files especially for nfts these are some old files here so let me just delete this real quick but when you first log on to nft storage you can sign on with your GitHub or your email and the first thing you're going to need to do is create an API key so if you go to this section here API keys at the top I've already created one that I use for most of my demos but you can create a new key here just fill out the name and create that's going to allow nft.storage to track you as a user to make sure you know there's not someone else using your key and creating a bunch of assets so we have our key set up next after our key we have to actually import that key well copy and paste that key into our nft storage SDK so that our unity game knows where to send information to so let's go over here copy this navigate back to Unity so we're going to go into our nft storage uh examples give me one sec nft storage Scripts classes sorry constants and our keys so here's really simple doesn't have any information besides what is your key you paste in your API key here save and close that out so now Unity knows where to communicate the information once you start sort storing your images so next up we have to configure our draw assets so that we can draw and then mint so if you notice when you first looked at the game online over here it just has an option for you to draw but there's no way for you to take that information and mint it on a blockchain so what we're going to have to do is create some buttons so that we can press them to mint and so that we can start transferring over information so first we want to open up that game we'll use that as a basis for our project this is what I was mentioning earlier this is our scene typically in this middle screen you'll see what's going on in your scene right now it's a bit hard to understand what's going on but if you zoom out you'll see that it's a screen and we have some controls on the side you can use uh this on the top right to kind of switch your angles that you're viewing the acid in but since it's a 2d game on a 2d screen I just go over here to this 2D button and it'll give you just kind of a flat view where you can move this around so this is what our game looks like as I mentioned it doesn't have a button it doesn't have any way for us to Mint anything so that's what we'll have to start working on first thing is let's click on this canvas this is where we're going to put everything in our game right click UI and then button text mesh Pro all right so let's name this mint button so as I mentioned earlier once you click on your objects you'll see on the right hand side there's a bunch of details on what you can do with that object you know we can switch the position let's say make this 10. or a hundred now it's moving to the right and this section here is saying what do we want to move that object relative to so I want to make sure that whenever anyone opens this game the buttons are roughly in the bottom left hand corner so let's switch this to bottom left hand corner and say all right I want it to be maybe a hundred X away from the left hand side of the screen and then from the Y position let's say I want maybe 40.

so no matter what screen pops up it'll be roughly these dimensions and it'll pop up relative to the bottom of the screen so there's our mint button if we want to add a bit more detail we can click on the text here there's a bit of a drop down after the button you see button here and we can change this text input to Mint and now this says mint here so when we start to save our file to ipfs we're going to want to grab that ID send it back and forth and we're going to have an input field for us to transfer that information so go to UI go to input field text mesh Pro and we're going to do the same thing we're going to Anchor this to the bottom left corner and we're going to move it next to our mint button so this is let's say 400 uh 300 is better we want it to be around the same height so let's put about 40. all right so now we have our button and we have an input field to transfer information next we want to work on our network manager so we're going to be pressing buttons we're going to be drawing our assets and we want to make sure that that's communicated over to the network to nft.storage so we're going to go right click here create an empty object and name it network manager and if you're following along we should be kind of on area seven so you have all of these notes if you're a little bit behind or you missed something you can follow along all right so we have our network manager now what we're going to want to do is add the camera capture onto our network manager so we can find that in N of t storage example Scripts storage example Scripts and our camera capture what we're going to want to do is drag and drop it to say all right what we're communicating over to the network is what we're capturing with our camera and we want it to be initiated by a button we wanted input field so that we can transfer that information and we also want to set some metadata so that we know what is going to be uploaded to ipfs what data is that going to contain so this is the script that comes with our unit City Unity nft storage SDK once you drop it into here it's going to ask you what buttons are you referencing what input field are you referencing and that's what we've just created so you can just grab your assets from the left hand side drag them over so we're going to put our mint button on our button we're going to put our input field on input field and for set metadata that's actually a script here that we pre-prepared for you so you add that to the object and then you drag and drop that over to set metadata so now once we start to play the game we start drawing an asset we can draw whatever we want press a mint button and it'll send that information over to our nft storage so now this is where we have to kind of mess with our scripts a bit and where I'll go back to our tutorial so open up this set metadata we're going to want to manipulate this callback on upload there's tons of different things you can upload but we want to specify that we're uploading these images so if I go over to our tutorial let's see we've skipped through all this we've done this already we're looking for this here number 10 under configure Unity to draw a mid so we can just copy and paste this over this is constructing the path for our nfts and this is going to upload it to nft storage all right so now we want to make sure that we set up our Gateway so that when we're saving the file there's a URL that we can access to actually view the image so we can go to nft.storage go over to our scripts classes nft metadata and here you can use tons of different public gateways you can find this online search for them on how to store your files properly but for here we've set up this one piece here that I'll copy so we're going to be using Cloud Fair uh cloudflare to save our files so you can just replace this here if you leave it as is it won't work it'll throw some errors at you because that's not a proper Gateway so let's save that and lastly we need to manage our events so so far we've set up our nft storage we've set up the basic view of our game we set up some buttons to say all right I'm done with my drawing I want to save this file onto nft.storage but we don't really have a way for our game to communicate amongst itself to say all right what's happening within the game what do I do next so to do that we have to create a new file and it's called our event manager so create c-sharp script and our event manager here I've been also included the script because at another event I try to hard code hard code whole of this live and that did not go too well so I provided the scripts in advance let's close this out let's open that file that we've just created our event manager let's get rid of all this and paste in our new events so this is saying once a new image is uploaded uh you know this is uploading the new image uploading the metadata and the nfts all right so as of right now we have everything that we need to actually start drawing and for this to be saved on ipfs so let's save this let's minimize the script for now um every time you edit your scripts the compiler is going to re-compile the scripts to make sure it works there's no errors as long as there's no kind of anything jumping out at you you can clear your console you're good to run sometimes it'll give you warning saying maybe you're using an old script or old way of doing this but it looks like we don't have any issues now so whenever you want to test out your game you can go to this button here and it'll start running everything you've put together so this is the game it's loading up right now let's pick let's say a green pen and let's say let's write build all right it's a little bit skinny let's make it a bit bigger all right it's terrible to try to draw with a mouse pad but that's my build so now when we press mint it's going to start uploading this file to our ipfs account and we'll be able to see the metadata along with the actual file there so let me go back to ipfs go to your files on nft.

storage let's see the 26 1125 that seems to be right so these are the two newest files everything else is just old data Let's uh view our URL and we saved our image to nft.storage so now we're going to use this to actually mint on our blockchain and we'll be going into those next steps so I'm sure many of you are super familiar with metamask probably have a ton set up but I'd like for this to be a tutorial for beginners so we'll briefly go through that kind of just run through that real quick set up our Network for God woken and then we'll work on our smart contract so if I go back to our tutorial uh you know you can use a metamask on several different browsers I'll start downloading it here if you're working on anything you're building brand new I suggest you create a developer wallet specifically for this you don't want to test with real currencies with your real wallet with your real identity you want something that you can kind of connect to anything play around and who cares if you know they try to rob the funds in there it's not going to affect you all right so I installed metamask uh for anyone who's not familiar this is your portal into the blockchain this is how you view what assets you have how to access your assets let's create a new wallet um you don't have to agree to that that's if you want to share information with metabask create your password this is how you're going to unlock your metamask every time you want to use it on your browser understand uh let's see next after you press create wallet it's going to tell you to remember a phrase this will give you a brief video of what you should know about metamask I'm going to skip this but let's secure my wallet so it's going to give you 12 words these 12 words should never be shared with anyone they should be saved somewhere where no one can access it because if they find these words then they can steal your funds do whatever they want with your money so I'll open up a text pad and save these words here because the next screen is going to ask me to verify that I remember those words so here it's asking me for the same words the third word was next so you retype it here it's not as much of a risk if you're using a test wallet so that's exactly why I'm doing it and next one is Kitchen all right confirm we created our wallet we have metamask installed it suggests that you pin it so that it's easily accessible this is what our wallet looks like it's generally going to be on the ethereum network by default so let's go to our pin let's pin this here and now we can just click on here and access our metamask wallet all right next step is we want to start minting our assets on God welcome blockchain so in order to do that you'll have to add the network the great thing about God woken is that it's evm compatible so any tools that you use for ethereum you can use on the godwoken blockchain and get all the benefits of being on God woken so in order to add a network to your wallet click on the network here it says ethereum wallet let's add a network it's going to come pre-populated with some of the more common networks God Wilkins has been around for maybe six months now so we're not on this list yet but we're able to get there let's add a network manually so now the question is where do you get these details if you go to our god welcome website look at our documents you can find our Network details they'll look like this so let me open this link to show you our documents there is going to be a test net and a mainnet so testnet is for you to play around with you can get some fake money publish some contracts without any consequences mainnet is when you're ready to publish your work to go live to actually have customers uh so it's going to ask you for these exact details so we can just copy and paste this over here our native token is pckb that is from the layer one that this is built on top of which is the nervous Network and we want to take this URL just because when we want to check our transactions it's going to be much easier to access if we have this configured all right so we save our Network and now we're on the godwoken testnet network first thing we'll need to do in order for us to launch Smart contracts is acquire some faucet uh tokens so if you go back to our docs click on this faucet you'll see a screen like this super simple press request it's going to ask you to sign your wallet let's sign that let's connect and within a second or two it should give me 10 pckb and this is what we'll use to fund our smart contracts press it again one more time and we have our pckb so this is what we use to be processing our transactions all right I'm going to close this out I have tons of windows open so let's close that close that close keep this nft that storage for our future drawings let's close this and close this so if you've never written a smart contract before open Zeppelin actually created a really awesome tool for you to just kind of Click what options you want in your smart contract and have that populate into a script and then you can use that script to launch your smart contract since we're evm compatible we can use all the same things that ethereum is using as I mentioned so we can use the same exact tool all we have to do is reference our network ID and we're done so uh if you've never visited open Zeppelin here's a list of bunch of different contracts you can use so if you wanted to launch your own token you can just click erc20 and you can launch your own currency click what functions you want if you want to be able to Mint it if you want people to be able to burn it in our case we're making an nft so we're going to switch over to ERC 721 give this a really unique name because we're going to reference this later and make sure this was published on the blockchain so I'll name this Biddle week and the symbol will be bdlw if you want you can give your nfts a unique URL so that they're numbered by that URL but I'm going to skip that I want it to make it so that anyone could call this function and it's mintable we're going to Auto increment so you can mint several different nfts on it make it innumerable so that's reflected on chain and URI storage since we're going to be referencing some storage on nft.storage so we clicked everything we want in our contract right here and as you notice it just kind of plopped in the scripts that we need so that we can launch our smart contract let's open this and remix this is an online ID that you can use to launch your smart contracts it's a pretty awesome tool I use it all the time here's our contract that it transferred over you can see it says bid a week bdlw it has our minting function how to transfer so this is our safe mint function uh the transfer has some options to burn it this is the information it's grabbing from our URI storage it has everything we need right now so let's compile this next what you're going to need to do is copy this ABI at the bottom uh this is what kind of breaks down your contract into binary so that you can communicate between Networks we're going to have to reference this in our script so open up a notepad and save that for later it's in a Json format we're going to need to also reformat this so we'll do that in a bit so we compiled our contract didn't give us any errors of course because these are tested contracts we know they work that's the reason why we use them so now let's go over to deploying our contract we want to switch our environment to uh injected provider this is going to say all right I'm using my metamask to launch these contracts to process these transactions so as soon as I press it it's going to ask for me to sign in with my wallet so I make that connection and now it shows my account here great so I have my contract I have my wallet connected now all I have to do is deploy it so you click this deploy it's going to ask you to process the transaction if we didn't acquire testnet pckb it'll tell you insufficient funds here so that's why that last step was important we needed money to be able to process our transactions so let's confirm give it a second or two it'll launch your smart contract it'll publish it and say all right you're good to go this is on your blockchain so we have this check success we have our transaction hash now if we want to check where that uh smart contract is on our blockchain we'll have to take this transaction hash and go over to our Explorer so at God woken we have an Explorer up it's GW scan you can navigate to it in our Docs paste in the hash here and this will show you the smart contract that we just launched you can verify it's yours by checking the wallet so let's see my wallet is begins with ox5e5e6 so you can see that here this was a contract from ox5e6 this is the deployed contract so this is just a kind of a registering that there was a smart contract deployed but if you want to look at your actual smart contract you want to click on deployed contract here and we're going to be referencing this ID later in our scripts so that Unity knows what smart contract to call to publish images all right so we set up our smart contract we deployed it now we have to set up our God welcome Mentor this is what's going to say hey I got these images the person wants to publish it send it this information over to our smart contract publish it on the blockchain so that will do from scratch I've also have some copy and paste pieces here so it's not entirely from scratch line to mess that up but we'll jump into that now all right so here let's create our empty object God woken mentor and in our projects go to assets we're going to create a new script with the same name God woke in Mentor all right let's open this script and this is a little bit more step by step so you understand what's going on here so let's go to our guide again here's the first portion of our script we should be up to set up your God welcome Mentor I'm at number two so let's replace all of this and save this these are some packages that we'll need in order to communicate between all the different applications we're working with here is our contract address so this is actually asking hey where do you want me to send this information to what is the Smart contract where can I find it so if we go over to our god woken scanner that's our contract that we want to grab here copy this over go back to your script paste that in now this information if you are using maybe a another script or you put it together yourself you'll have to manually put in your chain Network RPC and chain ID that is the same information we use to switch our networks when we were putting together our wallet um that was at our docs so that's right here the same information you see here that's what you're going to need to put in your script so that it knows what network is it communicating with so you're telling it the contract you're telling it the network but now you also need to give it the binary information it needs to communicate with that contract so that's this information here uh if you remember earlier I told you to copy and paste your ABI here and we need to reformat it to work in this format for Unity so let's uh select all of it press the replace button and what we're going to be replacing is a double quote with a backslash double quote let's replace all it'll make that change and now we want to get this all in a single line so there's a website that we use to do that instead of you having to kind of manually subtract lines do that on your own let's see so that's here just paste your text into here press remove replace line breaks and it'll generate the text for you copy that over go back to your script and replace this Abi so now if you decided you wanted to just not change any of this information use all of the details that are here and try to Mint something you're not actually going to be able to Mint your nfts and the reason why is because you're not the owner of that smart contract and when we minted our smart contract if you take a look at it here it's actually checking to see all right is this person the or the owner of the smart contract so no other wallets can actually use this contract to publish every contract is going to be unique so no one could use yours that you put together today if you wanted to make it accessible to other users so anyone can mint an nft from your game let's say you just need to remove this line here all right so we have our script here these are all the details we need to communicate with the network now we have to tell it all right what do we want to actually communicate so let's go back to our guide let's copy this over here we're going to say all right we want to take whatever account is right now signed up to the game and we're going to use that information uh once the game starts so that's going to be the first check that the game makes all right so let's copy the pasties here just making this a bit neater the transfer over from notion isn't the most seamless all right so this is saying once the game starts I want to see what that person's account is by checking in their player prefs and unity that's essentially checking the session who's uh in your game uh who's playing right now we're going to take their account um and pass that over to our event manager and see all right is this person minting a new nft um we're going to process a transaction with that we're going to prompt their wallet so we need these details to interact with their wallet now besides that we have the actual mint function so once we mint these are the details we'll send over to our smart contract if you're not sure what details your smart contract needs you can check the open Zeppelin website and it'll have all the details there from your tool wallet they're from uh any custom contracts you're using all the details you need for that all right so here it's going to format our URI to send that information to our nft.storage so it knows how to save it we're telling our smart contract that we want to use the safe mint function so that we can mint an nft using that smart contract this is just kind of converting data to Json and these are just additional scripts we're using to either publish from the unity webgl online site or from our editor um while we're working on it all right uh so we have everything set up for our God welcome Mentor let's save that let's see if Unity screams at us all right so let's see God movement here namespace directly Fields or methods I think I needed to paste it into here so that was my mistake let's grab this cut here and that should be good all right there's an assembly reference all right so the next thing we're going to work on from our mentor is our nft data all right so we're gonna have to send over some metadata to the smart contract and this is what's saying what we want to grab over what we're sending over to nft.storage from our game sorry this is actually the helper function we're putting together um that's helping this Json conversion uh between the data so let's look into team meta is all right we're going to create a new file let's name it NFC metadata utils and here we're going to let it know how to convert the data that it's receiving uh in metadata from our game over to nft.

storage so let's save that this conversion happens in tons of different games when you're communicating between systems so there's nothing special here all right so save all the files let's see if that compiles correctly see models looks like there's an issue with our God broken mentor on four seven let's take a look at that uh thank you see if we can still run this nope give me one second to look at our mentor let's go see storage let's see let's attach Our God welcome Mentor script [Music] oh my God just give me one moment I actually built this this morning and didn't run into any issues but you know how it is when you're building in front of people that's your Abi models let me make sure we have our Newton soft type namespace models cannot be found in the center looks like we have everything here looks like I'm missing this Unity models using models but for some reason that hasn't ever come up before let me see well when in doubt just Google it probably something super simple I forgot to include cannot be found your name you should see their energy models namespace create model cold sample this is my space all right uh unfortunately it looks like I'm not going to be able to finish that Mentor I'll have to check back at our scripts but we were really close to actually finishing this so I'll show you what the next steps are so uh in order for you to get your wallet to work for you to communicate between your script uh that might actually be the issue so in order for you to be to communicate between God welcome Mentor your ipfs it's gonna need to know what wallet are you signed into so let's import our chainsafe SDK and connect our wallet all right so let me go to my files uh looks like I don't have it open already if you go to our uh documents you'll see that I have the unity SDK sorry the chainsafe SDK link here you can just click on this download version five that's the one we're using for this demo once you've downloaded it here you can drag and drop it into your project or drag and drop it's going to import the package so these are all the details for the package Imports all right so we have additional scripts and everything we need from chainsafe including the login screen for our wallet all right so at this point we should have everything set up see metadata helper does not exist looks like we got rid of the other issue so the problem was I did things a bit out of order I was supposed to download the chainsafe SDK first import that and that's what the models was referencing now we have this other issue in God woken so metadata helper that's I believe the script that we were working on so let me go back um at the data helper so it's referencing this n of t this file that we've created maybe I didn't spell it properly let's make sure we do that all right so it's looking to call that function let's rename this script to make sure that it's a one-to-one match see details here nope right click rename and let's save that all right let's see context close this out foreign let me take another second to look at our script this looks right foreign so it looks like there's another issue here as I mentioned you know coding in front of everyone it doesn't always go exactly perfect if there are any issues here I'll be updating these docs after the event so that you can go back take a look at it make those changes that you need but that was essentially the last step we had our God Vulcan mincer set up we drag and dropped the script into God woken mincer and that's going to allow us to run the game uh and publish it online so I can show you what the game kind of looks like without the script running yet so give me one second just to show you that it'll actually show you know online on uh your web browser so let's instead uh see for now just leave that blank so that it compiles we don't run into any issues here hopefully all right so this is going to allow us to run uh the game just so that we can test it see that it runs in the browser it'll interact with our wallet but it's not actually going to mince on our blockchain uh because of that lat script there's a bug there that we'll need to rework so when you're going to run your game go into file build settings uh here you're gonna have a scene by default but we want to remove that scene so delete it our main scene for the game is the one we're looking at right now so that's the free draw asset we're going to want to switch this if it's not already switched to webgl because right now it's configured so that it'll run on your computer once you run the game let's switch platform to webgl give it a second or two to convert next we're going to have to change the resolution of the screen if you played some high performance games you notice that your screen kind of wigs out from time to time that's probably because your resolution settings aren't right so let's go to player settings go to resolution make sure you have web 3gl clipped and exit that so now we have the unity asset but we need a way for us to log into our wallet and that's provided by the chainsafe SDK so let's exits out go back to our project so this is one scene which is viewing the game being able to draw the game but we need to have another scene which is the login menu so whenever you're playing a game that's usually the first thing that comes up you're starting the game and it transitions to another scene so let's go over to webgl templates webgl here uh first thing we're gonna have to do here is switch the network so chain safe uh can interact with several different evm compatible chains we're going to want to find where this is located and make sure we want it to communicate with our God welcome blockchain so show an explorer here and let's open with our editor so when you're configuring this it'll have like a list of different chains you can use you see like Avalanche cello but here we're going to put in our God woken chain ID so let's go back to our docs for our d it's 71401 here go to your script replace that here save that and now uh the chainsafe SDK is now going to communicate with our God woken Network cross that out now go to the templates that they provided for us and you can find those templates uh by going to the web3 unity folder and then scenes so you have a wallet login which is like if you're making a game that's on desktop and then you have your web login which is what we'll be using want to save all of our changes so if you zoom out from here it's a basic login menu so this is the first scene that's going to load your login and then it'll transition to the actual game we want to add this scene to our build so go to build settings add open scene we want to make sure that this is the first thing that the user sees so we want to drag and drop this to the top and now we're all set to build and run so let's build and run this let's save to a new folder let's call that new folder builds it's a new folder fields select that folder and that's what will save every iteration that we make of this game so this could take a decent amount to build the first time uh if you have a pretty good computer it could take three to six minutes if you have a bad computer could take 20 minutes if it's longer than that then you need to upgrade your computer if you want to make games with unity um so while this is going on um it might not take as long since it doesn't have the mentor function I want to go back to our presentation and discuss uh some more information about why nfts so hello hello hello uh so uh We've created some nfts and a lot of people don't necessarily know what is the real value of having nfts in your game so first it's being able to track people's wallets and understand the history that they have with your game and also with other games so let's say I build a game today and 10 years down the line I want to reward the first person to play my game I can check their wallet and give them an airdrop free tokens to try to entice them to continue to be a member of our community or it's just to reward them for being with us for over a decade they may get a special item depending on how many years they've been with us but it allows you to kind of grow your relationship with your customer to a level we've never really seen before so not only can you do that but other people who are interacting with your community can also do that so let's say a friend builds a game and you want to kind of tap into a similar user base you can check the smart contract that they use for their game see all of the wallets that minted with that smart contract and then you can reach out to those players you can give them items for your game this is also commonly used as what's called a vampire attack let's say you have a competitor they've identified the target market let's say it's a race car game and you're making another competitor race car game you can see the exact audience that plays this maybe even identify who are the most highly ranked players and invite them to your game through airdrops through special rewards so that's why we want to build nfts why we want to start incorporating them in games you can also buy sell trade them so you can take them out of the game use them in several other games so it's a way for people to get rewarded for the time they've invested into playing your game now why would you want to build nfts on God woken so God woken is a blockchain focused on creatives and uh game developers so first we're the lowest gas fees for optimistic Roll-Ups if you look right now it costs about on Loop ring about a penny for you to send over ethereum from one wallet to another but for you to send over pckb from one wallet to another it's about point four point 004 cents so it's less than half a penny if you want to send over transactions so hands down the lowest fees we have a rebalancing uh gas fee so one ethereum today let's say 0.1 maybe a hundred dollars today but a year into the future it may be a thousand dollars so even though you're processing the same transaction in the game the actual dollar value could dramatically rise for games and for the players so it makes it uh complicated to scale when the network gets congested and you have a game that costs now thousands of dollars for a player to make a move so our gas fees rebalance according to USD so if a transaction costs a dollar today no matter what the congestion is on the network it'll cost a dollar tomorrow 10 years from now whatever it is uh we have a gasless API so we noticed that when people want to play games when they want to interact with nfts they don't necessarily understand what it is to acquire a test net token well not a test net token but the currency for that Network right um so we wanted a way for developers to absorb those costs and say hey if you want to play this game you can jump in play uh claim an nft without you having to process a transaction so that's our gas list API we have a web 2 sign-on that we're working with so you don't have to go through the steps that we've gone through to sign up the same way people normally do for metamask you can just sign up with your email or a Twitter login your social networks so the idea is we want to make it seamless for uh players to onboard to make it into an experience that they're used to and comfortable with we're also working on our Fiat on-ramp so uh sometimes it's a bit hard to bridge the Layer Two by offering a Fiat on-ramp you can just purchase the currency directly in the wallet and you don't have to go through those additional steps and as you've seen throughout the demonstration we've used ethereum uh compatible uh tools uh remix open Zeppelin chain safe so anything that you can do on ethereum you could pretty much do on us so we wanted to make it something that's easily accessible for the developers who have the skills but are looking for something that's optimized for games and for creatives so that's why we think you should work with God woken now if you do decide to work with God woken we have an incubator that we're running right now and we offer development support so if you need any help uh just working with our blockchain we'll have a developer work with you side by side we offer marketing support so let's say you're ready to launch your dap we have our Network we host Twitter amas we host telegram amas to try to get your application out there and if we think your game is going to bring a lot of people to our Network we'll even offer you a grant uh anywhere ranging from like 2 500 to 20 000 just to get you started and to have your game up and running I actually managed the build Club so I review all of those applications so if you want to talk to us after the event if you have a game idea let us know what you're working on and let's see if we can collaborate so now if you want to learn more about God woken you can scan our link tree or go to godwoken.com if you scan our link tree you'll navigate to our Twitter account our Discord Community it'll also have the links for build Club so if you're more interested in that process it'll have links to our Twitter and our Discord um and finally this is me uh Jay Albert uh this is my personal link tree so if you want to connect afterwards there's somebody during the presentation who came up who said they wanted to connect you can scan my link tree reach out to me on any platform I'm pretty much always available to collaborate so now let's check back on our game it should be done by now correct looks like it's running a bit more um but generally once the game finishes running it'll automatically open up on your browser and you'll see the same interface that we saw earlier today which is your draw application so you can draw whatever you want press the mint button it'll save that asset on to ipfs nft storage uh once we fix the god woken mincer uh you'll be able to put that script together and once you press that mint button it'll actually mint on our blockchain and you can preview what your nfts look like let's skip ahead to that part uh so there is a dow right now on godwoken blockchain called uh nft Nation this is the marketplace that they're working on so if you want to preview your nfts at a later time you can access this website I've provided the links in the docs as well it's already set up so you can connect your wallet metamask and sign on with your God welcome wallet it's currently a test phase so if you do take a look at it you have some feedback the community is very interested in hearing what you have to say but if you scroll to the bottom we actually did this tutorial a few months ago I want to say um and this was one of our users drawings so you can see it's the same exact kind of interface they drew their asset they were able to Mint it some of the packages have upgraded since then so that's why we ran into a bit of an issue but that's essentially everything you need to know to be able to turn your web 2 asset into a web 3 game and mint on the god broken blockchain um I think it'll probably take a little bit longer so I think it's a good time to wrap this up now as I mentioned uh my name is Jay Albert I want to thank everyone for coming to the presentation I'll be updating the documents after this meeting uh so I'll be working through that bug moving around certain components so that it's it's in a easier way to work through and if you want to work with the build Club want to work with God woken reach out to either me or Sam is also here we have some gear at the front if you want so come up after the event to grab some shirts some stickers come talk to us let us know what you're working on thank you [Music]