TylerK · March 25, 2016 21:14 · Mar 25, 2016
diff --git a/staggered-motion.js b/staggered-motion.js
@@ -0,0 +1,19 @@
+/**
+ * Let's say you have a list of 4 icons that need to "pop up" in sequence when their parent element is hovered. 
+ * To give the icons a more initial exageration, use loose "initial" damping and a stiffer "final" damping.
+ * If you want to give your staggered animation more oomph at the end, reverse these values.
+ */ 
+<StaggeredMotion
+  defaultStyles={[ { y: 10 }, { y: 10 }, { y: 10 }, { y: 10 } ]}
+  styles={prevInterpolatedStyles => prevInterpolatedStyles.map((_, i) => {
+    return i === 0
+
+      // Initial stiffness and damping
+      ? { y: spring(0, { stiffness: 300, damping: 18 }) }
+
+      // Final stiffness and damping 
+      : { y: spring(prevInterpolatedStyles[i - 1].y, { stiffness: 300, damping: 26 }) };
+  })}
+>
+  [...]
+</StaggeredMotion>