Docs
Art Engine
Getting Started

Quick Start

Installation Process

Install package

You can install the Art Engine npm package by running the following command:

npm install @hashlips-lab/art-engine

If you wish to explore the Art Engine's source code or contribute to its development, you can find the repository on GitHub: Art Engine Repository (opens in a new tab)

You can also find the NPM package here: Art Engine NPM package (opens in a new tab)

Usage

Adding the Art Engine

In this example, we'll initialize the Art Engine 2.0 without plugins thats why you see empty input objects, generators array, renderers array, and exporters array.

const { ArtEngine } = require("@hashlips-lab/art-engine");
 
const BASE_PATH = __dirname;
 
const ae = new ArtEngine({
  cachePath: `${BASE_PATH}/cache`,
  outputPath: `${BASE_PATH}/output`,
  useCache: false,
 
  inputs: {},
 
  generators: [],
 
  renderers: [],
 
  exporters: [],
});
 
(async () => {
  // Run the Art Engine
  await ae.run();
  // Print performance metrics
  await ae.printPerformance();
})();
  • We set up the cachePath and outputPath to specify the paths where the Art Engine will cache temporary data and save the generated artwork, respectively. The useCache option is set to false, meaning the Art Engine will not use cached data during the current run.

  • await ae.run(); executes the Art Engine, and since there are no plugins defined, the Art Engine will complete the process without generating any actual artwork.

  • await ae.printPerformance(); prints the performance metrics after the run, providing insights into the processing time and resource usage.

Adding plugins

Below is a usage example demonstrating how to use the Art Engine 2.0 to create NFT art by combining different CORE plugins. This example will load image layers as inputs, generate attributes for each item, render the layers on top of each other, and export the artwork and metadata. For a more detailed understanding, you can check out the example repository that implements this template: Art Engine Template Repository (opens in a new tab)

const {
  ArtEngine,
  inputs,
  generators,
  renderers,
  exporters,
} = require("@hashlips-lab/art-engine");
 
const BASE_PATH = __dirname;
 
const ae = new ArtEngine({
  cachePath: `${BASE_PATH}/cache`,
  outputPath: `${BASE_PATH}/output`,
  useCache: false,
 
  inputs: {
    // Define the input plugin (ImageLayersInput) to load image layers
    apes: new inputs.ImageLayersInput({
      assetsBasePath: `${BASE_PATH}/data`,
    }),
  },
 
  generators: [
    // Define the generator plugin (ImageLayersAttributesGenerator) to generate attributes for each item
    new generators.ImageLayersAttributesGenerator({
      dataSet: "apes",
      startIndex: 1,
      endIndex: 10,
    }),
  ],
 
  renderers: [
    // Define the renderer plugins to render the attributes and image layers
    new renderers.ItemAttributesRenderer({
      name: (itemUid) => `Ape ${itemUid}`,
      description: (attributes) => {
        return `This is a token with "${attributes["Background"][0]}" as Background`;
      },
    }),
    new renderers.ImageLayersRenderer({
      width: 2048,
      height: 2048,
    }),
  ],
 
  exporters: [
    // Define the exporter plugins to export the generated artwork and metadata
    new exporters.ImagesExporter(),
    new exporters.Erc721MetadataExporter({
      imageUriPrefix: "ipfs://__CID__/",
    }),
    new exporters.SolMetadataExporter({
      imageUriPrefix: "ipfs://__CID__/",
      symbol: "APES",
      sellerFeeBasisPoints: 200,
      collectionName: "The Apes",
      creators: [
        {
          address: "__SOLANA_WALLET_ADDRESS_HERE__",
          share: 100,
        },
      ],
    }),
  ],
});
 
(async () => {
  // Run the Art Engine to generate the artwork
  await ae.run();
  // Print performance metrics
  await ae.printPerformance();
})();

Throughout the documentation, we will explore each of these components in detail, providing code examples, plugin configurations, and best practices for their effective utilization.

Additional Learning Resources

To help developers get started with the Art Engine 2.0 and to enhance their understanding of its features and functionalities, we have curated a YouTube playlist. This playlist covers various topics related to the Art Engine and provides practical demonstrations to facilitate learning. Whether you are an artist or a developer, these videos will guide you through the process of creating NFT art and utilizing the Art Engine to its full potential.

YouTube Playlist: Art Engine 2.0 Tutorials

Art Engine 2.0 Tutorials - YouTube Playlist (opens in a new tab)