diff --git a/examples/amp-story/animations-presets.html b/examples/amp-story/animations-presets.html
index 868d2beeea35e..cff9d3e779ca8 100644
--- a/examples/amp-story/animations-presets.html
+++ b/examples/amp-story/animations-presets.html
@@ -178,7 +178,7 @@ <h1>zoom-in</h1>
     <!-- ## Zoom-Out -->
     <amp-story-page id="zoom-out">
       <amp-story-grid-layer template="fill">
-        <amp-img animate-in="zoom-out" animate-in-duration="4s" layout="responsive" src="https://picsum.photos/720/320?image=1026"
+        <amp-img animate-in="zoom-out" scale-start="3" scale-end="1" animate-in-duration="4s" layout="responsive" src="https://picsum.photos/720/320?image=1026"
           width="720" height="320">
         </amp-img>
       </amp-story-grid-layer>
@@ -190,7 +190,7 @@ <h1>zoom-out</h1>
     <!-- ## Pan-Left -->
     <amp-story-page id="pan-left">
       <amp-story-grid-layer template="fill">
-        <amp-img animate-in="pan-left" id="img-pan-left" animate-in-duration="4s" layout="fixed" src="https://picsum.photos/720/320?image=1026"
+        <amp-img animate-in="pan-left" id="img-pan-left" translate-x="600px" animate-in-duration="4s" layout="fixed" src="https://picsum.photos/720/320?image=1026"
           width="720" height="320">
         </amp-img>
       </amp-story-grid-layer>
@@ -202,7 +202,7 @@ <h1>pan-left</h1>
     <!-- ## Pan-Right -->
     <amp-story-page id="pan-right">
       <amp-story-grid-layer template="fill">
-        <amp-img animate-in="pan-right" animate-in-duration="4s" layout="fixed" src="https://picsum.photos/720/320?image=1026" width="720"
+        <amp-img animate-in="pan-right" animate-in-duration="4s" translate-x="200px" layout="fixed" src="https://picsum.photos/720/320?image=1026" width="720"
           height="320">
         </amp-img>
       </amp-story-grid-layer>
@@ -214,7 +214,7 @@ <h1>pan-right</h1>
     <!-- ## Pan-Up -->
     <amp-story-page id="pan-up">
       <amp-story-grid-layer template="fill">
-        <amp-img animate-in="pan-up" animate-in-duration="4s" layout="fixed" src="https://picsum.photos/720/320?image=1026" width="720"
+        <amp-img animate-in="pan-up" animate-in-duration="4s" translate-y="100px" layout="fixed" src="https://picsum.photos/720/320?image=1026" width="720"
           height="320">
         </amp-img>
       </amp-story-grid-layer>
@@ -226,7 +226,7 @@ <h1>pan-up</h1>
     <!-- ## Pan-Down -->
     <amp-story-page id="pan-down">
       <amp-story-grid-layer template="fill">
-        <amp-img animate-in="pan-down" animate-in-duration="4s" layout="fixed" src="https://picsum.photos/720/320?image=1026" width="720"
+        <amp-img animate-in="pan-down" animate-in-duration="4s" translate-y="100px" layout="fixed" src="https://picsum.photos/720/320?image=1026" width="720"
           height="320">
         </amp-img>
       </amp-story-grid-layer>
diff --git a/examples/amp-story/visual-effects.html b/examples/amp-story/visual-effects.html
index 3322b2eb8c844..ab2d37adc8d2c 100644
--- a/examples/amp-story/visual-effects.html
+++ b/examples/amp-story/visual-effects.html
@@ -6,7 +6,7 @@
   <link rel="canonical" href="visual-effects.html">
   <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
   <script async src="https://cdn.ampproject.org/v0.js"></script>
