Fruitless is a HTML canvas game prototype built using a JS implementation of the Box2D physics engine.

My idea was to create a game which could be played on any device – desktop, tablet, or phone without having to worry about the user’s platform.

The game itself features a group of characterised fruit which can be controlled using the mouse or touch.

The game is developed using JavaScript prototype based inheritance. An ‘Entity’ class contains a transform (position, scale, rotation), an update method, and a render method. All visual objects are extensions of the Entity class and override the base methods. Some entities are tangible meaning they can be affected by gravity, and mouse interactions. These entities use the Box2d library to apply collision detection on the object.

The intangible entities are used for the non-interactive objects. These are the background and foreground parallax images which do not have any need to use the Box2d engine.

Each of the fruit have animated, expressive faces which can change when the user is interacting with them. Each character is an extension of the ‘Fruit’ class which implements a set of methods to allow the user to touch and drag the character. Their faces are animated using a sprite sheet containing various eye expressions.

Some characters are heavier than others and so do not move as easily. Box2d allows the ability to configure an object’s density, friction, and restitution.

Demo 1 – Kitchen

Demo 2 – Barbeque

Demo 3 – Level Editor (Enable editor with space bar)

Leave a Reply

Your email address will not be published.