Demoreel

Next Level

Early 2023 I spent about a month or so working tirelessly to completely rewrite my old website. The last few years I had done a few projects with Next.js, so I wanted to take my own website to the next level. The markdown-based backend I used before was a bit of a pain to work with, so I went and also set up a back-end so that I can now edit and update my site more frequently. So no more yearly updates (I'll try to aim for monthly now).

While I was at it, I also "remastered" the brand's 3D hero elements, designed a new logotype/icon/emblem, and did some fruitful experiments with AI tools like Stable Diffusion.

New website

I revamped the website and took it from a markdown-backed Gatsby to a Dato CMS powered Next.js system. I also wanted to do a lot more 3D stuff than I did on the old site, so I made that a priority as well.

A little something about the custom Dato CMS: I now have the ultimate page-builder portfolio that gives me a massive amount of flexibility on how to layout each individual page, down to the timing of the background 3D animations, or rely on sensible defaults that look good with minimal effort.

To illustrate, also take a look at these articles. The first uses the same scene that was on the old website, and the second has an alternate layout I considered for a while to be the new homepage. This page has a vector illustration as a background, that I authored in Blender to give elements some parallax/depth. I also used a gold/metallic shader combined with a shared global environment map to give the elements the fancy gradient-like effect. Try it on a big screen to get the full effect.

Unlike the old site, I can now animate more than just the camera-position. The entire 3D animation is now synced with the page's scroll position, and smoothly interpolates. By following a simple naming convention in Blender, I can mark each animated object to either loop independently or to also sync with the main camera. Notice how the animals move when you scroll on the homepage.

New Icon

While I still like my animalistic logotype, I also wanted to have a more iconic symbol that could function as a logo/home-button. As a challenge to myself, I wanted to see if I could create an ambigram, which is a word or design that retains meaning when viewed from a different direction or perspective.

At the same time, I also wanted to try working with AI tools like Stable Diffusion and see if it could come up with an alternative that I liked better. Because these tools are notoriously bad at drawing text (and hands), I decided to give it a fair chance by making its briefing be more pictorial. I wanted to see if it could draw stylized animal heads, with no guidance beyond a simple worded prompt.

As you can see it created some cool illustrations. I took some of the best ones it made, cleaned them up in Photoshop and vectorized them in Illustrator:

Now I almost went with these, and I even coded a little script that would randomly show a different one of these heads on every page. But I found that these designs became too blurry and unreadable at smaller sizes, and I decided to go with my ambigram instead.

AI Experiments

After my earlier experiment I discovered a new tool for Stable Diffusion called Controlnet. This allows you to add additional images to your prompt to guide the generation. For instance, you can upload a hand drawn sketch, and the AI will attempt to draw something that follows those lines. You can also import photographs, 3d renders, or even draw skeleton-poses.

As a goal I wanted to create some different styles of Lions, Tigers and Bears to use throughout the site. This time I started in Procreate and made a quick sketch/digital painting of the kind of visual I wanted. I used some google images for the animal heads and photo-bashed them in place. I then loaded this design in Controlnet and experimented with different prompts to see what styles I could get.

I quickly discovered that if my prompt contained "Lion Tiger and Bear" that it wouldn't output a lion, a tiger, and a bear, but instead it would turn each character into a mutant amalgam of all three.

The solution was to use Stable Diffusion's built in inpainting tools to fix each individual animal face. So to recap, the final workflow in full:

1. Make a sketch of the composition (this doesn't have to be a sketch, you can use 3D renders or photographs), upload it into Controlnet

2. Craft the prompt to get something that resembles what you want, ignore the mutants

3. Remember to lock your seed as soon as you're close to what you want

4. Upscale the image from 512 to 2048 (or whatever you want/your GPU can handle)

5. Import the image into inpainting, copy over your prompt, seed, and other settings from the original image.

6. Inpaint each individual animal head, modifying your prompt every time (i.e. first head: "Cyberpunk lion...", second head: "Cyberpunk tiger...", etc.)

7. Continue until satisfied

8. Post process in Photoshop if you want

More experiments

For the last experiment I decided to have a little fun with my brand by trying to generate some album covers based on the Ambigram logo. Using just the black & white version of my logo as a Controlnet source, I was able to quickly generate these. I took my favourite one and manually extended it using Photoshop and inpainting.

Conclusion

So, do I think AI is going to be a disruption to my creative profession? Absolutely. Is it going to replace designers? Not entirely.

I doubt it's going to fully replace designers and illustrators. They still have technical and artistic abilities that are too hard to replicate with an AI tool (for now). But more importantly, their existing skillset synergizes with these tools: someone who knows photoshop and AI is going to outperform someone who only knows AI. The same is true for code, writing, and all the other creative professions supposedly threatened by AI.

Someone who only knows AI is like someone who cheats their way through a university degree. Depending on the field they've chosen, they might get away with it for a while. But one day they'll run into a situation where they can't cheat, and they'll be exposed.

Immature poets imitate; mature poets steal; bad poets deface what they take, and good poets make it into something better, or at least something different.

As a designer, I know when I can get away with using these tools: when making moodboards, painting in sketches, brainstorming ideas, mixing styles, etc. But I also know how to draw a human hand, make a quick photoshop edit, make a vector illustration, and a million other little things that any competent designer learns through experience. Things that a cheater doesn't even know how to prompt the AI.

But of course, these AIs keep getting better so it might only be a temporary roadblock. But for the moment, these tools are like legal performance enhancers. Knowing how to leverage these techniques and tools will allow competent creatives to 10x their output.

As a business, what would you rather do? Get rid of 90% of your staff to do 100% of your current work for the same money, or keep your staff and potentially make 1000% more? Gross oversimplification? Perhaps.

But imagine some talented junior animator laid off from Disney because an AI can draw the in-betweens now. Imagine that kid same going home and using these same tools to turn his own ideas into fully animated movies, movies that are wholly original, not workshopped to death by a committee, laden with product-placement, or burdened with small-minded corporate hang-ups.

Imagine a world where there are no more cogs in the machine, that each one of the thousands of names you see in the end-credits of any recent Marvel movie, that each one of those people working in the Hollywood CGI salt-mines could instead make their own movies. That's an AI powered world I wouldn't mind living in.