Ultra Fast Colour Image Scanner | Scratch How-to Tutorial
Вставка
- Опубліковано 16 чер 2024
- The Fastest Colour Image to List Scanner for Scratch, up to x400 faster than the previous method - You'll be amazed! Image scanning is useful for making textures for use in games, as well as for paint programs, and many other imaginative projects! In this tutorial we walk through how colour scanning in Scratch is achieved, and then look at how we can make it so much better!
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
👀 Previous GET COLOR tutorial - • How to GET COLOR value...
🐱 Scratch Studio for this tutorial - scratch.mit.edu/studios/31533...
🐱 Blue Line Scanning Filter - scratch.mit.edu/projects/6785...
👀 Quick and Fun Tutorials - • Quick and Fun Scratch ...
❤️ Scratch Addons - scratchaddons.com/
📹 Video Editing Software - techsmith.pxf.io/c/2682566/50...
-------------Video Chapters-------------
0:00 Intro
1:43 Scanning
6:20 Using Pen to Draw an Image from a List
9:49 Colour Caching
11:36 Pixel Accurate Scanning
14:09 The theory of Binary Search for Colour Scanning
17:30 Image Brightness
24:05 The Initial Scan
26:26 Possible Colour Values
30:04 Testing the Initial Scan
31:53 2nd Scan Pass
36:56 3rd Scan Pass
38:58 Correcting Edge Case Scanning Errors
43:31 Scanning with 3, 4 & 5 passes
45:47 Outro
It is incredible how you have made this, I tried making this but all my attempts failed, you are truly the greatest programmer on scratch
not really the best there are more great programmer out there in scratch
but griffpatch makes video on how to make them instead of just making it all by himself without making a video on it that how he made
someone made a 3D minecraft raycasting game
one of the sprites named "Renderer" had 5000+ blocks!!
i think you need at least 1000 blocks to make a working 3D game
I agree
Omg Your Right
There's alot of skilled scratcher that's greater than griffpatch, but for me griffpatch is the best scratch teacher.
35:06
This is incredibly long, the way you explain it is all clear and worth it!
Edit: Well... um I didn't expect this to gain likes.
Gosh I hope so... I was wondering about splitting it into multiple parts, but... I didn't!
@@griffpatch it actually didn't feel long at all watching it. I was kinda surprised how quickly the end snuck up on me.
@@griffpatch hi'
@@Resseguie same!
wow
I love your tutorials. They are different from most tutorials since other people tend to just tell you what to do. You do it differently, you explain why and how it works, and just overall gives the viewer more knowledge that they can use later in other projects.
You basically applied the binary search algorithm to scratch scanning. Amazing how efficient you made it
Oh wow, I didn't realize you had a UA-cam channel. I used to love your projects when I used Scratch myself in middle school. Now I'm a senior computer science major. Time flies.
Doesn't it just!!! That's awesome
@@griffpatch Well, I was able to make my own step number generator on Scratch without any help!
@@griffpatch i Love Me
i didnt even watch this tutorial for the tutorial i watched this to see how cool ultra fast scanning is and how it works.
i really like the methods you use like using a giant sprite, sizing it down, then switching to a small one, or maybe turning down the image brightness to make scanning easier.. its all very cool, good job griffpatch!
I love these tutorials! I'm a computer science student now, but my original interest in programming came from Scratch. The way you explain how things work in these videos is amazing, it's done in a way that even beginner Scratchers can pick up on, but I still find myself learning new and better ways to organize my code from them. I love seeing how much Scratch can really do, and it is a fun challenge for me to try implementing these projects in other languages like Python or Java. Thank you so much, I'm excited to see your future videos!
True, scratch is a really fun and simple way to start your programming journey.
Wow. This had my head spinning for a while, but I can't argue with the results. This looks amazing. And it would make for a great jumping off point to make a file compression program such as jpeg or png.
This is so amazing, you're truly one of the best scratchers out here. I also tried the blue line project and it's really fun!
THANKS for releasing this, it feels like I've been waiting so long. You are the best!
Let’s be real everyone still on scratch at one point either started or stayed on the site because of this man
I've gotten this far on learning from you on raycasting in scratch 3d. I'm trying to learn from this video so i can put my own textures for walls and other objects. An attempt to create seemingly random raycasting maps.
I cant get past the 2nd scan. I finished the video. Watched this video several times. I know i can catch my mistake. Im using turbo warp. Stantard settings to mimic scratch to avoid errors uploading. Youre such a great tutor. Its so hard to catch my own mistakes. How you broke down this, is mind boggling smart. Yet so simple kids can understand. Bravo 👏
Update. I figured it out. I was missing a ghost value. 😂 thank you
Wow, this is incredible! I'm pretty sure you said something about applying this to the raycaster tutorial series, I hope you make a video on that. Great work as always, I'm looking forward to what's next!
That's the plan!
Finally a griffpatch video that is over 40 minutes long! Love you videos; keep up the good work!
oh, i just made this on scratch using the brute force method a couple of days before this came out! i didnt know that you didnt have to convert the number into hex! thank you so much, griffpatch!
It's an understatement to say this is revolutionary
aww man! now i gotta wait for another raycasting tutorial, this looks so fun! time to hit F5 every few minutes :P amazing work as always, griff!
This is legendary! Love this job, it will open a lot of possibilities!!
A good idea for saving and loading pictures. Got saving to work before I went to this video but with it saving around 30 pixels a second, so I went to this video to make my saving way faster!
Even when I’m not using scratch, I still watch your videos. They’re just so entertaining
This is so incredible... wait, now we can actually take pictures in scratch, which is something that was practically impossible.
wow, a 47 min video! griffpatch must be worked so hard on this!!! thank you teacher griffpatch!!
used a 3 pixel thing with the previous tutorial and try to do this. it took 20 minutes. This is just revolutionary
"Scratch is a kids toy, you can't do anything cool without it being really laggy."
Griffpatch and Friends: Hold my calculator.
griffpatch you are so awesome! It would have taken me hours to scan a single image if you didn't upload! Love ur vids :)
i was waiting everyday for this video and was excited and it finally came out! thank you!
this, is, AMAZING! This is some of, if not the most impressive code I've ever seen!
FACE REVEAL
His pfp has been the same since ages ago bro
I like griffpatch because he makes a variety of things and not just constant platformers like most people
i have been waiting for this for a few days
I thank you for everything,now I can do CLOUD GAMES!I am a Scracher now because of your tutorials,thank YOU!
Griffpatch I'm currently working on a ray tracer for Scratch and this tutorial literally is so helpful as needed a waty get textures working in the engine. Great video!!
Glad it helped!
waty
ray tracer!?
I love all of your videos! This is amazing so far!
time flies when your doing griffpatch tutorials
I have no words. this is amazing.
Thanks a lot for subtitling all the videos. It's a very nice and helpful touch.
You're welcome 😊
Nice video.
I think this could be useful for making a mesh render and soft body physics with spring joints.
Yeah
amazing video! 40 whole minutes! it was very helpful! 😁
That was probably one of my favorite videos ever watched of your channel. This was totally worth the waiting, but don't put too much effort too, i just can't imagine how much time it took you.
Do you plan on livestreaming someday ? On youtube or Twitch, that would be so cool to watch and interact with you :)
Thanks so much. Yes it would be fun to live stream, but I get the feeling the Scratch team would not let me link to my UA-cam channel if I did.
@@griffpatch Too bad, but we'll keep watching your videos anyway, because they really are great. Thank you :)
@@griffpatch Yeah, Scratch thinks I am sharing private information when I talk about livestreams in Scratch.
Very helpful, thank you, and nice videos 👍🏾
This is really cool! 8 seconds is definitely an improvement from 20 minutes it was before.
If you had a game with a small color palette could you make this work in real-time so you could do cool screen effects to specific things in the game? Since it wouldn't have to check more colors.
Yeah! its possible
I am replying to this comment so I can be reminded of this comment later
@@rorucopexperements2235 ok
@@reuppbee8872 nice
@@rorucopexperements2235 hello from the future 1 hour later
Yoo, That's What I Wanted.
Thanks ❤️💛
Fun fact: for testing you can broadcast a message after "scan" to start "render"
Before I knew about all this I tried doing image scanning myself and it worked
to be honest, I never actually follow the tutorials, but I watch the whole thing because I find it very interesting the tricks you use and I want to use them for my games
Good video as always! Btw, a scratch tutorial of sudoku puzzles generating will definitely attract a lot of people!
Leaving this comment up in case anyone else has trouble.
TL:DR if your initial scan test (30:04 into the tutorial) starts glitching out about 50,000 pixels into the scan and the i value starts skyrocketing, make sure that you aren't running the "when space key pressed" code on both your original scanner sprite and the full screen mask. In other words, check to make sure that your "when space key pressed" code block starts with "If costume number >1, then stop this script."
-----
INITIAL POST: Running into an issue where my scanner, on intial pass, seems to be freezing up after about 50,000 pixels. Fault seems to be in the "touching color item i of colors" line: the i variable value is continuing to escalate p[ast 8. This seems to indicate that the scanner is looking for a color that isn't in the initial scan color list.
Double-checked the tutorial, and both my ghost values and color list lists match yours. Not sure what the issue could be here.
UPDATE: Tried a couple of other images, and they all seem to hang around 50,000 pixels. Now wondering whether the issue is somewhere else. If it were a color match issue, I'd expect them to freeze at different points, but they all seem to freeze between 50k and 70k pixels. Wondering if this is a fault in the Scratch color sensing block?
SOLVED: Found the issue in the "press space" code block. I forgot to have it stop if the costume number >1. As far as I can tell, the problem seems to have been that when I "borrowed" the code for the "When I receive Scan Pass" block, I forgot to put it back into the original place where it was from. I never checked that code again because I was sure the problem was somewhere in my color values lists. Like a fool.
So what happened is that the scanner started its scan, and then the mask clone broadcast another scan pass. This caused it to switch its ghost value to the next value on the list. The main sprite is already in the middle of doing its scan, so the "broadcast and wait" block skips past it and goes on to the next step, which is to broadcast "scan complete."
Broadcasting "scan complete" causes the mask sprite to hide itself. . . and suddenly in the middle of its initial scan, the scanner sprite finds the black mask gone and runs into the full array of colors, which causes it to freeze up looking for a color that isn't on its list.
Initially, I'd thought that something weird was up with the color sensing block or my mask. Maybe I'd used a color slightly off black or something. I tried fixing this by temporarily changing my initial pass code to run the full "get color" code if it hit the end of the list. . . but then I noticed it was running the full get color code every time after about a quarter-second. When I tried rendering, the first fifth of the image was four-color as expected, then suddenly switched to full color.
This told me that something was turning off my full-screen black mask after about a tenth of a second. I tried a few things, like adding a "Am Clone" variable and switching up the order of my code, but it didn't work. Finally, I went back to the start of the video and went step by step comparing my code to griff's, and found the problem at about 18:00 into the tutorial.
I spent a moment facepalming, fixed the code, and it worked perfectly.
Did you make it so that if it doesn’t scan for initial colours it will be able to select from a wider selection of colours if needed?
@@RandomDrawinglol I might try setting it up so that if it reaches the end of the preset colors list and doesn't find the color it's looking for, it records the actual color it is using the slow method. I'm just worried it might cause issues with the later scanning passes.
EDIT: Tried this, and found out that the problem appears to be with the broadcast and wait block. For some reason, the code is jumping ahead to "broadcast scan complete and wait" after a split second instead of waiting for the entire scan to finish.
EDIT: Found the problem. Feel like a fool. Forgot to stop the script if it's a clone.
griffpatch is GENIUS
I love how you can take something simple like scratch, and make it complicated
8:28 I think that the variable's name should be Render index, since it's rendering and not scanning. However, this video worked well for me and i recommend to watch the entire video. Good job!
🤓?
@@Idiot354 😫
Woah griffpatch face reveal??!
That was an extraordinary video. I loved how you explain things and actually edit them instead of using a powerpoint presentation.
How would you make a red square change color using the COLOR and BRIGHTNESS blocks with this?
You'd need some cunning maths in think
But no name review.
In his older (like 4 years old) videos there was a face camera
@@ant2902 I was just about to comment that
Maybe... if an rgb-to-hsl converter exists, that would make it a whole lot easier.
This was the first ever scratch video I’ve seen!
You're an absolute madman!
I thought a little more about it. Theoretically, we can get ~0.117 fps 480x360 streaming!
*Streaming on Scratch, Carl!*
Edited: (LONG TEXT WARN)
I know the fps will actually be less than 0.117, but we can reduce the resolution:
if you scan every 2nd pixel and row, the image will be compressed 4 times (resolution 240x180), increasing fps to 0.468;
if you scan every 3rd pixel and row, the image will be compressed 9 times (resolution 160x120), increasing fps to 1.053;
if you scan every 4th pixel and row, the image will be compressed 16 times (resolution 160x90), fps will grow to 1.87.
if you scan every 5th pixel and row, the compression will be 25 times (resolution 96x72), fps will increase to 2.92;
if you scan every 6th pixel and row, the compression will be 36 times (resolution 80x60), fps will grow up to 4.2!
And so on, and so on.
then you could have video chats on scratch lol
We could've actually did that but scrath would say every curse word against us and ban us lol
But we could make a fully working whatsapp in scratch now.Just package it in tbw and put [wait (0.1) seconds] every time you edit cloud variables
That's clever. Nice application of the binary search, @geotale!
I haven't peeked into your blue line filter yet, but I suspect for uses like this you really only have to do a single line scan at a time, rather than a full image scan, correct? And the 8 second wait (in total) isn't problematic because you're scanning it in realtime with the user.
On to texture mapping!
Yeah - you are quite right :D - The only trick is getting the 5 colours passes to be done in one screen refresh :)
@@griffpatch ah, right! The details...
I'm obviously excited to see the texture mapping, but it should be fun to see what else scratchers come up with to use this, too.
this is so cool, also my friends at school love your time warp project
Thanks for the tutorial!
Griffpatch always makes the impossible possible !!!
This is great. Thank you much for this awesome tutorial!
This video will be the start of cameras in Scratch
I feel like you’ve literally read my mind! Because I was actually working on an multi sequence image scanner on solo for a good bit, I always wanted to know if it were possible to do it in color. And now, I have this, big thanks for this tutorial.
Awesome! you are the best! 😀
I would love to see a tutorial on how to create tile scrolling game with procedural generation.
I've always wanted to make my own tile scrolling game similar to paper minecraft, i tried
to do this multiple times, but each time i eventually gave up :(
I have got a procedurally generated tutorial planned at some point! So we should get there :D
@@griffpatch cool!
I made a procedualy generating game with the tile scroller before but i eventually gave up because it was to difficult
"Scary!!!"
As someone who has been to such places as the Googology Wiki and Two Minute Papers, this is fine (-_-)
And, man, I can only imagine some people using the camera scanning programs for dangerous purposes like shoving scanned camera photos into cloud variables...gosh, the Scratch Team's gotta make a rule about that, right? You could see some pretty nasty things if a stranger wanted to. Honestly, I'm pretty shocked about how few predators and trolls there actually are in Scratch. More internet communities need to be like it
Very clever! Now if only we could just get the position pixel colour directly or check for colour touching with different degrees of precision with native Scratch blocks...
ikr
Definitely your best video yet! It’s crazy how it can go that fast!
Wow. That’s really impressive!
Hey Griffpatch, i was wondering if you could ever consider making a A* pathfinding tutorial for Scratch. Now i know that you already have a pathfinding tutorial, and i did it, but you see. It isn't very optimized, and tracking a moving target is impossible. I would really appreciate it if you could at least consider, thanks! :)
i believe this tutorial works well
ua-cam.com/video/K1GwbqpAfLQ/v-deo.html
YEEEEEEEEEEES
This is really cool! You are the best scratcher!
Woah! This is so cool!
You can also use (X+(Y*480)) for the index
Very true! and super important to have that trick up your sleeve :) But only use it when you need to, right now to save precious computer cycles, we just change idx by 1 each time around
I’m afraid scratch might try to block this as it would allow for scratch project to take picture of people without consent. How are you going to deal with this?
I think we will have to wait and see. The upside is that you really can't store a lot of data in the cloud variables... so the primary limit of why we can't do this is still there.
But couldn’t some store it in cloud lists? Or is there a max charter limit on cloud variables?
This is Absolutely GENIOUS! HOLY CRAP
Im waiting this part very long, but finally you do that. Congrats:)
mans got 2 million messages lmao
11:29: 1263 seconds... I couldn't take it...
Griffpatch, how did you make it through 21 minutes?.. OMG. Respect. 🤩🤩🤩
46:42: loooooooonger griffpatch. 🤣🤣🤣
Finally, ive been waiting
The cleverness of that darkening trick is astounding! You would need to know a lot about how colors work: like I had no idea that "darkening" a color fuzzed it, and "lightening" unfuzzed it so to speak. I wonder if you could do it in reverse? Like instead whiten the screen first and then darken it to reduce the color searches? Anyways: great tutorial on showing us how this works.
I studied this programme in school and thought it was a programme that died long ago and our school uses it only bc its free or something but I can see that some ppl actually use it nice
👌
👍
You are great !!!!
My Wi-Fi won’t let me send this comment this is like the 7th Time today First I'll probably upgrade my screenshot engine I honestly thought you would have made us take a long scan and just edit the list for the walls, I never thought of using shaded images to speed images up! Good job surprising me! ;-)
Later I'll probably use it for shaders and mirrors, maybe really upgrade the screenshot engine a lot. Adding filters and things, one thing I'm definitely going to use this for is my powerpoint engine that I've been using for cool presentations at School, and I need my senior presentation to be the best I can do. Thanks griffpatch
This is crazy. I didn't think the color picker would be possible, let alone wntire screen scanning at this speed
No matter how many years I've been playing Scratch, I still can't seem to beat this genius Scratcher. Hats off to him.
Why you want to beat him?
Join him.
@@kittinanpakboon8129 Oh, it's true, I'm using deepl translations, but the intent of the comment is radical. Sorry, sorry, I'm not trying to take him down.
@@kittinanpakboon8129 ...No wait a minute, I wrote "hats off to him" at the end of my sentence. On the contrary, I want to ask you, do you think that I am writing an anti-comment against Mr. griffpatch or something? If you think so, let me clarify. The answer is NO.
this is so cool omg
Thanks very much griffpatch.
You are a amazing scratcher.
I am on Mobil and your joystick helped soooo much. 😊
Great to hear!
Wow i did not expect you to actually see this!
Wow! Amazing!
WOW this is AMAZING
ANOTHER AWESOME VIDEO!
Image scanner in scratch you said?
Yippee!
INCREDIBLE!
Yay!!! Griffpatch uploaded
yay griffpatch, been waiting for a ultra fast image scanner!! thanks a lot!!!
When I saw this, it was something like showing gunpowder to human, who just discovered fire. This is just awesome.
Thanks for your amazing tutorial, again, griffpatch! I'm ur BIG FAN!
The fact you're awake at 3:00 astonished me
The king is back
I decided to pause near the start and do it myself; I checked the video again to see how I did it differently, but I did it the same way! Even down to the variable names.
amazing video, continue with a good job!
this is fascinating to watch
You are so talented!