Favorite Musician Gif (Tutorial)

Before we begin, choose the GIF application you are most comfortable with. Photoshop is recommended, but for those who are not familiar with making animated gifs, I will guide you through with the simplest method. Next, think about who your favorite musician is, and then find your favorite video of theirs that is on Youtube (Best quality, HD if possible). And now we begin.

Step One

Screen shot 2014-10-25 at 3.13.46 PM

Once you have found your video, type gif in front of the url link exactly how it is in the screenshot above. Hit enter, and it will automatically take you to the Youtube GIF creator page.

Step Two 

Screen shot 2014-10-25 at 3.15.58 PM

You will now configure your GIF, selecting a portion of the video you want to use. Then drag the slider to adjust the length you would like your GIF to be (I usually keep mine under 5 seconds). Once you have adjusted both sliders, the screen will then playback the GIF over and over according to the settings you have chosen. If you are not satisfied with the outcome, keep playing with the sliders to your liking, and then click on the green box below to “CREATE GIF”.

Step Three

Screen shot 2014-10-25 at 3.16.39 PM

You will then receive the url for your animated GIF and options to share on different social media platforms. In this case, we want to upload it to our WordPress blog. There are a few extra steps to achieve this, so pay close attention. Click on the Switch to GIF button and then right click to save image.

Step Four

Screen shot 2014-10-25 at 3.24.52 PM

Login to your WordPress account and generate a new post. Click on “Add Media” and upload the gif image you have just downloaded. Finally, click “Insert into post”. You will notice the GIF won’t play in the post, but don’t fear, we will solve this with ease. Right click the GIF in your post and copy the url now that it is hosted on your blog. Now delete the image in your post.

Step Five

Screen shot 2014-10-25 at 3.32.11 PM

Click on the “Add Media” tab again, but this time you want to use the “Insert From URL” option. Insert into post, and BOOM, Done Deal!

Screen shot 2014-10-25 at 3.32.25 PM

And here is the final result once you click the Publish button on your blog. You have now created and added an Animated GIF to your blog. Congratulations!

 

GIF the Portrait for Points!

Welcome to the GIF the Portrait Project! CT101 students, so by now you love to make GIFs!! Well, then why not join in this fun collaborative project and rack up some digital storytelling points! First, check out the project itself … Continue reading

Brewing Passion Ice Tea

Brewing Passion Ice Tea

I did the visual assignment “Photo It Like Peanut Butter,” which is worth 3 stars. To do this assignment, I checked out a DSLR camera from DTLT (just to experiment with) and I set it to “continuous shot” mode that way I would be able to kind of recreate the process the process of getting video frames. I held it down after I poured the hot water in the glass, and captured 16 images of the tea brewing. Next, I imported those images into Photoshop as a “stack,” meaning they imported in as layers. Then I clicked the drop down menu above the Timeline in Photoshop to make all of my layers frames in the Timeline. Next, I selected all of my 16 frames and cropped down the image of the glass to focus in on the tea bag and on the brewing tea swirls. After that, I resized the image width from around 3,000 pixels to 800 pixels. Then, I adjusted the delay speed of all of the frames to 0.1 seconds. Finally, I “saved to web” and saved my project as a GIF.

I really need to get a tripod to put cameras on…that would have definitely made the photo shoot easier and it would have made the gif sequence smoother. It’s also weird to make a GIF from pictures only instead of a video, mostly because in my limited GIFfing experience I’ve only used videos to convert into GIFs. Nevertheless, I am happy with the way it turned out. I really wanted to depict the subtle movement within tea brewing and I think I accomplished that.

twitterredditpinterestlinkedinmail

“Now You’re in the Game.”

For the GIF assignment, I summarized Season 1, Episode 10: The Cost of The WireI picked five scenes that had what I felt were either crucial moments, and/or crucial lines. The actual GIF making process was definitely more difficult than I had thought it would be, but that is because I chose to make it more difficult for myself. I was not satisfied with MPEG Streamclip and GIMP after making one GIF, so I decided to head over the library to work some Adobe Creative Suite magic. Turns out I may know how to do the photoshop part of the GIF making, but I didn’t know how to do the video editing. I vaguely remembered how I was taught using Adobe Premiere, so I asked for some help, watched some Youtube tutorials, and of course googled as much as I could. Nevertheless, I finally figured out how to trim the video, add text, export it, and then open it up as layers in Photoshop to save it as a GIF.

However, just when I thought everything would be okay, the software did not cooperate at first. My first GIF ended up saving too slow despite the preview appearing to be at normal speed. My second GIF ended up saving too fast despite the preview appearing to be at normal speed. So as you can imagine, at this point I was very confused, but not completely defeated. I continued on, and just like in Goldilocks and the Three Bears, my third GIF was just right! :D (And the ones after that too.)

