Created Shrink Animation (Opposite of Grow)

src/animation/Shrink.ts

@@ -0,0 +1,13 @@
+import { Animation } from "./Animation.js";
+import * as THREE from "three";
+
+export default class Shrink extends Animation {
+    constructor(object: THREE.Object3D) {
+        super(
+            (elapsedTime) => {
+                object.scale.set(1 - elapsedTime, 1 - elapsedTime, 1 - elapsedTime);
+            },
+            { object, reveal: true },
+        );
+    }
+}

src/animation/index.ts

@@ -12,7 +12,7 @@ export { default as Wait } from "./Wait.js";
 export { default as Emphasize } from "./Emphasize.js";
 export { default as Shake } from "./Shake.js";
 export { default as Grow } from "./Grow.js";
+export { default as Shrink } from "./Shrink.js";
 export { default as Stagger } from "./Stagger.js";
 export { default as SetStyle } from "./SetStyle.js";
 export { default as StaggerFadeIn } from "./StaggerFadeIn.js";
-

userScene/main.ts

@@ -31,13 +31,9 @@ export default class Scene implements StudioScene {
 
     this.animations = [
       new Animation.Wait(),
-      new Animation.Animation((t, _) => {
-        triangle.reshape([
-          new THREE.Vector3(-1, -1, 0),
-          new THREE.Vector3(1 + t, 1, 0),
-          new THREE.Vector3(1, -1, 0),
-        ]);
-      }),
+      new Animation.Shrink(triangle),
+      new Animation.Grow(triangle),
+
     ];
   }
 }