Network Pipe Manufacturer


    0.4.0 • Public • Published

    Blöb2D Game Engine 🎮

    Playable demo 💾 available here
    Package 📦 for new games here

    General Structure

    • Docker is a facade for PixiJS application responsible for mounting and updating the Scene during each frame of the game cycle.

    • Scene provides ground to initialize relationships between dynamics Entities and more static Tiles. One Docker can only mount one scene at a time. Unmounting the current Scene destroys all elements, relationships, or events belonging to it.

    • Addon provides a way to extend Scene with additional functionality, like animation, physics, or updating Traits.

    • Entity is a dynamic element of Scene, it's also known as "sprite" in other environments. Each Entity has its own velocity which can be affected by Addons or Traits.

    • Trait provides a way to extend Entity with additional functionality, like movement caused by user input, or interaction with other Entities or Tiles.

    • Tile is a static element of Scene. Basically always it's a group of Tiles on a grid with specific properties, like collision for Entities or purply visual aspects.

    Features 📝

    • Scene based environment fed by game cycles
    • Sprites described as bounding box with position and velocity
    • Traits system extending the functionality of sprites
    • Tiles structure with methods to interact with them
    • Custom and predefined events related to game cycles
    • Sprite sheets manager
    • Tiled integration
    • Collisions
    • Animations
    • User inputs
    • User interface
    • Motion easings
    • 🤷‍♂️ General physics
    • Sound

    Creating a New Project

    First, install pixi.js and blob2d as dependencies for your project, then you should run the command creating boilerplate. It populates the current directory with a file structure and demonstration components.

    blob2d create

    Documentation 📑

    Avaible here

    Basic Usage

    First, create basic types for the core component of the engine.

    // types.ts
    import {CustomAddon} from './addons';
    import {CustomTrait} from './traits';
    export type Addons = {customAddon: CustomAddon};
    export type Traits = {customTrait: CustomTrait};
    export type Events = 'player/score' | 'player/die';
    export type Keyframes = 'player/jump' | 'player/run';

    Then create an Application and pass it to the Docker. From now on, you can mount and unmount different subclasses of Scene like a playable level or cutscene.

    // game.ts
    import {Docker} from 'blob2d';
    import {Application} from 'pixi.js';
    import {Level} from './Level';
    const app = new Application();
    loader.load(() => {
      const docker = new Docker<Addons, Events>(app);
      const level = new Level();

    The Scene is a place where you can combine all parts of your game like addons, entities, tilemaps, etc. You can create multiple scenes with different functions of the game.

    // Level.ts
    import {Entities, Entity, Scene} from 'blob2d';
    import {Sprite, Container} from 'pixi.js';
    import {CustomAddon} from './addons';
    import {CustomTrait} from './traits';
    export class Level extends Scene<Addons, Events> {
      constructor() {
        // addons should be registered before
        // calling them later in the code
          customAddon: new CustomAddon(this),
        // create a player with traits
        const player = new Entity<Addons, Traits, Events>(
          new Sprite(texture), {customTrait: new CustomTrait()}
        // add a player to the scene
        // add a player to the addon


    npm i blob2d

    DownloadsWeekly Downloads






    Unpacked Size

    134 kB

    Total Files


    Last publish


    • bartoszlorek