From 6822d3b7dd1a29c200996413ab6ce208074a0e3c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Zoe=CC=88=20Bentley?= <zoe.bentley.1@gmail.com>
Date: Mon, 18 Nov 2019 13:43:06 -0500
Subject: [PATCH] Reorder tutorials for HOC 2019

---
 src/lib/libraries/decks/index.jsx | 1086 ++++++++++++++---------------
 1 file changed, 543 insertions(+), 543 deletions(-)

diff --git a/src/lib/libraries/decks/index.jsx b/src/lib/libraries/decks/index.jsx
index 3e09346f1..7b241746b 100644
--- a/src/lib/libraries/decks/index.jsx
+++ b/src/lib/libraries/decks/index.jsx
@@ -104,82 +104,6 @@ export default {
         urlId: 'getStarted'
     },
 
-    'animate-a-name': {
-        name: (
-            <FormattedMessage
-                defaultMessage="Animate a Name"
-                description="Name for the 'Animate a Name' how-to"
-                id="gui.howtos.animate-a-name.name"
-            />
-        ),
-        img: libraryAnimate,
-        tags: ['animation', 'art', 'spin', 'grow'],
-        steps: [{
-            video: 'animate-a-name'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Pick a Letter Sprite"
-                    description="Step name for 'Pick a Letter Sprite' step"
-                    id="gui.howtos.animate-a-name.step_AnimatePickLetter"
-                />
-            ),
-            image: 'namePickLetter'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Play a Sound When Clicked"
-                    description="Step name for 'Play a Sound When Clicked' step"
-                    id="gui.howtos.animate-a-name.step_AnimatePlaySound"
-                />
-            ),
-            image: 'namePlaySound'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Pick Another Letter Sprite"
-                    description="Step name for 'Pick Another Letter Sprite"
-                    id="gui.howtos.animate-a-name.step_AnimatePickLetter2"
-                />
-            ),
-            image: 'namePickLetter2'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Change color"
-                    description="Step name for 'Change color' step"
-                    id="gui.howtos.animate-a-name.step_AnimateChangeColor"
-                />
-            ),
-            image: 'nameChangeColor'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Pick Another Letter Sprite & Make It Spin"
-                    description="Step name for 'Pick Another Letter Sprite & Make It Spin' step"
-                    id="gui.howtos.animate-a-name.step_AnimateSpin"
-                />
-            ),
-            image: 'nameSpin'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Pick Another Letter Sprite & Make It Grow"
-                    description="Step name for 'Pick Another Letter Sprite & Make It Grow!' step"
-                    id="gui.howtos.animate-a-name.step_AnimateGrow"
-                />
-            ),
-            image: 'nameGrow'
-        }, {
-            deckIds: [
-                'add-a-backdrop',
-                'glide-around'
-            ]
-        }
-        ],
-        urlId: 'name'
-    },
-
     'imagine': {
         name: (
             <FormattedMessage
@@ -337,166 +261,617 @@ export default {
         urlId: 'imagine'
     },
 
-    'Make-Music': {
+    'code-cartoon': {
         name: (
             <FormattedMessage
-                defaultMessage="Make Music"
-                description="Name for the 'Make Music' how-to"
-                id="gui.howtos.make-music.name"
+                defaultMessage="Code a Cartoon"
+                description="Name for the 'Code a Cartoon' how-to"
+                id="gui.howtos.code-cartoon"
             />
         ),
-        img: libraryMakeMusic,
-        tags: ['music', 'sound', 'instrument', 'play', 'song', 'band'],
+        tags: ['code-cartoon'],
+        requiredProjectId: '331474033',
+        img: libraryCodeCartoon,
         steps: [{
-            video: 'Make-Music'
-        },
-        {
+            video: 'code-cartoon'
+        }, {
             title: (
                 <FormattedMessage
-                    defaultMessage="Pick an Instrument Sprite "
-                    description="Step name for 'Pick an Instrument Sprite' step"
-                    id="gui.howtos.Make-Music.step_PickInstrument"
+                    defaultMessage="Say Something When You Click the Green Flag"
+                    description="Step name for 'Say Something When You Click the Green Flag' step"
+                    id="gui.howtos.code-cartoon.step_codeCartoonSaySomething"
                 />
             ),
-            image: 'musicPickInstrument'
-        },
-        {
+            image: 'codeCartoonSaySomething'
+        }, {
             title: (
                 <FormattedMessage
-                    defaultMessage="Play Sound When Clicked"
-                    description="Step name for 'Play Sound When Clicked' step"
-                    id="gui.howtos.Make-Music.step_PlaySoundClick"
+                    defaultMessage="Animate a Character When You Click It"
+                    description="Step name for 'Animate a Character When You Click It' step"
+                    id="gui.howtos.code-cartoon.step_codeCartoonAnimate"
                 />
             ),
-            image: 'musicPlaySound'
-        },
-        {
+            image: 'codeCartoonAnimate'
+        }, {
             title: (
                 <FormattedMessage
-                    defaultMessage="Create a Song"
-                    description="Step name for 'Create a Song' step"
-                    id="gui.howtos.Make-Music.step_MakeSong"
+                    defaultMessage="Select a Different Character"
+                    description="Step name for 'Select a Different Character' step"
+                    id="gui.howtos.code-cartoon.step_codeCartoonSelectDifferentCharacter"
                 />
             ),
-            image: 'musicMakeSong'
+            image: 'codeCartoonSelectDifferentCharacter'
         }, {
             title: (
                 <FormattedMessage
-                    defaultMessage="Choose a Drum & Make a Beat"
-                    description="Step name for 'Choose a Drum & Make a Beat' step"
-                    id="gui.howtos.make-music.step_MakeBeat"
+                    defaultMessage="Use a Minus Sign to Get Smaller"
+                    description="Step name for 'Use a Minus Sign to Get Smaller' step"
+                    id="gui.howtos.code-cartoon.step_codeCartoonUseMinusSign"
                 />
             ),
-            image: 'musicMakeBeat'
+            image: 'codeCartoonUseMinusSign'
         }, {
             title: (
                 <FormattedMessage
-                    defaultMessage="Choose the Microphone Sprite & Surprise Beatbox"
-                    description="Step name for 'Choose the Microphone Sprite & Surprise Beatbox' step"
-                    id="gui.howtos.make-music.step_MakeBeatBox"
+                    defaultMessage="Make a Character Grow and Shrink"
+                    description="Step name for 'Make a Character Grow and Shrink' step"
+                    id="gui.howtos.code-cartoon.step_codeCartoonGrowShrink"
                 />
             ),
-            image: 'musicMakeBeatbox'
+            image: 'codeCartoonGrowShrink'
         }, {
-            deckIds: [
-                'add-a-backdrop',
-                'add-sprite'
-            ]
-        }
-        ],
-        urlId: 'music'
-    },
-
-    'Tell-A-Story': {
-        name: (
-            <FormattedMessage
-                defaultMessage="Create A Story"
-                description="Name for the 'Create A Story' how-to"
-                id="gui.howtos.story.name"
-            />
-        ),
-        img: libraryStory,
-        steps: [{
-            video: 'stah7jjorp'
-        },
-        {
             title: (
                 <FormattedMessage
-                    defaultMessage="Add a Backdrop"
-                    description="Step name for 'Add a Backdrop' step"
-                    id="gui.howtos.story.step_addbg"
+                    defaultMessage="Select a Different Character"
+                    description="Step name for 'Select a Different Character' step"
+                    id="gui.howtos.code-cartoon.step_codeCartoonSelectDifferentCharacter2"
                 />
             ),
-            image: 'storyPickBackdrop'
+            image: 'codeCartoonSelectDifferentCharacter2'
         }, {
             title: (
                 <FormattedMessage
-                    defaultMessage="Add a Character"
-                    description="Step name for 'Add a Character' step"
-                    id="gui.howtos.story.step_addsprite"
+                    defaultMessage="Jump Up and Down"
+                    description="Step name for 'Jump Up and Down' step"
+                    id="gui.howtos.code-cartoon.step_codeCartoonJump"
                 />
             ),
-            image: 'storyPickSprite'
+            image: 'codeCartoonJump'
         }, {
             title: (
                 <FormattedMessage
-                    defaultMessage="Say Something"
-                    description="Step name for 'Say Something' step"
-                    id="gui.howtos.story.step_saysomething"
+                    defaultMessage="Click a Character to Change Scenes"
+                    description="Step name for 'Click a Character to Change Scenes' step"
+                    id="gui.howtos.code-cartoon.step_codeCartoonChangeScenes"
                 />
             ),
-            image: 'storySaySomething'
+            image: 'codeCartoonChangeScenes'
         }, {
             title: (
                 <FormattedMessage
-                    defaultMessage="Add Another Character"
-                    description="Step name for 'Add Another Character' step"
-                    id="gui.howtos.story.step_addanothersprite"
+                    defaultMessage="Glide Around"
+                    description="Step name for 'Glide Around' step"
+                    id="gui.howtos.code-cartoon.step_codeCartoonGlideAround"
                 />
             ),
-            image: 'storyPickSprite2'
+            image: 'codeCartoonGlideAround'
         }, {
             title: (
                 <FormattedMessage
-                    defaultMessage="Flip Direction"
-                    description="Flip Direction' step"
-                    id="gui.howtos.story.step_flip"
+                    defaultMessage="Change Costumes"
+                    description="Step name for 'Change Costumes' step"
+                    id="gui.howtos.code-cartoon.step_codeCartoonChangeCostumes"
                 />
             ),
-            image: 'storyFlip'
+            image: 'codeCartoonChangeCostumes'
         }, {
             title: (
                 <FormattedMessage
-                    defaultMessage="Have A Conversation"
-                    description="Step name for 'Have A Conversation' step"
-                    id="gui.howtos.story.step_conversation"
+                    defaultMessage="Choose More Characters to Add to Your Cartoon"
+                    description="Step name for 'Choose More Characters to Add to Your Cartoon' step"
+                    id="gui.howtos.code-cartoon.step_codeCartoonChooseMoreCharacters"
                 />
             ),
-            image: 'storyConversation'
+            image: 'codeCartoonChooseMoreCharacters'
+        }, {
+            deckIds: [
+                'Chase-Game',
+                'Tell-A-Story'
+            ]
+        }
+        ],
+        urlId: 'code-cartoon'
+    },
+
+    'say-it-out-loud': {
+        name: (
+            <FormattedMessage
+                defaultMessage="Create Animations That Talk"
+                description="Name for the 'Create Animations That Talk' how-to"
+                id="gui.howtos.say-it-out-loud"
+            />
+        ),
+        img: libraryTXTSpeech,
+        steps: [{
+            video: 'k54n8uwcty',
+            trackingPixel: (
+                <img src="https://code.org/api/hour/begin_scratch_talk.png" />
+            )
         }, {
             title: (
                 <FormattedMessage
-                    defaultMessage="Add Another Backdrop"
-                    description="Step name for 'Add Another Backdrop' step"
-                    id="gui.howtos.story.addanotherbg"
+                    defaultMessage="Add the Text to Speech blocks"
+                    description="Step name for 'Add the Text to Speech blocks' step"
+                    id="gui.howtos.say-it-out-loud.step_AddTXTextension"
                 />
             ),
-            image: 'storyPickBackdrop2'
+            image: 'speechAddExtension'
         }, {
             title: (
                 <FormattedMessage
-                    defaultMessage="Switch Backdrops"
-                    description="Step name for 'Switch Backdrops' step"
-                    id="gui.howtos.story.step_swithbg"
+                    defaultMessage="Say Something"
+                    description="Step name for 'Say Something' step"
+                    id="gui.howtos.say-it-out-loud.step_TXTSpeech"
                 />
             ),
-            image: 'storySwitchBackdrop'
+            image: 'speechSaySomething'
         }, {
             title: (
                 <FormattedMessage
-                    defaultMessage="Hide a Character"
-                    description="Step name for 'Hide the Wizard' step"
-                    id="gui.howtos.story.step_hidewizard"
+                    defaultMessage="Set a Voice"
+                    description="Step name for 'Set a Voice"
+                    id="gui.howtos.say-it-out-loud_TXTSetVoice"
+                />
+            ),
+            image: 'speechSetVoice'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Move Around"
+                    description="Step name for 'Move Around' step"
+                    id="gui.howtos.say-it-out-loud.step_TXTMove"
+                />
+            ),
+            image: 'speechMoveAround'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Add a Backdrop"
+                    description="Step name for 'Add a Backdrop' step"
+                    id="gui.howtos.say-it-out-loud.step_TXTBackdrop"
+                />
+            ),
+            image: 'speechAddBackdrop'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Add Another Character"
+                    description="Step name for 'Add Another Character' step"
+                    id="gui.howtos.say-it-out-loud.step_TXTAddSprite"
+                />
+            ),
+            image: 'speechAddSprite'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Perform a Song"
+                    description="Step name for 'Perform a Song' step"
+                    id="gui.howtos.say-it-out-loud.step_TXTSong"
+                />
+            ),
+            image: 'speechSong'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Change Color"
+                    description="Step name for 'Change Color' step"
+                    id="gui.howtos.say-it-out-loud.step_TXTColor"
+                />
+            ),
+            image: 'speechChangeColor'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Spin Around"
+                    description="Step name for 'Spin Around"
+                    id="gui.howtos.say-it-out-loud.step_TXTSpin"
+                />
+            ),
+            image: 'speechSpin'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Grow and Shrink"
+                    description="Step name for 'Grow and Shrink' step"
+                    id="gui.howtos.say-it-out-loud.step_TXTGrow"
+                />
+            ),
+            image: 'speechGrowShrink'
+        }, {
+            deckIds: [
+                'animate-a-name',
+                'Make-Music'
+            ]
+        }
+        ],
+        urlId: 'animations-that-talk'
+    },
+
+    'talking': {
+        name: (
+            <FormattedMessage
+                defaultMessage="Talking Tales"
+                description="Name for the 'Talking Tales' how-to"
+                id="gui.howtos.talking"
+            />
+        ),
+        tags: ['talking'],
+        img: libraryTalking,
+        steps: [{
+            video: 'talking'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Click to Add the Text-to-Speech Blocks"
+                    description="Step name for 'Click to Add the Text-to-Speech Blocks' step"
+                    id="gui.howtos.talking.step_talesAddExtension"
+                />
+            ),
+            image: 'talesAddExtension'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Choose a Sprite"
+                    description="Step name for 'Choose a Sprite' step"
+                    id="gui.howtos.talking.step_talesChooseSprite"
+                />
+            ),
+            image: 'talesChooseSprite'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Make a Character Speak"
+                    description="Step name for 'Make a Character Speak' step"
+                    id="gui.howtos.talking.step_talesSaySomething"
+                />
+            ),
+            image: 'talesSaySomething'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Choose a Backdrop"
+                    description="Step name for 'Choose a Backdrop' step"
+                    id="gui.howtos.talking.step_talesChooseBackdrop"
+                />
+            ),
+            image: 'talesChooseBackdrop'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Click a Character to Go to the Next Backdrop"
+                    description="Step name for 'Click a Character to Go to the Next Backdrop' step"
+                    id="gui.howtos.talking.step_talesSwitchBackdrop"
+                />
+            ),
+            image: 'talesSwitchBackdrop'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Choose Another Sprite"
+                    description="Step name for 'Choose Another Sprite' step"
+                    id="gui.howtos.talking.step_talesChooseAnotherSprite"
+                />
+            ),
+            image: 'talesChooseAnotherSprite'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Move Around"
+                    description="Step name for 'Move Around' step"
+                    id="gui.howtos.talking.step_talesMoveAround"
+                />
+            ),
+            image: 'talesMoveAround'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Choose Another Backdrop"
+                    description="Step name for 'Choose Another Backdrop' step"
+                    id="gui.howtos.talking.step_talesChooseAnotherBackdrop"
+                />
+            ),
+            image: 'talesChooseAnotherBackdrop'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Animate Talking"
+                    description="Step name for 'Animate Talking' step"
+                    id="gui.howtos.talking.step_talesAnimateTalking"
+                />
+            ),
+            image: 'talesAnimateTalking'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Choose Another Backdrop"
+                    description="Step name for 'Choose Another Backdrop' step"
+                    id="gui.howtos.talking.step_talesChooseThirdBackdrop"
+                />
+            ),
+            image: 'talesChooseThirdBackdrop'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Choose a Song to Dance To"
+                    description="Step name for 'Choose a Song to Dance To' step"
+                    id="gui.howtos.talking.step_talesChooseSound"
+                />
+            ),
+            image: 'talesChooseSound'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Dance Moves"
+                    description="Step name for 'Dance Moves' step"
+                    id="gui.howtos.talking.step_talesDanceMoves"
+                />
+            ),
+            image: 'talesDanceMoves'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Get the Ask and Answer Blocks from the Sensing Category"
+                    description="Step name for 'Get the Ask and Answer Blocks from the Sensing Category' step"
+                    id="gui.howtos.talking.step_talesAskAnswer"
+                />
+            ),
+            image: 'talesAskAnswer'
+        }, {
+            deckIds: [
+                'Tell-A-Story',
+                'Animate-A-Character'
+            ]
+        }
+        ],
+        urlId: 'talking'
+    },
+
+    'animate-a-name': {
+        name: (
+            <FormattedMessage
+                defaultMessage="Animate a Name"
+                description="Name for the 'Animate a Name' how-to"
+                id="gui.howtos.animate-a-name.name"
+            />
+        ),
+        img: libraryAnimate,
+        tags: ['animation', 'art', 'spin', 'grow'],
+        steps: [{
+            video: 'animate-a-name'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Pick a Letter Sprite"
+                    description="Step name for 'Pick a Letter Sprite' step"
+                    id="gui.howtos.animate-a-name.step_AnimatePickLetter"
+                />
+            ),
+            image: 'namePickLetter'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Play a Sound When Clicked"
+                    description="Step name for 'Play a Sound When Clicked' step"
+                    id="gui.howtos.animate-a-name.step_AnimatePlaySound"
+                />
+            ),
+            image: 'namePlaySound'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Pick Another Letter Sprite"
+                    description="Step name for 'Pick Another Letter Sprite"
+                    id="gui.howtos.animate-a-name.step_AnimatePickLetter2"
+                />
+            ),
+            image: 'namePickLetter2'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Change color"
+                    description="Step name for 'Change color' step"
+                    id="gui.howtos.animate-a-name.step_AnimateChangeColor"
+                />
+            ),
+            image: 'nameChangeColor'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Pick Another Letter Sprite & Make It Spin"
+                    description="Step name for 'Pick Another Letter Sprite & Make It Spin' step"
+                    id="gui.howtos.animate-a-name.step_AnimateSpin"
+                />
+            ),
+            image: 'nameSpin'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Pick Another Letter Sprite & Make It Grow"
+                    description="Step name for 'Pick Another Letter Sprite & Make It Grow!' step"
+                    id="gui.howtos.animate-a-name.step_AnimateGrow"
+                />
+            ),
+            image: 'nameGrow'
+        }, {
+            deckIds: [
+                'add-a-backdrop',
+                'glide-around'
+            ]
+        }
+        ],
+        urlId: 'name'
+    },
+
+    'Make-Music': {
+        name: (
+            <FormattedMessage
+                defaultMessage="Make Music"
+                description="Name for the 'Make Music' how-to"
+                id="gui.howtos.make-music.name"
+            />
+        ),
+        img: libraryMakeMusic,
+        tags: ['music', 'sound', 'instrument', 'play', 'song', 'band'],
+        steps: [{
+            video: 'Make-Music'
+        },
+        {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Pick an Instrument Sprite "
+                    description="Step name for 'Pick an Instrument Sprite' step"
+                    id="gui.howtos.Make-Music.step_PickInstrument"
+                />
+            ),
+            image: 'musicPickInstrument'
+        },
+        {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Play Sound When Clicked"
+                    description="Step name for 'Play Sound When Clicked' step"
+                    id="gui.howtos.Make-Music.step_PlaySoundClick"
+                />
+            ),
+            image: 'musicPlaySound'
+        },
+        {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Create a Song"
+                    description="Step name for 'Create a Song' step"
+                    id="gui.howtos.Make-Music.step_MakeSong"
+                />
+            ),
+            image: 'musicMakeSong'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Choose a Drum & Make a Beat"
+                    description="Step name for 'Choose a Drum & Make a Beat' step"
+                    id="gui.howtos.make-music.step_MakeBeat"
+                />
+            ),
+            image: 'musicMakeBeat'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Choose the Microphone Sprite & Surprise Beatbox"
+                    description="Step name for 'Choose the Microphone Sprite & Surprise Beatbox' step"
+                    id="gui.howtos.make-music.step_MakeBeatBox"
+                />
+            ),
+            image: 'musicMakeBeatbox'
+        }, {
+            deckIds: [
+                'add-a-backdrop',
+                'add-sprite'
+            ]
+        }
+        ],
+        urlId: 'music'
+    },
+
+    'Tell-A-Story': {
+        name: (
+            <FormattedMessage
+                defaultMessage="Create A Story"
+                description="Name for the 'Create A Story' how-to"
+                id="gui.howtos.story.name"
+            />
+        ),
+        img: libraryStory,
+        steps: [{
+            video: 'stah7jjorp'
+        },
+        {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Add a Backdrop"
+                    description="Step name for 'Add a Backdrop' step"
+                    id="gui.howtos.story.step_addbg"
+                />
+            ),
+            image: 'storyPickBackdrop'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Add a Character"
+                    description="Step name for 'Add a Character' step"
+                    id="gui.howtos.story.step_addsprite"
+                />
+            ),
+            image: 'storyPickSprite'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Say Something"
+                    description="Step name for 'Say Something' step"
+                    id="gui.howtos.story.step_saysomething"
+                />
+            ),
+            image: 'storySaySomething'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Add Another Character"
+                    description="Step name for 'Add Another Character' step"
+                    id="gui.howtos.story.step_addanothersprite"
+                />
+            ),
+            image: 'storyPickSprite2'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Flip Direction"
+                    description="Flip Direction' step"
+                    id="gui.howtos.story.step_flip"
+                />
+            ),
+            image: 'storyFlip'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Have A Conversation"
+                    description="Step name for 'Have A Conversation' step"
+                    id="gui.howtos.story.step_conversation"
+                />
+            ),
+            image: 'storyConversation'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Add Another Backdrop"
+                    description="Step name for 'Add Another Backdrop' step"
+                    id="gui.howtos.story.addanotherbg"
+                />
+            ),
+            image: 'storyPickBackdrop2'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Switch Backdrops"
+                    description="Step name for 'Switch Backdrops' step"
+                    id="gui.howtos.story.step_swithbg"
+                />
+            ),
+            image: 'storySwitchBackdrop'
+        }, {
+            title: (
+                <FormattedMessage
+                    defaultMessage="Hide a Character"
+                    description="Step name for 'Hide the Wizard' step"
+                    id="gui.howtos.story.step_hidewizard"
                 />
             ),
             image: 'storyHideCharacter'
@@ -1068,133 +1443,11 @@ export default {
         }, {
             deckIds: [
                 'add-effects',
-                'Video-Sensing'
-            ]
-        }
-        ],
-        urlId: 'pong'
-    },
-
-    'code-cartoon': {
-        name: (
-            <FormattedMessage
-                defaultMessage="Code a Cartoon"
-                description="Name for the 'Code a Cartoon' how-to"
-                id="gui.howtos.code-cartoon"
-            />
-        ),
-        tags: ['code-cartoon'],
-        requiredProjectId: '331474033',
-        img: libraryCodeCartoon,
-        steps: [{
-            video: 'code-cartoon'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Say Something When You Click the Green Flag"
-                    description="Step name for 'Say Something When You Click the Green Flag' step"
-                    id="gui.howtos.code-cartoon.step_codeCartoonSaySomething"
-                />
-            ),
-            image: 'codeCartoonSaySomething'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Animate a Character When You Click It"
-                    description="Step name for 'Animate a Character When You Click It' step"
-                    id="gui.howtos.code-cartoon.step_codeCartoonAnimate"
-                />
-            ),
-            image: 'codeCartoonAnimate'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Select a Different Character"
-                    description="Step name for 'Select a Different Character' step"
-                    id="gui.howtos.code-cartoon.step_codeCartoonSelectDifferentCharacter"
-                />
-            ),
-            image: 'codeCartoonSelectDifferentCharacter'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Use a Minus Sign to Get Smaller"
-                    description="Step name for 'Use a Minus Sign to Get Smaller' step"
-                    id="gui.howtos.code-cartoon.step_codeCartoonUseMinusSign"
-                />
-            ),
-            image: 'codeCartoonUseMinusSign'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Make a Character Grow and Shrink"
-                    description="Step name for 'Make a Character Grow and Shrink' step"
-                    id="gui.howtos.code-cartoon.step_codeCartoonGrowShrink"
-                />
-            ),
-            image: 'codeCartoonGrowShrink'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Select a Different Character"
-                    description="Step name for 'Select a Different Character' step"
-                    id="gui.howtos.code-cartoon.step_codeCartoonSelectDifferentCharacter2"
-                />
-            ),
-            image: 'codeCartoonSelectDifferentCharacter2'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Jump Up and Down"
-                    description="Step name for 'Jump Up and Down' step"
-                    id="gui.howtos.code-cartoon.step_codeCartoonJump"
-                />
-            ),
-            image: 'codeCartoonJump'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Click a Character to Change Scenes"
-                    description="Step name for 'Click a Character to Change Scenes' step"
-                    id="gui.howtos.code-cartoon.step_codeCartoonChangeScenes"
-                />
-            ),
-            image: 'codeCartoonChangeScenes'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Glide Around"
-                    description="Step name for 'Glide Around' step"
-                    id="gui.howtos.code-cartoon.step_codeCartoonGlideAround"
-                />
-            ),
-            image: 'codeCartoonGlideAround'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Change Costumes"
-                    description="Step name for 'Change Costumes' step"
-                    id="gui.howtos.code-cartoon.step_codeCartoonChangeCostumes"
-                />
-            ),
-            image: 'codeCartoonChangeCostumes'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Choose More Characters to Add to Your Cartoon"
-                    description="Step name for 'Choose More Characters to Add to Your Cartoon' step"
-                    id="gui.howtos.code-cartoon.step_codeCartoonChooseMoreCharacters"
-                />
-            ),
-            image: 'codeCartoonChooseMoreCharacters'
-        }, {
-            deckIds: [
-                'Chase-Game',
-                'Tell-A-Story'
+                'Video-Sensing'
             ]
         }
         ],
