Tutorial 1: Introduction to WiMi5
Welcome to HTML5 games and WiMi5.
Our online editor allows people to create, publish and monetize HTML5 games.
With the WiMi5 drag and drop creation tool you can easily make cross-platform HTML5 games. You will be able to publish your games in several market places and start getting players for your games very quickly. You can also start monetizing your game and getting revenues using several payment gateways included in the WiMi5 platform.
This tutorial will show you how to use the WiMi5 platform. In the tutorials 2, 3 and 4 we will focus on the 3 main functionalities: creation, publishing and monetization. Then, in the tutorial 5, we will deeply explain one of the most powerful features of WiMi5: the visual scripting. Finally, in the tutorial 6, we will show you some examples, ‘how to’ and best practices to create video games.
But first let us show you a general overview of WiMi5.
WiMi5 Platform Walkthrough.
As a HTML5 based platform you only need any modern Web browser to use WiMi5. We recommend to use Chrome but any other browser that supports HTML5 will work.
We are in Beta.
As you probably know we are currently in a private Beta. So, please, we kindly ask you to be patient. We can help you with any problem you have during the process of creating, publishing or adding the monetization features. Just let us know which kind of problem, bug or difficulties you have. We really appreciate your feedback.
WiMi5 is the only framework that allows video game developers to create, publish and monetize HTML5 games in the same place, using only one platform. We have worked hard to integrate these 3 processes in the same tooling and tried to make it really easy for developers.
When you sign in you will see the Dashboard, where you can manage your projects. From the Dashboard you can edit and create new projects or publish them.
If you edit an existing project or create a new one you will be redirected to the creation tool. With this powerful and intuitive tool you can usually work in two different scenarios: the Scene Editor and the Logic Editor. You have more information about this in the tutorial 2.
If you choose to publish your project you will able to make it public or private (for testing purposes, for example). Currently you only can choose to publish your project in the Labs area of WiMi5. Coming soon you will able to publish your HTML5 games in the WiMi5 Game Arena, in the Chrome Web Store, the Firefox Marketplace and others.
Currently you can create a new game, edit existing ones or clone a project from a repository of game templates. Each game has a set of buttons in the bottom part to manage its settings, to go to the editor, to share it in your social networks or to delete it.
You can also double click on it which is a shortcut to go to the settings view. In the Settings you will be able to publish your game, manage the virtual goods, monitor the stats, etc.
Overview of the Logic Editor
When you open or create a new project from the Dashboard you will enter the Logic Editor desktop. From this desktop you can create the logic of your game. It is the core of your HTML5 games where you will able to configure all the actions and behaviors for the elements of your game.
In the Logic Editor you will find the Blackboxes, which represent a fundamental feature in WiMi5. You can use the blackboxes for creating visual scripts in your game. A blackbox is a box containing a piece of logic that can be connected to other blackboxes forming complex behaviors. In the Blackboxes tab you will find all blackboxes organized in several categories. For example you will find a blackbox called Move for animating elements under the Animation category. If you want to use this blackbox you only have to drag and drop it into the Logic Chart canvas, and fill in its required input and output parameters, connect its activators and triggers and customize its properties. Everything is about dragging things, so you can also drag assets from the Asset Manager and drop them into the Blackboxes parameters, or you can also drag and drop parameters from the Parameters tab. It´s that easy !
It’s all about connecting blackboxes and changing the values of the properties, so no programming is required. WiMi5 has a powerful visual scripting engine that allows you to create all the logic for a game without writing any code. Anyway, you should know at least some basic concepts of programming in order to feel comfortable with WiMi5 creation tool.
Overview of the Scene Editor
You can access to the Scene Editor by clicking on a button located in the bottom right corner in the Asset Manager panel of the Logic Editor desktop. In this view you can manage all the features related with the visual creation of the several scenes of your game. You can split your game in scenes in order to organize your creation process. In the Scene Editor view you can upload and manage your image and sound resources you will use in your HTML5 games.
Managing the workspace layout.
WiMi5 is a very flexible tool that you can customize according to your needs. You can move, resize, delete or create the panels in order to create the workspace you feel comfortable with. Just use the buttons located in the top right corner of every panel. You can also drag and drop them for exchanging positions between two panels.
Exchanging the views of the Scene Editor and the Logic Editor.
When you are in the Logic Editor you can see a button in the bottom right corner of the Asset Manager panel () that allows you to go to the Scene Editor. The Scene Editor is the working area where you can set up every scene of your game. You can go back to the Logic Editor by clicking on the button located in the upper left corner.
Back to Help10/02/2014 / 8 Comments