I think I might've given up on keeping this page updated because everything's moving so fast. I'ma just slap some stuff up.
At one point I asked myself, "Heather, why do you have a wiggling dick butt gif on your homepage? Maybe you should do something more professional. Why are you doing that?" After some introspection I realized that I mostly wanted to show the somewhat novel capacity of Webflow, the tool I used to make this site. Webflow lets me use transparent pixels and animated gif. You can't stop me.
It also lets me use responsive layouts for different sized screens. I would use Figma but the process for turning a Figma design into a website is to basically rebuild it in Webflow. As of mid 2023, they've started doing stuff with templates that can transfer over from Figma to Webflow but my gut doesn't trust em. >_>
So since I can't make a vulgar joke, I guess I'll do a silly dance for you and of course I have to use AI because I'm lowkey obsessed with it.
Animated gif is an ancient file type and apparently I'm a dinosaur. It's also somewhat easy to put together in photoshop, one frame at a time. To appease the animated gif gods and make my file type small, I decided to make it only 600 pixels wide which would then be shrunk down to icon size. Also, for the same reason, I wanted to go with a limited palette as each additional color makes your file larger.
My motto is "files not small enough until you can breathe it."
Now that I've explained a bit of the "why", I'll go into some of the process-
The first poem I wrote the computer was:
"Lady Gaga Sailor Moon vector graphic logo icon simplified minimal"
my last prompt I mean poem was:
"vector graphic logo icon simplified minimal silly girly femme lady pink hair glasses updo side-swept yay happy :D 😃😀😄 cowlick sparkle eyes clear defined halftone side-part hooray yell"
There was lots of word shuffling/swapping in between the first and last poems, including the words "running man dance" but the AI did not fully grasp that because this one only takes individual words. I believe the individual word "running" is the source of my tracksuit.
As you may have gathered, there was a more chibi Heather design that was in the works but it was not turning out as well as this "Less Chibi Heather."
My initial plan was to do a character that was Lady Gaga crossed with Sailor Moon before I considered that this was a personal portfolio site so the person dancing should probably be me.
When I got a rendering with a great pose (above image with the chaotic background) I flipped her because it fit the page layout better, the sorta feng shui, the flow of the eye. You need your chi to flow around the right way and if she were looking right then she'd be directing people to look directly off of the screen.
I'm happy I was able to extract a design that achieved my goals of optimized file size while following logo/icon best practices.
I've worked on my signature a lot. I think a lot of artists do.
It's easy to ruin everything if you do your signature wrong. You hate to use fancy paper and a fancy printer to get a fancy print and then you screw it all up because your wrist flicked the wrong way in the moment. Even worse if it's an actual painting. Decided it'd be best to switch to doing a canned format.
I wanted to do it in AI for a couple reasons. Partly to see if I can subtly fix the legibility problem with the A that was giving "4" energy.
Another thing I wanted to do was send the point home that the person signing this is tech-y, as just a pen signature doesn't say enough about me, that's only half the story. I was determined to bring in some cyberpunk/synthwave vibes to my signature.
I first used this stroke pattern when I was brainstorming in an empty art school classroom, on a long sheet of butcher paper, draped across a row of desks with an old, fat brush dipped in black India ink.
I signed an alcohol ink painting I did on canvas the other day and it happened to come out really well so I used it as my source. I only had this crappy photo of it though because it was hanging in a gallery so I extracted a horribly pixelated, vector version of it.
I wanted to process it with AI, in which case, it doesn't matter that it's pixelated. The AI adds noise so it's not usually noticeable.
I put this black and white image in my software. Then for like 3 hours I ran the AI hundreds of times and saved a few hundred options, iteratively changing the prompt as I went along.
When I do black and white vectors with AI, I like to include an inverted version and it gets me two interpretations at once. If you just copy the vector twice, with the same color ways, then the AI will put an identical copy there itself. When it's two opposites then you get 2 variations on every seed so they're often like siblings but not twins.
After spending all that time, I questioned everything and was like "Who makes logos with AI, Heather? This is from hand and it was never fully legible. At least start with a real font."
So I started the heck over. After awhile I presented myself with these 3 options. I and those that I asked, liked the middle option the most. I'd been using that font a lot.
I processed it through AI a bunch and this metal-band lookin logotype came out. I thought it might be good until I considered the irregular x-height and how AI definitely does not know enough about typography to have consistent x-heights. At this point, all hope was lost.
So I went back to the hand-done signature. The x-heights might not be perfect but at least they're authentic.
One of the results almost looked like they could fit on an isometric grid so I wandered down that path a bit.
It was a bad path but I'll share it with you anyway.
We'll chalk that trash up to life experience.
Then I went back to my trove of AI generations and tried to narrow things down a bit. As you may guess. That was difficult. Here's a narrowed down list:
Got it down to 3. Friends voted for the middle.
Then I took that back into my AI tool and did further processing. It was sharp and sketchy enough for me but not overtly cyberpunk.
One of the resulting renderings explicitly ignored the rules I gave it to only show me black and white shapes and put some grey segments in there on me. Well, of course everyone loved that one so I had to figure out how to make grey out of black and white shapes.
I decided to go with a simple mesh, making all the right angles in contrast to the slanted, jagged marks. Looked nice and industrial.
Well Heather, you never actually solved your "A" cosplaying a "4" problem. Well heck. So I went in and manually rearranged the crossbar and extended the left stem of the A as you'll see in the animation. The result felt contrived and too crisp, like it didn't fit so, once again, I asked AI.
AI solved this incongruency in a variety of ways but here's the top 3.
To be clear, we're looking at the bottom left corner of the A in the next set of 3.
I decided to combine two of these solutions. I took the mesh inlay on the crossbar from the bottom option and added it to the middle option, which has a bevel on the sharpest point that I liked.
Then I put it on my website! Yaaaaaaay.