Stay still… BUT MOVE !

How coooooool.  Once again.  I can take my favorite still media and animate it to make it move smooth.

This BMW M3 is one of my favorite cars.  One day I’ll get one, but for now I will have fun editing with the free pictures online. I love how the effects made the image come to life. 

Welcome to the beautiful beaches of the Dominican Republic.  The refreshing and swifts winds of the ocean make things go the way they want.  This palm tree is leaning in to take a closer look at the warm water.  I decided to do a light to dark piece for this one.  Just as fast as this image changes filters is just as fast as the time seems to go by when you’re on vacation.

I owe myself a trip very soon!

 

Freedom in assignments?

How is this so possible?

The way things are looking in the class so far gears me up to learn some new computer skills that I can use forever.

Photoshop!  Something I have always wanted to learn since I first heard about it many years ago.  I mean, have you seen some of these images that have been manipulated to perfection?   I personally always liked the face swapping aspect of it.  they are so hilarious!

Photoshop I’m sure has lots of other purposes which would be cool to figure out how to use all of them.  I tried browsing the suggested Photoshop Battles site, but I wasn’t able to find easily distinguished Photoshop projects.  When I saw the title as Photoshop Battles, I expected to click into an array of swapped and exchanged photos with people showing off their skills.  Either way, Google is a great thing that exists.  I can easily search for some wicked projects people have done, and soon, I can even have my own nutty stuff on there.

If I practice one skill every class, I believe I can learn Photoshop quite well.  This can be like my secret weapon in my storytelling.  I can really express myself in ways that maybe I can only understand.  It is a great skill, because in this world of technology, we need to have a skill set that makes us stand out.

I learned how to create my own GIFs from YouTube videos and I am still pumped about that.  Also, if I just felt like browsing through GIFs I could use these cool sites that I was introduced to this semester called imagur and giphy.  The internet truly has the most resources in the world to learn to do almost anything you want.

A cool project for me would be combining the two into a Photoshop face swap GIF, like this one LOL.

Similar to a Photoshop GIF, have you ever seen those Photoshop videos?  The creators put faces of athletes and other people on videos of people dancing.  These things look pretty fake, but at the right time with the right scene, they are funny.  My classmate loves those things.  She has always known how to make GIFs and would like to learn video editing.  All I’m really doing now is learning some skills to make some funny pics, GIFs, and videos hopefully.

I’m looking forward to class tomorrow, I think we will learn how to use Photoshop.  Finally !

My Favorite Imagery

A few GIFs I made of one of my favorite YouTubers, Connor Franta. The GIFs come from the trailer he made for his newest book, Note To Self. The tutorial for this assignment was very easy to follow. It took one or two tries to get Imgur to work, but once I figured it out, the gifs were quite easy to make. It’s easy to see how people make so many, it’s so fun and quick!

View post on imgur.com

View post on imgur.com

View post on imgur.com

View post on imgur.com

The original video can be found here: Note To Self | Trailer

A “How To” Net Art & GIF Making Tutorial.

A “How To” Net Art & GIF Making Tutorial.

GIVE IT TRY! This is a fun exercise to add to your NEW WEBSITES!

Lets use a NYPL Digital Collections Archive Image.

Its no secret, you can find tons and tons of great historical images in the NYPL Digital Collections Archives. I made this series of GIF animations based on the inspiration from this old subway train image below. I love trains, especially NYC subway trains. Im a bit bias as NYC subway Graffiti has inspired me from the get go, but here is the “how-to” process below on how I made this series of animations and net art works.

subway car

The original image. I found it, I liked it, I was inspired and got to work. (tons of images here) I saved the image from the web. Don’t fret, you wont get sued like Andy Baio did! I don’t plan to do anything with this image other than inspire creativity and show you how we can breathe new creative life into our history. Let’s revive this image and bring it to life! The NYPL has done a great job of digitizing tons and tons of historical images. I feel a connection to NYC. My family is from NYC, Im from NYC, this is a part of me and I love that energy. I first opened the image in adobe photoshop and got busy.

trainII

Using the rectangular marquee tool I simply removed the interior spaces from the windows of the train, making it transparent negative space. I then saved the image as a psd. file (for archival and re-use purposes) but mainly I saved the image as a PNG-24 – (file –> save for web – select – PNG-24) the PNG-24 image option allows for the negative areas to remain open so that if you layer the image over another image or animation you will be able to see through it. I do this on a regular basis with images that I like, I love to work on repurposing static images with an animation. Its a nice way to connect the past and the present.

tips

I went back to the web and logged into my to.be account (its a digital art making platform, I also love newhive and jump back and forth testing how far I can stretch my ideas on both platforms – both are free, and really awesome!) I started a new “field” on my to.be platform. I added two layers. (sadly, uploaded files on to.be must be 5 mega bytes or smaller, where newhive seems to allow unlimited sizes) no matter, getting comfortable with preparing and resizing images for the web is a task we will all face, a lot! Best to get used to that, and learn how to navigate it. The back round which you see above as a static pixelated image is actually an animated GIF of moving pixels (below.) This is an asset that i made a few weeks ago. I keep a stock of this kind of stuff, just for this purpose.

fast-pixels

The to.be platform allows for you to drag your graphic assets directly into the field, so I did this first and then layered the prepared image of the old train directly on top. I scaled it to size by pulling the corners. I then used the quicktime application on my mac to “screen record” a few second of the animation. Of course you can publish the work directly onto your to.be feed (or keep it private) but in this case I used it as a “tool” for the screen capture. I later published another version of this animation (below.) Ultimately you can do all of this stuff in one application like photoshop, but I find it much more fun to cross discipline and tinker with multiple software applications and techniques on the web. This is where one can create their own methods, record them, share them and build off of them! I saved my quicktime screen recording and imported it into photoshop. Use the “import –> video frames to layers” option from the file menu and then open your timeline. From there you can crop away the rest of the screen (as you see below) and also resize the animation at will. Im not going mislead you, quicktime will screen record a large file, and it will need to be tinkered with for the best output of display. Output can be in GIF format, or you can also render the frame animation back into an mp4 video file. This is helpful if you want to loop the animation on mobile platforms like Instagram or Vine, or bring it into after effects or imovie, or final cut pro.

oldertrainsII

Above we see the first output iteration as a GIF animation, a colorful pixel party happening only “inside” of the train. Will you get in? I enjoyed this as an idea so much I had to extend it. I thought, what if one of the party goers inside the train stepped outside for a minute, what would that look like? More fun for sure. I placed this animated digital asset (below) on top of the existing animation by layering over it again. I also utilized the entire width of my screen field to extend the viewers perspective.

bboy-vecotr-asset

This digital asset above is a two frame GIF animation that was made with a transparent back round. It was originally a vector image created from this drawing. I love seeing how far I can push ideas, and also convert the applied arts in digital arts.

The final final piece above was published on my to.be platform. Rather than reposting the screen recording GIF conversion of the piece I grabbed the iframe source code from to.be and embedded it into this blog editor template. I can resize it by its height or width if needed.

Updated – 10/11/16 – A second variation was created with a static graphic asset laying over the animated back round. This too is taken from the iframe source code on my to.be feed.

(By the Way, writing tutorials is a great way to practice blogging! )

What do you think? Are you ready to make yours?