The primary solution that we provided removed flash dependency and renovated the whole application with HTML5. Having said that there are lots of ideas and optimization decisions being taken and implemented, keeping in mind the requirements of the client, problem they are having now, targeted audience and other parameters which directly or indirectly would have made impact on the development.
Educational Games for Students, a HTML5 and CSS3 compliant, e-learning game application for kids. It helps teachers teach their students while the kids are having fun and learning at the same time. The application has two major section FAIRLY TALES and EARLY SHAKESPEARE. The FAIRY TALES consists of 6 different fairy tale stories, when selected the application starts. At the very beginning the story is narrated in slides with the help of audio / video / sprite animations and supporting texts. After the story is complete the actual game starts. The game will have different levels, the higher the level the more difficult the game becomes. Each level will have 2-4 questions from the slides shown at very beginning. On successfully answering the question user is prompted to next question of the level and on giving all right answers the next level activates, however levels can be jumped.
The application, which was initially flash based, was to be developed in HTML5 and CSS3.
Our complete role and responsibility was to come up with a solution and develop and/or remake the existing application they already have, so the application is able to run on all major browsers available in the market. The current application being flash based was able to run only on desktop browsers and only if the browser supports rendering of flash application. Our client wanted a solution which will eliminate the flash-support dependency for the application and as well as able to run on mobile and tablets and iPad, be able to connect with large number of users. The targeted audience of the application are mainly schools and educational institution for kids, including government and private organization. It is therefore of utmost important that the dependency of flash is removed. After this solution is implemented it will take seconds to run the application, even for a person with very little knowledge on internet and technology. They only would have to open the application on a browser, that’s it.
The primary solution offered removed the flash dependency and renovated the whole application on HTML5. Having said that there are lots of ideas and optimization decisions being taken and implemented, keeping in mind the requirements of the client, problem they are having now, targeted audience and other parameters which directly or indirectly would have made impact on the development.
The main centralized navigation system was developed in this module where intra application navigation system was implemented, such as traversing between game levels, game sections and other relevant navigation in the application.
All animation done in the application is with sprite images. Throughout the application sprite calls this module with relevant params to generate appropriate animation in place.
The story slides let the story get narrated in slides. It contains audio/video, images, texts to support the story context. We developed this module to show the slides with media which narrates the story to the user.
The game play module is the most important module of the application where, a question is asked to the user. The question gets generated depending on the level of the game selected by the user, with different options to choose from. On choosing the right answer it will allow the user to move to next level otherwise the question gets repeated with other random answers with the right one.
List of technologies used:
HTML5
CSS3
JAVASCRIPT
jQuery
The web based e-learning platform was successfully launched after 4 months of development, with completely new platform for the application with same look and feel but optimized technical solutions.
Migrated all of their existing website which was built with ASP.Net 2.0 into a newer platform with MVC5 framework and Web API2. Older website was given a design facelift with the latest trend of Bootstrap and HTML5.
Full Case Study
