Giter Site home page Giter Site logo

vier's Introduction

vier

Game for the js13k challenge 2014, Fight against elemental enemies in a brutal pixelated world.

Vier graphics are inspired in Old Atari videoGames that I played when I was a child, and the gameplay is inspired in beat'em ups like double dragon and fatal fury.

The game contains 6 different levels:

  • The Beginning
  • The Gate
  • Air Palace
  • Earth Palace
  • Water & Fire Montains
  • Grand Master Palace

5 different Kinds of enemies and 7 final bosses

Every enemy has a different behaviour and different attributes depending on the level.

Could you defeat the game I made in less than 13kilobytes?

Preview:

alt text

Development

The project contains 3 utilities I made to create the sprites in the game:

  • spriteGenerator/index.html is a web editor that allows you to create 16X16 one color sprites, also it allows you to add frames to preview different kind of animations.
  • transformSprites.js is a script that transform .sprite files into enconded strings that are used by the game.
  • animator.js is another script that takes more than one sprite and describes an animation following the xor algorithm to animate my special sprites.

sprites is a directory where I put all my generated sprites.

animations is a directory where the generated animations are placed.

To build the project I used gulp, the script concatenates and uglify the code I made in js, also it zipped in one single file.

I had a small server only to serve my game and test it locally with friends < index.html>

dist is a directory that contains the uglified version of the game.

app directory contains all the sources of the game:

  • js/initializers.js contains all the declarations of the variables of the game, also it initialize the canvas context and sets default values for the screen.
  • js/keyEvents.js adds the key listeners for the game.
  • js/elements.js contains the core logic behind the elements ratio attacks and power.
  • js/particles.js It is used as effects for backgrounds and character deaths.
  • js/sprites.js has the different images and frames used in the game as encoded strings.
  • js/sprite.js contains the logic to transform and animate encoded strings into graphics and manage it into the canvas
  • js/platform.js is the responsible to draw the platforms of the game and also validates the collisions.
  • js/powers.js contains the logic of the element powers like collisions and movement into the level.
  • js/booster.js contains the logic of the booster packages
  • js/enemyBook.js describes the logic of every enemy in the game, it's graphics, behaviour and attributes.
  • js/enemies.js is the class for the enemy character, contains the hole logic to load the information from the enemy book. Also has the concrete implementations for every possible action that an enemy can do.
  • js/levels.js is the class responsible to load the platforms and enemies also generates enemies and validates when the level is ended.
  • js/levelGenerator.js describes the different posibles levels in the game in an object, it contains too the logic to load a level when is restarted or initialized.
  • js/hero.js is the class responsible to manage the hole behaviour of the hero.
  • js/screens.js functions to draw the screens of the game
  • js/main.js contains the gameLoop to update the variables and manage the differnt elements in the game

vier's People

Contributors

agar3s avatar

Stargazers

 avatar  avatar Philippe Tedajo avatar Steven avatar Ricardo Ramírez avatar Artem avatar Oriol López Sánchez avatar Simon Oberhammer avatar Yohann Ferreira avatar  avatar  avatar Kristian Koivisto-Kokko avatar Matthew Levandowski avatar Gabor Heja avatar Oscar Rendon avatar

Watchers

Yohann Ferreira avatar James Cloos avatar Oscar Rendon avatar Artem avatar

vier's Issues

basic music

if is possible using byteArrays as with the images.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.