http://hosted.musesradioplayer.com/mrp.js http://aforgrave.ca/detritus/audiojs/audio.min.js

Tag Archives: animatedGIF

Flex Your Creative Muscles with the Daily Create Summer 2017 T-Shirt

“The new Daily Create Summer 2017 T-Shirt,” design and GIF by @aforgrave

It’s hard to believe that it’s been three years since The Daily Create – Summer 2014 T-Shirt, but time flies when you’re having fun!

In response to Alan Levine’s (@cogdog, on Twitter) DS106 June 2017 30-Day Daily Create Challenge, I’m getting my creativity tools all splayed out on my desk in preparation for June, and the summer months beyond.

The Daily Create for today, June 1st, 2017 is #tdc1970, which revisit’s the skinny-kid-on-the-beach comic book ad and provides the prompt, “Charles Atlas, Charles Schmatlas. My Creativity is bigger than your muscles.”  The description continues with “Make this uncreative skinny kid a blossoming portrait of creative prowess! Show us your creative muscle, your photographic bicep, your video burpee (for the love of our eyes, do not take this literally, think metaphorically!)

Rather than re-visiting the old comic directly, I decided to get things in place with a newly updated T-Shirt that community members could wear while flexing their creative muscles (whether on a beach, or simple thinking about one).

The original 2014 shirt was a fun project because it gave me a challenge of selecting some appropriate icons from The Noun Project to use in representing the 5 create types — drawing, audio, photography, writing, and video.  I liked the clean design then, but was conscious that some new create types had emerged over the past three years, and relished the opportunity to source some additional icons for design, remix, and GIF.

The updated set of icons, representing eight different types of Daily Create categories, are presented on the back of the T-shirt, along with the newish URL which changed from tdc.ds106.us to daily.ds106.us on September 3rd, 2015.

T-Shirt BACK graphic, with 8 icons representing 8 Create types, by @aforgrave

I also decided to update the front of the shirt, changing the message from “Keep Calm and Create On” to “Keep Calm and Make Art.”

T-Shirt FRONT graphic, with updated “Keep Calm and Make Art” text, by @aforgrave

I’ve posted the shirt design to The DS106 Zone store on Zazzle, where you can select a shirt fit and colour to suit your own tastes. The white-text is designed to reverse out of a darker coloured shirt, so you can’t have this on white, I’m afraid. Colour is more fun anyway!  There’s a GIF in the sidebar that shows some shirt styles in different colours, with links to guys and gal shirts to get you started. You can swap the shirt style to many different cuts and fits. Go wild! But Make Art!

Attributions

VR Bubbles are Cool!

Ontario artist and educator Colleen Rose (@ColleenKR, on Twitter) shared a unique view of her art classroom this morning, and the image far surpassed what one would usually get with a standard photo.

Created with the iPhone app Bubbli, the fully spherical view of the room immediately had me seeking out the source app on the iOS App store.

bubbli_logo_@2x  bubbli_icon@2x

Hours later, as the afternoon sun streamed through my classroom windows and reminded me of the need to take advantage of available light, I packed up my bags and headed outside. A few minutes later I was standing in the back yard of the school waving my phone around in the air.

The “bubble” image above is the result.  The app, in conjunction with a powerful upstream stitching application, allowed me to easily create the VR bubble within only a couple of minutes.  If you have an accelerometer-supported smart phone, view the image bubble using that, and you will see the image move around you as you tilt and pan your phone. Within a web browser on a computer, use your mouse to view up, down, left, and right.

Prior to making the image shared at the top of this post, I experimented further away from the play equipment, and you can see the results of my first, second, and third attempts on the on.bubb.li  site.  I don’t know that my “painting technique” (their metaphor) improved all that much from first through fourth — the stitching algorithm does a fantastic job of removing the overlaps. If anything, my composition improved as I learned how well the app/server were able to handle objects close to the camera  — something I was initially concerned about having seen previous phone based  “pano” apps distort objects in the foreground.

The built-in getting started tutorials provide a quick and clear introduction to the app and the process, and the interface of the app is so simple to use, I’m going to see tomorrow if a child can do it. I’m sure they will be able to.

bubbli_playground

BONUS: If you email yourself a link to the bubble, you also get a nice little animated GIF thumbnail in your email, and you can suss out the URL if you view the source of the email.
The animated GIF itself is a nice bonus!

Time for another iPhone Photo Project?

