CRAZY COOL JOYSTICKS 🎮 - How to make your Scratch Games Mobile Friendly
Vložit
- čas přidán 29. 07. 2024
- Do you want to make your games mobile friendly, learn how to code an awesome reusable mobile joystick (thumbstick) by following this tutorial and you'll be playing your Scratch Games on your phone or tablet in no time!
Scratch works great with mouse and keyboard, but showing off your hard work to a friend on your mobile can be really frustrating unless you have the best mobile controls. That's where this tutorial will help! Once coded you can backpack the controller script and drop it into all your favorite games!
My tutorials are for all budding game & software developers using Code Blocks. Scratch On guys!
🚀 Boost Your Creativity with Griffpatch
The Griffpatch Academy will take you from "Gamer to Game Creator"
Learn more at 👉 griffpatch.academy 👈
😺 Scratch was developed by the Lifelong Kindergarten Group at the MIT Media Lab. See scratch.mit.edu
👀 NEW Multi Touch Joystick Tutorial !!! - • Impossible "Multi-Touc...
🐱 Scratch Studio for this tutorial - scratch.mit.edu/studios/31206...
👀 Quick and Fun Tutorials - • Quick and Fun Scratch ...
⭐ Projects Featured in this video
Click and Jump [ A Platformer ] - scratch.mit.edu/projects/6327...
Slither.io v1.10 #games #all #game #trending #s - scratch.mit.edu/projects/6426...
Potatoid Invasion v1.3 - scratch.mit.edu/projects/5547...
Scratch Fly | Mega Game | #Games #Trending # - scratch.mit.edu/projects/6291...
Snowy town - teeeeeeen - Unshared - scratch.mit.edu/users/teeeeeeen/
-------------Video Chapters-------------
0:00 Intro
1:00 Costumes
2:50 Coding the Joystick Base
3:20 Code Control Stick
5:22 Release back to Centre
6:58 Stick Direction and Power
9:02 Constrained Distance of Travel
12:21 Using the Thumb Stick in a Game
13:45 Thumb Stick Activation Area
17:45 Stick X & Stick Y
20:36 Using the STICK X & Y variables in game
22:14 Bigger Stick for Small Screens
23:31 Backpack to other Games!
24:14 Snowy Town by teeeeeeen
26:15 Click and Jump by ManGold-658
27:52 Highway Madness! by Games_Central
28:50 Slither.io v1.5 by SlordWas Taken
30:03 Potatoid Invasion by Kube_Komix
32:24 Outro
New Multi Touch Tutorial - czcams.com/video/cI1mdVVvCWY/video.html 🔥🔥🔥
Early Access / Channel membership - www.youtube.com/@griffpatch/join
Scratch Studio for this tutorial - scratch.mit.edu/studios/31206995/comments
Quick and Fun Tutorials - czcams.com/play/PLy4zsTUHwGJKByTn_qV76oTpEYGczqEb_.html
LETS GO
how do you get the guy and the flags?
@@NotRealChatGPT griffpatch have the membership future
how do you make the joystick only go left and right?
@@morganisapro6 just make the player change x by stick x
I loved the section where you implemented it in others' games, much fun! :)
Chiroyce, what are you doing here?
@@BuzzyBee13 LOL
Woah, Chiroyce!
@Samfitzgamer, what are you doing here?
@Samfitzgamer Hehe, ok I'll stop. But watch Twishorts to see where I get it.
I actually had to shorten the scripts, but got the same results !! Well done Griffpatch!!
Thank you so much!!! I was making an game where you use your keyboard but I realised I could not test the game on the go. I came across this and tought it was perfect for me as it is easy to understand. It also works very well.
I always love how goofy yet entertaining your videos are! while I doubt I'll make a mobile game, this is still helpful
This really helped! Ive always failed at joysticks!
same lol
the problem is the small circle moving out of the big one
Same
Same :)
✓✓✓✓✓✓✓✓✓✓✓✓✓✓✓✓✓✓✓✓✓
Hey Griffpatch! I just wanted to say thank you so much. Im currently making a game and you have really helped me with these tutorials. In fact, i would be completly lost on how to even properly code the PHYSICS ENGINE without you. So yea, keep up the good work, and thank you again! :)
Never stop scratching there are only a few scratch tutorial makers and you are one of the best sadly I don’t know where you get your sprite designs from but that’s not your fault it’s mine for not learning. Keep it up!
When you made it to where you could only use the joystick by clicking on it WITHOUT “when this sprite clicked”, it actually helped me with something completely unrelated. I was making a mobile keyboard for a Morse Code translator, but had tons of buttons that I wanted to keep on one sprite. Thank goodness I saw this before finishing the code for a whole control-button system. This channel has taught me many ways to avoid big messes. Thanks a lot!
That's excellent news, exactly what I hope
O
@@immegamewer33457._ Spider man go away from home
I love how griffpatch sounds more and more excited in every video he makes. Great tutorial!
lol :D
:D
@@griffpatch :P😛
@@griffpatch for this lemon only
@@griffpatch ah, this lemon only
This worked great! I put it into my 2d top view style game and was surprised at how easy it was to code. thank you!
Griff, I literally love your vids i get so much more knowledge just by copying them or actually making them thanks so much for getting my code skills up! and also by the way when I was doing the part 3:49 mine actually appeared the thumb stick bc I was doing it in a copy of my game so I can add it on my actually game
Griffpatch: this function is relatively simple
also Griffpatch: Explains quantum physics and the relative law of black holes in under 40 seconds.
Lol
I didn’t get it lol
@@rayyanrahman8115 lol
I went to the Scratch homepage and saw that you were following "Crazy Cool Joysticks" and thought, "Oh, I guess he posted a video of that." Sure enough, here it is.
I can't use Scratch on my iPod because there is no Apple app, and the website is too big.
What a great series. Finally, a break from raycasting!
Thank you, it really help me improve, long time ago, I very been trying to do the same as yous but it never worked, thank you, after watching your video, I could do more programing
love the little animations they really help explain the programming! thanks griffpatch! love u
Crazy cool... you are undoubtedly the BEST scratcher in scratch! I haven't shared a project with a joystick but I will certainly do it soon!
The same effect could also be achieved by using the "set mode to draggable" block, and "if " then limit the stick, and "if not ", then reset the stick.
That is a good idea, but it would be too tricky to ensure the user actually clicked on the stick to start moving it
@Zi Zoy Nacho Maybe that works too.
@@griffpatch moving the stick would be needed only to limit it or reset its position. The "set drag mode [draggable]" block from the sensing category does the work of moving the sprite/clone while it is held.
Also i realised while writing this that the only difference is you have to move the stick every time you press it, instead of just pressing the area of the stick
@@griffpatch nice
That’s what I was thinking this video would be about-
I’m working on a scratch platform we but I’m on mobile making it so this tutorial really helps also I’m using your platform tutorial videos it really helps thx
Super now I can put this thing on the platformer game you put into the tutorial (not appel) but the other if I wanna play on mobile thx
Personally I think if you are using a joystick for a platformer, it’s best to use a square joystick. That way it is easier to run and jump, as the corner where both are possible is larger.
Though it would be even better if Scratch had some kind of multi-touch capability… It might make things more difficult to code, but it would be easier to play when you can press a separate button for jumping as for running.
You are very right! I think just the same thing. Although, by using joystick > 0.5 you actually end up with just such a design in reality :) - And yeah - Scratch should support multi touch somehow!!!
@@griffpatch i agree :DD
I also agree
@@BOLT_THUNDERSPHERE Agree:D
How
Who else likes how enthusiastic griffpatch is always makes every second of the vid interesting and fun
yeh
He's the Bob Ross of Scratch coding.
he is the wrost
@@RyteoyGamingCommunity you this is wrost
@@RyteoyGamingCommunity correction YOUR THE WORST*
hi griffpatch i have a question. how would you implement a joystick that works like what you taught us, but instead of using if blocks, we use a key x variable(like in your classic platformer tutorial)
Worked like a charm
Just Added the joystick in my classic platformer and tested it with my mobile device! It turned out so well, So smooth and easy to use! Thank you griffpatch! You never fail to amaze me!
Great to hear!
@@griffpatch i agree. also, there is some kind of Pc = mobile type of the mobile controls [5 keys, 3 moving keys[left,down,right], 2 jumping keys [space,up].]
I have always wanted to learn how to do this, especially with the growing amount of people on mobile devices. This is really helpful!
This is the first vid of your channel I've seen and it instantly earned a subscribe from me👍 good job and keep creating amazing vids
I am so happy my game works with the Joystick!! Thanks griffpatch so much!!
Thank you so much! I combined this with my platformer game that I am making with your tutorials and it works so well! You are amazing :D (Also, 1000th comment?)
I love it! I just added a version of this to my Rocket Canyon game (and submitted it to your studio). But I also experimented with only turning on the joystick once they click on the screen so it doesn't get in the way of the game if playing on the computer. Thanks again for a great tutorial (and worth waiting for)!
Very cool, I have a small update to make it even better, but that will have to wait
For the changing size, maybe add a icon and make it 100 for regular size and 200 for big size or something
@@griffpatch CHECK YOUR MESSAGES
Hi
@@griffpatch i love your vids
Amaizing tutorial, it explains every thing slowly and makes every one understand
Thanks! That helped a lot!
This is great! I am looking forward to another tutorial like creating an inventory with draggable items.
Oh, yes, yes, yes! The perfect tutorial for a joystick! I'm excited for this one, as I've always been working on mastering my joystick code! Thank you so much again, griffpatch!
Best scratch tutorial, understand easily and specific explanation, keep up the good work
this really helped thanks!!!
I can’t believe your probably one of the only you tubers who is big and uploads consistently I have watched you for u years and you have tought me so much thank you!!!!!keep grinding and doing your thing brotha!!!!
Wow, I used a completely different technique for a joystick and this is so much more flexible than mine. Mine is so stiff.
Hi Griff i have a question why do you need to place a variable when you could do a direct value for the constrained distance of travel thanks
thank you griffpatch so much !!
Hey griffpatch, I think it would be cool if for your next series after 3d raycasting would be a renewed version of your old series, How to make a cloud game. It would be nice with your current editing and microphone!
You don't have to use the MYSELF variable. You can use a scratch bug. Drag a GO TO block into a different sprite, select Control Stick, drag the block into Control Stick.
I got interrupted as I was typing and part of the code I mentioned is missing. I reads "go to x position of control stick, y position of control stick", which is what is in the project I mentioned. BUT, doing it myself now I realize that the project I got that from must have done it by exploiting the "different sprite" trick, so it amounts to the same thing. I guess it's another alternative, though I still wonder how they compare in efficiency. Note, you also need it in the "distance to myself" block. the myself variable is easier to code, but you have to worry about if the sprite name changes.
This was extremely helpful!
WOW this helps alot! and thank you! ❤️👍
For a lot of games, on the cat sprite use a ‘set rotation style left-right’ block inside the forever loop, but not in the ‘if Stick Power > 0’ block.
Thank you so much for this tutorial! youre the person who inspired me and got me started!
It will be helpful! I will now use your skills in my work. Thank you :D
This will be great for my RPG project. Thank you so much for this tutorial.
For the going to center thing, use this: Go into 1 sprite then use the go to block to select the sprite, then move the sprite into the Control Stick sprite and tada.
Easy tutorial, thanks Griffpath! 👏👏👏
This is great really useful your tutorials are awesome
thank you so much i was doing a basketball game i was looking for this now i found so thank you i subscribed to you and liked the video
somehow you've again made a undercomplicated script that functions the same as a 500 block long script.
Wondering if you could attempt Binary Space Partitioning though. That'd mean you could make a true 3d engine. And you can also add actual up&down movement without the image weirdly shifting.
That'd probably make the project run far too slow but a full on 3d engine will being able to have many old gems to be ported over to scratch.
I know that you've attempted something similar a long time ago but this could be a chance to remake it but extremely easy to port over like the stick and have many extra things like textures and shading.
This helped a lot by the way!☺
Thanks! This is really helpful! 😄
7:53 i believe theres an alternative way on making it turn 180 degrees.. using join blocks.. basically you use the join block to point toward the negative of the variable
would that work if it was already a negative direction
I think you should do things in other people's code more often, I find this really entertaining for some reason 😅
True....
That would be funny.
Same
Best tutorial ever ! This video made my game interesting than ever!~
Is there a way you can make the joystick toggle when people are specifically using mobile devices? or does it always have to be there including when people are using a computer?
This is perfect! I was just implementing mobile support to my game and I was having trouble with movement. Do you think you can create a tutorial on optimization to reduce project size and make things run faster? (reducing imported file sizes, smart coding, etc. My game runs at around 31 FPS on PC and 20 FPS on my phone but I still have a lot of content to add)
Scratch runs at 30 FPs, so that's the highest it can run.
@@maikeru5187 oh thanks, I didn't know that, that was helpful
Hey griffpatch can you tell the scratch team to make scratch multi touch? Thanks.
Thank you since I program on a mobile phone and it will help me a lot🎉
Thank you for sharing this. This VDO help me a lot to create new scratch project.
instead of using variable 6:48 you can use the join block like this [ *join* _control stick_ *with* _blank_ ] (you just don't type anything in the blank and delete the pre existing space)
edit sorry if this is annoying i just hate making new variables unless its necessary
Same
Yes, I often do that, but I was thinking since we had to use it over and over a variable would be better
yeah CUP
Yeah it's not that hard to type it out every time.
uosh?!?!?
17:21 u can devide the size by 2 and u need to be in the radius of the base to use the joystick and i think it works well!
sorry but *you*
@@coolswag352 ?wym
@@Jeregaje you said “u” instead of “you”
@@simplylou8631 ye ik it is easier
Thank you, Griffpatch, for teaching me about Scratch coding
Thank you for this tutorial. It helped me in my work a lot.
5:06 you can add a “set drag mode to not draggable” so you can test the project with no full screen.
Sadly not... That only applies to full screen mode. There is a scratch addon extension that supports that feature though.
I tried that with my 3D backrooms game and I dragged the actual entity sprite
A tip is that if you want the joystick to always stay in the front no matter what, you can put the go to front layer in a forever loop.
keep the tutorials up and it helps A LOT of people like me! :)
Thank you for teaching me about joysticks
I love how enthusiastic griffpatch is with each video! Also helpful how he explains everything making it easy to make quick tweaks. I was wondering how to do it for your recent scratch RPG series? The movement didn’t seem to work the same for the player. 😢
Technoblade never dies
Thank you for making this tutorial so the mobile joystick can become more popular, I am tired of those terrible mobile controls where you have to hold a specific section of the screen and stuff.
It's really lacking in mobile friendly, I'm so glad to see this💗
My most popular project on scratch is Dan Adventures, and it was based on the great platformer tutorial from griffpatch! Thank you so much.
Scratch: *no you can’t return to base sprite*
Also scratch: lets us add a variable in the ‘go to’ block which we can set to the base
Griffpatch, you can actually get the control stick position option in another sprite and then drag the block to the stick sprite instead of using a variable.
He did it in one of the Tile Scrolling Plattformer Video.
@@DoxxTheMathGeek And also shiftclicklearn did that.
@@darrickhans9478 did you join his discord?
@@DoxxTheMathGeek and in raycasting pt 5
@@1080GBA No.
its cool because everything can be easily customized in the joystick, the look of the base, stick, shape of the base too
Thanks Griffpatch! I'm make a new game but I need joystick but you helped me!
Your tutorials are the best :D I also like how you added the joystick in other scratchers games :)
Thanks! 😃
I loved this one, I didn't even realize that there was a simpler way to make a joystick!
Can you please make a tutorial on how to make your own scratch extensions?
Thank you so much for this tutorial but I have a question: when I was close to finishing, I accidentally deleted the block you told us to break apart because it was too long! I tried remaking it but the joystick wouldn’t move at all! I began crying because I worked for 2+ hrs on this so is there any possible way you can undo / redo something in scratch
This Saved me in a Rougelike game im making on scratch where the only thing you need to play is a Mouse, No Keyboard Required. and i was Really struggling with the movement, i did have a method that make a movement block that made it go from movement mode to interact mode but whenever u went to press it the player would move towards the button.
Thank you i got 1.30$ and 68 people downloaded my game in 1 day!
How
@@AnonymousEMPTYi put in on appstore
اوحهحه 😂 اوقحقه😂اوطحطهحخهجحه😂
Great brother 👏🏻
But which platform you are using ?
2 sec later ROBLOX IN SCRATCH FOR MOGILE
Yea its a roblox moving stick😂😂😂😂
Mogile
You miss spelled
I hope not
2 secs? G’arn m8 r u rekt? No wey you mak gam 3D les tan 2 secs
your videos are very helpful! thank you
Cool video. I followed your tutorial of boids.
bro My Kaitty is fast??🤣🤣
At 20:80 I left the Set STICK X and Y out and it still worked. I think this is because you are multiplying the X and Y by Stick power and when you let go is is set to 0 so its multiplying Stick X and Y by 0 (making it 0). Thank you so much for your tutorial's they have help me start coding on scratch and understanding it.
20:80?
I’m working on the RPG on my ipad and my chrome book so for testing I needed the joystick TYSM for the amazing tutorials.
No problem I'm glad to have been of help, scratch on
Thanks Now I Can make alot of mobile friendly games From The Joystick!
i love your videos they are so helpful
Thank you so much for this tutorial! i made a game but people wanted it to be mobile too so this helps a lot.
15:01 I ticked the run without screen refresh box lol. What I did was I seperated the script from the repeat until block, and placed the Drag Stick block inside the repeat, just in case, 'cuz it seems SOOOOOO much smarter.
I love it it worked so great
You are always so energetic! These guides help me a lot!!!!! Thanks you!
Tank you, this is really nice.
Thank you!
Thank you so much ❤❤
I've made a tap-joystick for my platformer.
To do it, first go into the player sprite. Then, make two new variables, mouse x and mouse y. Then go two Controls Left and Right. Set KEY X to mouse x.