So although I spent nearly three hours on the library Mac desktop, I managed to make all of the GIFs that I felt summarized The Cost. Below are my five GIFs. (I didn’t really need 6.) Enjoy!

 

You wanted to be in the game. Now you're in the game.Stay free.

McNulty is trying to see if Kima is alive.

twitterredditpinterestlinkedinmail

Dancing Jim All Over The World

I did this assignment for a number of reasons, but mostly because only one other person has done it and it’s one-star, so it’s unlikely anyone else will. I thought it might be fun to up the game a little. Earlier this semester Jim riffed an assignment by Brian Bennett, here, where he took Brian Bennett’s version of this assignment and expanded it into a gif enclosed in an old ad. So, he made a Visual Assignment into an AnimatedGIFAssignment.

Well I took Jim’s Assignment and riffed it, don’t worry I have screenshots for a tutorial later, I added another layer and a whole separate process for combining the layers so that you can have Jim dancing in poor Norma’s mouth as she lets out one final scream in agony.

First of all, if you want to do this one you’re going to need to grab the .gif of Jim dancing a fool from this assignment. You should know how to make a .gif and what a .gif is at an image file level, this tutorial will help you understand that if you don’t already. You will need Brian Bennett’s .xcf of the TV with the transparent screen, found here.  Here’s a link to Norma’s mouth, should you ever need that for anything else. And finally you should read Jim’s method of using a gif behind another layer of image, link here, specifically the section about duplicating image layer that will sit on top of the .gif.  I know that’s a lot of information, but it’s easier to understand if you’ve read that stuff, because I would just be copy-and-pasting their instructions anyway and this way you can see multiple assignments.

So, my method is a lot like Jim’s. Except I add another layer underneath the dancing Jim Groom. Thus there are three main sets of layers that need to be created. Two of the sets are the same across every frame and one of the changes, fortunately you only need to pull the image of Jim Groom into the frame (much easier).

You will need to ‘Merge Visible Layers’. This is done from the layers window in GIMP. Also, we’re using GIMP. Should’ve said that earlier. First you get your layer on the same workspace. Then create a duplicate layer for every gif layer in both the front and back image sets. So, if your .gif image set is 12 images, then you should have 12 front images and 12 back images.

Now we layer, just like Jim shows us in his walkthrough. After you have arranged them correctly, click all the eyes so that no frames except those you want to marge are visable, like this:

Now click Merge Visible Layers, this will prompt a pop-up window, which may be hidden by the multiple windowed GIMP software, so look for it. It should look like this:

Make sure you click ‘clipped to image’ or it may rearrange the layers. Click okay and you should have a single layer in place of the previously visible three layers:

And then you will have the final product:

One Star? I feel like this was more than one star’s worth of work…

Pressing the Panic Button

twilight-zone-panic-button

It’s the end of the school year, end of term work is piling up on your desk and inbox,  it makes more sense to count the remainder of the instructional time you have with students in hours rather than days, and you feel like if a panic button magically appeared on your desk, you’d smash it without a moment of hesitation. That’s sort of where I am right now. I’ve been failing miserably in keeping up with the DS106 assignments for this past week (I managed a lowly 2 animated GIFS), the end of year PD for technology is falling apart, and I’m chasing the loose ends of all the conferences I’m attending his summer like a neophyte teacher with eyes wide.

That’s not to say I’m not enjoying the experience! But after watching the pilot episode of the Twilight Zone, I’m desperately seeking a panic button for a few hours of escape. Titled under the misnomer of “Where is Everybody?“, the fledgling episode of Rod Serling’s seminal program about the paranormal explores the depths of human sanity with the deprivation of all contact with other beings (sorry, no spoiler alerts for a 60+ year old television program). The premise starts simply enough; a man with no recollection of who he is, or where he came from, awakens to find the world completely devoid of other beings. Tea kettles are left boiling on stoves, jukeboxes playing, and automated recordings are all that’s to be heard when dialing the operator. As the main character attempts to pass off his uncanny solitude with jokes and monologues delivered to himself in the mirror, it becomes painfully obvious that someone, or something is watching his every move. The feeling of being under careful watch, something that all teachers in Michigan can most likely identify with these days, becomes apparent, and before long, our protaganist is reduced to a sobbing heap of a man, finding a crosswalk signal, and desperately mashing the button as though it were some sort of “panic button” capable of ending his torment. It’s a fantastic story, and worth watching if you haven’t experienced the joys of the Twilight Zone. Provided Hulu is still allowing embedded video, you can watch it below.

