最近、NFTアートが流行っていますよね。
その中でもジェネラティブと言って、似たようなNFTが複数制作させるNFTが人気です。
唐突に、NFTど素人の筆者がジェネラティブNFTを制作することに挑戦しました。
結論は、ジェネラティブNFTは素人にも制作できます。その過程を報告します。
Contents
ジェネラティブ作成の全体像
- 画像を作る
- 分散型のサーバーにアップロードする→PINATA
- スマートコントラクトのプログラムを修正する
ジェネラティブ画像を生成
ジェネラティブ画像はAIなどが自動で作ってくれるイメージがありますが、実は素材自体は自分で用意します。
複数の素材を、決めた重み付けで重ね合わせて作ります。
ジェネ画像に必要なもの
- HashLips→作成に必要なコードのひな型
- Node.js→サーバーサイド言語はjavascriptで開発できる
- vscode→コードを書くためのテキスト
HashLips
HashLipsは、ジェネラティブ画像の「生成」「ミント」「スマートコントラクト」の3つのプログラミングコードの雛形です。
デフォルトでは、「目」の画像が入っています。
まずは、HashLipsをダウンロードしていきます。
「hashlips_art_engine」 「hashlips_nft_minting_dapp」 「hashlips_nft_contract」の３つをダウンロードします。
<code>→Download ZIP
フォルダは、半角英数字の場所へ保存してください。日本語が含まれているとエラーが出ます。
PS C:\Users\yuduk\デスクトップ￥新しいフォルダ\new\hashlips_art_engine-1.1.2_patch_v5> npm install
PS C:\Users\yuduk\NFT test\new\hashlips_art_engine-1.1.2_patch_v5> npm install
Node.js
早速ダウンロードしますが、ホーム画面では最新版と推奨版がダウンロード可能です。ホーム画面のものをインストールすると後々躓きます。なので、ダウングレードしたもの「Node.js 16.18.1」をインストールしていきます。
Node.jsとは、もともとWebブラウザ上で動作するプログラミング言語だったJavaScriptを、サーバー上で動作させるものです。
詳しくは↓
https://blog.beachside.dev/entry/2020/07/11/110000
コードを書いていく「vscode」をダウンロードします。
ジェネラティブNFTを作る
ジェネラティブアートはブロックチェーンが自動的に作ってくれるイメージがありませんか？
実は全く違います。自分で素材を用意してプログラミングを組んで作成していきます。
hashlips_art_engineのフォルダ内のソースコードを修正すると出来上がるイメージです。
デフォルトでは「目」のジェネラティブを生成できます。
デフォルトでは5枚のジェネラティブですが、今回は1,000枚作ってみましたが、同じ画像が出ているので、結局は50枚にしました。
ここまでがジェネラティブ作成のパートです。
Pinataにアップロード
PC上で作成したジェネラティブをPinataにアップロードします。
Pinataとは、無料で使えるサーバーですが普通のレンタルサーバーとの違いは、分散型のサーバー（Ipfs）であることです。
imageは、画像データのことでアップロードするとCDIがアドレスになります。
ブロックチェーンの中にNFT画像が入っているわけではありません。実際にはURLなどの最低限の情報のみが刻まれています。
tokenURIを辿って、必要な情報を取得しています。
テストネット
テストネットは「Goerli」で行っていきます。
デプロイでは、「ENVIRONMENT」から「Injected Web3」がなく「Injected Provider – Metamask」で行います。
ミントサイトを作る
ミントサイトは「HASHLIPS_NFT_MINTING_DAPP-1.0.1」で作成します。
VScodeで展開してターミナルにnpm installと入力するとインストールが開始されます。けっこう時間がかかりますので気長に待ちます。
終わったら、npm run start と入力して起動するのを待ちましょう。起動されると自動で「Hashlips」が開かれます。
実際にミントするアドレスを変更していきます。
remixの「Deployde Contracts」のアドレスをコピー
VScodeでpublic>config>config.json
CONTRACT_ADDRESSに貼り付け。
CAN_LINKの「https://polygonscan.com/token/ここに貼り付け」
VScodeでpublic>config>abi.jsonのフォルダの中身をすべて書き換えます。
Remixの左のアイコンSolidity compilerのCONTRACTを設定して、一番したの「ABI」の横のコピーマークをクリック
VScodeのabi.jsonに貼り付けます。
VScodeを保存するとhttp://localhost:3000/が変更され、ミントできる状態になります。
実際にミントしてopenseaで確認してみましょう。
無事にミントできましたね！
Remixを閉じてしまった。
Remixは、一度閉じてしまうと作っていたプロジェクトが見えなくなりますが、コントラクトアドレスを入力すると再度呼び出せます。
- ENVIRONMENT→「Injected Provider -MetaMask」
- メタマスクが接続されます。（本番で接続したネットワークで！）
- CONTRACT→「○○ – contracts/○○.sol」
- At Addressをクリック
「Deployed Contracts」に復活します。
完成したジェネラティブNFTのミントサイト
