Templates: Remove first page animations (#11687)

* Ran script to set first page animations to an empty array * Added regression test * updated docs
GoogleForCreators · Jun 15, 2022 · e71e115 · e71e115
1 parent 789609c
commit e71e115
Show file tree

Hide file tree

Showing 59 changed files with 66 additions and 1,479 deletions.
diff --git a/docs/external-template-creation.md b/docs/external-template-creation.md
@@ -26,6 +26,7 @@ To add a new template to the editor:
 
 1. Don't upload SVGs as images. SVGs should only be added as stickers in step (1).
 2. Avoid "`-<number>`" suffixes on images and videos e.g. `some_image-1.png`. See [details below](#filenames-for-images-and-videos).
+3. Don't add animations to the first page.  First page animations are not supported by AMP. [More details](https://wp.stories.google/docs/how-to/animations/#First-Page)
 
 ## Detailed steps
 

diff --git a/packages/templates/src/raw/12-hours-in-barcelona/template.json b/packages/templates/src/raw/12-hours-in-barcelona/template.json
@@ -284,54 +284,7 @@
         }
       ],
       "backgroundOverlay": "none",
-      "animations": [
-        {
-          "id": "1bbf6651-1c06-41b5-8e20-23ca4230343b",
-          "type": "effect-background-zoom",
-          "targets": ["aa2fbbaa-670c-4f87-8349-954464b36b62"],
-          "zoomDirection": "scaleIn",
-          "duration": 4000,
-          "delay": 0
-        },
-        {
-          "id": "11c13a7d-4a94-4530-974b-00d7733b55f2",
-          "type": "effect-fly-in",
-          "targets": ["baf1f174-c8e9-43cc-be31-ddcd62be8207"],
-          "flyInDir": "bottomToTop",
-          "duration": 2000,
-          "delay": 1200
-        },
-        {
-          "id": "820672f3-5d74-40aa-a013-e06c4ace5a5a",
-          "type": "effect-fly-in",
-          "targets": ["cfd2781a-77cb-470c-ad0e-3712913f04d0"],
-          "flyInDir": "topToBottom",
-          "duration": 1600,
-          "delay": 0
-        },
-        {
-          "id": "d498526d-88b3-48cd-a95f-d0296d4317e1",
-          "type": "effect-fly-in",
-          "targets": ["6952d29c-8ad5-410f-9982-eb8ca2f828a1"],
-          "flyInDir": "leftToRight",
-          "duration": 1600,
-          "delay": 500
-        },
-        {
-          "id": "59bab187-acf8-4af9-a0ae-5decfb985297",
-          "type": "effect-fade-in",
-          "targets": ["c153d6f9-3904-4c8a-bec6-2a7e84e0d7d9"],
-          "duration": 1600,
-          "delay": 1000
-        },
-        {
-          "id": "519811ee-8ad9-426a-a06a-395c1c97b143",
-          "type": "effect-fade-in",
-          "targets": ["9e6218c8-7223-4069-add8-ea3367dc9466"],
-          "duration": 2000,
-          "delay": 1300
-        }
-      ],
+      "animations": [],
       "backgroundColor": { "color": { "r": 255, "g": 255, "b": 255 } },
       "type": "page",
       "id": "9c17b213-94a8-4da4-bb6f-20018ea8787d",

diff --git a/packages/templates/src/raw/a-day-in-the-life/template.json b/packages/templates/src/raw/a-day-in-the-life/template.json
@@ -199,15 +199,7 @@
           "type": "text"
         }
       ],
-      "animations": [
-        {
-          "id": "756cda7e-a6b6-433a-9be1-0bad2c112d3d",
-          "type": "effect-fade-in",
-          "targets": ["57828597-1338-4b6f-b2c7-60339643bc9f"],
-          "duration": 2000,
-          "delay": 0
-        }
-      ],
+      "animations": [],
       "backgroundColor": { "color": { "r": 57, "g": 57, "b": 57 } },
       "type": "page",
       "id": "7b18ade0-d74d-41b9-81b6-50a65422db76",

diff --git a/packages/templates/src/raw/ace-hotel-kyoto-review/template.json b/packages/templates/src/raw/ace-hotel-kyoto-review/template.json
@@ -263,16 +263,7 @@
       "backgroundColor": { "color": { "r": 25, "g": 88, "b": 77 } },
       "type": "page",
       "id": "da3808b7-6397-435a-8a2d-93f756672665",
