{"id":2900,"date":"2021-10-30T14:54:37","date_gmt":"2021-10-30T14:54:37","guid":{"rendered":"https:\/\/computerscienced.co.uk\/site\/?page_id=2900"},"modified":"2021-10-30T16:02:47","modified_gmt":"2021-10-30T16:02:47","slug":"virtual-sparkler-in-scratch-project","status":"publish","type":"page","link":"https:\/\/computerscienced.co.uk\/site\/virtual-sparkler-in-scratch-project\/","title":{"rendered":"Virtual Sparkler in Scratch Project"},"content":{"rendered":"\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<figure class=\"wp-block-image size-large is-resized\"><a href=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/undraw_fireworks_q-5-ji.svg\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/undraw_fireworks_q-5-ji.svg\" alt=\"\" class=\"wp-image-2893\" width=\"269\" height=\"174\"\/><\/a><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p>Create a virtual sparkler in this quick Scratch project!  Just like a real sparkler &#8211; students should be able to wave the sparkler around with their mouse to draw out their name or make patterns. <\/p>\n<\/div>\n<\/div>\n\n\n\n<p class=\"has-background\" style=\"background-color:#0693e3\"><strong>Task<\/strong><\/p>\n\n\n\n<p>Read through this page and in Scratch, create the program that is asked for. Pay close attention to what is being asked and the success criteria.<\/p>\n\n\n\n<p>We recommend planning the program before you start it.<\/p>\n\n\n\n<p class=\"has-background\" style=\"background-color:#0693e3\"><strong>Create a Scratch Project that does the following:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Create a sparkler effect in Scratch<\/li><li>The sparkle effect should follow your mouse as you move it<\/li><li>A trail should follow the sparkle effect but only for a small amount of time.<\/li><\/ul>\n\n\n\n<p><\/p>\n\n\n\n<p class=\"has-background\" style=\"background-color:#0693e3\"><strong>Instructions<\/strong><\/p>\n\n\n\n<p><strong>1.<\/strong> Open Scratch or go to the Scratch website <a href=\"http:\/\/www.scratch.mit.edu\">www.scratch.mit.edu<\/a><\/p>\n\n\n\n<p><strong>2.<\/strong> Download and save the Sparkler video file below (make sure you save it to a place you know!): <\/p>\n\n\n\n<div class=\"wp-block-file\"><a href=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/sparklervideo.gif\">SparklerVideo.gif<\/a><a href=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/sparklervideo.gif\" class=\"wp-block-file__button\" download>Download<\/a><\/div>\n\n\n\n<p><\/p>\n\n\n\n<p><strong>3.<\/strong> We now need to put the video we have downloaded into Scratch<\/p>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<figure class=\"wp-block-image size-full is-resized\"><a href=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/upload-sprite.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/upload-sprite.png\" alt=\"\" class=\"wp-image-2903\" width=\"245\" height=\"265\" srcset=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/upload-sprite.png 316w, https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/upload-sprite-277x300.png 277w\" sizes=\"auto, (max-width: 245px) 100vw, 245px\" \/><\/a><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p><strong>4.<\/strong> Hover over the &#8216;Choose a sprite&#8217; button then click on the Upload Sprite button right at the top.<\/p>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-background has-contrast-background-color has-contrast-color\"\/>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<figure class=\"wp-block-image size-full is-resized\"><a href=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/import-sprite.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/import-sprite.png\" alt=\"\" class=\"wp-image-2904\" width=\"324\" height=\"143\" srcset=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/import-sprite.png 672w, https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/import-sprite-600x266.png 600w, https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/import-sprite-300x133.png 300w\" sizes=\"auto, (max-width: 324px) 100vw, 324px\" \/><\/a><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p><strong>5.<\/strong> Select the file and click on the Open button<\/p>\n\n\n\n<p>This will put the video into Scratch for you.  <\/p>\n\n\n\n<p>If you go to the Sprite window you should be able to see the video.  <\/p>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-background has-contrast-background-color has-contrast-color\"\/>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/get-rid-of-cat.png\"><img loading=\"lazy\" decoding=\"async\" width=\"231\" height=\"148\" src=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/get-rid-of-cat.png\" alt=\"\" class=\"wp-image-2905\"\/><\/a><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p><strong>6.<\/strong> If the cat sprite is still here you can get rid of it as we don&#8217;t need it for this project.  <\/p>\n\n\n\n<p>Click on the cat then click on the rubbish bin.  <\/p>\n\n\n\n<p>Sorry cat!<\/p>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-background has-contrast-background-color has-contrast-color\"\/>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/When-flag-clickedpng.png\"><img loading=\"lazy\" decoding=\"async\" width=\"348\" height=\"202\" src=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/When-flag-clickedpng.png\" alt=\"\" class=\"wp-image-2906\" srcset=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/When-flag-clickedpng.png 348w, https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/When-flag-clickedpng-300x174.png 300w\" sizes=\"auto, (max-width: 348px) 100vw, 348px\" \/><\/a><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p><strong>7.<\/strong> We will now code our program.  Click on the sprite that we imported and select the starting block from the &#8216;Events&#8217; menu on the left.  <\/p>\n\n\n\n<p>Double click or drag this block into the coding window to the right.  <\/p>\n\n\n\n<p>This block tells the sprite what to do when you click on the green flag. <\/p>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-background has-contrast-background-color has-contrast-color\"\/>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/switch-costume.png\"><img loading=\"lazy\" decoding=\"async\" width=\"663\" height=\"266\" src=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/switch-costume.png\" alt=\"\" class=\"wp-image-2907\" srcset=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/switch-costume.png 663w, https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/switch-costume-600x241.png 600w, https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/switch-costume-300x120.png 300w\" sizes=\"auto, (max-width: 663px) 100vw, 663px\" \/><\/a><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p><strong>8.<\/strong> Under the &#8216;Looks&#8217; menu on the left, find the block that says &#8216;switch costume to&#8217; and place it under the starting block.<\/p>\n\n\n\n<p>Your code should look like the image on the left.  <\/p>\n\n\n\n<p>This block of code will help our video to run \/ animate.    <\/p>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-background has-contrast-background-color has-contrast-color\"\/>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/Set-variable-to-24.png\"><img loading=\"lazy\" decoding=\"async\" width=\"646\" height=\"350\" src=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/Set-variable-to-24.png\" alt=\"\" class=\"wp-image-2909\" srcset=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/Set-variable-to-24.png 646w, https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/Set-variable-to-24-600x325.png 600w, https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/Set-variable-to-24-300x163.png 300w\" sizes=\"auto, (max-width: 646px) 100vw, 646px\" \/><\/a><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p><strong>9.<\/strong> Under the &#8216;Variables&#8217; menu on the left, find the block that says &#8216;set my variable to 0&#8217;. <\/p>\n\n\n\n<p>Drag it into the code area and change the 0 to 24.  <\/p>\n\n\n\n<p>This is the number of frames per second the video has.<\/p>\n\n\n\n<p>Can you change the variable name to &#8216;frames&#8217; instead of &#8216;my variable&#8217;? <\/p>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-background has-contrast-background-color has-contrast-color\"\/>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/forever-loop.png\"><img loading=\"lazy\" decoding=\"async\" width=\"643\" height=\"545\" src=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/forever-loop.png\" alt=\"\" class=\"wp-image-2910\" srcset=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/forever-loop.png 643w, https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/forever-loop-600x509.png 600w, https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/forever-loop-300x254.png 300w\" sizes=\"auto, (max-width: 643px) 100vw, 643px\" \/><\/a><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p><strong>10.<\/strong> Under the &#8216;Control&#8217; menu on the left, find the block that says &#8216;forever&#8217;.<\/p>\n\n\n\n<p>Drag it into the code area and attach it under the variable block.  <\/p>\n\n\n\n<p>This block will make the code in it run forever until we stop the program.  <\/p>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-background has-contrast-background-color has-contrast-color\"\/>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/add-extension.png\"><img loading=\"lazy\" decoding=\"async\" width=\"107\" height=\"303\" src=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/add-extension.png\" alt=\"\" class=\"wp-image-2911\" srcset=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/add-extension.png 107w, https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/add-extension-106x300.png 106w\" sizes=\"auto, (max-width: 107px) 100vw, 107px\" \/><\/a><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p><strong>11.<\/strong> We now need to add something extra to Scratch to make the sparkler draw lines as we move our mouse.  <\/p>\n\n\n\n<p>Click on the blue button in the bottom right hand corner of the screen underneath all of the other menu options.  <\/p>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-background has-contrast-background-color has-contrast-color\"\/>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/pen-extension.png\"><img loading=\"lazy\" decoding=\"async\" width=\"441\" height=\"496\" src=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/pen-extension.png\" alt=\"\" class=\"wp-image-2912\" srcset=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/pen-extension.png 441w, https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/pen-extension-267x300.png 267w\" sizes=\"auto, (max-width: 441px) 100vw, 441px\" \/><\/a><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p><strong>12.<\/strong> A window will pop up with lots of different extensions.  You need to select the &#8216;Pen&#8217; extension.  <\/p>\n\n\n\n<p>Without this, our sparkler won&#8217;t be able to draw lines.  <\/p>\n\n\n\n<p><strong>Did you know<\/strong> &#8211; Python uses similar extensions called libraries that allows it to do extra tasks as well!<\/p>\n\n\n\n<p>Click on the image and an extra menu option will be added to the left hand menu bar called &#8216;Pen&#8217;<\/p>\n\n\n\n<p>You will be given lots of different Pen menu options.  <\/p>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-background has-contrast-background-color has-contrast-color\"\/>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/pen-commands.png\"><img loading=\"lazy\" decoding=\"async\" width=\"624\" height=\"800\" src=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/pen-commands.png\" alt=\"\" class=\"wp-image-2913\" srcset=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/pen-commands.png 624w, https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/pen-commands-600x769.png 600w, https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/pen-commands-234x300.png 234w\" sizes=\"auto, (max-width: 624px) 100vw, 624px\" \/><\/a><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p><strong>13.<\/strong> From the &#8216;Pen&#8217; menu option on the left we need to select 3 different blocks:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>set pen size to<\/li><li>pen down<\/li><li>set pen color to<\/li><\/ul>\n\n\n\n<p>All 3 of these need to go into our forever loop.  <\/p>\n\n\n\n<p>Make sure you change the set pen size value to 10.<\/p>\n\n\n\n<p>Change the &#8216;set pen color to&#8217; value to a nice orange colour.<\/p>\n\n\n\n<p>These 3 blocks setup our sprite so that it can draw onto the screen. <\/p>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-background has-contrast-background-color has-contrast-color\"\/>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/go-to-mouse-pointer.png\"><img loading=\"lazy\" decoding=\"async\" width=\"509\" height=\"654\" src=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/go-to-mouse-pointer.png\" alt=\"\" class=\"wp-image-2914\" srcset=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/go-to-mouse-pointer.png 509w, https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/go-to-mouse-pointer-233x300.png 233w\" sizes=\"auto, (max-width: 509px) 100vw, 509px\" \/><\/a><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p><strong>14. <\/strong>Under the &#8216;Motion&#8217; menu option on the left select the block labelled &#8216;go to random position&#8217;. <\/p>\n\n\n\n<p>Drag the block into the forever loop.  <\/p>\n\n\n\n<p>Click on the &#8216;random position&#8217; value and select the &#8216;mouse-pointer&#8217; value.  <\/p>\n\n\n\n<p>This will make our sprite go to where the mouse pointer is so that we can use the mouse to draw.  <\/p>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-background has-contrast-background-color has-contrast-color\"\/>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/next-costume.png\"><img loading=\"lazy\" decoding=\"async\" width=\"491\" height=\"677\" src=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/next-costume.png\" alt=\"\" class=\"wp-image-2916\" srcset=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/next-costume.png 491w, https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/next-costume-218x300.png 218w\" sizes=\"auto, (max-width: 491px) 100vw, 491px\" \/><\/a><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p><strong>15.<\/strong> Under the &#8216;Looks&#8217; menu option on the left select the block labelled &#8216;next costume&#8217;.<\/p>\n\n\n\n<p>Drag the block into the forever loop.  <\/p>\n\n\n\n<p>This block will make sure that the animation on our sparkler runs.   <\/p>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-background has-contrast-background-color has-contrast-color\"\/>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/wait-number-of-frames.png\"><img loading=\"lazy\" decoding=\"async\" width=\"627\" height=\"754\" src=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/wait-number-of-frames.png\" alt=\"\" class=\"wp-image-2917\" srcset=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/wait-number-of-frames.png 627w, https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/wait-number-of-frames-600x722.png 600w, https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/wait-number-of-frames-249x300.png 249w\" sizes=\"auto, (max-width: 627px) 100vw, 627px\" \/><\/a><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p><strong>16. <\/strong>The next block we add is actually comprised of 3 blocks &#8211; pay attention to get this correct.  <\/p>\n\n\n\n<p>Under the &#8216;Control&#8217; menu option select the &#8216;wait 1 seconds&#8217; block.<\/p>\n\n\n\n<p>Drag it into the forever loop.<\/p>\n\n\n\n<p>Next under the &#8216;Operators&#8217; menu option select the block with the &#8216;\/&#8217; symbol in the middle of it and two blank spaces either side.<\/p>\n\n\n\n<p>Drag this block and put it into the &#8216;wait 1 seconds&#8217; block where the &#8216;1&#8217; is.  <\/p>\n\n\n\n<p>Next under the &#8216;Variables&#8217; menu option select the &#8216;my variable&#8217; (or &#8216;frames&#8217; variable if you renamed it).  <\/p>\n\n\n\n<p>Drag this into the empty space on the right side of the &#8216;\/&#8217; block like the picture. <\/p>\n\n\n\n<p>Finally put a &#8216;1&#8217; into the left hand blank space of the &#8216;\/&#8217; block.  <\/p>\n\n\n\n<p>This block makes sure that our animation runs at the correct speed.      <\/p>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-background has-contrast-background-color has-contrast-color\"\/>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/erase-all.png\"><img loading=\"lazy\" decoding=\"async\" width=\"527\" height=\"754\" src=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/erase-all.png\" alt=\"\" class=\"wp-image-2918\" srcset=\"https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/erase-all.png 527w, https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/erase-all-210x300.png 210w\" sizes=\"auto, (max-width: 527px) 100vw, 527px\" \/><\/a><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p><strong>17.<\/strong> The last part of code we need!<\/p>\n\n\n\n<p>Under the &#8216;Pen&#8217; menu option select the block that says &#8216;erase all&#8217;.<\/p>\n\n\n\n<p>Drag this into the forever loop.  <\/p>\n\n\n\n<p>This block will erase our drawing as, like a real sparkler the drawing should not last for long.  <\/p>\n\n\n\n<p><\/p>\n\n\n\n<p>Press the Green flag to try out your virtual sparkler!<\/p>\n<\/div>\n<\/div>\n\n\n\n<p>Is everything working correctly?  Great! If not have another read through and make sure you have followed the instructions.  <\/p>\n\n\n\n<p class=\"has-background\" style=\"background-color:#0693e3\"><strong>Challenge<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Make the sparkler draw colour changing patterns.  <\/li><\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Create a virtual sparkler in this quick Scratch project! Just like a real sparkler &#8211; students should be able to&#8230;<\/p>\n","protected":false},"author":1,"featured_media":2893,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"inline_featured_image":false,"disable_featured_image":true,"footnotes":""},"class_list":["post-2900","page","type-page","status-publish","has-post-thumbnail","hentry"],"blog_post_layout_featured_media_urls":{"thumbnail":["https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/undraw_fireworks_q-5-ji.svg",150,150,true],"full":["https:\/\/computerscienced.co.uk\/site\/wp-content\/uploads\/2021\/10\/undraw_fireworks_q-5-ji.svg",1144,742,false]},"categories_names":null,"comments_number":"0","_links":{"self":[{"href":"https:\/\/computerscienced.co.uk\/site\/wp-json\/wp\/v2\/pages\/2900","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/computerscienced.co.uk\/site\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/computerscienced.co.uk\/site\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/computerscienced.co.uk\/site\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/computerscienced.co.uk\/site\/wp-json\/wp\/v2\/comments?post=2900"}],"version-history":[{"count":6,"href":"https:\/\/computerscienced.co.uk\/site\/wp-json\/wp\/v2\/pages\/2900\/revisions"}],"predecessor-version":[{"id":2928,"href":"https:\/\/computerscienced.co.uk\/site\/wp-json\/wp\/v2\/pages\/2900\/revisions\/2928"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/computerscienced.co.uk\/site\/wp-json\/wp\/v2\/media\/2893"}],"wp:attachment":[{"href":"https:\/\/computerscienced.co.uk\/site\/wp-json\/wp\/v2\/media?parent=2900"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}