ANIMAX

Animax is a web application that has animations which users can view and download. It was built with
purely CSS. At the time of this document, it has about 8-10 animations, we are still considering adding
more. It is targeting beginners in web development.

Features of the application

1) We have two types of users, those who has signed up and those who have not. They do not
have the same access.

Unauthenticated

This user would be able to see only some pages such as the landing page and documentation page
where they view some of the animations- a way to draw them in.

Authenticated Users

These users would access all the pages in Animax application.

2) At first, we wanted users to be able to copy their code, we wanted to use a light-box, ie, clicking
on the animation would show a modal showing the code used particularly for the animation
clicked on to achieve that but the animation that was built in ways that it allows user to import.
It does this by downloading the file, putting it in the same folder that their html code is in,
adding the ID to the element they want it to animate.
3) The animation is made with CSS. The animations includes, blinking, bouncing, fading, stretching,
moving left, right, etc. We wanted to do an NPM with the animation because javascript makes
animation look smoother. Infact, there was a time the person in charge of the library thought of
typescript but there is basically a lot of things to do with no much time.
4) The animation would be saved as a ZIP file, uploaded to cloud storage so users can retrieve it
anytime they want to download.
5) The way users would use our animation is in the landing page. Users would be taken through
the process of linking our CSS file to their own HTML file and using the ID of the animation they
want after viewing how it works in the documentation page.
6) The library is easy to use. When learning web development, the usage of the library we built
would be taught to the users because once a front end developer has started HTML and CSS,
they know how to link CSS file to their HTML file.
7) Users would be able to contact us but that would be after going through frequently asked
questions.
8) Users would be able to upload what they made with our animation library and also be able to
download it whenever they want.