-      "animations": [
-        {
-          "id": "80dd3a87-c2d8-4a3b-aeb0-673e6521f6b5",
-          "type": "effect-fly-in",
-          "targets": ["3ce61444-e401-490f-b9f1-f775b3d0244f"],
-          "flyInDir": "leftToRight",
-          "duration": 2500,
-          "delay": 0
-        }
-      ],
+      "animations": [],
       "pageTemplateType": "cover"
     },
     {

diff --git a/packages/templates/src/raw/album-releases/template.json b/packages/templates/src/raw/album-releases/template.json
@@ -189,24 +189,7 @@
       "backgroundColor": { "color": { "r": 18, "g": 32, "b": 54 } },
       "type": "page",
       "id": "eff1d1ce-14d8-454c-a770-2cdf0d3c154f",
-      "animations": [
-        {
-          "id": "47e3bced-4e5c-4564-bf7c-ca43dff4a9c6",
-          "type": "effect-fly-in",
-          "targets": ["8ce9bdf4-f6f1-4045-a288-eb90dd64aaf7"],
-          "flyInDir": "rightToLeft",
-          "duration": 2000,
-          "delay": 0
-        },
-        {
-          "id": "63599ff7-c69e-4134-8fb2-1fb033da2b90",
-          "type": "effect-fly-in",
-          "targets": ["2813cfb7-ec17-411f-963e-bd038b45d9c7"],
-          "flyInDir": "rightToLeft",
-          "duration": 1600,
-          "delay": 200
-        }
-      ],
+      "animations": [],
       "pageTemplateType": "cover"
     },
     {

diff --git a/packages/templates/src/raw/all-about-cars/template.json b/packages/templates/src/raw/all-about-cars/template.json
@@ -197,30 +197,7 @@
           "type": "text"
         }
       ],
-      "animations": [
-        {
-          "id": "c2821faa-931c-4b1b-a024-7e75fcb63dfb",
-          "type": "effect-zoom",
-          "scaleDirection": "scaleIn",
-          "duration": 2000,
-          "delay": 0,
-          "targets": ["045aa174-4326-485e-ab49-061d5d7f517c"]
-        },
-        {
-          "id": "20a58822-2cc6-48a2-a720-bb3e59b91949",
-          "type": "effect-fade-in",
-          "targets": ["49925035-6a2a-40dd-89c8-3b37174f7620"],
-          "duration": 1200,
-          "delay": 0
-        },
-        {
-          "id": "e965660a-978b-4814-9eab-e8003d7bf7f9",
-          "type": "effect-fade-in",
-          "targets": ["6815fa2d-5446-4838-b840-c8ea6853a48f"],
-          "duration": 1200,
-          "delay": 0
-        }
-      ],
+      "animations": [],
       "backgroundColor": { "color": { "r": 255, "g": 255, "b": 255 } },
       "type": "page",
       "id": "e5a0040d-67df-47af-b227-f31db2882ec3",

diff --git a/packages/templates/src/raw/almodos-films/template.json b/packages/templates/src/raw/almodos-films/template.json
@@ -198,23 +198,7 @@
         "type": "shape",
         "id": "c084b1c7-913c-40b5-82f7-02e9b62bacb1"
       },
