Getting Started

Before you can start using Kiwi to create some excellent games, it would be good to know a little bit more about it and what you will need to have in order to use this game engine.

What you need!

  • A Modern Web Browser
  • Text Editor
  • TypeScript Compiler (Optional)

Since Kiwi is a JavaScript game engine, all you need to use it is a modern web browser and a text editor. There are many good Text Editors out there to choose from so we will let you decide on that, but a good browser that we recommend is chrome since it supports majority of the latest HTML 5 API’s.

TypeScript Compiler?

When developing Kiwi we made the decision to develop the library using TypeScript. TypeScript is a neat language who’s purpose is to make common tasks when making application’s in JavaScript a lot easier; in particular object orientated practices such as inheritance. But just because we used it doesn’t mean you have to, if you want to use pure JavaScript when developing games that is fine also.

Now if you are unsure whether to use Kiwi with TypeScript or not, keep in mind that all the Tutorials we post are made using JavaScript and we have a page that details the differences between using Kiwi in Typescript vs JavaScript.

A useful tutorial on Installing TypeScript.

More Getting Started Tutorials

Getting Started

There are several ways to get started, starting from scratch is the generally accepted way to go about this, but if you want to get up and running even faster, Kiwi.js “Blueprint” games will help get your game building experience off to a flying start.

Choose from any of the following:

  • HTML5 match-three game
  • HTML5 top-down game
  • HTML5 dressup game
  • HTML5 breakout game
  • HTML5 roguelike game
  • HTML5 platform game (in dev coming soon)
  • HTML5 crossword (in dev coming soon)
  • HTML5 hidden object (in dev coming soon)
  • HTML5 tower defense (in dev coming soon)
  • HTML5 poker game (in dev coming soon)

There will be an ever increasing library of free and premium blueprints to get you started.

Starting from scratch

The easiest way to start with a blank game is to take a copy of the /gameTemplate folder in the Kiwi.js Repository. This contains a recommended folder structure and all default files already in place.

You will need to use a web server to open the index file.

A more advanced, but still simple, way to create a blank game is to use the Kiwi.js Yeoman Generator. This will create build files and other goodies for you as well.

Example Repo

We have put together an example repository that has basic examples from how to create anything from a sprite to using sounds in Kiwi.js

When this repo is fully functioning we will have examples for everything in Kiwi.js.

 

Getting and building the library

Bower

If you use the Bower package manager you can install kiwi.js with

 

Yeoman

If you use the Yeoman scaffolding system you can install a blank kiwi.js game with

 

It’s best to look at our Yeoman Game Generator repo for full details.

Using Grunt

This requires installing node.js, and the grunt CLI package. There are a few thing you can do with grunt, including linting and compiling the typescript, uglifying the result and compiling the docs.

To build, lint and uglify use the default

To do all of the above plus compile the docs

To just build the docs

The csproj and grunt compilation methods both output a single kiwi.js file in /build Grunt will also create a min.js version and also output a kiwi.d.ts definition file in /build as well

Building Kiwi manually

You don’t need to build the library to use it. The repo has prebuilt files in the Kiwi.js Repositories /build folder.

Kiwi.js is currently using Typescript 0.9.5 Either – use Visual Studio/TS extension. There are csproj files for both the main project and also the examples.

Extending Kiwi.js

You want Plugins? We got Plugins!.

The concept of Plugins, and how they might apply to game creation, is something we’re very interested in. Years of working in the open source space and hacking open source tools has provided us with the qualifications necessary to create a system that works for you.

We built from the ground up as a plugable system. You can add multiple plugins to your game, or write plugins yourself. Soon, you’ll even be able to sell your own plugins in the Kiwi.js marketplace.

Kiwi.js is built in such a way that your plugins can do very simple or very powerful things. For example:

  • A utility plugin, such as an inventory for keeping track of items a player has collected.
  • A gameobject plugin, that creates programmable tower defense unit.
  • A component plugin, such as a specialised physics system that can be applied to any gameobject.
  • A rendering plugin, that creates new renderers and WebGL shaders that give your game an entirely different look.
  • A service plugin, such as an ad-network or in-app purchasing system.
  • Stop your bathtub from automatically draining whenever you try to take a bath.

To learn about building Plugins view the tutorials on kiwijs.org. You can also get started with Plugins using the Kiwi.js Yeoman Plugin Generator.

Share the joy