Google Summer of Code Final Work Product#
Name: Mohamed Abouagour
Organisation: Python Software Foundation
Sub-Organisation: FURY
Project: FURY - Keyframe animations API
Proposed Objectives#
Keyframe animations API
Basic playback functions, such as playing, pausing, and rewinding the timeline.
Adding keyframes at a specific time for transformations of FURY actors and cameras such as translation, scale, rotation, color, and opacity.
Implement quaternion-based interpolation (SLERP)
Allow the camera to be interpolated by the keyframe system.
Allow the creation and removal of actors from the scene according to the keyframes.
Visualize the motion path of positional animation.
Speed the animation using GLSL vertex and fragment shaders.
Modified Objectives#
Adding a playback panel for controlling the timeline.
Billboard actor using the geometry shader.
Hierarchical animation support.
Animating primitives of the same FURY actor separately.
Color interpolators.
Objectives Completed#
Keyframes Animation API
Animation
ClassThe
Animation
class is the main part of the FURY animation module. It is responsible for keyframe animations for a single or a group of FURY actors. TheAnimation
is able to handle multiple attributes and properties of FURY actors such as position, color, scale, rotation, and opacity. It is also capable of doing the following:Set animation keyframes and events.
Animate custom properties.
Support add-to-scene/remove-from-scene events.
Can animate other animations (Hierarchical animation)
Set or change the keyframes interpolation method.
Visualize the motion path of the positional animation.
Timeline
Class TheTimeline
is the player of FURYAnimations
; it controls the playback of one or more FURY animations. It also has the option to include a very useful playback panel to help control the playback of the animation. TheTimeline
can have a fixed length or get its duration from the animations added to it dynamically. It can loop, play once, change speed, play, pause, and stop.
- Keyframes Interpolators
Interpolation is also a core part of the keyframes animation. It is responsible for filling in the blanks between the keyframes so that we have transitional states between the set keyframes. Another factor is that interpolators must be super-optimized to interpolate data in a minimum amount of time as possible or else it would be the bottleneck that lags the animation. The following interpolators have been implemented as a part of the keyframes animation API:
Step Interpolator
Linear Interpolator
Spherical Linear Interpolator (Slerp)
Spline Interpolator
Cubic Spline Interpolator
Cubic Bézier Interpolator
Color Interpolators:
XYZ Color Interpolator
Lab Color Interpolator
HSV Color Interpolator
- Tutorials
Also included 11 tutorials demonstrating how the FURY keyframe animation API works and how to use it to make some interesting animations. These tutorial will be added soon to the FURY website. Subjects explained in the tutorials are:
Introduction
Timeline
Interpolators
Camera Animation
Hierarchical Animation
Using Color Interpolators
Using Bezier Interpolator
Using Spline Interpolator
Using time-based functions
Creating Custom Interpolators
Arm Robot Animation
Pull Requests:
Keyframe animations and interpolators (Merged): fury-gl/fury#647
Separating the ``Timeline`` (Ready to be Merged): fury-gl/fury#694
Timeline hierarchical transformation (Merged): fury-gl/fury#665
Add Timelines to ShowManager directly (Ready to be Merged): fury-gl/fury#690
Updating animation tutorials (Ready to be Merged): fury-gl/fury#680
Record keyframe animation as GIF and MP4 (Under Development): fury-gl/fury#687
PlaybackPanel UI component
At first, while in the early development stage of the FURY keyframe animation API, basic playback buttons were used to play, pause, and stop the animation. As the API kept growing, more controllers needed to be implemented, such as the time progress slider, the speed changer, and the loop toggle. And composing all of these controllers into a single UI element was inevitable. While the PlaybackPanel is a main part of the
Timeline
, the goal was to make it completely independent from the keyframes animation API so that it can be used for anything else, i.e. a video player actor or a continuous time simulation or any other time-dependent applications.Pull Requests:
``PlaybackPanel`` initial implementation (Merged): fury-gl/fury#647
Set position and width of the ``PlaybackPanel`` (Merged): fury-gl/fury#692
- Billboard actor using the geometry shader
FURY already has a billboard actor implemented using two triangles to construct the billboard. But the new approach uses only one vertex and the canvas of the billboard is generated by the geometry shader. This approach is faster in initialization since only the center is needed and no additional computations to generate the primitive on the CPU side. Also, animating these new billboards using the method mentioned above in the previous objective is way much faster, and faster is one of the reasons why we use billboards.
Pull Requests:
billboards using geometry shader (Ready to be Merged): fury-gl/fury#631
Objectives in Progress#
- Animating primitives of the same FURY Actor separately
Animating FURY actors is not a problem and can be done easily using the FURY animation module. The problem appears when trying to animate a massive amount of actors, thousands or even hundreds of thousands of actors, it’s impossible to do that using the animation module. Instead, primitives of the same actor can be animated by changing their vertices and then sending the new vertices buffer to the GPU. This also needs some discussion to find the cleanest way to implement it.
Pull Requests:
Animating primitives of the same actor (Draft): fury-gl/fury#660
Added primitives count to the polydata (Merged): fury-gl/fury#617
- Speeding up the animation using GLSL shaders
Using the power of the GPU to help speed up the animations since some interpolators are relatively slow, such as the spline interpolator. Besides, morphing and skeletal animation would be tremendously optimized if they were computed on the GPU side!
Pull Requests:
Adding shader support for doing the animations (Open): fury-gl/fury#702
Other Objectives#
- Added more enhancements to the
vector_text
actor Added the ability to change the direction of the
vector_text
actor, as well as giving it the option to follow the camera. Also added the option to extrude the text which makes it more like 3D text.Pull Requests:
Improving ``vector_text`` (Merged) : fury-gl/fury#661
- Added more enhancements to the
Other PRs
Fixed multi_samples not being used (Merged): fury-gl/fury#594
Added an accurate way to calculate FPS (Merged): fury-gl/fury#597
Implemented two new hooks for UI sliders (Merged): fury-gl/fury#634
Fixed some old tutorials (Merged): fury-gl/fury#591
Returning the Timer id while initialization (Merged): fury-gl/fury#598
GSoC Weekly Blogs
My blog posts can be found on the FURY website and the Python GSoC blog.
Timeline#
Date |
Description |
Blog Post Link |
---|---|---|
Week 0 |
My journey till getting accepted into GSoC22 |
|
Week 1 |
Implementing a basic Keyframe animation API |
|
Week 2 |
Implementing non-linear and color interpolators |
|
Week 3 |
Redesigning the API, |
|
Week 4 |
Camera animation, |
|
Week 5 |
Slerp implementation, |
|
Week 6 |
Fixing the Timeline issues and equipping it with |
|
Week 7 |
Billboard spheres and implementing interpolators |
|
Week 8 |
Back to the shader-based version of the Timeline |
|
Week 9 |
Animating primitives of the same actor |
|
Week 10 |
Supporting hierarchical animating |
|
Week 11 |
Improving tutorials a little |
|
Week 12 |
Adding new tutorials |
|
Week 13 |
Keyframes animation is now a bit easier in FURY |