-      "animations": [
-        {
-          "id": "ab3fce4b-5b1f-46ec-b828-ce047d6f807f",
-          "type": "effect-fade-in",
-          "targets": ["4838faa0-fb5d-49d4-9095-1b14feac4aba"],
-          "duration": 1600,
-          "delay": 300
-        },
-        {
-          "id": "747d38f3-96de-4f28-aad4-eaa5616bf3b4",
-          "type": "effect-background-zoom",
-          "targets": ["aa873b8f-d480-416b-9b89-118916439706"],
-          "zoomDirection": "scaleIn",
-          "duration": 4000,
-          "delay": 0
-        }
-      ],
+      "animations": [],
       "pageTemplateType": "cover"
     },
     {

diff --git a/packages/templates/src/raw/an-artists-legacy/template.json b/packages/templates/src/raw/an-artists-legacy/template.json
@@ -313,23 +313,7 @@
       "backgroundColor": { "color": { "r": 255, "g": 255, "b": 255 } },
       "type": "page",
       "id": "58d5729f-4584-4416-8c59-938c142f4fe6",
-      "animations": [
-        {
-          "id": "1b3ba52b-ed68-4efa-8c01-8b1f7312ac4b",
-          "type": "effect-fly-in",
-          "targets": ["56b3420e-ee0a-472f-9b3a-23452b35ee20"],
-          "flyInDir": "leftToRight",
-          "duration": 1000,
-          "delay": 0
-        },
-        {
-          "id": "9c23ea3f-0590-462d-806a-174821c14d88",
-          "type": "effect-fade-in",
-          "targets": ["fd4219e8-f495-48c7-9b72-f6538f71daa8"],
-          "duration": 1500,
-          "delay": 500
-        }
-      ],
+      "animations": [],
       "pageTemplateType": "cover"
     },
     {

diff --git a/packages/templates/src/raw/art-books-gift-guide/template.json b/packages/templates/src/raw/art-books-gift-guide/template.json
@@ -187,16 +187,7 @@
       "backgroundColor": { "color": { "r": 65, "g": 44, "b": 71 } },
       "type": "page",
       "id": "c02e601a-0212-46d0-84d8-7b5c63e4523f",
-      "animations": [
-        {
-          "id": "c207b444-b14d-4dff-a0b8-9a4c7fe8fd91",
-          "type": "effect-fly-in",
-          "targets": ["81355f8c-39b0-42f9-b4b3-8bb3f67ba2fb"],
-          "flyInDir": "bottomToTop",
-          "duration": 1500,
-          "delay": 0
-        }
-      ],
+      "animations": [],
       "pageTemplateType": "cover"
     },
     {

diff --git a/packages/templates/src/raw/baking-bread-guide/template.json b/packages/templates/src/raw/baking-bread-guide/template.json
@@ -250,24 +250,7 @@
       "backgroundColor": { "color": { "r": 45, "g": 42, "b": 53 } },
       "type": "page",
       "id": "21cf9649-5574-4038-bd34-e297eca0a920",
-      "animations": [
-        {
-          "id": "79349e8b-3205-4c49-8537-129059461984",
-          "type": "effect-fade-in",
-          "targets": ["a32f5187-3902-428f-94ba-9faa7555ef4b"],
-          "duration": 1600,
-          "delay": 600
-        },
-        {
-          "id": "192ff8db-a70a-4e14-87e4-c08083bea010",
-          "type": "effect-pulse",
-          "targets": ["1d5e5fbc-5fc6-4707-8430-c96ee46482de"],
-          "scale": 0.01,
-          "iterations": 1,
-          "duration": 3000,
-          "delay": 0
-        }
-      ],
+      "animations": [],
       "pageTemplateType": "cover"
     },
     {

diff --git a/packages/templates/src/raw/beauty-quiz/template.json b/packages/templates/src/raw/beauty-quiz/template.json
@@ -193,16 +193,7 @@
       "backgroundColor": { "color": { "r": 255, "g": 255, "b": 255 } },
       "type": "page",
       "id": "9182a7be-e7cb-4206-bee1-09ec8ecbba01",
-      "animations": [
-        {
-          "id": "0c61ca9b-f49a-4473-80ea-e8c4f9cedb27",
-          "type": "effect-background-pan",
-          "targets": ["d3c66373-d2ce-4295-bb5e-5e1ffe20aee9"],
-          "panDir": "leftToRight",
-          "duration": 3000,
-          "delay": 0
-        }
-      ],
+      "animations": [],
       "defaultBackgroundElement": {
         "opacity": 100,
         "flip": { "vertical": false, "horizontal": false },

diff --git a/packages/templates/src/raw/belly-fat-workout/template.json b/packages/templates/src/raw/belly-fat-workout/template.json
@@ -199,29 +199,7 @@
       "backgroundColor": { "color": { "r": 0, "g": 0, "b": 0 } },
       "type": "page",
       "id": "f0d308dc-15f3-4959-ae9c-fc0c1ddb65c7",
-      "animations": [
-        {
-          "id": "1cfaf2a0-0910-4fd6-9efe-920e8f38ef24",
-          "type": "effect-fade-in",
-          "targets": ["86f89631-269e-4ec5-98e3-82478de2adc3"],
-          "duration": 3000,
-          "delay": 0
-        },
-        {
-          "id": "0dbf4de2-8e34-49c0-9ede-22ddc5775ef8",
-          "type": "effect-fade-in",
-          "targets": ["f5a69faf-517a-45a1-adc8-98ed77c0a323"],
-          "duration": 2000,
-          "delay": 0
-        },
-        {
-          "id": "e06a292f-c35a-4c65-a8ec-00b56401b86a",
-          "type": "effect-fade-in",
-          "targets": ["c4cfe316-478a-4d58-9662-5916e1cde062"],
-          "duration": 2000,
-          "delay": 700
-        }
-      ],
+      "animations": [],
       "pageTemplateType": "cover"
     },
     {

diff --git a/packages/templates/src/raw/celebrity-life-story/template.json b/packages/templates/src/raw/celebrity-life-story/template.json
@@ -325,30 +325,7 @@
           "type": "text"
         }
       ],