The fun in playing with a new iOS camera app today reminds me that it’s been a while since I scoured the iOS app store for new and interesting camera/image apps. In 2011, a number of folks joined me in the April 2011 iPhone Photo Project  iPPP • (archives here), and again the subsequent year for the May 2012 iPhone Photo Project iPPP2 • (archives here). Given that 2013, 2014, and 2015 have passed by unrecognized, I’m thinking that today’s app play will herald in a 2016 re-incarnation, the February 2016 iPhone Photo Project iPPP3.

Who’s in?

I’ll formally announce it with an iPPP3 – Day 2 app tomorrow. Consider Bubbli as the app for use for iPPP3 – Day 1. Start your iPhones!

A Point at Which the Purge Takes a Pause

Andy'sSomewhatLessRoughWebsite

The e-Waste Depot is open today, so I’m going through my storage and finding old tech stuff to dispose of. So far, I’m pushing the pause button for the second time an old hard drive that retains this little blast from the past. This is an old, locally-hosted start page that led off to all the various sites and stuff that I was working on at the time. There’s a larger story to suss out here (how many of the links are still active, for example) that might be of interest to some. For the time being, this hard drive joins another one in the “not quite yet ready for recycling” heap.  Creation date on the page is set as March 21, 2000, last modified February 22, 2003.

The animated GIF is of Johnny Clegg (of Juluka and Savuka fame) — still a fav in my music library.  The creation date on the GIF (its not mine) is December 3, 1998.

And HEY! He’ll be touring my neighbourhood in April 2016.  Still time to get tickets!

Johnny Clegg April 2016

Okay, time to pop up out of this rabbit hole and head to the depot.

BIT15_AnimatedGIFsForFunAndArt

 

In the early wild-west days of the Internet, animated GIFs promised the world to web explorers in the form of flashy-yet-soon-to-be-gaudy under-construction signs. Shunted aside as more refined web design arose, animated GIFs have experienced a resurgence in recent years, and are now accepted as a true Art Form, with annual competitions and juried art shows held around the world.

Participate in a hands-on workshop exploring the potential of the animated GIF, as both a professional tool for illustration and an art form for expression. Learn how to make and optimize GIFs, and explore the finer points of focus, timing, and envisioning so that you can develop your skills as a GIF Artiste. Who knows, you may even acquire a chronic case of GIF-EYE-tis, in which images presents themselves daily as an opportunity for interpretation as an animated GIF …

This workshop will occur as part of the annual conference of the Educational Computing Organization of Ontario (ECOO.org) at the annual BringITtogether.ca conference, held this year November 4th, 5th, 6th in Niagara Falls, Ontario. Details in Lanyrd. You will need to select this workshop as part of your Wednesday registration.  Register here.

A Pretty Penny (Furthering Christina’s GIF)

Christina's original GIF (1.5 MB)

Christina’s original “Number Two as Anvil” GIF (1.5 MB) by @clhendricksbc

Original, Masked, saved with 32 colours, Perceptual (478 K)

Masked, saved with 32 colours, Perceptual index (478 K) by @aforgrave

Making GIFs from scratch can be somewhat of an arcane Science at times. While there can be a good number of strategies to which one can turn to decrease file size, there is always a point at which the Art begins to suffer. While a smaller GIF may be desirable (if only as a challenge — high speed broadband makes the original intent somewhat moot), there is a point at which the reduced dimensions, or reduced colour depth, or the reduced number of frames introduces too much compromise and your GIF starts to look like crap. There is an interesting documentation outlining some of this in Tina’s post “@Tumblr, Meet Me at the Stairs,” where she attempts a number of different approaches to getting her GIF to post on Tumblr.

Having said that, it’s always nice to be able to optimize a GIF and still have it say what you want it to say.

Initial Strategies: Dimensions, Number of Frames, Colours

So when Christina (@clhendricksbc) posted her GIF of Number Two and the Penny Farthing this morning (first image, above), there was an immediate impulse to respond to her attempts at decreasing the file size when she said, ‘So it’s 1.5 MB as is, which isn’t too bad.”

Christina had already made 3 attempts at compromise:

  • she reduced the dimensions of her image to 400 pixels (wide) by 280 pixels high;
  • she reduced the number of frames (sometimes there are duplicates which can be deleted);
  • she adjusted the colour depth/indexing of the GIF.

