Case study: cityicons

A growing NFT collection of unique 3D coins celebrating popular cities and their beautiful landmarks specifically created for held back travel-lovers, digital nomads and collectors.

Flørian Rauscher
4 min readMar 8, 2022

Project link

cityicon

About cityicons

cityicons are 3D animated coins in gleaming gold and silver, displaying an engraved picture of a popular city’s landmark, the city’s and the landmark’s name and the exact coordinates in longitude and latitude. On the back there is the cityicon logo as well as a hidden message in binary code.

While cityicons are available as NFTs (ERC1155 Token Standard) at opensea.io, the available amount is limited to 100 per cityicon, so more people can own their favourite city.

My journey

Step 1: Learn to use 3D software

When it comes to 3D software, there are a lot of sophisticated tools out there. From Cinema 4D to Maya… I looked at a couple of them and decided to go with an open source program called Blender. It’s free to use and you can find many tutorials online.

Step 2: Create 3D coins

So I followed a couple of tutorials to find my way around Blender and modelled a coin. Then I added some colors, structure and finally used an image from a landmark, the title as well as the coordinates as a bump texture. I found most of the photos on royalty free stock photo websites like Unsplash or Pexels, or I took them myself. Just had to remove the background and play around a little bit with contrast in Photoshop.

Step 3: Upload to IPFS

I uploaded the finished cityicons to IPFS (InterPlanetary File System). For the sake of decentralization I don’t safe those images on my own webserver. The uploaded files include a static image, the video file of the animation and a .json file containing all the metadata like URL to the media files, names and description of each NFT. This metadata information are crucial and have to comply with a certain standard, so other NFT marketplaces can pick up your token information and list them.

Step 4: Write Smart Contract

A Smart Contract is basically a simple program stored on the blockchain. I read through a lot of documentation and contracts of other NFT projects to figure this one out. But once you understand the fundamentals (reading this book helped a lot: “Mastering Ethereum”) it’s not that hard, if you are a reasonably good web developer. ;)

So I decided on an ERC1155 token. Why? ERC1155 tokens are unique, but you can have multiple amounts of that unique NFT. So not only one, but more people can own a cityicon of eg Vienna.
ERC721 tokens (the most common) on the other hand just have one amount of each NFT.
There are some things to set up for a local development environment (truffle, hardhat, ganache). Once that’s done you can write your Smart Contract and test it out.

Step 4: Create Website

The easiest part… Or is it? :)

I built a website with Drupal (my goto open source content management tool) and then had to figure out how to connect with the blockchain. There are well documented tools and libraries already available (MetaMask & web3.js).

So you basically build your website and add some JavaScript functionality to interact with your Smart Contract via the MetaMask browser extension. In this case, I just wanted to check if the current user owns a certain NFT or not.

Step 5: Deploy Smart Contract

After the last tests and checks, I was ready to deploy the Smart Contract on the Polygon blockchain: View Smart Contract

Why Polygon? Gas fees (fees you have to pay for transactions, it’s basically the cost for the used energy) are extremely high on the Ethereum network. Polygon uses a different consensus mechanism to validate transactions that is way more energy efficient and therefore cheaper. To interact with the Smart Contract you need some Matic, the cryptocurrency used on the Polygon blockchain.

Step 6: Mint NFTs

So on polygonscan.com you can find the new contract. There we have to validate the contract first, then we will be able to interact with the it via the interface on polygonscan. You can also interact via command line (Terminal), but this way, it’s way more convinient.
For the cityicons, I’m simply minting (publishing) all Tokens at once with a maximum amount of 100 per cityicon.

The collection will automatically be visible on one of the biggest NFT marketplaces (OpenSea): Marketplace

Conclusion

Everything seems impossible and very hard to do at first glance. But if you dive in, follow tutorials and read guides/documentations carefully, with small steps you will be able to go a long way and accomplish more than you can think.

If you have any questions about this project, need help exploring the NFT space or want to partner up and bring exceptional, creative ideas to the metaverse together, don’t wait to get in touch: mail@rauscher.io

--

--

Flørian Rauscher

vienna • bass player • graphic designer • web developer • nft artist • web3 • blockchain