I made my profile picture get Thanos snapped... and you can do it too!

This post was born when I remembered that I, once upon a time, intended to make a series of photo editing "tutorials". The only one I ever made used Google Drawings and may have been semi-impressive considering that at that age we were learning how to use spreadsheets in Computers class, but nowadays seeing as I can be outclassed in literally anything by someone my age out there, that's not very "big brain", if you catch my drift. And what I'm going to be showing you how to do today, seeing as I made it entirely with free browser-based tools available on the web, intentionally isn't. I don't currently have the tools or skills (beyond Adobe Photoshop Elements, which I have already used for this) to really do it in a more complicated manner, or without a small barely-noticeable watermark on the bottom right corner if you want to make it a transparent-background GIF, so you'll have to bear with me. 

Anyone can easily do this! This is especially great for those who don't want to spend too much time on a simple meme or image or have to pay for any software. People like me. I was able to figure out how to make my profile picture suffer the consequences of Thano's snap from Infinity War in under an hour or two, but this tutorial can be done in probably 15-30 minutes since you won't have to be searching for tools. I used the Google Chrome browser on a Windows 10 laptop, but I bet that the sites and tools I used probably could work on any other non-mobile device or browser, including a Chromebook. Step-by-step, here we go! 

You will be able to take any image and turn it into an animated GIF (with a transparent background, if you so choose) of it getting Thanos-snapped like you see above that can be used as an animated profile picture with Discord Nitro, as an example. 

Step 1: Have your image ready as a URL. 

For instance, this is my image's URL: https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOIQhypfzmgWH26DcqdUwRDR8EYWfXVEDKZajQIEdqeKfAw15w4CkQMISXA-0fKVZP4RCScXmsNdCvuYSOXBv6cM24J0HAhEw4Ifiw53kMSwzxqNyVct-bnCiNA1xZLkk8oDgee8ozWEaI/ If you want to make your image into a URL, it's as easy as just posting it somewhere, like IMGUR or even social media, and then right-clicking on the image and selecting "copy image link/address". The way I got my image URL was by creating a Blogger "page" (an unlisted post) and then copying the image URL after viewing the page. 

Step 2: Thanos Snap Time!

Take that image URL and go on over to this link: https://codepen.io/frankieali4/pen/oOrLRY/ This is the CodePen page. (CodePen is a site where you can share snippets of code with previews. It's very cool.) By going into the "HTML" tab (you can actually view it, but not view it, with the iFrame embedded preview I placed above. No, that's not just an image. You can interact with it), you can replace this part's default URL of an Iron Man image: 

<img src="https://s3.us-east-2.amazonaws.com/codepen-frali/ironman.png" height="479">

...with the URL of your own (replace the part that's highlighted blue and underlined). The preview should then update to show your own image. Then, click the "close controls" button that's in the upper right corner of the preview to get rid of the controls so that they don't appear during the next step. You can adjust little details here if you want, including the disintegration duration. You can test it out by clicking the "Snap!" button that the creator of the code snippet put in the program. Clicking the button again will make the image reappear.  

Step 3: Record your screen. 

If you don't already have a screen recording tool, a decent free one is Screencastify. It's a Google Chrome extension, but free screen recording software does exist in other browsers. Do research before downloading a sketchy one, however. If you're on Mac (this is important!) don't even bother downloading something! There's a built in, simple way to record video of your screen, and you can even crop to a portion of the screen (just your image), too! You can learn how in this article: https://support.apple.com/en-us/HT208721 That also saves time for the next step, which is only really necessary if you're not on Mac. 

Step 4: Crop the footage to just your image. 

Again, this part isn't necessary if you're on Mac, but otherwise, I do know that Screencastify has a built-in way (if you have created your account recently and are by default a premium member; otherwise just use a different Google account and you'll be fine) to use its video editor once you're done recording footage to crop the footage's image as well as duration. Then...

Step 5: Download footage as MP4. 

This part is pretty self-explanatory. Screencastify lets you download as an MP4 as an option that you see as soon as you finish your recording. I'm sure Mac has a way to do this as well if you read that quick support article I linked to earlier. 

Step 6: Use GIPHY to convert the MP4 to a GIF. 

Go here: https://giphy.com/upload. Drag and drop the file or click to upload the file that's the MP4 video that you just downloaded of your profile picture suddenly not feeling so good, Mr. Stark.  Then, once you upload the GIF, you can right-click on it to save it as a GIF. 

Step 7 (optional): Make the background of the GIF transparent!

You can then, if you wish to have a transparent (although not perfect, and somewhat funky) background version of the GIF that looks more like it's teleporting through one of Thanos's portals and with a slightly-visible watermark, then you can go here: https://www.unscreen.com/. Then, click "upload clip" and select your previous GIF file. Then, it will automatically attempt to remove the background. It does a semi-decent job of it, overall, and I'd say it's mostly good enough to be used as a Discord Nitro animated profile picture, for instance. The watermark won't be a problem since it won't be visible with how small the profile picture is, and the white extra blur left behind I find to be bearable and worth it to get a transparent background. It kind of looks cool in its own way, in my opinion. Again, though, this step is completely optional and it's up to you if you think it's worth it or not. 

...And, that's it for this tutorial! You now have successfully Thanos snapped your profile picture, congratulations. I tried to make this tutorial as simple and easy-to-understand as possible, but if you have any questions or run into any issues, feel free to reach out to me through the comments section. Enjoy! :) 

Please check out my younger brother, Onur's, latest blog post! It's his first post in three months, and it's comedic gold and very fun to read, as usual: https://omegaonix.blogspot.com/2020/07/what-happened-to-operation-nose-in.html

Also be sure to check out my previous post: http://www.arcabaran.com/2020/07/nintendo-president-apologizes-drift.html

Subscribe to my YouTube channel for upcoming vacation vlogs from old footage: https://www.youtube.com/channel/UCwRZe3oXRb7ybJthjNfoz5w

This is Arca, signing off for now. See you for my next daily summer post, coming tomorrow (probably something Fourth of July-themed). Stay safe, everyone!