All of these approaches can be viable options to apply when looking to reduce the size of the GIF.  And each of the three, if taken to the extreme, can take your GIF out of the realm of Art and reduce it too far.

  • make the dimensions too small, and people can’t see the detail;
  • remove too many frames, and you lose the nuances and distinctions that individual frames provide;
  • reduce the colour depth too much, and you get banding, blotches, washouts, and a generally poor quality image.

Another Strategy to Try: Masking

In looking to decrease Christina’s file size from 1.5 MB, there was one as-yet-untried strategy can make all the difference in the world. Note that it does not always result in significant file size reduction — it depends on the nature of the image being animated.

Christina’s Number Two and the Penny Farthing GIF is an ideal candidate for masking, as it features a fairly large area which does not change from frame to frame.

If you study the GIF above you will see that the movement is limited to Number Two’s hands and his face. The significant purple curtain behind and his jacket/sleeve represent an unchanging area, that if only referenced once, makes for a much smaller GIF.

Consider the following:

  1. Imaging keeping a large part of the GIF static.
  2. Poke a hole through the static image where the movement from the other frames needs to show through.
  3. Let the frames cycle behind the mostly static image, so that the only parts that change from frame to frame are the small bits that show through the window.
"Making a Mask" animated GIF by @aforgrave

“Making a Mask” animated GIF by @aforgrave

To accomplish this, you study the frames to identify where you want to retain motion. If you compare the two GIFs at the top, you will see that I have made the decision not to retain the movement of the bicycle saddle — the hands and the face tell a story, the moving seat is not so important.

  1. Select the area you want to isolate —  use a selection tool like the lasso
  2. Use Select>Inverse to select everything BUT what you want to remove.
  3. Use Layer>New Layer via Copy to create a new layer which forms a static foreground and place it at the top of the stack. By default it will be toggled on to display in every frame.

Now save the GIF again, and voila, an instantly reduced file size.

Notes:

  1. If you err on the side of caution (make the initial selection smaller rather than larger) you can always erase bits of your top layer if you need a little bit more motion to show through.
  2. If you make the hole too large, you can always delete that layer and make new common layer to replace it. You are not changing your existing layers, only duplicating part of one to use for all.
  3. If you have varying qualities in the image of the frames from different layers), choosing a really good quality layer to use for your mask suddenly promotes the good quality throughout the whole GIF.
  4. In some situations, you make find it valuable to create a composite mask from two or more layers so that you eliminate distracting movements that are not central to your GIF.
  5. The counterpoint to creating a masking layer is to create a common background, and then animate small portions of your image in front. This also results in a reduced file size.

Try Masks!

Working to understand and make use of masking in your GIFs can really open up a number of possibilities — not only for reducing file sizes, but also for increasing the quality and uniformity of your GIF across the frames. If, in emphasizing part of an image, you eliminate distracting movements in other parts of the image, you are helping to focus the viewers attention –and that can better help to tell your story.

In exploring Christina’s question, I have also started to extend my limited understanding of the options provide by different kinds of indexing. Rather than share that here, I will create a separate post where that can be the focus.

#BeSeeingYou

Daily Create Shirt – 2017

What Is Your Question Today?

#prisoner106 Summer 2015

#noir106 Winter 2015

ECOO 2014 #bit14

#ecoo14 #bit14 Bring IT Together

#wire106 Fall 2014

Bava/Nobody WIRE106 T-Shirt

3D Anaglyphs

3D Glasses_FLAT AnaglyphBADGE GREY fill BLACK

3D Glasses_FLAT Anaglyph-A-GIF BADGE GREY fill BLACK

The Daily Create T-Shirt

#thoughtvectors

ds106 Spring 2014

#ds106 The DS106 Workplace

ds106 Summer 2013

Posts by Date

October 2017
S M T W T F S
« Jul    
1234567
891011121314
15161718192021
22232425262728
293031  

Creative Commons

Visitors to de•tri•tus

105theHive.org


MiniCYHMN? | Status | 64K | Listening Options

Winampwindows Media PlayerReal PlayerQuickTime
Listening to 105theHive - details

ds106rad.io FAQs

What is ds106rad.io?
ds106rad.io is #4life.
Why do you ds106rad.io?
#4life.
Who is ds106rad.io?
ds106rad.io is of The Earth. That's you, brother!

105theHive.org MiniPlayer

MiniCYHMN? | Status | 64K | Listening Options