Turn your NFT into a BOT!

Odds are you have made each of your NFTs unique, original works of art!

Congratulations! I hope they are really great, really, I do… But, lets make them better! lets give them distinct personalities!!

I’m going to show you how you can turn your next NFTs into unique works of art with personalities users can chat with! Instead of just showing a picture, your “NFT bot” can tell jokes, tell stories, show images and use natural language or cognitive AI services to have a conversation with you! This higher fidelity experience is built in parallel to your decentralized NFT project.

CryptoBabies “The Awakening”

Recently, without any fanfare, the CryptoBabies all became “self-aware”. You can now talk to your CryptoBabies NFTs, or talk to other people’s NFTs. Ask them about their features, joke with them, talk about rarity..

Embedded NFT chat window where you can talk to the CryptoBabies

This content can be surfaced directly on OpenSea as the detail window, NFTs show their basic “image” metadata when in list mode.

In “detail mode”, its switches to animation_url, which lets you change the primary image into an interactive animation, or in this case a Chat Window.

Because it’s off-chain, it can do many more things! like store temporary state and even keep track of conversations and remember people! You could make it do some pretty cool things to interact. You can have it only expose certain functionality to it’s owner. Even enable Voice and Speech synthesis if you can show the NFT on your own website or meta-space. Computation has to be done off chain to keep costs low!

Here is a quick overview of the steps to make your NFT a bot:

1. Create a bot to echo your responses.
2. Host your bot in the cloud (with Docker)
3. Upload to Heroku
4. Surface the bot on a website.
5. We will make the bot better, later..

OK, lets do it, no more messing around.

Prerequisites

Make sure you have all of the following prerequisites ready to go.

• Heroku account created (sign up here).
• Heroku CLI installed (download here).
• Docker Desktop Installed (https://docs.docker.com/desktop/windows/install/)
• Git installed (download here).
• Visual Studio 2022 — NOT VSCODE!
• Download Visual Studio Tools — Install Free for Windows, Mac, Linux
• .NET Core SDK version 3.1

1. Create a bot.

We are going to use the Microsoft Bot Framework to create our bot. It’s pretty big and has a bunch of moving parts, so let’s just keep it simple for now! Once we have all the pieces in place, swapping out the bot for a smarter one is easy!

Let’s use an Echo-bot sample from here, download this repo to your local machine: https://github.com/microsoft/BotBuilder-Samples/tree/main/samples/csharp_dotnetcore/02.echo-bot

Extract the files and run the bot locally with “dotnet run” from a local terminal in this folder, connect to it with the Emulator. (see below)

Running the bot in the left console, testing it in the right Emulator

Testing the bot using Bot Framework Emulator

Bot Framework Emulator is a desktop application that allows bot developers to test and debug their bots on localhost or running remotely through a tunnel.

• Install the latest Bot Framework Emulator from here

Connect to the bot using Bot Framework Emulator

• Launch Bot Framework Emulator
• File -> Open Bot
• Enter a Bot URL of http://localhost:3978/api/messages

Interacting with the bot

Enter text in the emulator. The text will be echoed back by the bot.

Stop the console app with Cntrl-Break.

So, our simple test bot is done for now, lets move onto hosting it.

2. Host your bot in the cloud (with Docker)

Docker lets you package applications into containers so that they have all of the resources they need to execute packaged right along side the actual application. It also makes your application much more portable than hosting a set of files somewhere. Containers can also be versioned and easily upgraded.

Create a new file called “Dockerfile” in the root directory of the project:

(make sure its a capital D!) — Put this content into the file:

FROM mcr.microsoft.com/dotnet/core/sdk:3.1 AS build-env

WORKDIR /app

COPY EchoBot.csproj ./

RUN dotnet restore

COPY . .

RUN dotnet publish -c Release -o out

FROM mcr.microsoft.com/dotnet/core/aspnet:3.1

WORKDIR /app

COPY — from=build-env /app/out .

CMD ASPNETCORE_URLS=http://*:$PORT dotnet EchoBot.dll

Save the file and build the image from the base directory:

docker build . -t latest

This will build a docker image and package your bot code inside, tagging it as “echobot:latest”

Now we can run it with:

docker run -p 8080:80 echobot

Start the docker image locally.

You can now connect your emulator to http://localhost:8080/api/messages

You can type, get echo responses and see the logs from your app on the left.

Run “Control-C” to break out of debug mode. If you can’t, start another Command Window and run:

This shows the running docker images. “docker container ls”

You can stop your image with the first few letters of its image id:

Now, lets get that docker image and push it to the cloud!

3. Upload to Heroku

We need somewhere to host our bot. We are going to use a free Heroku account for this. Go signup here: Open Heroku website

Heroku is free hosting service and easiest way to deploy your bot project , In this step we will create heroku instance and push git code to run on heroku server

Be aware of the limitations of FREE services. Some free services only allow a certain amount of usage. This might break your NFT if you get a sufficient amount of traffic. You can upgrade to better hardware later if you need to.

Here we created a new nft-demo-bot project.

Here is my demo app url:

(nft-demo-bot.herokuapp.com)

Click on the Deploy tab, here you can see Container Registry.

We need to login and push the docker image to heroku’s container registry.

Follow the steps from the Deploy Tab on Heroku website

Release it! — Release the hounds! — I love that saying..

Try out the web page from the Open App link.

The site is now running: EchoBot (nft-demo-bot.herokuapp.com)

Connect to the remote bot with your local Emulator

Setup — ngrok

Install nGrok on your local machine. Configure the Emulator to point to the path of the executable. This allows the remote bot site to proxy responses back to your private machine. Since your machine doesn’t have a public internet address, this ngrok proxy is needed to get responses in the emulator.

Add “/api/messages” to your hostname:

YOUR-URL /api/messages

Bot Framework Emulator Settings dialog

Connect to your bot with the emulator to test it in the cloud!

Does it work ? We have a working bot! Remotely through the emulator!

Your users though, they just web or mobile browsers and either see the NFT on your website or on some marketplace or wallet app.

4. Surface the bot on a private website.

Ok!! We did it! we have a bot that will repeat whatever we say to it. While that by itself isn’t the most functional use case in the world, the fact that we have a bot running is more important right now.

Now, we can look at the features the bot can provide in certain contexts. To enable talking to the bot through different communication channels:

Go and register your bot’s Endpoint with the Bot Framework.

Register | my bots (botframework.com)

The IFrame code and Secret Keys here can be used to embed the chat control on your website. Just follow the instructions in the Web Chat Channel.

Attribution

You have to give me some credit and say “powered by NFT.bot” or whatever you want, just say “NFT.bot” somewhere to give credit! If you use it on social media please reference #EndiVerse @Endiverses and send me one of your new NFTs! my address is botlab.eth — Thanks and enjoy your bots!!