-      "animations": [
-        {
-          "id": "0e3c06a7-cb32-40e0-a08f-961bdc5ea790",
-          "type": "effect-fly-in",
-          "targets": ["99377bf6-8aaa-4faa-b639-386bf4e72eb5"],
-          "flyInDir": "leftToRight",
-          "duration": 1200,
-          "delay": 0
-        },
-        {
-          "id": "0c55f078-d371-494d-8485-855a85a2e785",
-          "type": "effect-fade-in",
-          "targets": ["e8b8be9b-825e-4ba3-9204-9020e01f9c28"],
-          "duration": 1200,
-          "delay": 1200
-        },
-        {
-          "id": "33ec1d95-d164-40fe-9ded-70ec3f6ea4a3",
-          "type": "effect-fade-in",
-          "targets": ["c8e63fad-0c15-41f2-8fe5-51fcdce97f0c"],
-          "duration": 1200,
-          "delay": 1200
-        }
-      ],
+      "animations": [],
       "backgroundColor": { "color": { "r": 255, "g": 255, "b": 255 } },
       "type": "page",
       "id": "0b2ff5e9-0446-48c0-be8c-61adf75ba2fc",

diff --git a/packages/templates/src/raw/celebrity-q-and-a/template.json b/packages/templates/src/raw/celebrity-q-and-a/template.json
@@ -224,31 +224,7 @@
           "type": "text"
         }
       ],
-      "animations": [
-        {
-          "id": "7a40ace1-1e05-43aa-a6ca-861d030984f7",
-          "type": "effect-zoom",
-          "targets": ["5e174cb2-a3f1-4a21-a08d-de3b1af4b54a"],
-          "scaleDirection": "scaleIn",
-          "duration": 600,
-          "delay": 0
-        },
-        {
-          "id": "7b8ee671-2ebe-496d-8fcd-d2ccf0378c20",
-          "type": "effect-fly-in",
-          "targets": ["34f04d90-ba21-4036-abc6-363af1d12bc7"],
-          "flyInDir": "rightToLeft",
-          "duration": 2000,
-          "delay": 0
-        },
-        {
-          "id": "93f0536f-075d-48c6-9d22-57709fa7de31",
-          "type": "effect-fade-in",
-          "targets": ["c99005c7-776e-46db-8bbf-53099c00b6ee"],
-          "duration": 600,
-          "delay": 200
-        }
-      ],
+      "animations": [],
       "backgroundColor": { "color": { "r": 255, "g": 255, "b": 255 } },
       "type": "page",
       "id": "911c9de4-8b85-4779-aa58-321b4b7e3388",

diff --git a/packages/templates/src/raw/doers-get-more-done/template.json b/packages/templates/src/raw/doers-get-more-done/template.json
@@ -120,24 +120,7 @@
           "id": "4baca404-e3f5-41d6-b4b0-36e2ecaee696"
         }
       ],
-      "animations": [
-        {
-          "id": "a8999305-4627-4178-a503-4ef3ca840e8e",
-          "type": "effect-fly-in",
-          "targets": ["4e256c35-5e30-45f5-9095-d8ce0a230b21"],
-          "flyInDir": "bottomToTop",
-          "duration": 1000,
-          "delay": 0
-        },
-        {
-          "id": "7d2b1997-86ab-46e1-8d63-43003b447711",
-          "type": "effect-fly-in",
-          "targets": ["b8f9eb9a-5007-4642-aca3-750cdb7c7463"],
-          "flyInDir": "topToBottom",
-          "duration": 600,
-          "delay": 400
-        }
-      ],
+      "animations": [],
       "type": "page",
       "id": "d47afc22-71b7-4303-9917-96f9a31ad38a",
       "backgroundOverlay": "none",