I’m glad that I’ve jumped into this abbreviated term of DS106. It’s a great release for the stress that builds up at the end of the school year (my own personal “panic button” if you will), and it’s a great chance to explore and mine a lot of really great vintage media from the Twilight Zone; the theme of DS106 this go around is the DS106 Zone, a riff on black and white series of yesteryear. If you haven’t ever watched the original Twilight Zone episodes, or if it’s just been a nice long time since you caught them on TV, slide over to Hulu and watch a few episodes! I had anticipated watching a few minutes in order to produce the animated GIF at the top of this article for the Twilight Zone animated GIF assignment, but I ended up watching nearly an hour of terrific classic sci-fi and paranormal story telling, a great release for any teacher at the end of the school year, when some of the stress and duties put upon us feels as though some omnipotent being is orchestrating the very demise of our sanity.

I Dont Like These Noises in my Head

Invaders Gif

friendly b&w animated GIFs From The Twilight Zone and Beyond?  Try to capture all of the really nice childhood moments! You know the really, really best and funnest parts!

The Invaders Gif assignment was the only mandatory assignment for this week. I chose the seen when Agnes Moorhead begins to hear things. Her facial expressions in this scene depict the pain of being invaded by some external source, as if the invasion of her home was truly an invasion of her and her body. I wanted to depict this because of the universal discomfort her face expresses. Her feelings are something that everyone has felt, be it a physical invasion or even a mental invasion, the pain still exists.

This was probably one of the most difficult assignment that i have completed already for this class. Even though i followed the tutorials because of the size of my file it would not upload directly to wordpress, and would incorrectly upload to flickr. Instead i used  an outside source, minus, that allowed me to upload a 4.8 mb gif. From this site i was able to embed my gif into my post.

In order to make my gif however, i downloaded the Invaders video and imported it into MPEG Streamclip, from there i selected the start point of my gif using the “I” key and then the endpoint using the “O” key. I trimmed the video in order to see exactly what parts of the episode i had selected and trimmed further as necessary. I then saved the file as set of images, then had them imported into GIMP as layers of images. Because the images imported at 854×480 i needed to rescale the layers of images to 640×360. Once finished and the clip was played back i exported it as a gif file and then saved it as well.

I Dont Like These Noises in my Head

Invaders Gif

friendly b&w animated GIFs From The Twilight Zone and Beyond?  Try to capture all of the really nice childhood moments! You know the really, really best and funnest parts!

The Invaders Gif assignment was the only mandatory assignment for this week. I chose the seen when Agnes Moorhead begins to hear things. Her facial expressions in this scene depict the pain of being invaded by some external source, as if the invasion of her home was truly an invasion of her and her body. I wanted to depict this because of the universal discomfort her face expresses. Her feelings are something that everyone has felt, be it a physical invasion or even a mental invasion, the pain still exists.

This was probably one of the most difficult assignment that i have completed already for this class. Even though i followed the tutorials because of the size of my file it would not upload directly to wordpress, and would incorrectly upload to flickr. Instead i used  an outside source, minus, that allowed me to upload a 4.8 mb gif. From this site i was able to embed my gif into my post.

In order to make my gif however, i downloaded the Invaders video and imported it into MPEG Streamclip, from there i selected the start point of my gif using the “I” key and then the endpoint using the “O” key. I trimmed the video in order to see exactly what parts of the episode i had selected and trimmed further as necessary. I then saved the file as set of images, then had them imported into GIMP as layers of images. Because the images imported at 854×480 i needed to rescale the layers of images to 640×360. Once finished and the clip was played back i exported it as a gif file and then saved it as well.

Brain Dead

This is my first gif. The wiggle stereoscopy! It took me a couple of tries, I eventually got it. It seemed like forever. I felt bad using something from inside again, but it was 6am and I had nothing else better to do before my chem lab. My love of coffee mixed with  with my enjoyment of critical thinking game. I thought it was also fitting given what was on the mug itself. I’m really happy with this one! Photography is my strength so I’m excited to something different with it. I’m normally just a good standard composition kind of guy. I need to open the door to other possibilities with editing.  Definitely the most fun visual three star this week.

 

Sadly the mug is empty.

Enjoy the Garden, but Mind the Mushrooms

dancing-mushrooms

For regular readers of my blog, you may have already guessed that the dancing mushrooms above can only mean one thing….I’m about to succumb to another intensive 5 weeks of DS106, the best digital storytelling course in this universe, although I’m told it will soon be available in many of the other multiverses. For those that many be unfamiliar with DS106, or have only recently stumbled across my musings here on the web, pull up a seat for the next few weeks, as this simple GIF is just the first small speed bump on the road to the digital storytelling dimension known as the DS106Zone!