1. "Enter through the .gif Shop" - A Museum GIF Art Exhibition!

    In collaboration with the Utah Museum Of Contemporary Art (UMOCA), I am incredibly proud to announce my very first public art exhibition! If you live in the Salt Lake City area, I encourage you to come meet me in person for the opening night of the show, this Friday, September 19th, from 7 to 9PM. Directions and parking information can be found on the UMOCA website. If you can’t make it for the opening night, don’t worry - my content will be up at the museum until October 16th, when I’ll have some other awesome news to share. ;)

    You guys. This is so legit. We can declare our short looping motion graphics GIFs a legitimized artistic movement now. Do you even know what this means? Oh my gosh oh my gosh oh my gosh.

    —————————- Full Press Release below —————————-

    Enter Through the .gif Shop
    UMOCA Presents First in a Six Part Series of low-tech Yet Sophisticated Animations by Salt Lake City’s Own Admiral Potato

    Opening Night: SEP 19 | 7-9 PM

    Exhibition Runs: SEP 19 – OCT 16

    Salt Lake City, UT – The Utah Museum of Contemporary Art (UMOCA) is pleased to represent one of Salt Lake City’s most endearing underground geniuses, Admiral Potato, and a collection of his mesmerizing short animations in the first of a six part series titled .gif Shop.

    Perhaps without being aware, the short digital animation file known as the “.gif” is one of the most shared and looked at forms of visual communication. Many contemporary artists have become aware of the .gifs engaging power and have twisted what was once thought of as an advertising medium into aform of artistic expression.

    UMOCA will drive head-on into one of the most consistently bedeviling questions for the art world today, what is “contemporary art” and how does it relate to pop-culture? For .gif Shop, UMOCA has curated examples of .gifs animations that exemplify the medium as something greater than brief comedy loops. With the combination of traditional color theory, the aesthetics of painting, and the use fractal mathematics to create works, these .gifs not only echo classical art making, they are truly mesmerizing. UMOCA invites you to experience this exhibition and re-discover the .gif.

    September 19, 7-9 PM

    About Admiral Potato

    Admiral is a design scientist, a motion graphic artist, a software developer, and a mentor for youth at the Sorenson Unity Center. Admiral’s work is well known and respected in the local programming circles, and he has collaborated with renowned Utah artists. admiralpotato.tumblr.com

    About The Utah Museum of Contemporary Art

    Founded in 1931, the award-winning Utah Museum of Contemporary Art’s purpose is to give Utah residents and visitors access to international, national, regional, and local art that is relevant to our time. UMOCA offers rotating exhibitions in four gallery spaces, youth and adult education, as well as community outreach, an Artist-in-Residence program, and a variety of public programs to cultivate awareness of concepts found in contemporary art. UMOCA is a 501c3 institution that is supported by public, foundation, and corporate gifts.

    UMOCA has been recognized as Best Museum in the State of Utah for 2011, 2012, 2013, and 2014, and is a four-time recipient of funding from the Andy Warhol Foundation.

    Admission is a $5 Suggested Donation

    ###

     

  2. Sweet Compositing Accident

    Higher Quality Versions here: http://imgur.com/gallery/AVVRr

    These designs were an accidental side-effect that came up in the process of trying to create something completely different, but they were an awesome accident. So I decided to post them as their own set.

    Side note for fellow Blender + AE users - I just learned that yes, you can actually use image data from Blender’s Multi-Layer EXR files in After Effects, but you have to use the “EXtractor” plugin to access that data, which seems to come bundled with AE versions CS6+.

    Here is the link to the video from which I learned the trick, jumping ahead to the point where it became relevant to me.

     

  3. Lazor Tacos!

    High quality version here: http://imgur.com/gallery/t01tOap

    Because you know that you want to eat Lazor Tacos! They clean your teeth while you eat them! Eat these for lazor fresh breath! Freshness you can see from a mile away! Yeah. Okay, actually - I’m sorry that I’ve been silent for so long - this has been an incredibly busy month for me. So I made something quick and silly to help battle the crazy and the radio silence.

    I’ve got an upcoming exhibition featuring my GIFs at the Utah Museum Of Contemporary Art (UMOCA) in Mid-September, where I’ll present 9 new designs that will be hosted exclusively at the gallery for 1 month before I can post them to the intercats. I’ve been working like mad to produce new content for the show. I’ve already got about 15 design ideas that I’m working on so far - I figure that gives me a better selection of which 9 I choose for the gallery, and the leftover designs can be posted directly to here.

    I am facing a tremendous challenge with this task though; Since these are my first gallery pieces, I’m being far too much of a perfectionist and pushing myself unreasonably hard to produce something extra special for this event. Those almost uncontrollable tendencies are really working against me for both stress management and keeping focus against the approaching deadline. I need to remember that some of my favorite and most popular designs are the simplest ones. Wish me luck while I rock this, everyone!

     

  4. Hexeosiversary 9 - SeaPunk Version

    High Quality Version Here: http://imgur.com/gallery/ujrNf

    This is the second camera angle in the set for the SeaPunk post processing version of the design I created to celebrate hexeosis posting wonderful GIFs to the internets for a whole year already.

    This GIF is one in a set named “Hexeosiversary”, a tribute to one of the GIF world’s heroes, Hexeosis.

     

  5. Hexeosiversary 8 - SeaPunk Version

    High Quality Version Here: http://imgur.com/gallery/ujrNf

    This is a post processing variation of this design, which I created to celebrate the 1 year anniversary of designer hexeosis starting to post GIFs to the internets.

    Boy oh boy do I love post-processing! I recently changed my workflow so that Blender now outputs its renders with each render pass saved into its own channel in an OpenEXR Multi-Layer file.

    Pro: Now I have like 36 new channels to play with for each rendered frame, and a zillion more options in the post processing step of my creation process.

    Con: Nothing but Blender’s compositing system reads these files with the Multi-Layer information, Including the Blender Animation Preview window. Wtf. So I need to build a whole post-processing scene just to get an animated preview of something that may have just taken hours to render already.

    To me, It’s an inconvenience that’s well worth the effort trade off. No idea what I’m talking about? Prepare your brain splatter guard, and watch this EXCELLENT VIDEO TUTORIAL about how to use each of the render passes that Blender’s Cycles render engine can output.

    What do render passes have to do with the SeaPunk variation of this design? Well, I had already completed the render for the previous GIFs and had these Multi-Layer EXRs laying around. I wondered what playing with some of those new passes would yield, and by just throwing the Mist pass, the Emit pass, the Ambient Occlusion pass, and one cup of Butter together in a pot, I produced most of what you’re seeing here in about two minutes.

    What is SeaPunk? You’ve probably never even heard of it. I don’t understand it. I guess it’s like Punk + Emo + Hipster, so it would sound like “Soft, Obscure, Misunderstood, Rage”? I don’t even. Google’s Image Search seems to think it has colors similar to this image.

    This GIF is one in a set named “Hexeosiversary”, a tribute to one of the GIF world’s heroes, Hexeosis.

     

  6. Hexeosiversary 9

    High Quality Version Here: http://imgur.com/gallery/riJAw

    This is another camera angle in the scene I built to help celebrate Hexeosis’s 1 year anniversary of making awesome GIFs. Sooo pretty.

    This GIF is one in a set named “Hexeosiversary”, a tribute to one of the GIF world’s heroes, Hexeosis.

     

  7. Happy Tumblrversary, Hexeosis!

    High Quality Version Here: http://imgur.com/gallery/riJAw

    Last week, I read that Hexeosis is celebrating a one year Tumblrversary this month! I’ve been inspired by Hexeosis so many times, I decided that I should help celebrate that milestone myself - so I whipped up some fresh new designs, and I’m really pleased with this work!

    Congrats Hexeosis, every one of your works has inspired countless other designers and hexagon appreciators everywhere, so this is for you! I can’t wait to see what kinds of designs you create in this coming year!

    This GIF is one in a set named “Hexeosiversary”, a tribute to one of the GIF world’s heroes, Hexeosis.

     

  8. Reflecto-Dome 3

    High Quality Version Here: http://imgur.com/gallery/RRckN

    Turns out that this series works really well with EDM background music.

    This GIF is one in a set named “Reflecto-Dome

     

  9. Reflecto-Dome 4

    High Quality Version Here: http://imgur.com/gallery/RRckN

    Turns out that this series works really well with EDM background music.

    This GIF is one in a set named “Reflecto-Dome

     

  10. Reflecto-Dome 5

    High Quality Version Here: http://imgur.com/gallery/RRckN

    Turns out that this series works really well with EDM background music.

    This GIF is one in a set named “Reflecto-Dome

     

  11. The Green Nebula’s eye

    Higher quality version here: http://imgur.com/gallery/lpCtYGT

    Yeah, I’m still not done with the space overlay theme. I feel like this idea had a little more potential, but I didn’t know how to get it there from where it is now. For the moment, I have to post it so I can move on. Perhaps I will revisit it later.

    This design actually came from the same blend file and shared most of its compositing setup with a GIF I posted earlier today named "You’ve Got Stars in Your Eyes".

     

  12. You’ve Got Stars in Your Eyes

    High quality version here: http://imgur.com/gallery/62RrBza

    Now that I get to posting this one, I realize that you can look at this design in a few different ways:

    1. Those are the eyes of a wicked awesome space creature, and they emit light that looks like space.
    2. Those are the holes in a mask(don’t ask why it’s blinking)- they are letting light in through them, and you’re looking through them on the backside.
    3. Stop over-analyzing things.
    4. Okay.

    Just for fun, here are a few of my other “space masking” designs in case you missed any of them. I’m totally re-using the same space image that I made for the first one over and over again, and I’m perfectly okay with that - it looks great in so many use cases.

     

  13. Warm Colors Knot

    High quality version here: http://imgur.com/gallery/bTDJ6HG

    Remember when I created the Zipper Knot?) Well, this is what I had been shooting for. Though, now that it’s made, it’s not as awesome as I thought it would be, but I did learn a few things about working with Blender’s bezier curves objects and their oddly non-uniform UV coordinate distrobution along the way. More in the ‘Knot’ series to come.

    This piece was inspired by the beauty that is the album artwork for Above and Beyond’s album titled “Group Therapy”.

    This GIF is one in a set named “Knot

     


  14. Everything you ever wanted to know about the technical details of making a GIF look good under 2MB for Tumblr

    toa697:

    I am getting angry, my Gifs are suddenly 7x as big and i dont know whats causing it.

    toa697:

    how do you keep your gifs under a MB? ive been having issues where my gifs have increased in size an insane amount even thought they are still 500x500 and 90 frames.

    First, a few months ago, I started using 400x400 instead of my previous typical size of 480x480 (fitting into the 500x500 size bracket) because Tumblr had just started allowing GIFs to be 2MB at 400x400. Then, about a month after that, I heard that Tumblr started allowing 2MB @ 500x500, but I had already found that by scaling my animations down to 400x400, which trimmed an extra 70400(the extra 80 on each edge - it’s late, I don’t know if I math’d that right) pixels per frame, allowed me to turn my quality up a lot higher. But higher quality AND twice the file size? LIFE CHANGING. I went from being able to store between 16 to 36 frames of animation to 48 - 72, and that’s been really nice. 500x500 with 90 frames is probably not going to happen for you unless there are fewer than 300 total pixels of change going on per frame, and you have transparency enabled.

    So, here are some fundamentals about the GIF algorithm.

    First, one of the ways that GIF saves file size is by reducing the total number of colors saved in the images. Most modern day computer graphics are displayed in 24 bit color - that’s (8 bits/1 byte) to represent 256 levels of brightness for the Red, Green and Blue channels of a pixel. GIF says “You know, I can store a palette of colors which are 24 bit themselves, but I’ll only build an list of up to 256 of them, and then just refer to each of them with a single byte as its index.” So we go from 16.7m allowed colors in an image down to 256 of them - but we can pick exactly which colors we want those to be, based on image content. The more total pixels of the same color you have in an image, the more likely it is to make in into that palette. Let’s say the color palette builder spent 255 of your total colors by the time it was 50 pixels from the end of the image. Let’s say that those colors in the palette are all in the green to blue range. Then let’s say you have two shades of orange at the end of your image, and they’re really similar to each other. One of those shades covers 30 of the remaining pixels, and the other shade covers 20 of them. The orange which covers more pixels will be the one between the two that is fit into the palette, and the remaining colors will be “close enough” and replaced with the color of orange that covered more image area.

    Next, GIF compresses with LZW, or run-length encoding, meaning that the more repetitive data you have you have in a row, eg; the more pixels of the same color you have in a row, the smaller the resulting file size will be.

    It’s like: “Show color #5 for the next 50 pixels in a row. Next, show color #120 for 20 pixels.”
    Those 2 color change instructions covered 70 pixels worth of image space, and that file is going to be rather small.

    If you have a lot more image detail going on, the instructions would be more like: “Show color #5 for one pixel. Next, show color #8 for one pixel. Okay, now color #20 for two pixels. Now a single pixel of color #5 again.”
    Those 4 color change instructions covered only 5 pixels of image space, and that file is going to be HUGE.

    Try this experiment. Create a 256x256 image which has a black to white gradient from left to right. and save it as a GIF. Then create an image which is a black to white gradient from top to bottom and save that as a GIF too. The left to right gradient will be much larger because it be like: “White for 1 pixel! Next shade darker than white for one pixel! Next shade darker for one pixel!” and it will take 256 color change instructions to store a single row of pixels, and that’s 256 instructions on 256 rows. That’s not a small number. The top to bottom image on the other hand, will be like “Oh hey, a whole row of white 256 pixels. Let’s see, next row is a shade darker, and look, it’s 256 of those in a row too!” - So what would be stored in that image would be 256 color change instructions total, with one per row.

    Next, if you’re using Blender’s Cycles as your render engine, the higher the number of samples you give your render, the smaller the file size is going to be. Why? Because noise. What you need to do is render your animations with a level of noise that’s low enough that the color differences between any two pixels next to each other are not different enough that they would get their own unique colors on the palette. Go ahead and set your samples up higher than you normally would, and let your animation render for 8 or 16 hours starting when you go to sleep, through when you go to school or work or whatever. Get back home at in the evening, and you have a super crispy animation ready to GIF an post.

    It’s crucial to render to a lossless image format so you’re not getting weird DCT/JPEG/MPEG artifacts in your animations before you convert them to GIFs. I use these formats, for these reasons: AVI RAW(8bits per channel, smallest file size, fastest to load into other GIF exporting apps if image is perfect and needs no additional processing), PNG(16bits per channel, nice if you want to do some basic levels, curves or color correction on it after the fact), or Open EXR[not multi-layer](32bits per channel, fantastic for post-processing in both Blender and After Effects); When in doubt, use Open EXR, because while those files are a bit larger - the time you spent waiting for the render is more precious than the extra bits you spent to store the file, and you can’t go back and get the extra render data that would normally be in the EXR after the fact if you’ve already saved it as an AVI or PNG.

    Protip: If you have an animation that’s on a white or black background, adjust your levels so that some of the unnecessary noise at the top and bottom if your histogram is clipped to pure white or pure black, producing more pixels in a row of the same color. This works best with 16 or 32 bit images because there is more intermediate data between the clipping points to stretch out, and you’ll get less banding in the final image. I used that trick just recently in the “Insomnia Attacks Again” design.

    Last tip, and then I go bed. Photoshop has a “Lossy” setting in its GIF export dialog. Using lossy is like getting the color palette picker drunk. “[hic] Eh, this sequence of colors is (orange, orange, yellow-orange, orange, red-orange, orange), but it all looks orange to me! Orange for 6 pixels in a row![spills drink on bartender]”. The more lossy you have, the more drunk the color picker. The less lossy, the more discerning the color picker. DO NOT CROSS LOSSY WITH TRANSPARENCY. NOT EVEN A LITTLE BIT. Try it out, and you’ll see why. It looks like someone covered a pair of Crocks with Glitter. Double bad taste.

    Okay. I ran out of it. I bed now.

    Questions?

     

  15. Zipper Knot

    High quality version here: http://imgur.com/gallery/YI4weD2

    This design came about entirely by accident. I had been trying to create an animated set of tubular nylon strands like the beauty that is the album artwork for Above and Beyond’s “Group Therapy”, when I turned on geometric displacement and realized that the intensity was set up way too high. Added a Glossy shader, and POW! Happy Accidents!

    If you’re not yet familiar with it “Group Therapy”, you should definitely listen to that album - but note that you WILL cry.

    This GIF is one in a set named “Knot" - hopefully I’ll be able to create and post more soon - this idea has a lot of unexplored potential.