Method and a system for creating an audio-enabled svg animations used as learning contents

A method for creating a learning content at a server, comprising:

• receiving a plurality of chunks of a JSON document, from a user front end module of a web-based application hosted by the server;
• reconstructing the JSON document by combining the plurality of smaller chunks;
• extracting an audio metadata and the visual metadata from the reconstructed JSON document;
• and
• performing a plurality of operations to create an enhanced JSON document as the learning content.

A method for creating a learning content for an end user’s device, comprising:

• transmitting a request to view a specific content on a user interface deployed by a web-based application;
• receiving a plurality of chunks pertaining to a JSON document, from a server in response to the request;
• re-creating the JSON document by combining the plurality of smaller chunks;
• extracting a visual metadata from the re-created JSON document and transforming the visual metadata to a Cascading Style Sheets (CSS) animated SVG and play the CSS-animated SVG,
• extracting the audio metadata from the re-created JSON document and convert the audio metadata to a plurality of audio blobs;
• and
• controlling playing of the CSS-animated SVG and the plurality of audio blobs on a display of the end user’s device such that the CSS-animated SVG audio and the plurality of audio blobs are being played in synchronization on the display of the end user’s device.

A server for creating a learning content, comprising:

• a memory;
• and
• a processor coupled with the memory and configured to:
• receive a plurality of chunks of a JSON document, from a user front end module of a web-based application hosted by the server;
• reconstructing the JSON document by combining the plurality of smaller chunks;
• extract an audio metadata and the visual metadata from the reconstructed JSON document;
• and
• perform a plurality of operations to create an enhanced JSON document as the learning content.

A non-transitory computer-readable medium storing instructions that, when executed by one or more processors of a server, cause the server to perform operations comprising:

• receiving a plurality of user inputs on a digital canvas deployed by a web-based application hosted at the server;
• simultaneously generating a visual representation of the plurality of user inputs on the digital canvas in real time;
• and
• generating an audio-integrated animated Scalable Vector Graphics (SVG) format as an output to create learning content.

A non-transitory computer-readable medium storing instructions that, when executed by one or more processors of a server, cause the server to perform operations comprising:

• receiving a plurality of chunks of a JSON document from a client device;
• reconstructing the JSON document by combining the plurality of chunks;
• extracting audio metadata and visual metadata from the reconstructed JSON document;
• and
• performing a plurality of operations to create an enhanced JSON document as learning content.