設定ファイルの更新

設定ファイルを確認してみよう

まずは設定ファイルの中身を確認してみましょう。左側のEXPLORERビューからsrc/config.jsをクリックしてみてください。
右側のビューに中身が表示されるはずです。

中にわけのわからない文字列が書かれていますが、この中でも触る箇所は決まっているので1つずつ紹介していきますね。

※該当のコードが何行目に書かれているかも示していますが、将来のバージョンによって前後する可能性があるのでご了承ください

1. コレクションの設定

まずはNFTコレクションの基本的な情報を定義する部分です。

src/config.js [8~10行目]const namePrefix = "Your Collection";
const description = "Remember to replace this description";
const baseUri = "ipfs://NewUriToReplace";

いずれの行もconst 変数名 = "設定内容"という書き方になっていて、"設定内容"部分だけを書き換えるようなイメージとなります。くれぐれも=の左側は変更しないようにしましょう。

それぞれがどのような内容を示しているかは以下のとおりです。

ちなみに、ぼくが作成したテスト用のプロジェクトでは以下のように設定をしています。

const namePrefix = "Dot KANJI NFTs";
const description = "This is a generative NFT of KANJI drawn with dots. This NFT was created to illustrate the procedure of development in HashLips.";
const baseUri = "ipfs://QmXd3KLiyzrsGvB54UXQcRTLrkmYNpkQesXJAz1hs5fWH9";

すると、OpeaSea上ではこのように反映がされるようになります。

こちらを参考に、namePrefixとdescritpionの2箇所をご自身のNFTコレクションの内容に合わせて変更してみてください。

ちなみに、baseUriは実際に画像をアップロードしてからじゃないとURLがわからないので、ここではまだ変更する必要はありません！

2. レイヤー画像の重ね合わせ設定

この部分は非常にややこしいので次パートで詳細を説明していきます。
基本的には、レイヤー画像をどの順番で重ね合わせて、画像をいくつ生成するかを定義する箇所となります。

src/config.js [25~38行目]const layerConfigurations = [
  {
    growEditionSizeTo: 5,
    layersOrder: [
      { name: "Background" },
      { name: "Eyeball" },
      { name: "Eye color" },
      { name: "Iris" },
      { name: "Shine" },
      { name: "Bottom lid" },
      { name: "Top lid" },
    ],
  },
];

気をつけるべきは、画像の重ね合わせ設定を複数作ることができるのですが、そのときのgrowEditionSizeToは「それぞれの設定ごとにいくつの画像を作るか」ではなく、「何番目までの画像を作成するか」という点です。

これだけだとよくわからないと思うので、、説明は次パートに譲りますね。

3. 順番をシャッフルするかどうか

デフォルトでは、レイヤー画像の重ね合わせ設定通りの順番で#1から番号が付けられるようになっているのですが、ミントされるタイミングによって排出内容に偏りが生じるので、デフォルトのfalseからtrueに変更することを強くオススメします。

src/config.js [40行目]const shuffleLayerConfigurations = false;

4. 出力画像のフォーマット

続いて出力される画像の高さ、幅、平滑化をするかどうかの設定です。こちらはお好きな内容で設定していただければ結構です。

ちなみにぼくのテストプロジェクトでは特に変更していない状態でリリースしています。

src/config.js [40行目]const format = {
  width: 512,
  height: 512,
  smoothing: false,
};

他にも設定内容は色々とありますがここでは必須と思われる箇所のみ説明しました。より詳しいことを知りたい方は、公式動画やドキュメントを参照ください。