WANT AMAZING PEN EFFECTS? Surprising ways to easily up your game | Scratch Tutorial

hello fellow scratchers do your games need a little more snazzing up well i'm griff batch and today we are looking at some neat graphical effects that can really take your games to the next level by combining scratches effect blocks and the pen extension we can transform a flat boring screen lifting the foreground away from the background with a stylish outline of shadow wow what a difference and this works on any costume vector or bitmap and even looks good on text yeah it just makes things pop now we could recreate this effect by hand in the paint editor but doing so is quite time consuming and fiddly what's more if you want to change your level at a later date then you have to redo all your hard work all over again so in this tutorial i'm going to show you how we can replicate this effect using only simple costumes and a bit of funky scratch code so what are we waiting for let's get scratching we'll begin a new project and since scratchy is waiting here on the stage to greet us let's focus some attention on him first make him nice and big by setting his size to 250. many of you will already have played with the effects blocks found under the looks category but for those who haven't we will begin with the set color effect 2 block make sure to use the set block not the change block for this now change the drop down to read brightness so this starts on a brightness of zero but if you click this you'll find that this has no effect on scratch cat at all that's because a brightness of zero means no change so we can try 50. click the block and scratch cat becomes 50 brighter so things get interesting when we whap this right up to 100 that's full brightness again click the block and lo scratchcat appears to have disappeared however this is not quite the case they have actually become pure white that's really useful if you ever want to flash the sprite white for any reason but equally interesting therefore is if we go the other way a brightness of negative 50 makes our cat 50 darker than normal and negative 100 gives us a completely black silhouette of scratch cat now that's really useful another useful effect i like to use a lot is the ghost effect i'll set this to 90 and when combined with the brightness effect then scratch cat becomes an almost completely see-through silhouette perfect for recreating a drop shadow effect all we need to do is bring back the original cat costume and overlay it on top well to get back the original costume we simply use the clear graphic effect block one click and it's back to normal but also gone is our shadow okay so we need both visible at once so what options do we have either we could create a clone of this sprite or we could as we are about to do use costume stamping for this we need to enable a scratch extension click into the extensions box at the bottom left of the scratch window now select the pen extension nice now we have a whole new category of scratch blocks to play with but for this tutorial we are mainly interested in the stamp block here if we click the stamp block and then drag scratch cat you can see it has happily left a copy of itself behind on the stage this we can repeat as many times as we like and it's important to note that these are not clones and the stamped copies are not draggable or movable in the slightest at least not without clearing and then restamping them if we go full screen you'll also see that the stamped costumes unlike clones are not quite as high resolution the edges are pixley that is they're made up of small jagged squares sadly there's nothing we can do about this at present it's just how the pen drawing and stamping canvas works anyhow it still does a good enough job so bring in the last new block we will be looking at the arrays all block clicking this block does what it says and it erases everything that has been drawn or stamped on the pen canvas okay let's try and make a shadow from this position the cat where the shadow wants to be apply the brightness effect apply the ghost effect and then we stamp the costume just as it is nice so we can now move the sprite up oh there's the stamped shadow we just need to clear the graphical effects to bring back our official sprite and there they are and pop them where we want them to finish up yeah there we have a very respectable stamped shadow so having done it by hand let's make it official and turn this into a script when green flag clicked erase all now i'm going to use a custom block to represent the next steps name it stamp shadow we might as well make use of it right away under the arrays all block so we set the brightness to negative 100 and set the ghost to 90. next up we need to think about how to position the shadow we want it to be below the current sprite so why not use a change y by say negative 20. that will move us downwards then we're free to stamp the shadow on the pen canvas to get us back to where we were before we can simply change y by 20 again the opposite of the negative 20 we did above lastly clear the graphics effects to finish off and that's it so we can test this now by first moving the cat sprite and then clicking the green flag hey the shadow followed us success and very useful indeed one thing that is not obvious thus far is how cool the shadow can look on a more funky background for this we'll need to click into the stage backdrop and bring up the backdrops editor i'll start by creating a filled rectangle to cover the entire stage hmm perhaps a little less intense blue and then in a slightly lighter shade of blue make some long rectangles perhaps rotate them a tad and then duplicate them in a pattern across the screen with a select tool you can hold the alt key down while dragging to make copies quickly or you can just use the copy and paste if you prefer great so look at this how cool does that look now and see how the shadow really does have that see-through effect that's what really makes this lift off the page so to speak okay click back into the main sprite now and i just want to add that the ghost number of 90 here you can change that to anything between 0 and 100 and the result is the shadow will be heavier or lighter see how much darker 80 is yeah for shadow i will keep this on 90. now i think you will agree that looks great for a sprite like scratch cat but next up i want to show you how cool it can look to enhance your scratch games by giving depth to your level designs we can click into the costume editor and start drawing a new costume this is to be the level of a game so i'm using filled rectangles to create clean solid areas for the ceiling walls and floor now i'm not seeing the entire costume on the stage because i left the size on 250 from earlier we'd better reset that to 100 and position it at an x y of zero okay so i'll also add a small floating platform here for effect nice this is done and it was so quick to put together but man without texture or outlines it looks really flat on the stage doesn't it although it's fun that scratch cat's shadow is still here okay so click the green flag and voila the level is transformed by the addition of our drop shadow you can see it around the ceiling and the floating platform that is cool but it's still not quite as good as it could be we really would benefit from giving the edge of the level a nice crisp outline to separate it from the background so easy right we just select all the level shapes in the costume editor and give them an outline well yes and no there's this small problem that each shape receives its own distinct outline what we want is the whole level to be treated as a single object and surround that with the black outline sadly this is not quite so easy we could spend lots of time hand crafting the levels from one object using the shaping tool that is often my preferred method or we could use the trick i used in apple and duplicate all the costumes one with a border and one without only showing the bordered ones on a layer behind the non-bordered ones but today we are experimenting with pen solutions so i'll remove the object's outlines and let's see what we can do with scripts click into the main sprite code and let's duplicate the script from our stamp shadow custom block and what i want us to do is to remove the ghost effect completely without the ghosting effect this script now has the effect of drawing a fully black shadow yep there you go so why is this useful well let us continue and it'll become clearer click the green flag to reset and then let me reduce how far the second script moves the sprite it's currently at -20 so bring it right back to just negative three and then of course the positive three to balance it out so if we click the script again ah now then do you see what we are doing we've created a black outline underneath the entire level of course it only hugs the underside of the level at present but perhaps we can do more about that without resetting the project change the first change y to be a positive three and the second to be negative three this way the sprite will be moved up first instead of down if i run the script and then the result is rather cool the top of the level is now been sandwiched by another black line now this is really promising and you should be getting the big picture if we do this in all directions then we'll end up with a perfect black outline around all the edges not just the top and bottom to make this process easier we'll rework the scripts to loop around in a circle stamping each edge as it goes but if we are to be rotating the sprite inner circle we'd best set the rotation mode first to don't rotate otherwise our costume will point in all sorts of directions and the stamping won't look right at all next we set the brightness so all the edges will be the same and here we go wrap the rest of the blocks in our repeat loop i'm going to pick the number eight as that will cover both the basic four directions up right down and left plus the additional diagonals in between two now we should move the clear graphics effects to outside the repeat loop so it doesn't reset until aft drawing is finished so what next well previously we used the change y to move the sprite but since we want to move in different directions i'm going to switch this for a move in steps block and we move forward by the same three steps as before let's switch both these change y's for move-in steps the last one of course moving by negative three right all we need to do now is rotate our directions ready to stamp the next edge we turn right that is clockwise by 45 degrees since 8 45 adds up to 360 a full circle and that is it but to let us see this in action i'm going to temporarily add a weight one second at the bottom of the loop click the green flag to reset the project and then click our new script oh black oh it's okay that got me for a moment yes so did you see the black silhouette moving around before it finished and showed us the original costume in the center let me play that again for you do watch to see it moving around in a circle did you see it well the finished result is great a perfect outline indeed and what a difference it makes to the scene there's no need for this to be slowed down though so remove the weight and let's see it again green flag and click the script that was faster but still not fast enough we really don't want to see this flicker black at all luckily we can fix that we just need our friend run without screen refresh for that we must make a new custom block name it stamp outline and yes tick the run without screen refresh this will allow our repeat loop to run without treating it as an animation it will just draw instantly attach it to our outlining script and then we'll complete the project by dropping the outline block to just before we then draw the shadow so does this make it all run super fast to make testing easier i'm going to add a key press to erase all now i can go full screen click the space to erase all our effects oh wow doesn't the level look flat again you forget and now click the green flag and pow the whole level pops out at you i'm so pleased with that and yes it draws really really quickly no problems there then so how about we try this with something completely different i'll just make a new costume oh wow even this black level with a shadow gives me all sorts of ideas for a cool looking game anyhow drawing something more organic less rectangular and run that okay yeah it doesn't look so great with this bright background hold on while i draw something else okay ah better but perhaps a little too bright in the foreground now there well i don't know but it's still pretty cool and might give you all sorts of ideas right and it works on all sorts of things text levels shapes and of course scratch cat but all this is leading towards the next episode of our classic scratch platformer where i will be using this technique to upgrade the visuals before adding in collectibles keys and working doors so excited for that if you want to try this code out in your platformer then just backpack the scripts and drop them into the level sprite you can trigger them off the change a scene event rather than the green flag simple as that well i hope you've enjoyed this episode i've created a studio on scratch for you to share your creations in and i'm dead excited to see what you come up with just be as creative as you can and have fun it could be a cool scene or a game doesn't matter and i can't wait to see them if you like this video then please do smash the like button and if you want to see more then subscribe to the channel and you won't miss out on the next exciting tutorial until next time have a great week ahead and scratch on guys [Music] you

Channel: griffpatch

Views: 228,158

Keywords: scratch coding, scratch programming, scratch game, scratch 3, griffpatch, griffpatcho, Pen, Stamping, Special Effects, Tutorial, Help coding

Id: KWZldY-Xtpw

Length: 16min 12sec (972 seconds)

Published: Sun Nov 14 2021