-        urlId: 'code-cartoon'
+        urlId: 'pong'
     },
 
     'cartoon-network': {
@@ -1356,259 +1609,6 @@ export default {
         urlId: 'video-sensing'
     },
 
-    'say-it-out-loud': {
-        name: (
-            <FormattedMessage
-                defaultMessage="Create Animations That Talk"
-                description="Name for the 'Create Animations That Talk' how-to"
-                id="gui.howtos.say-it-out-loud"
-            />
-        ),
-        img: libraryTXTSpeech,
-        steps: [{
-            video: 'k54n8uwcty',
-            trackingPixel: (
-                <img src="https://code.org/api/hour/begin_scratch_talk.png" />
-            )
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Add the Text to Speech blocks"
-                    description="Step name for 'Add the Text to Speech blocks' step"
-                    id="gui.howtos.say-it-out-loud.step_AddTXTextension"
-                />
-            ),
-            image: 'speechAddExtension'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Say Something"
-                    description="Step name for 'Say Something' step"
-                    id="gui.howtos.say-it-out-loud.step_TXTSpeech"
-                />
-            ),
-            image: 'speechSaySomething'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Set a Voice"
-                    description="Step name for 'Set a Voice"
-                    id="gui.howtos.say-it-out-loud_TXTSetVoice"
-                />
-            ),
-            image: 'speechSetVoice'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Move Around"
-                    description="Step name for 'Move Around' step"
-                    id="gui.howtos.say-it-out-loud.step_TXTMove"
-                />
-            ),
-            image: 'speechMoveAround'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Add a Backdrop"
-                    description="Step name for 'Add a Backdrop' step"
-                    id="gui.howtos.say-it-out-loud.step_TXTBackdrop"
-                />
-            ),
-            image: 'speechAddBackdrop'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Add Another Character"
-                    description="Step name for 'Add Another Character' step"
-                    id="gui.howtos.say-it-out-loud.step_TXTAddSprite"
-                />
-            ),
-            image: 'speechAddSprite'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Perform a Song"
-                    description="Step name for 'Perform a Song' step"
-                    id="gui.howtos.say-it-out-loud.step_TXTSong"
-                />
-            ),
-            image: 'speechSong'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Change Color"
-                    description="Step name for 'Change Color' step"
-                    id="gui.howtos.say-it-out-loud.step_TXTColor"
-                />
-            ),
-            image: 'speechChangeColor'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Spin Around"
-                    description="Step name for 'Spin Around"
-                    id="gui.howtos.say-it-out-loud.step_TXTSpin"
-                />
-            ),
-            image: 'speechSpin'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Grow and Shrink"
-                    description="Step name for 'Grow and Shrink' step"
-                    id="gui.howtos.say-it-out-loud.step_TXTGrow"
-                />
-            ),
-            image: 'speechGrowShrink'
-        }, {
-            deckIds: [
-                'animate-a-name',
-                'Make-Music'
-            ]
-        }
-        ],
-        urlId: 'animations-that-talk'
-    },
-
-    'talking': {
-        name: (
-            <FormattedMessage
-                defaultMessage="Talking Tales"
-                description="Name for the 'Talking Tales' how-to"
-                id="gui.howtos.talking"
-            />
-        ),
-        tags: ['talking'],
-        img: libraryTalking,
-        steps: [{
-            video: 'talking'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Click to Add the Text-to-Speech Blocks"
-                    description="Step name for 'Click to Add the Text-to-Speech Blocks' step"
-                    id="gui.howtos.talking.step_talesAddExtension"
-                />
-            ),
-            image: 'talesAddExtension'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Choose a Sprite"
-                    description="Step name for 'Choose a Sprite' step"
-                    id="gui.howtos.talking.step_talesChooseSprite"
-                />
-            ),
-            image: 'talesChooseSprite'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Make a Character Speak"
-                    description="Step name for 'Make a Character Speak' step"
-                    id="gui.howtos.talking.step_talesSaySomething"
-                />
-            ),
-            image: 'talesSaySomething'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Choose a Backdrop"
-                    description="Step name for 'Choose a Backdrop' step"
-                    id="gui.howtos.talking.step_talesChooseBackdrop"
-                />
-            ),
-            image: 'talesChooseBackdrop'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Click a Character to Go to the Next Backdrop"
-                    description="Step name for 'Click a Character to Go to the Next Backdrop' step"
-                    id="gui.howtos.talking.step_talesSwitchBackdrop"
-                />
-            ),
-            image: 'talesSwitchBackdrop'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Choose Another Sprite"
-                    description="Step name for 'Choose Another Sprite' step"
-                    id="gui.howtos.talking.step_talesChooseAnotherSprite"
-                />
-            ),
-            image: 'talesChooseAnotherSprite'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Move Around"
-                    description="Step name for 'Move Around' step"
-                    id="gui.howtos.talking.step_talesMoveAround"
-                />
-            ),
-            image: 'talesMoveAround'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Choose Another Backdrop"
-                    description="Step name for 'Choose Another Backdrop' step"
-                    id="gui.howtos.talking.step_talesChooseAnotherBackdrop"
-                />
-            ),
-            image: 'talesChooseAnotherBackdrop'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Animate Talking"
-                    description="Step name for 'Animate Talking' step"
-                    id="gui.howtos.talking.step_talesAnimateTalking"
-                />
-            ),
-            image: 'talesAnimateTalking'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Choose Another Backdrop"
-                    description="Step name for 'Choose Another Backdrop' step"
-                    id="gui.howtos.talking.step_talesChooseThirdBackdrop"
-                />
-            ),
-            image: 'talesChooseThirdBackdrop'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Choose a Song to Dance To"
-                    description="Step name for 'Choose a Song to Dance To' step"
-                    id="gui.howtos.talking.step_talesChooseSound"
-                />
-            ),
-            image: 'talesChooseSound'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Dance Moves"
-                    description="Step name for 'Dance Moves' step"
-                    id="gui.howtos.talking.step_talesDanceMoves"
-                />
-            ),
-            image: 'talesDanceMoves'
-        }, {
-            title: (
-                <FormattedMessage
-                    defaultMessage="Get the Ask and Answer Blocks from the Sensing Category"
-                    description="Step name for 'Get the Ask and Answer Blocks from the Sensing Category' step"
-                    id="gui.howtos.talking.step_talesAskAnswer"
-                />
-            ),
-            image: 'talesAskAnswer'
-        }, {
-            deckIds: [
-                'Tell-A-Story',
-                'Animate-A-Character'
-            ]
-        }
-        ],
-        urlId: 'talking'
-    },
-
     'add-sprite': {
         name: (
             <FormattedMessage
-- 
GitLab