art – Sean Shadmand

A case study in logo animation with AI

I wanted to experiment with animating a logo using agents I already had. The results surprised me. I’m glad I stuck with it, and I hope sharing the process saves you some time.

I’m not an animator, but I’ve been interested in animation for a long time. In school, video editing classes brought together my love of art, expression, and cartoons. I was fascinated by stories about how Disney and its animators thought. I made things using tools like Flash, Maya, Blender, and Final Cut. I learned that a bouncing ball is more than a ball moving up and down. Animating it meant understanding speed changes through easing and how mass affects the way a shape moves, squishes along both axes, and springs back.

Purpose built animation apps

I started by trying third-party tools that promised to make animating a logo easy. I tried Adobe, Canva, and even apps built specifically for logo animation. They were all unimpressive. At best, they added a shake or an expansion, but the motion had no character. It felt like AI’s equivalent of PowerPoint clip art. I had little control over how the animations could make use of my logo’s unique qualities. Even Lottie, a first-class web animation tool, didn’t offer a way to upload my logo and create a timeline animation for me.

Open AI

Next, I tried ChatGPT. I’d seen it do impressive things with image generation and art, so I started with a process that had worked well for me when brainstorming image ideas: a storyboard grid. You can read more about that here.

I asked for a 5-by-5 grid, with each row showing a different animation and each cell representing a keyframe: an important pose or moment in the movement.

The idea showed promise. After a few experiments, I picked my favorite animation to develop.

From there, things went downhill. GPT produced animations that bore little resemblance to the storyboard. I tried different instructions and output formats, including GIF, SVG, and Lottie. It felt like it would take a lot more turns and tokens to get to something worth celebrating.

Give up or fight on

I subscribe to several AI tools because one of them may have a feature that works especially well for a particular task. I use Cursor, Grok, Claude, and OpenAI regularly. That day, after getting nowhere with the third-party tools and OpenAI, I gave Claude a try. A few weeks earlier, it had handled a tricky image request in one turn, while the others took several tries and still didn’t produce anything usable.

Claude

Claude’s first animation attempt was far better than the others. It decided on its own to use animated SVGs, and it worked. It was a unique animation made for my logo. It wasn’t ready to use, but it gave me hope. If it could get that close from a loose prompt, maybe it was worth giving it more time.

During the earlier attempts, I’d started describing parts of the logo as if they belonged to a character: “The top two nodes are hands, and the bottom two are feet. Change the right hand like this.” Then I imagined the logo getting bored from sitting in a website header all day. It might slouch, nod off, or let out a big yawn, so I asked for a yawn animation. Here it is as an animated GIF.

Here are a few tricks I learned to take the animations further with less pain.

Storyboarding

Don’t just create a storyboard to guide the animation. Ask for one with each generated version. With the storyboard, I could point to a specific frame and annotate the change I wanted. For example, I wanted the logo’s “hands” to reach farther out and shake in frames 32 and 33.

Grid of pink shapes with text labels indicating various actions and time durations.

It also let me fix small details that would have been hard to specify. I noticed a tiny bulge between a node and its stem. I could target the frame and circle the bump so Claude could fix it. It used that feedback well, resolving the issue without regression or confusion.

Two similar abstract red shapes with a central round area, one shape has a marked detail at the top left, and the other has a marked detail at the top right.

Use reference material

When I watched behind-the-scenes footage of Disney animators, I loved seeing how they studied animals in their environment and asked actors to perform for them.

That memory came to mind when I tried to create a jumping-jack animation but wasn’t quite getting the nuances I wanted. Instead of trying to draw or verbalize what I meant in a storyboard, I showed the agent a human reference so it could understand the nuances I wanted to capture in the movement.

A sequence of three illustrations showing a person performing jumping jacks, demonstrating arm and leg movements.

Unlocking words

That was much easier than describing the change in another prompt. I also found that a broad direction like “give it life” could lead to subtle movements I might not have thought to specify.

Claude’s animation work clicked for me. Codex’s did not. The experiment reminded me how much I could contribute with visual references and an understanding of movement, even without being an expert. The agent created possibilities, and the storyboard gave me a way to direct them.

Improving my Ilustrator Skills

