Nounish Vector Editor and Composer


  • Web-based vector editing and composition tool, whch allows users to draw anything they want to draw and mint it as a fully on-chain NFT (just like Nouns).
  • If the user draws everything from scratch, it is a free mint.
  • If the user reuse/remix any existing vector assets (such as Nouns icons on NounsDescriptor), the user needs to pay a small fee (probalby 0.02ETH) to mint it.
  • 97.5% of revenue will be immediately distributed to the provider of those remixed assets. In case of Nouns, it will be distributed to NounsDAO’s wallet.

Vision and Mission

Inspired by fully on-chain nature of Nouns, we have determined to create a set of technologies and mechanisms, which will make it easier and affordable to store, share and compose vector images on-chain, enabling fully on-chain NFTs with rich graphics.

We believe that we need to build a decentralized ecosystem (automated by smart contracts), where creators can generate revenue from their creations while enabling and encouraging various remixes and compositions.

Our Approach

Here is the list of technologies and mechanisms we are building.

SVG Compression (deployed)

While SVG is the industry standard to exchange vector data, raw SVG data is quite verbose and not suitable as the storage format on the blockchain.

After various prototpes, we have chosen to compress SVG data in the following steps.

  1. We convert all SVG elements to “path” elements, eliminating the need to specify element types (such as “rect” and “circle”).
  2. We convert all floating points to integers by having a large and fixed view area (1024 x 1024).
  3. We extract only the “d” attribute of those path elements, eliminating SVG tags entirely.
  4. We compress a series of data (commands and their parameters) in the “d” attribute into a series of 12-bit bytecodes.
  5. In this byte code, commands (such as “M” and “C”) will be simply expanded to 12-bit (higher 4-bits will be all zero), while parameters (numbers ranging from -1023 to 1023) will be converted to N+1024+256 (higher 4-bits will be non-zero).

We always perform this encoding off-chain (typically in TypeScript) before passing the data to the smart contract. Please see compressPath() method in createMethod.ts.

The decoding will be done on-chain in the “view” method, such as tokenURI() or generateSVGPart(). Even though there is no “gas cost” associated with it, an efficient implementation is critical to avoid time-out or gas-limit errors. Please see decodePath() method of SVGPathDecoderA.

On-Chain Asset Store (deployed)

The On-chain Asset Store is a smart contract, which acts as the public on-chain asset storage service, allowing developers to store and share vector assets.

It stores various vector data in the compressed format described above, and makes them available to other smart contracts, just like the asset store for Unity 3D engine.

Please see AssetStore.sol for details.

Crowd Minting (deployed)

The “crowd minting” is a method to eliminate a large upfront cost for developers when issuing fully on-chain NFT collection (just like the developer of Cyberbrokers did).

Instead, we ask each NFT minter to pay a small extra gas fee which is required to upload necessary vector data to the blockchain during the minting process.

This is done by calling mintWithAsset() method, which stores the vector data to the On-Chain Asset Store and issues NFT(s) to the minter.

We have launched three NFT collections (Material Icons, Kamon Symbols, Emoji Flags) using crowd minting and managed to upload over 1,400 vector images on the Ethereum blockchain.

We also came up with an idea to give addtional rewards to those minters. Please see the “Draw2Earn” section below.

Please see the mintWithAsset() method of KamonToken.sol as the reference implementation.

Asset Composer (beta testing)

Asset Composer is a smart contract, which allows developers and users to create a new vector asset by composing existing vector assets, provided by asset providers (described below).

You can see the current version of Asset Composer code here.

Asset Providers (beta testing)

Asset Providers are a set of smart contracts, each of which provides a set of vector assets. Those assets are either stored on-chain, dynamically generated, or a combination of those.

AssetComposer acts as the registration mechanism of those asset providers so that the user can easily discover available assets when authoring new images using the On-chain Vector Editor (described below).

Each Asset Provider implements IAssetProvider interface.

As a reference implementation, we have created a wrapper of NounsDescriptor, NounsAssetProvider, which offers dynamically generated Nouns characters as assets.

On-Chain Vector Editor and Composer (beta testing)

On-Chain Vector Editor is a WebUI front-end of Asset Composer, which allows creative people to author new images by drawing and combining existing vector assets, just like Adobe Illustrator, and mint it as an NFT.

The source code of On-Chain Vector Editor is a part of WebUI front-end of On-Chain AsstStore.

Draw2Earn (beta testing)

During the development of the On-Chain Vector Editor described above, we came up with the idea to release it as a Draw2Earn application.

Here is the business model.

  1. Creating a new drawing from scratch and minting it as an NFT is free. The minter needs to pay only the gas fee to upload the vector data of the drawing to the blockchain.
  2. Creating a drawing using assets on the asset store (somebody’s drawings or the result of crowd-minting) and minting it as NFT is NOT free. We will charge a small amount (probably 〜0.02ETH), and distribute most of it (97.5%) to the creators and minters of those assets.
  3. If the remixed asset is a composition of multiple assets, we will distribute the payout recursively, splitting it equally at each level.

We are aware that most of the X2Earn services introduce their app-specific currencies, which allows developers to keep all the earnings, by paying earnings in the app-specific currency.

This approach creates a so-called token economy, giving the developer the power to print money as the central bank of that economy.

We chose NOT to take that approach because it will turn the service into a pseudo Ponzi scheme, where the infinite growth is required to keep it attractive.

We believe the direct and immediate distribution is fair to everybody and a better mechanism to create a healthy and sustainable ecosystem.

CC-Share-Earnings (draft proposal)

During the development process of the Draw2Earn business model, we realized that we need a new kind of Creative Commons license, CC-Share-Earnings, which is suitable for on-chain assets (such as vector images, but not limited to them).

This license allows other people to copy or remix it, but revenue sharing is required if somebody uses it to generate revenue.

IAssetProvider interface has a built-in revenue-share mechanism (processPayout method), and we’d like to propose it as the standard mechanism to share revenue.

Generative Asset Providers (under development)

As described in the Asset Provider section, any smart contract, which supports IAssetProvider interface can be registered to the Asset Composer as an asset provider and start earning money.

We would like to invite other developers to create variety of asset providers, most of which would generate vector assets programatically – just like ones you see in the Art Block project.

If anybody is interesated in it, please join the On-Chain Asset Store discord.

What we expect from NounsDAO community

I also created a web site about on-chain generative art.

It uses the common interface (IAssetProvider), and the vector editor is able to use registered generative art providers as the asset providers.

I’ve just released a beta version of “On-Chain Canvas”, which allows you to create your own vector images and mint them as fully on-chain NFTs. It’s on Goerli Testnet at this moment.