Expected duration: less than 1 week Our company started to develop a machine that is capable to count squats using computer vision and generate a ticket if a certain number is reached in a period of time. Project was already developed by companies in India, Mexico and Russia. Please watch the following video to understand exactly the concept: https://www.youtube.com/watch?v=hK_6T1KYvRw https://www.youtube.com/watch?v=OZn7GufsHgs https://www.youtube.com/watch?v=CKCLhPs4XG4 https://www.youtube.com/watch?v=XAHbatuwG6Y
From software and hardware point of view our machine is ready. Now we need design for the user interface and for the box. (HTML+CSS+JS code)
We created a simple and basic web interface that should be designed by you in a very professional way. We need animations (for countdown for example), .etc The interface has 6 states, each of them is represented by a . To switch between states I used jQuery. What I want from you is to work on same divs.
There is no person in front of machine $('#statustry').css('background-color', 'green'); Currently when a user is detected in front of machine, #statustry will be green. – You can use other marker to indicate that a person is in front of machine // state 2, prepare (countdown timer) In this case a person was detected and a countdown timer will start. // state 3, in cycle Cycle will start and on screen user will be able to see how many squats he made and time left // state 4, Cycle Completed Successfuly When cycle is completed a message should indicate this and the ticket will start printing // state 5, Timeout When cycle started but the user doesn’t manage to do all squats in the time // state 6, incorect posture During the cycle if the user doesn’t have right posture a message should be displayed. If he doesn’t correct the posture in few seconds, the cycle will be reseted.
