# 2021-02-16 - How to implement animations?
We present our research from [here](https://github.com/hpi-swa-lab/BP2020RH1/wiki/animations).
## General Idea
- Sequences hold one `PropertyAnimation` per animated property on a morph in the sequence.
- Sequences update each Animation with its current progress.
- `PropertyAnimations` hold
- a `target` (Morph) which they reference
- a property that is animated
- `keyframes` between which is interpolated, an ordered array of keyframe objects, each holding
- numbers (0 to 1 -- progress) and
- property value
- name (customer wants this)
- per convention two keypairs following each other constitute an interval
- (a curve, this is an anonymous function)
- first step: assume linear curve everywhere
- For different kinds of properties (e.g. Color-based, number-based, text-based) PropertyAnimation can be subclassed
## `PropertyAnimation` external interface:
- `progress` (setter) will update the animation, may cause a rerender. This is triggered by the sequence
- `name` (get, set)