Skip to content

The main website for advertising the crypto-collectible "8bitfish". 8bitfish are 8000 programmatically generated pixel fish swimming around on the ethereum blockchain!

Notifications You must be signed in to change notification settings

8bitfish/8bf-web

Repository files navigation

8bitfish

twitter opensea discord

banner

The family of 8000 algorithmically unique pixel fish swimming around the ethereum blockchain.
Special thanks to Andrew Hale, Abhinav Palacharla, and Clara Jeon for igniting the vision of 8bitfish.

Token architecture

Lets address the elephant in the room, how the hell are there over 2 quadrillion unique combinations of fishes? To understand this, we need to understand the anatomy each token.

Each generated token has 3 generated properties:

  • Colors
    • Primary: The primary color of the fish.
    • Secondary: The secondary color of the fish.
  • Patterns: The hue pattern overlaying the fish.

Colors

Contrary to traditional methods of generating randomized assets which uses a set of pre-selected images then combines them into a single image, each token has a primary and secondary color that are applied directly to their respective areas of the svg. Both of these colors are randomly generated hex colors then expanded into the Color type.

// Expanded color palette for single color
type Color = {
  base: string; // initially randomly generated hex
  light: string; // 10% lighter than base
  maxLight: string; // 20% lighter than base
  dark: string; // 10% darker than base
  maxDark: string; // 10% darker than base
  bg: string; // base color converted to hsl with fixed saturation and lightness
  hue: {
    base: string; // increased hue of base color
    light: string; // 10% lighter than hue base
    dark: string; // 10% darker than hue base
  };
};

Since there are two colors, we need to generate two colors for each token. The primary color is the color that is applied to the fish's body and the secondary color is the color that is applied to the fish's tail.

// Full Colors object containing expanded color palette for each color
interface Colors {
  primary: Color;
  secondary: Color;
}

Respective color assignment

Below is a graphical representation of the Colors type on a plain pattern.

colors

NOTE: The hue value from each color are not listed because the plain pattern doesn't require the hue values, check out patterns to see how hue is used.

Patterns

There are 8 patterns that can be applied to each generated token (see below).

architecture

Each pattern has a numerical id so during generation its as simple as generating a random number between 1 and 8 and then using that number to select the pattern.

All patterns excluding the plain pattern take the hue value of the primary color and apply it to the respective areas of the pattern.

// hue object (child of Color)
hue: {
  base: string; // increased hue of base color
  light: string; // 10% lighter than hue base
  dark: string; // 10% darker than hue base
}

Respective color assignment

Below is a graphical representation of the hue object on all 8 patterns.

patterns

Roadmap

Launch and reveal 8bitfish

Deploy the 8bitfish contract to the ethereum blockchain and reveal the 8bitfish family.

Date of completion: TBD

Mint 8000 tokens

Mint all 8000 tokens to the collectors of the 8bitfish family.

Date of completion: TBD

More milestones coming soon...

Token generator

You can generate your own tokens locally by setting up the official 8bitfish token generator.

With the generator you can generate unlimited combinations and preview what you might see or get in the actual collection on the mainnet.

Like this project? Support me with ethereum: 0xD4c6325E42fac0625B25C0d4DB40823870986609

About

The main website for advertising the crypto-collectible "8bitfish". 8bitfish are 8000 programmatically generated pixel fish swimming around on the ethereum blockchain!

Topics

Resources

Stars

Watchers

Forks