Home
Computer Graphics, 2020
20161201 Choi Yerin
5rd Project
Program Document
##Title Robot Dance Animator
##Link
Project Link
Project Code (Project5)
##Concept
"Robot Dance Animator" is a queue-frame 3D animator. Users can make their own choreography using sliders and buttons.
There were two 'dance sequence' that I wanted to make -- I wanted something funny and relatable so that it means more than just a movement.
But I thought it was not very efficient to make a single (or two) sequence, so I made a dance animator so that I can record any kind of choreography. Users will enjoy this animator since animating a robot has been thought to be something that can only be done on programs like Maya or Cinema4D. Now users can make their own choreography, and download the sequence so that they can test the sequence later.
Users who want to test choreography on robot online.
###Sliders
There are 3 sliders for controling view, and 22 sliders for controling movement.
There are three view sliders. Each sliders are for view x, y, and z.
For view x, you can rotate the scene. (-90 to 0 degrees)
For view y, you can control the height of the view.
For view z, you can rotate the scene. (0 to 180 degrees)
There are 6 parts of the robot you can control, and for each part there are 3 or 4 sliders.
For waist top and waist bottom, the 3 sliders are for x, y, z rotation.
For the rest of the parts, the first 3 sliders are for x, y, z rotation and the last slider is for lower part of the slider. For instance, last slider for right arm rotates the lower arm.
###Buttons
Robot Dance Animator supports 7 buttons for users.
Model Buttons
push : "pushes" the pose to the choreography.
run : runs the choreography. This sets the run_flag.
reset : delete all the choreography and intialize the pose. This resets the run_flag and initializes choreo array.
light : enable or disable lights and stroke.
save : downloads the sequence of coordinates of choreography in text file.
Preset Buttons
User can test 2 preset choreo on the Robot Dance Animator.
국민체조: The Robot dances (promotes) to the 국민체조 music and choreography.
성시경 : The Robot dances to the 'View' of Shinee, with choreo of Sung shikyung.
sketch.js
preload function loads the music for presets.
setup function sets all the user interfaces like buttons or sliders.
draw function draws the scene according to run_flag. If run_flag is set, the robot is drawing through the sequence of choreo coordinates. Else, the robot is controlled by user.
rig.js
rightLeg, leftLeg, rightArm, leftArm draws each part of the robot body. Each of the functions takes 4 inputs, x, y, z, and lower x relatively.
slider.js
setSliders sets and initializes and positions all the 25 sliders. This is separated from setup function just for code readability.
choreo, velocity, current are main arrays for implementation.
choreo (array) : if user pushes a pose, the coordinates of each of the parts (slider values) are pushed to choreo array. Thus if the user pushes 1 pose, then 22 values are inputted to the array.
velocity (array) : when run_flag is set by hitting run button, the program computes velocity for moving one pose to another. The animation runs 1 pose per 30 frames by default, so the velocity is calculated by following equation :
velocity[i] =
(choreo[(choreo_idx+1)*slider_cnt + i] -
choreo[choreo_idx*slider_cnt + i]) / (frmrate);
// frmrate is 30
current (array) : when run_flag is set and all values of velocity is set, values for current array is generated. current is basically current coordinate of the movement, and values are computed by following equation :
for (i = 0; i < slider_cnt; i++) {
current[i] += velocity[i];
}
// slider_cnt is number of coordinates (22)
robot moves according the current array, and current array is updated by velocity array frame by frame.