Since authoring Erec Makes a Fire I’ve become quite familiar with Illustrator. Though Lain took care of drawing all the characters and objects I spent months of man hours reworking the layout, extending the scenery and modifying his artwork based on reader feedback to keep up with each iteration of the story. That being said, creating an illustration from scratch is VERY different than editing one already made.

Motivated by new concepts I’m working on (such as books, apps, and websites), I wanted to bridge the gap between my offline art skills with that of my digital to be more self-reliant when original artwork is needed. I wanted to take the more directed “deliberate practice” approach to learning this new skill and decided to post what I am creating for critique.

I really like the flat UI look, so my goal is to get to a point where I can replicate that look and feel – at least to some reasonable degree.

I needed a horse for an intro scene I was putting together for an app I was building, so I figured it was a good time to crack open Illustrator and give it a shot. Here is the first version. Sadly, this took me many hours to create. Much of the time was learning how to manipulate the tools, but even more came from the constant iterating (or resolving in art speak) to something I can be happy with.

I thought the tail was too boring, but I also didn’t want to over complicate the simplistic nature of the illustration. After another few hours of trial and error I came up with the final horse below. I got a bit carried away in the fun and ended up creating a sprite that walks a bit, then turns to look at the viewer and blink.

If you have any useful tips, or feedback to improve the horse, please let me know.

I really enjoyed working in this medium and look forward to continuing to lear more about it.

No matter what happens to you – make good art

Great commencement speech from Neil Gaimen passed on to me by Isaac Mosquera. Lots of poetic insights…Have a looksee

If you don’t know how to do it pretend you are someone that knows how to do it and do it. – Neil Gaiman

https://www.youtube.com/watch?feature=player_embedded&v=ikAb-NYkseI

Amazing Animated Scrolling Sites: A web symphony in design

I am a big fan of creative and captivating site design. One way of telling your story through your website’s design is by using animates scrolling effects. How they work is the viewer controls the animation and presentation through the amount the scroll wheel has been moved. Every pixel scrolled triggers a movent to some aspect or object on the web page. In many cases the web designer makes a sort of symphony with the multitude of events being moved and morphed on the page. You can see some past blog posts of mine on animated scrolling website designs here.

Here are some more recent orchestrations of stories being told in that fashion below. For this blog I am including video screen captures with the screenshots of the site as some of the sites in my older blog posts have since disapeared and there is no longer a way to see how they animated in the past. Live and learn 😉

(Note: Click the titles of each site to visit their webpage)

Fishy

I really liked the use of paper like textures on the site. It makes it feel like a book or pamphlet has exploded into life. I also really liked how they put a whole slew of characters and objects into motion without making the site feel cluttered or confusing. This site is a super rich scrolling experience.

Ikayzo

Your really gonna like this one. Not only are the graphics smooth, but they capture a great affect and time-period quite elegantly. The concept of having a single machine traverse and change as it scrolls through the deeper pages within it, while also tying it into the story being told is exceptionally well done.

Super Chemical

It was the subtle animations created in the background that really caught my eye on this one. There wasn’t as many objects in motion in the foreground as the others, but the scenery chosen to be animated did a good job supplementing the site instead of going heavy on the scroll animations being the star of the show. It looks like these guys put up a new version of the site quite a bit so check out the video, but makes sure you check out the site as well as they may already have a new one out by the time you read this.

CSSPiffle

A good use of foreground and background in the scrolling animation. Also a great demo of their product offerings, and I like that it is their “pitch deck” (Something given to clients or investors which is usually done in a power point or pdf).

Bagigia

I really give credit to this site. It is a site for a leather bag which could easily have been made into a static site like others in their space. They do a great job display the bag using a 3d rotation, and also do a cute tie in between the scroll and the bag by using a zipper as the scroll progress bar at the bottom of the screen.

You can find more here: http://favbulous.com/post/983/23-stunning-parallax-scroll-websites-you-have-to-know

Some more good documentries

Art & Copy

The moment I saw the previews for this movie I wanted to see it. In your face PR and Marketing that stands up in the face of have-to’s and mediocrity. You will not watch this movie an feel uninspired, especially if you have an idea or two bouncing around in your head.

Crips and Bloods

