Creative field - animations and multiplayer games right in the browser

Book One: Creating an Open Source Project

I will continue the topic described in the article “14 Ways to Contribute to Open Source Software, not being a Genius Programmer or Rock Star” habrahabr.ru/post/147220 , but in a slightly different way!

I think many novice programmers would be interested to invest their contribution in some unusual and interesting project, test their strength and learn to work in a team with other developers! For these purposes, it was decided to launch a sort of sandbox and a block of articles on Habré, subdivided into topics that describe all the stages of entering the opensourse, ranging from technical techniques to the psychology of teamwork.
')

Stage One: Idea

Since the project is open to us and is not aimed at obtaining benefits, then first of all you need to think about what developers need now. Based on the fact that I am more of a web (ny) developer than a desktop (ny), then we will choose from here.

Thanks to the appearance and, for the most part, the introduction of such things as CANVAS and WEBGL into the most popular browsers, there is a huge field for creativity.

Let's fantasize a little! How good it would be if there was such an application thanks to which it would be easy to create vector animation for embedding into a browser. Of course, this is not a complete replacement for FLASH, but it would be very useful to create banners, animate some details of the page, create games, and many other multimedia elements managed with javascript. It would be nice if you could draw a character with a skeletal structure and transfer some parameters to it and control it and its behavior on the user's page. And if you combine all this with the server on node.js, then it is quite possible to organize multiplayer games, and arrange an extraordinary communication of the site administration with its clients! For example, through a cute little man. Well, how? Impressive!? Then go to the second stage.

Stage Two: The Skeleton System

The idea is, now it is necessary to decide how all this will work for us! Since this stage requires brainstorming, collecting the opinion from your comments will be the main development plan, a general description of which will be posted in the next article.

To begin, I will offer my version! What is needed for the system ...

... Blocks and Layers.
All elements must be divided into blocks and layers. Each block can have its own list of layers, and in any layer there can be a block with its own layers. In order to move the block layers could move all the internal parts.

... Should I use jquery or another framework? (translation: a block is a single object inside which there can be its layers with animation. For example, we make an image in which it rains - we draw a block with flying drops and duplicate it many times in different places, so it turns out to be rain!), and the layers They are layers in Africa too!

... bones.
Layers and blocks must be bonded with bones. To manage them through the script

... Basically, all the objects are vector-based , but you can connect images, audio and video, for example, so that you can make some kind of animation, suppose that someone runs and put a white blot on the wall, and already in this blot the video is played.

... The data is loaded as when loading the application , and in the course of execution (in advance), so that the overall look is complete. For example, the base is loaded first, that is, the core of the system, with the first moments of animation, and then the necessary data is loaded in the process. And then suddenly the images themselves will be at 200 meters, who will wait for them then!? :(

... How is it better to store and transfer data? I think it's better through JSON direct data stream.
But for now I don’t know what to stop at 100%, since in what format the data for generating animation will be stored, because there will be two programs, I’m not completely sure yet.
The first program is the editor through which all this is done, the second is the script that displays everything that is done in the editor, but for this you need a uniform format for writing and reading! In addition to JSON, nothing comes to mind.

... It is necessary to create the ability to work with the server , both in automatic mode (that is, a request is the answer, like an ICQ), and directly (that is, by submitting a request to the server, we manage the script in the browser, such as a visitor to us, we went see it, that it is now on the site, and the created program gives the command to the little man so that he, for example, runs out at the top of the page, and greets the user, or that he offers something to the user!

... The editor is one of the main parts with which you can create something in this application. In the editor, you can draw, create cartoons, write scripts, and so on.

... Main objectives:
- minimalistic code size with loading the necessary parts of the script as needed so that the kernel does not weigh much, since all functions will not be used. If you need additional functionality, then it is loaded, if add. functionality is not required, then everything remains in its place.
- if possible, download the script, animation with Meltimedia data - one file! That is, not a bunch of separate, hundreds of pictures and two music, but one file in which it is all located.
- for rendering, it is worth using the user's video card to increase the capabilities of the script. In order not to strain the browser and cause total suspensions, plus through the card, since there is much more power there, you can construct full-fledged 3D games, as it has enough power.

As a result, you can make together a powerful program for WEBa, such as web4.0 :))))

The license will be the most open, that is, you can do anything and anyone with such a program (which is all suitable for it, will be selected in the near future)

Stage Three: Development

For development it will be most convenient to use github. In terms of functionality, it is most suitable! For beginners, a description of what it is and how it works will be in the next article.

And now the question to the entire habrasoobshchestvo "How to call this application?

All options will be considered and selected the most popular! The project is currently located at github.com/xamelion/newproject and completely empty!