GIF a Badge – #Burgeron106

The summer of 2015 brings several groups in #ds106 coming together to make art.

Two of the groups are open groups: Prisoner106 and Bugeron106. there is also cross participation between the two groups (Villages).

Prisoner106 has set up as a more structured format after the #ds106 format and a calendar.

Bugeron106  is a revisit of the summer of 2014 and continues the story of the Burgeron Family of Bovine County who are now leading the Bovine County Fairy Tale Festival.

The two villages in addition to cross participation has also created some friendly challenges. Prisoner106 created a badge for blogs and has specific design elements. To meet the challenge, I worked on a badge for those in the Burgeron106 group. And of course since it is #ds106 it had to be GIF.

As the Bovine Fairy Tale Festival started to get off the ground, @RockyLou22 and @NanaLou had created a series of Puffins for the festival. Nanalou also organized the family by providing some focus points thru a Around the World of Workshops for each week of the summer so that members can align more easily in work together.

I decided since these images were an organizing part of the group that I would use them and not introduce new visuals. We are all involved in many things, and asynchronous collaboration can bring about confusion if too many things are circulating at once.

My first attempts were individual pics that would be used in frame animation in photo shop.

I was happy with the concepts and was really glad to have been able to create the puffin animation of it moving through the frame. The result was too spastic and more like a fast slide show than a GIF to me. It had about 60 frames and used frame animation in photoshop. There was futzing and putzing with each image by capturing it, scaling and cropping. The standards are high in the Burgeron106 and ds106  families so sloppy work was not acceptable by the PR department. More work was needed.

I have friend who shares access to her Lynda.com account for help when needed. Looking at Photoshop is overwhelming. So many available  courses and screen casts. They really show how complex PS can be. I hopped around and saw a few things to explore – but my brain was not in a place to go through the tutorials. I opted for some exploration, but maximizing features that I have found already.  I know there must be a way to do what I did, faster, smoother, and with good results.

I spent a day working with the images. The frame animation was a lot of duplicating and minor changes. I also had to do a lot of merging of layers as I added things.

The result was less than satisfactory – but a little better.  A shower and some lunch to clear the head, move the muscles, and fuel up and I went back again. This time I went back to some of the first GIFs I made as part of the open course a few months back. At that @cogdog – Alan Levine was facilitating the You Show in Canada and thru his blog I found a tutorial which used video in PhotoShop. I decided to try video editing to GIF instead of frame animation. This allowed for a smoother transition and motion.

I saved the ground work of the basic images of each section. I went to timeline and created a video. I set a work length so that I stayed within a certain time sequence so that the GIF didn’t become an actual movie in length.

Adding transition, changing opacity and putting in motion. All of this was done with pure abandonment and free will – no logic or system. Lots of do it and try to then undo it. Lots of saving versions to have something to go back to if steps did not work.

Once I thought I was close – I changed the video to frame animation so that I could tweak some parts and to try to cut frames that are not really needed as a GIF to cut back on file size. Doing that worked well – but I lost some layers and changing things after the switch caused more issues to correct – like losing the Holland graphic and key frames that didn’t translate smoothly. It did however get me to pare down even more which was good for design.

I went back to a saved version and this time did more timing within video. This was a little cumbersome at first – but actually made more sense to me than working with the frame animation with such a large number of frames. I was able to get some images resized and placed without losing or chain reactions. I am still not able to explain how – but my mouse hand found the rhythm and pattern to repeat.

This time I went to save for web right from the video. I found by paring down and making sure that layers that were not used deleted instead of just turned off helped make the file smaller. Saving as video did not create a larger file than animation – so it worked.

The last step was getting a font installed so that I had one that I liked more from a design point. I started on my laptop which has different fonts than my desktop. This was a risk as I had a good result and changing the font meant re-establishing a base layer composed of 5 merged layers. I made sure things stayed named the same and that the one layer remained as the foundation. The digital fairies were watching over me – and I got through it without an issue. Once I got those changed and put in – it was a save as for web and done. Whew!

For use by others I saved 4 different sizes and put them in a Google Drive for access.

and….to meet part of my Prisoner106 tasks – the bike is in the GIF to represent the Artists infiltrating the Village. 🙂

I think I will be seeing Dr. M at her tree house soon!

Add a thought or critical friend feedback-

This site uses Akismet to reduce spam. Learn how your comment data is processed.

css.php