Inspiration

We were inspired by the artist, Gentile da Fabriano, whose artwork was one of the firsts to introduce framing. We wanted to be able to provide a tool for NFT projects to have the ability to frame their work without having to worry about the original code being tampered with or affecting the holder perks that come with the NFT. As well as allowing the frame creators to add additional perks from the ownership of the frame.

What it does

The app allows you to select unique frames to merge onto your NFT. It works by combining the frame metadata stored in the frame.sol ERC1155 contract the metadata of any arbitrary NFT, then storing the result on IPFS. Then, the user can transact with framable.sol contract, calling the merge function which will mint the user a framed version of their NFT, storing the combined metadata in the contract. Users pay a fee of 0.001 ETH each time they merge their NFT. The fees collected by the contract get disbursed to a random holder of a framed NFT when the amount of ether collected by contract surpasses a threshold of 1 ETH. So in other words, every 1,000 merged NFTs, a lucky holder of a framed NFT will get 1 ether.

How we built it

We built it using solidity for the smart contract programming language, hardhat for the smart contract development framework, react.js for the front end and Alchemy API for storing and reading ipfs data. We also used Chainlink keepers and Chainlink VRF to disburse the fees collected by the framable.sol contract to the holder of a framed NFT.

Vision

This app became our use case for a larger vision of building infrastructure for NFT upgradeability. When introducing "after-market" parts for NFTs, it was important that we were still able to prove the "donor" NFT's authenticity.

Challenges we ran into

  1. Generating a new NFT contract that holds 2 NFT contracts within it.
  2. Merging the original image with a frame using Javascript canvas
  3. Dynamically generating an NFT image and uploading it to ipfs
  4. Reading the NFT image using Alchemy API
  5. Merging 2 attributes from different NFTs into one

What we learned

Hardhat, Solidity, Chainlink VRF, Chainlink Keepers, React.js, Javascript, Alchemy API

Built With

Share this project:

Updates