diff --git a/issue-repro/src/main/java/com/airbnb/lottie/issues/IssueReproActivity.kt b/issue-repro/src/main/java/com/airbnb/lottie/issues/IssueReproActivity.kt
index 7fc7b8a..80f04ca 100755
--- a/issue-repro/src/main/java/com/airbnb/lottie/issues/IssueReproActivity.kt
+++ b/issue-repro/src/main/java/com/airbnb/lottie/issues/IssueReproActivity.kt
@@ -2,8 +2,17 @@
 
 import android.os.Bundle
 import androidx.activity.compose.setContent
-import androidx.annotation.FloatRange
 import androidx.appcompat.app.AppCompatActivity
+import androidx.compose.foundation.background
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.size
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.unit.dp
 import com.airbnb.lottie.compose.LottieAnimationSpec
 import com.airbnb.lottie.compose.LottieAnimationState
 import com.airbnb.lottie.compose.rememberLottieComposition
@@ -19,10 +28,19 @@
                 isPlaying = true,
                 repeatCount = Integer.MAX_VALUE,
             )
-            ComposeLottieAnimation(
-                compositionResult,
-                state,
-            )
+            Column(
+                verticalArrangement = Arrangement.Center,
+                horizontalAlignment = Alignment.CenterHorizontally,
+                modifier = Modifier.fillMaxSize(),
+            ) {
+                ComposeLottieAnimation(
+                    compositionResult,
+                    state,
+                    modifier = Modifier
+                        .size(256.dp)
+                        .background(Color.Blue)
+                )
+            }
         }
     }
 }