-  <script async custom-element="amp-story" src="https://cdn.ampproject.org/v0/amp-story-0.1.js"></script>
+  <script async custom-element="amp-story" src="https://cdn.ampproject.org/v0/amp-story-1.0.js"></script>
   <style amp-custom>
     amp-story-page {
       font-family: 'Roboto', sans-serif;
@@ -33,7 +33,7 @@
 
     <amp-story-page id="ken-burns-effect1">
       <amp-story-grid-layer template="fill">
-        <div animate-in="zoom-in" animate-in-duration="30s" class="img-container">
+        <div animate-in="zoom-in" animate-in-duration="30s" scale-start="1" scale-end="3" class="img-container">
           <amp-img id="ken-burns-img1" src="https://picsum.photos/1600/1200?image=1077" animate-in="pan-left" animate-in-duration="30s"
             layout="fixed" width="1600" height="1200">
           </amp-img>
diff --git a/extensions/amp-story/1.0/animation-presets.js b/extensions/amp-story/1.0/animation-presets.js
index 0db9b27e63fbf..d965fc287c3b7 100644
--- a/extensions/amp-story/1.0/animation-presets.js
+++ b/extensions/amp-story/1.0/animation-presets.js
@@ -24,9 +24,16 @@ import {
   whooshIn,
 } from './animation-presets-utils';
 import {px} from '../../../src/style';
+import {userAssert} from '../../../src/log';
 
+/** @const {string} */
 const FULL_BLEED_CATEGORY = 'full-bleed';
+/** @const {string} */
 const FILL_TEMPLATE_LAYOUT = 'fill';
+/** @const {number} */
+const SCALE_HIGH_DEFAULT = 3;
+/** @const {number} */
+const SCALE_LOW_DEFAULT = 1;
 
 /**
  * A list of animations that are full bleed.
@@ -68,232 +75,284 @@ export function setStyleForPreset(el, presetName) {
   }
 }
 
-/** @const {!Object<string, !StoryAnimationPresetDef>} */
+/**
+ * @param {string} name
+ * @param {!Object} options
+ * @return {?StoryAnimationPresetDef}
+ */
 // First keyframe will always be considered offset: 0 and will be applied to the
 // element as the first frame before animation starts.
-export const PRESETS = {
-  'pulse': {
-    duration: 500,
-    easing: 'linear',
-    keyframes: [
-      {
-        offset: 0,
-        transform: 'scale(1)',
-      },
-      {
-        offset: 0.25,
-        transform: 'scale(0.95)',
-      },
-      {
-        offset: 0.75,
-        transform: 'scale(1.05)',
-      },
-      {
-        offset: 1,
-        transform: 'scale(1)',
-      },
-    ],
-  },
-  'fly-in-left': {
-    duration: 500,
-    easing: 'ease-out',
-    keyframes(dimensions) {
-      const offsetX = -(dimensions.targetX + dimensions.targetWidth);
-      return translate2d(offsetX, 0, 0, 0);
-    },
-  },
-  'fly-in-right': {
-    duration: 500,
-    easing: 'ease-out',
-    keyframes(dimensions) {
-      const offsetX = dimensions.pageWidth - dimensions.targetX;
-      return translate2d(offsetX, 0, 0, 0);
-    },
-  },
-  'fly-in-top': {
-    duration: 500,
-    easing: 'ease-out',
-    keyframes(dimensions) {
-      const offsetY = -(dimensions.targetY + dimensions.targetHeight);
-      return translate2d(0, offsetY, 0, 0);
-    },
-  },
-  'fly-in-bottom': {
-    duration: 500,
-    easing: 'ease-out',
-    keyframes(dimensions) {
-      const offsetY = dimensions.pageHeight - dimensions.targetY;
-      return translate2d(0, offsetY, 0, 0);
-    },
-  },
-  'rotate-in-left': {
-    duration: 700,
-    easing: 'ease-out',
-    keyframes(dimensions) {
-      const offsetX = -(dimensions.targetX + dimensions.targetWidth);
-      return rotateAndTranslate(offsetX, 0, 0, 0, -1);
-    },
-  },
-  'rotate-in-right': {
-    duration: 700,
-    easing: 'ease-out',
-    keyframes(dimensions) {
-      const offsetX = dimensions.pageWidth - dimensions.targetX;
-      return rotateAndTranslate(offsetX, 0, 0, 0, 1);
-    },
-  },
-  'fade-in': {
-    duration: 500,
-    easing: 'ease-out',
-    keyframes: [
-      {
-        opacity: 0,
-      },
-      {
-        opacity: 1,
-      },
-    ],
-  },
-  'drop': {
-    duration: 1600,
-    keyframes(dimensions) {
-      const maxBounceHeight =
-          Math.max(160, dimensions.targetY + dimensions.targetHeight);
-
-      return [
-        {
-          offset: 0,
-          transform: `translateY(${px(-maxBounceHeight)})`,
-          easing: 'cubic-bezier(.75,.05,.86,.08)',
+export const getPresetDef = (name, options) => {
+  switch (name) {
+    case 'pulse':
+      return {
+        duration: 500,
+        easing: 'linear',
+        keyframes: [
+          {
+            offset: 0,
+            transform: 'scale(1)',
+          },
+          {
+            offset: 0.25,
+            transform: 'scale(0.95)',
+          },
+          {
+            offset: 0.75,
+            transform: 'scale(1.05)',
+          },
+          {
+            offset: 1,
+            transform: 'scale(1)',
+          },
+        ],
+      };
+    case 'fly-in-left':
+      return {
+        duration: 500,
+        easing: 'ease-out',
+        keyframes(dimensions) {
+          const offsetX = -(dimensions.targetX + dimensions.targetWidth);
+          return translate2d(offsetX, 0, 0, 0);
+        },
+      };
+    case 'fly-in-right':
+      return {
+        duration: 500,
+        easing: 'ease-out',
+        keyframes(dimensions) {
+          const offsetX = dimensions.pageWidth - dimensions.targetX;
+          return translate2d(offsetX, 0, 0, 0);
+        },
+      };
+    case 'fly-in-top':
+      return {
+        duration: 500,
+        easing: 'ease-out',
+        keyframes(dimensions) {
+          const offsetY = -(dimensions.targetY + dimensions.targetHeight);
+          return translate2d(0, offsetY, 0, 0);
         },
-        {
-          offset: 0.3,
-          transform: 'translateY(0)',
-          easing: 'cubic-bezier(.22,.61,.35,1)',
+      };
+    case 'fly-in-bottom':
+      return {
+        duration: 500,
+        easing: 'ease-out',
+        keyframes(dimensions) {
+          const offsetY = dimensions.pageHeight - dimensions.targetY;
+          return translate2d(0, offsetY, 0, 0);
         },
-        {
-          offset: 0.52,
-          transform: `translateY(${px(-0.6 * maxBounceHeight)})`,
-          easing: 'cubic-bezier(.75,.05,.86,.08)',
+      };
+    case 'rotate-in-left':
+      return {
+        duration: 700,
+        easing: 'ease-out',
+        keyframes(dimensions) {
+          const offsetX = -(dimensions.targetX + dimensions.targetWidth);
+          return rotateAndTranslate(offsetX, 0, 0, 0, -1);
         },
-        {
-          offset: 0.74,
-          transform: 'translateY(0)',
-          easing: 'cubic-bezier(.22,.61,.35,1)',
+      };
+    case 'rotate-in-right':
+      return {
+        duration: 700,
+        easing: 'ease-out',
+        keyframes(dimensions) {
+          const offsetX = dimensions.pageWidth - dimensions.targetX;
+          return rotateAndTranslate(offsetX, 0, 0, 0, 1);
         },
-        {
-          offset: 0.83,
-          transform: `translateY(${px(-0.3 * maxBounceHeight)})`,
-          easing: 'cubic-bezier(.75,.05,.86,.08)',
+      };
+    case 'fade-in':
+      return {
+        duration: 500,
+        easing: 'ease-out',
+        keyframes: [
+          {
+            opacity: 0,
+          },
+          {
+            opacity: 1,
+          },
+        ],
+      };
+    case 'drop':
+      return {
+        duration: 1600,
+        keyframes(dimensions) {
+          const maxBounceHeight =
+            Math.max(160, dimensions.targetY + dimensions.targetHeight);
+
+          return [
+            {
+              offset: 0,
+              transform: `translateY(${px(-maxBounceHeight)})`,
+              easing: 'cubic-bezier(.75,.05,.86,.08)',
+            },
+            {
+              offset: 0.3,
+              transform: 'translateY(0)',
+              easing: 'cubic-bezier(.22,.61,.35,1)',
+            },
+            {
+              offset: 0.52,
+              transform: `translateY(${px(-0.6 * maxBounceHeight)})`,
+              easing: 'cubic-bezier(.75,.05,.86,.08)',
+            },
+            {
+              offset: 0.74,
+              transform: 'translateY(0)',
+              easing: 'cubic-bezier(.22,.61,.35,1)',
+            },
+            {
+              offset: 0.83,
+              transform: `translateY(${px(-0.3 * maxBounceHeight)})`,
+              easing: 'cubic-bezier(.75,.05,.86,.08)',
+            },
+            {
+              offset: 1,
+              transform: 'translateY(0)',
+              easing: 'cubic-bezier(.22,.61,.35,1)',
+            },
+          ];
+        },
+      };
+    case 'twirl-in':
+      return {
+        duration: 1000,
+        easing: 'cubic-bezier(.2,.75,.4,1)',
+        keyframes: [
+          {
+            transform: 'rotate(-540deg) scale(0.1)',
+            opacity: 0,
+          },
+          {
+            transform: 'none',
+            opacity: 1,
+          },
+        ],
+      };
+    case 'whoosh-in-left':
+      return {
+        duration: 500,
+        easing: 'ease-out',
+        keyframes(dimensions) {
+          const offsetX = -(dimensions.targetX + dimensions.targetWidth);
+          return whooshIn(offsetX, 0, 0, 0);
+        },
+      };
+    case 'whoosh-in-right':
+      return {
+        duration: 500,
+        easing: 'ease-out',
+        keyframes(dimensions) {
+          const offsetX = dimensions.pageWidth - dimensions.targetX;
+          return whooshIn(offsetX, 0, 0, 0);
+        },
+      };
+    case 'pan-left':
+      let {translateX} = options;
+
+      return {
+        duration: 1000,
+        easing: 'linear',
+        keyframes(dimensions) {
+          const scalingFactor = calculateTargetScalingFactor(dimensions);
+          dimensions.targetWidth *= scalingFactor;
+          dimensions.targetHeight *= scalingFactor;
+
+          const offsetX = dimensions.pageWidth - dimensions.targetWidth;
+          const offsetY = (dimensions.pageHeight - dimensions.targetHeight) / 2;
+
+          return scaleAndTranslate(offsetX, offsetY, translateX ?
+            offsetX + translateX : 0, offsetY, scalingFactor);
         },
-        {
-          offset: 1,
-          transform: 'translateY(0)',
-          easing: 'cubic-bezier(.22,.61,.35,1)',
+      };
+    case 'pan-right':
+      translateX = options.translateX;
+
+      return {
+        duration: 1000,
+        easing: 'linear',
+        keyframes(dimensions) {
+          const scalingFactor = calculateTargetScalingFactor(dimensions);
+          dimensions.targetWidth *= scalingFactor;
+          dimensions.targetHeight *= scalingFactor;
+
+          const offsetX = dimensions.pageWidth - dimensions.targetWidth;
+          const offsetY = (dimensions.pageHeight - dimensions.targetHeight) / 2;
+
+          return scaleAndTranslate(0, offsetY, -translateX || offsetX, offsetY,
+              scalingFactor);
         },
-      ];
-    },
-  },
-  'twirl-in': {
-    duration: 1000,
-    easing: 'cubic-bezier(.2,.75,.4,1)',
-    keyframes: [
-      {
-        transform: 'rotate(-540deg) scale(0.1)',
-        opacity: 0,
-      },
-      {
-        transform: 'none',
-        opacity: 1,
-      },
-    ],
-  },
-  'whoosh-in-left': {
-    duration: 500,
-    easing: 'ease-out',
-    keyframes(dimensions) {
-      const offsetX = -(dimensions.targetX + dimensions.targetWidth);
-      return whooshIn(offsetX, 0, 0, 0);
-    },
-  },
-  'whoosh-in-right': {
-    duration: 500,
-    easing: 'ease-out',
-    keyframes(dimensions) {
-      const offsetX = dimensions.pageWidth - dimensions.targetX;
-      return whooshIn(offsetX, 0, 0, 0);
-    },
-  },
-  'pan-left': {
-    duration: 1000,
-    easing: 'linear',
-    keyframes(dimensions) {
-      const scalingFactor = calculateTargetScalingFactor(dimensions);
-      dimensions.targetWidth *= scalingFactor;
-      dimensions.targetHeight *= scalingFactor;
+      };
+    case 'pan-down':
+      let {translateY} = options;
 
-      const offsetX = dimensions.pageWidth - dimensions.targetWidth;
-      const offsetY = (dimensions.pageHeight - dimensions.targetHeight) / 2;
+      return {
+        duration: 1000,
+        easing: 'linear',
+        keyframes(dimensions) {
+          const scalingFactor = calculateTargetScalingFactor(dimensions);
+          dimensions.targetWidth *= scalingFactor;
+          dimensions.targetHeight *= scalingFactor;
 
-      return scaleAndTranslate(offsetX, offsetY, 0, offsetY, scalingFactor);
-    },
-  },
-  'pan-right': {
-    duration: 1000,
-    easing: 'linear',
-    keyframes(dimensions) {
-      const scalingFactor = calculateTargetScalingFactor(dimensions);
-      dimensions.targetWidth *= scalingFactor;
-      dimensions.targetHeight *= scalingFactor;
+          const offsetX = -dimensions.targetWidth / 2;
+          const offsetY = dimensions.pageHeight - dimensions.targetHeight;
 
-      const offsetX = dimensions.pageWidth - dimensions.targetWidth;
-      const offsetY = (dimensions.pageHeight - dimensions.targetHeight) / 2;
+          return scaleAndTranslate(offsetX, 0, offsetX, -translateY || offsetY,
+              scalingFactor);
+        },
+      };
+    case 'pan-up':
+      translateY = options.translateY;
+
+      return {
+        duration: 1000,
+        easing: 'linear',
+        keyframes(dimensions) {
+          const scalingFactor = calculateTargetScalingFactor(dimensions);
+          dimensions.targetWidth *= scalingFactor;
+          dimensions.targetHeight *= scalingFactor;
 
-      return scaleAndTranslate(0, offsetY, offsetX, offsetY, scalingFactor);
-    },
-  },
-  'pan-down': {
-    duration: 1000,
-    easing: 'linear',
-    keyframes(dimensions) {
-      const scalingFactor = calculateTargetScalingFactor(dimensions);
-      dimensions.targetWidth *= scalingFactor;
-      dimensions.targetHeight *= scalingFactor;
+          const offsetX = -dimensions.targetWidth / 2;
+          const offsetY = dimensions.pageHeight - dimensions.targetHeight;
 
-      const offsetX = -dimensions.targetWidth / 2;
-      const offsetY = dimensions.pageHeight - dimensions.targetHeight;
+          return scaleAndTranslate(offsetX, offsetY, offsetX, translateY ?
+            offsetY + translateY : 0, scalingFactor);
+        },
+      };
+    case 'zoom-in':
+      let {scaleStart, scaleEnd} = options;
 
-      return scaleAndTranslate(offsetX, 0, offsetX, offsetY, scalingFactor);
-    },
-  },
-  'pan-up': {
-    duration: 1000,
-    easing: 'linear',
-    keyframes(dimensions) {
-      const scalingFactor = calculateTargetScalingFactor(dimensions);
-      dimensions.targetWidth *= scalingFactor;
-      dimensions.targetHeight *= scalingFactor;
+      if (scaleStart) {
+        userAssert(scaleEnd > scaleStart, '"scale-end" value must be greater ' +
+        'than "scale-start" value when using "zoom-in" animation.');
+      }
 
-      const offsetX = -dimensions.targetWidth / 2;
-      const offsetY = dimensions.pageHeight - dimensions.targetHeight;
+      return {
+        duration: 1000,
+        easing: 'linear',
+        keyframes: [
+          {transform: `scale(${scaleStart || SCALE_LOW_DEFAULT})`},
+          {transform: `scale(${scaleEnd || SCALE_HIGH_DEFAULT})`},
+        ],
+      };
+    case 'zoom-out':
+      scaleStart = options.scaleStart;
+      scaleEnd = options.scaleEnd;
 
-      return scaleAndTranslate(offsetX, offsetY, offsetX, 0, scalingFactor);
-    },
-  },
-  'zoom-in': {
-    duration: 1000,
-    easing: 'linear',
-    keyframes: [
-      {transform: 'scale(1,1)'},
-      {transform: 'scale(3,3)'},
-    ],
-  },
-  'zoom-out': {
-    duration: 1000,
-    easing: 'linear',
-    keyframes: [
-      {transform: 'scale(3,3)'},
-      {transform: 'scale(1,1)'},
-    ],
-  },
+      if (scaleStart) {
+        userAssert(scaleStart > scaleEnd, '"scale-start" value must be ' +
+        'higher than "scale-end" value when using "zoom-out" animation.');
+      }
+
+      return {
+        duration: 1000,
+        easing: 'linear',
+        keyframes: [
+          {transform: `scale(${scaleStart || SCALE_HIGH_DEFAULT})`},
+          {transform: `scale(${scaleEnd || SCALE_LOW_DEFAULT})`},
+        ],
+      };
+  }
+  return null;
 };
diff --git a/extensions/amp-story/1.0/animation.js b/extensions/amp-story/1.0/animation.js
index bb0a77d14e730..35f7ad9ab94ec 100644
--- a/extensions/amp-story/1.0/animation.js
+++ b/extensions/amp-story/1.0/animation.js
@@ -22,7 +22,6 @@ import {
   StoryAnimationDimsDef,
   StoryAnimationPresetDef,
 } from './animation-types';
-import {PRESETS, setStyleForPreset} from './animation-presets';
 import {Services} from '../../../src/services';
 import {
   WebAnimationPlayState,
@@ -34,6 +33,7 @@ import {
   scopedQuerySelector,
   scopedQuerySelectorAll,
 } from '../../../src/dom';
+import {getPresetDef, setStyleForPreset} from './animation-presets';
 import {map, omit} from '../../../src/utils/object';
 import {timeStrToMillis, unscaledClientRect} from './utils';
 
@@ -47,7 +47,14 @@ const ANIMATE_IN_DELAY_ATTRIBUTE_NAME = 'animate-in-delay';
 const ANIMATE_IN_AFTER_ATTRIBUTE_NAME = 'animate-in-after';
 /** const {string} */
 const ANIMATABLE_ELEMENTS_SELECTOR = `[${ANIMATE_IN_ATTRIBUTE_NAME}]`;
-
+/** const {string} */
+const SCALE_START_ATTRIBUTE_NAME = 'scale-start';
+/** const {string} */
+const SCALE_END_ATTRIBUTE_NAME = 'scale-end';
+/** const {string} */
+const TRANSLATE_X_ATTRIBUTE_NAME = 'translate-x';
+/** const {string} */
+const TRANSLATE_Y_ATTRIBUTE_NAME = 'translate-y';
 
 /**
  * @param {!Element} element
@@ -530,10 +537,51 @@ export class AnimationManager {
    */
   getPreset_(el) {
     const name = el.getAttribute(ANIMATE_IN_ATTRIBUTE_NAME);
+    const options = {};
     setStyleForPreset(el, name);
 
+    if (el.hasAttribute(SCALE_START_ATTRIBUTE_NAME)) {
+      options.scaleStart =
+        parseFloat(el.getAttribute(SCALE_START_ATTRIBUTE_NAME));
+
+      userAssert(options.scaleStart > 0, '"%s" attribute must be a ' +
+        'positive number. Found negative or zero in element %s',
+      SCALE_START_ATTRIBUTE_NAME,
+      el);
+    }
+
+    if (el.hasAttribute(SCALE_END_ATTRIBUTE_NAME)) {
+      options.scaleEnd =
+        parseFloat(el.getAttribute(SCALE_END_ATTRIBUTE_NAME));
+
+      userAssert(options.scaleEnd > 0, '"%s" attribute must be a ' +
+        'positive number. Found negative or zero in element %s',
+      SCALE_END_ATTRIBUTE_NAME,
+      el);
+    }
+
+    if (el.hasAttribute(TRANSLATE_X_ATTRIBUTE_NAME)) {
+      options.translateX =
+        parseFloat(el.getAttribute(TRANSLATE_X_ATTRIBUTE_NAME));
+
+      userAssert(options.translateX > 0, '"%s" attribute must be a ' +
+        'positive number. Found negative or zero in element %s',
+      TRANSLATE_X_ATTRIBUTE_NAME,
+      el);
+    }
+
+    if (el.hasAttribute(TRANSLATE_Y_ATTRIBUTE_NAME)) {
+      options.translateY =
+        parseFloat(el.getAttribute(TRANSLATE_Y_ATTRIBUTE_NAME));
+
+      userAssert(options.translateY > 0, '"%s" attribute must be a ' +
+        'positive number. Found negative or zero in element %s',
+      TRANSLATE_Y_ATTRIBUTE_NAME,
+      el);
+    }
+
     return userAssert(
-        PRESETS[name],
+        getPresetDef(name, options),
         'Invalid %s preset "%s" for element %s',
         ANIMATE_IN_ATTRIBUTE_NAME,
         name,
diff --git a/extensions/amp-story/1.0/test/test-full-bleed-animations.js b/extensions/amp-story/1.0/test/test-full-bleed-animations.js
index 35904b4745ba3..41558c83172d0 100644
--- a/extensions/amp-story/1.0/test/test-full-bleed-animations.js
+++ b/extensions/amp-story/1.0/test/test-full-bleed-animations.js
@@ -22,12 +22,12 @@ import {AmpStory} from '../amp-story';
 import {AmpStoryPage} from '../amp-story-page';
 import {AmpStoryStoreService} from '../amp-story-store-service';
 import {LocalizationService} from '../localization';
-import {PRESETS} from '../animation-presets';
 import {Services} from '../../../../src/services';
 import {
   calculateTargetScalingFactor,
   targetFitsWithinPage,
 } from '../animation-presets-utils';
+import {getPresetDef} from '../animation-presets';
 import {registerServiceBuilder} from '../../../../src/service';
 
 describes.realWin('amp-story-full-bleed-animations', {
@@ -216,7 +216,7 @@ describes.realWin('amp-story-animations-utils', {
     const factor = factorThatWillMakeTargetFitPage * 1.25;
     expect(calculateTargetScalingFactor(dimensions)).to.equal(factor);
 
-    const calculatedKeyframes = PRESETS['pan-up'];
+    const calculatedKeyframes = getPresetDef('pan-up', {});
     calculatedKeyframes.keyframes = calculatedKeyframes.keyframes(dimensions);
 
     const offsetX = -dimensions.targetWidth / 2;