The client runs an educational business. On www.Gokids.dk the editors are able to create educational exercises (called tasks).
On the tasks, the client wants the user to be able to add pictures and a video so that the user can see how the task is executed.
There is a simple function (js library) where the editor can add pictures but they cannot delete them. They can also add a link to a youtube video, making the video display. This needs to be integrated.
The following functions must be completed
- As an editor, users must add multiple pictures to a task
- As an editor, users must be able to delete pictures from a task
- As a user must be able to see a large picture on a task
- As a user must be able to see thumbnails of pictures on a task and when clicked on a large picture
- As an editor users user users must be able to add a video to a task
- As an editor user users must be able to delete a video on a task
- As a user must be able to see a thumbnail of a video on a task
- as a user users must be able to play the video on the task
- As a user user users must be able to maximize the video on a task
The following nonfunctional stories must be completed:
- The task page must load < 1,5 seconds
- The pictures and videos must not be stored in DB.
The site is built as a frontend site, accessing web services.
The frontend is an ASP.NET MVC site but uses mostly HTML5, Less, AJAX, Bootstrap 4.0, and Jquery (and a bit angular 1.X) The services are purely a WEB API solution.
Our Experience and Possible Solution
We have worked on a similar application for a Gym. Trainers have multiple clients/users under them, for whom they create exercises to be performed each day. Trainers upload images for the exercises and YouTube links to show how a particular exercise needs to be executed. Youtube links are embedded in an iFrame and thus opens on the site itself.
Our team is well versed with ASP.Net 4.5 framework, MVC 5 with razor engine, Bootstrap, Entity Framework 6.0, SQL Server, and jQuery UI.