An etymological look at the notorious gangs formed in LA known as the Bloods and Crips. It was interesting to see the movie’s point of view on how slavery, civil rights and unrest and racism slowly and with little stabs at this south LA community created resentment and hate the bubbled up into an uncontrollable burst of violence. It was also interesting to see the physiological introspection and consciousness that the gangsters in this movie possessed. They are able to self reflect even with a low education, low income and low social awareness communities which makes for an interesting view. Honestly they made some pretty good points about the one-sided nature of history related to south LA and gangs. Another interesting moment is how 3 boys described how they wanted to be in the Boy Scouts of America and were not allowed because they were black and how it turned out to be the 3 creators of what ended up being the seed to what grew into the Bloods and Crips and LA gangs as we know it in its stead. Yes, this movie is pretty one-sided from the view point of the gangster as a victim but walking through the history I would be pretty pissed too.

Afghan Star

Pretty maddening Movie. This movie tracks the stars of the new show Afghan Star (An Afghan rip-off of American idol) after Afghanistan had recently softened its stance on singing, TV and entertainment being banned from the country. The maddening part is watching people praise their new found freedom and love for the ability to finally express themselves as being “an empty house finally filled in their soul” and then having to watch those same people shake their head in disgust when a woman on the show decides to dance on TV to express her joy and passion for music. Watch this movie and step back and think how often are we so short-sided with freedom, vs real freedom. (Bloods and Crips also has a — when is freedom freedom aspect to it as well in a very different way).

Helvetica

Okay, when I saw this movie I was really intrigued so I was looking forward to watching it. For one, how much can a movie dive into one font? Secondly, these people are passionate about design. In all honesty it was kind of long and it got old halfway through but the first half was full of info and good tidbits on design, business and how a font can be so influential and have such history. To be honest I never finished it.

Willard Wiggen: The something in nothing

Have you heard of this guy? He creates sculptures that are microscopic to the naked eye. The end result looks so great it hard to put ut all together and realize he is using materials like eye lashes to create these works of art.

His work and physical capabilities to produc such work “has baffled medical science and has been the subject of many discussions among micro-surgeons, nano-technologists and at universities worldwide. His work is both inspirational and ground breaking in both artistic and scientific spheres.”

You can see him on Conan O’brian here »

The middle

im in the corner
sitting is easy
thinking of the things i wanted to be
math is upon us
and lisp is he speaking
the brightes of sky but the darkest of day

tight lips do catch us
and whispeirng is easy
fooling your slef as to what yo should be
tango and dancing
the steps are the thinking
but the music has challace and cheers on thier way

trash and the heaps of it
scattered inside me
the in-dig-a-nation to inspire the fame
confidnce is weekness
and what is the measure
and chasing perfection when its perfectly sain

seek with a caution
get carried away
beutiful what nots the most desprate of things
balanced in chaos
intimite mieetings
closing the night and then opening the day

Liu Bolin: Artist

My friend Ryan turned me on to this cool Chinese artist that has made a name for himself with intriguing sculptures that incorporate human figures within common settings or objects. More predominantly and most intriguing to me is his Camouflage art where he paints himself as the setting he stands in front of creating this transparent looking effect. The image on the left is an example of this all natural no Photoshop used camouflage transparency art.

Gehry Up

Sketches of Frank Gehry (2005)

Just saw a pretty cool documentry called Sketches of Frank Gehry. Frank gehry is and artist/ architect that is probably most known for his Disney concert hall or the the Guggenheim in Spain. The docuemntry exposes a man who cares nothing fro conformity and captures the essance of entrepenuership. He quits his job as an architect as as he puts it “he has nnever been hapier”

Check out a trailer here or more on imdb here

Through the (cable) wire

I am a Kanye West music fan, and I am not afraid to admit that I can love his music. I appreciate his message but I do so for example the same way one appreciates the lady in the next cubicle, who annoys the hell out of you, tells your jerk of a boss off in front of everyone. It’s intensly awkward, and your jaw drops open in amazementat the audacity of the action. In the back of your mind you may think however, ”way to go, you sure did stick it to him!’ — but you would rather not associate with them moving forward.

Anyways I came across his blog not to long ago (http://www.kanyeuniversecity.com/blog/) and find that it churns out some great fasion, style, and songs. So I figured I would share the link and some of the posts with you, you can decide what to do with it for yourself.