diff --git a/issue-repro/src/main/res/raw/anim.json b/issue-repro/src/main/res/raw/anim.json
index 072ccdb..8ac014b 100644
--- a/issue-repro/src/main/res/raw/anim.json
+++ b/issue-repro/src/main/res/raw/anim.json
@@ -1 +1 @@
-{"v":"5.7.4","fr":60,"ip":0,"op":61,"w":400,"h":400,"nm":"Test","ddd":0,"assets":[],"layers":[{"ddd":0,"ind":1,"ty":4,"nm":"Shape Layer 1","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[200,200,0],"ix":2,"l":2},"a":{"a":0,"k":[0,0,0],"ix":1,"l":2},"s":{"a":0,"k":[100,100,100],"ix":6,"l":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[150,150],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":1,"k":[{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":0,"s":[-125,-125],"to":[41.667,41.667],"ti":[-41.667,-41.667]},{"t":60,"s":[125,125]}],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle 1","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":61,"st":0,"bm":0}],"markers":[]}
\ No newline at end of file
+{"v":"5.7.4","fr":60,"ip":0,"op":181,"w":400,"h":400,"nm":"Diagonal","ddd":0,"assets":[],"layers":[{"ddd":0,"ind":1,"ty":4,"nm":"Shape Layer 1","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[200,200,0],"ix":2,"l":2},"a":{"a":0,"k":[0,0,0],"ix":1,"l":2},"s":{"a":0,"k":[100,100,100],"ix":6,"l":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[150,150],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":1,"k":[{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"t":0,"s":[-125,-125],"to":[41.667,41.667],"ti":[-41.667,-41.667]},{"t":180,"s":[125,125]}],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle 1","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":181,"st":0,"bm":0}],"markers":[]}
\ No newline at end of file
diff --git a/lottie-compose/src/main/java/com/airbnb/lottie/compose/renderer/LayerTransform.kt b/lottie-compose/src/main/java/com/airbnb/lottie/compose/renderer/ComposeLottieTransform.kt
similarity index 70%
rename from lottie-compose/src/main/java/com/airbnb/lottie/compose/renderer/LayerTransform.kt
rename to lottie-compose/src/main/java/com/airbnb/lottie/compose/renderer/ComposeLottieTransform.kt
index 4974626..ece86b3 100644
--- a/lottie-compose/src/main/java/com/airbnb/lottie/compose/renderer/LayerTransform.kt
+++ b/lottie-compose/src/main/java/com/airbnb/lottie/compose/renderer/ComposeLottieTransform.kt
@@ -3,14 +3,14 @@
 import android.graphics.PointF
 import androidx.compose.runtime.*
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.composed
 import androidx.compose.ui.graphics.graphicsLayer
 import com.airbnb.lottie.model.animatable.AnimatableTransform
+import com.airbnb.lottie.model.content.ShapeGroup
 import com.airbnb.lottie.model.layer.Layer
 import com.airbnb.lottie.value.Keyframe
 import kotlin.properties.Delegates
 
-fun Modifier.withTransform(transform: LayerTransform): Modifier {
+fun Modifier.withTransform(transform: ComposeLottieTransform): Modifier {
     if (transform.isIdentity) return this
 
     // TODO: maybe use composed {}
@@ -22,7 +22,26 @@
     )
 }
 
-class LayerTransform(private val transform: AnimatableTransform?) {
+@Composable
+fun rememberTransform(layer: Layer): ComposeLottieTransform {
+    val animatableTransform = remember(layer) { layer.transform }
+    return rememberTransform(animatableTransform)
+}
+
+@Composable
+fun rememberTransform(shapeGroup: ShapeGroup): ComposeLottieTransform {
+    val animatableTransform = remember(shapeGroup) { shapeGroup.items.lastOrNull() as? AnimatableTransform }
+    return rememberTransform(animatableTransform)
+}
+
+@Composable
+fun rememberTransform(transform: AnimatableTransform?): ComposeLottieTransform {
+    val composeTransform = remember(transform) { ComposeLottieTransform(transform) }
+    composeTransform.progress = LocalLottieProgress.current
+    return composeTransform
+}
+
+class ComposeLottieTransform(private val transform: AnimatableTransform?) {
     var progress by Delegates.observable(0f) { _, oldValue, newValue ->
         if (oldValue == newValue) return@observable
         updatePosition(newValue)
@@ -30,7 +49,7 @@
 
     private var positionProgress = 0f
     private var positionKeyframeIndex = 0
-    private var _position = mutableStateOf(POINT_F)
+    private var _position = mutableStateOf(PointF())
     val position: PointF by _position
 
     val isIdentity get() = transform == null || position.equals(0f, 0f)
@@ -50,10 +69,6 @@
             lerp(keyframe.startValue?.y ?: 0f, keyframe.endValue?.y ?: 0f, interpolatedProgress),
         )
     }
-
-    companion object {
-        private val POINT_F = PointF()
-    }
 }
 
 private fun <T> List<Keyframe<T>>.findKeyframeIndex(progress: Float, currentKeyframeIndex: Int): Keyframe<T> {
diff --git a/lottie-compose/src/main/java/com/airbnb/lottie/compose/renderer/LottieComposeRenderer.kt b/lottie-compose/src/main/java/com/airbnb/lottie/compose/renderer/LottieComposeRenderer.kt
index 20cb2c0..c50b0d8 100644
--- a/lottie-compose/src/main/java/com/airbnb/lottie/compose/renderer/LottieComposeRenderer.kt
+++ b/lottie-compose/src/main/java/com/airbnb/lottie/compose/renderer/LottieComposeRenderer.kt
@@ -3,7 +3,6 @@
 import android.graphics.PointF
 import android.util.Log
 import androidx.compose.foundation.Image
-import androidx.compose.foundation.layout.size
 import androidx.compose.runtime.*
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
@@ -13,7 +12,6 @@
 import com.airbnb.lottie.LottieComposition
 import com.airbnb.lottie.compose.LottieAnimationState
 import com.airbnb.lottie.compose.LottieCompositionResult
-import com.airbnb.lottie.model.animatable.AnimatableTransform
 import com.airbnb.lottie.model.content.RectangleShape
 import com.airbnb.lottie.model.content.ShapeFill
 import com.airbnb.lottie.model.content.ShapeGroup
@@ -24,7 +22,11 @@
 val LocalLottieProgress = compositionLocalOf { 0f }
 
 @Composable
-fun ComposeLottieAnimation(compositionResult: LottieCompositionResult, state: LottieAnimationState) {
+fun ComposeLottieAnimation(
+    compositionResult: LottieCompositionResult,
+    state: LottieAnimationState,
+    modifier: Modifier = Modifier,
+) {
     if (compositionResult !is LottieCompositionResult.Success) return
     val composition = compositionResult.composition
 
@@ -62,8 +64,7 @@
                 Layer.LayerType.SHAPE -> Image(
                     shapeLayerPainter(composition, layer),
                     contentDescription = null,
-                    // TODO: use a different size
-                    modifier = Modifier.size(256.dp)
+                    modifier = modifier,
                 )
                 else -> Unit
             }
@@ -73,23 +74,20 @@
 
 @Composable
 fun shapeLayerPainter(composition: LottieComposition, layer: Layer): VectorPainter {
-    val progress = LocalLottieProgress.current
-    val animatableTransform = remember(layer) { layer.shapes.firstOrNull { it is AnimatableTransform } as? AnimatableTransform }
-    val transform = LayerTransform(animatableTransform)
-    LaunchedEffect(progress) {
-        transform.progress = progress
-    }
-
+    val transform = rememberTransform(layer)
     return rememberVectorPainter(
-        defaultWidth = 256.dp,
-        defaultHeight = 256.dp,
+        defaultWidth = composition.bounds.width().dp,
+        defaultHeight = composition.bounds.height().dp,
+        viewportWidth = composition.bounds.width().toFloat(),
+        viewportHeight = composition.bounds.height().toFloat(),
     ) { viewportWidth, viewportHeight ->
+        Log.d("Gabe", "shapeLayerPainter ${transform.position}")
         Group(
             name = layer.layerName,
             translationX = transform.position.x,
             translationY = transform.position.y,
-            scaleX = viewportWidth / composition.bounds.width(),
-            scaleY = viewportHeight / composition.bounds.height(),
+            scaleX = composition.bounds.width() / viewportWidth,
+            scaleY = composition.bounds.height() / viewportHeight,
         ) {
             PathData {
                 layer.shapes.forEach { shapeModel ->
@@ -106,18 +104,25 @@
 @Composable
 fun ComposeShapeGroup(shapeGroup: ShapeGroup) {
     if (shapeGroup.isHidden || shapeGroup.items.isEmpty()) return
-    val transform = remember(shapeGroup) { LayerTransform(shapeGroup.items.lastOrNull() as? AnimatableTransform) }
+    val transform = rememberTransform(shapeGroup)
     val pathData = remember { mutableListOf<PathNode>() }
-    val progress = LocalLottieProgress.current
-    LaunchedEffect(progress) {
-        transform.progress = progress
-    }
-    pathData.clear()
+
+    Log.d("Gabe", "ComposeShapeGroup ${transform.position}")
     Group(
         name = shapeGroup.name,
         translationX = transform.position.x,
         translationY = transform.position.y,
     ) {
+        // Reuse the list and clear it so that the backing array doesn't need to be recreated.
+        pathData.clear()
+        pathData += PathData {
+            moveTo(380f, 0f)
+            lineTo(400f, 0f)
+            lineTo(400f, 20f)
+            lineTo(380f, 20f)
+            lineTo(380f, 0f)
+            close()
+        }
         for (model in shapeGroup.items) {
             when (model) {
                 is RectangleShape -> {
@@ -127,7 +132,6 @@
                     ComposeShapeFill(model, pathData)
                 }
             }
-            Log.d("Gabe", "Drawing ${model::class.simpleName} $model")
         }
     }
 }
@@ -148,19 +152,23 @@
         lerp(sizeKeyframe.startValue?.y ?: 0f, sizeKeyframe.endValue?.y ?: 0f, interpolatedProgress),
     )
 
+    val halfWidth = size.x / 2f
+    val halfHeight = size.y / 2f
+
     return PathData {
-        moveTo(0f, 0f)
-        lineTo(size.x, 0f)
-        lineTo(size.x, size.y)
-        lineTo(0f, size.y)
-        lineTo(0f, 0f)
+        moveTo(-halfWidth, -halfHeight)
+        lineTo(halfWidth, -halfHeight)
+        lineTo(halfWidth, halfHeight)
+        lineTo(-halfWidth, halfHeight)
+        lineTo(-halfWidth, -halfHeight)
         close()
     }
 }
 
 @Composable
 fun ComposeShapeFill(fill: ShapeFill, pathData: List<PathNode>) {
-    Log.d("Gabe", "Drawing fill with ${pathData.size} nodes")
+    val colorAnimation = fill.color?.keyframes ?: return
+
     Path(
         pathData,
         // TODO: use the real color
diff --git a/lottie/src/main/java/com/airbnb/lottie/model/layer/Layer.java b/lottie/src/main/java/com/airbnb/lottie/model/layer/Layer.java
index 7bab3ab..fd4aa09 100644
--- a/lottie/src/main/java/com/airbnb/lottie/model/layer/Layer.java
+++ b/lottie/src/main/java/com/airbnb/lottie/model/layer/Layer.java
@@ -149,7 +149,7 @@
     return shapes;
   }
 
-  AnimatableTransform getTransform() {
+  public AnimatableTransform getTransform() {
     return transform;
   }
 
diff --git a/lottie/src/main/java/com/airbnb/lottie/utils/Utils.java b/lottie/src/main/java/com/airbnb/lottie/utils/Utils.java
index baac4e5..136c1ee 100644
--- a/lottie/src/main/java/com/airbnb/lottie/utils/Utils.java
+++ b/lottie/src/main/java/com/airbnb/lottie/utils/Utils.java
@@ -252,6 +252,7 @@
   }
 
   public static float dpScale() {
+    if (true) return 1;
     if (dpScale == -1) {
       dpScale = Resources.getSystem().getDisplayMetrics().density;
     }