Show HN: Beast 2D – Open-source framework for building 2D Web games

4 months ago 3

Beast2D from 25scripts.com

Beast 2D

An open-source JavaScript game development framework

Get Started

About Beast 2D

Beast 2D is an open-source JavaScript game development framework that provides a variety of features to aid in the creation of 2D games.

Key Features

Sprite Animation

Sprite Animation System

Beast 2D provides a sprite animation system for creating animated game elements.

Event Handling

Event Handling System

The framework includes an event handling system to manage input events and signals within the game, such as keyboard and mouse input.

Game Entities

Game Entities and Component System

Beast 2D offers a flexible system for creating game entities and managing their components, allowing for easy creation of various game elements like players, enemies, and objects.

Canvas Management

It provides methods for managing the HTML canvas element, including setting up the viewport, clearing the screen, and updating game elements.

Scene Management

Beast 2D supports scene management, allowing developers to create and manage different game scenes, including backgrounds, game objects, UI elements, and physics colliders.

Physics System

The framework includes a physics system with support for rigid bodies and colliders, enabling developers to add realistic physics interactions to their games.

UI Features

Beast 2D offers various UI features such as buttons, labels, images, and layouts for creating menus and interfaces.

Asset Collection

Asset Collection System

It includes an asset collection system for loading and managing game assets like images and audio files.

Camera Control

Beast 2D provides functionality for controlling the camera viewport within the game world.

Tools

The framework includes additional tools such as a vectors library for mathematical operations and calculations.

Documentation

Learn how to use Beast 2D with the documentation.

Installation

Follow these steps to set up Beast 2D in your project:

Download the latest version of Beast 2D from the here.
Extract the downloaded ZIP file to your project directory.
Include the necessary JavaScript files in your HTML file:

vectors.js
events.js
engine.js
physics.js
tools.js

Create a canvas element in your HTML file with the ID "screen".

Add the following basic HTML setup:

Basic HTML Setup:

<html> <body> <canvas id="screen" width="500" height="500"></canvas> <script type="text/javascript" src="vectors.js"></script> <script type="text/javascript" src="events.js"></script> <script type="text/javascript" src="engine.js"></script> <script type="text/javascript" src="physics.js"></script> <script type="text/javascript" src="tools.js"></script> <script type="text/javascript"> // Global update function function update() { // Clear screen with black color each frame clear("black"); // Update the canvas object canvas.update(); // Set the update to repeat setTimeout(update, canvas.timeout); } update(); </script> </body> </html>

Examples

Explore interactive examples and demos of games built with Beast 2D.

Read Entire Article