Skip to main content
  1. Stories/

Why I Made Illustrations for All My Tags

·13 mins
Design Web Dev Website Management Illustrations Portfolio Workflow
Table of Contents

What?
#

As you might notice, I’m making illustratins for all my stories.

They are mostly vectors,

  • because vectors are crisp on any display,
  • they are very low on data traffic,
  • and minimalistic in style, which I like.

Sometimes they’re raster images, most time photos.

I enjoy making them, and I like optimising them too. I wrote a separate story about that.

How I Optimise Images
·10 mins
Documentation Long-Read Linux Programming Scripts Software Optimisation Perfectionism Design Illustrations

Not all of them are made by me. Most of them are in public domain and are modified by me. I created a separate attributions page in an attempt to track all of this images and attribute all their authors.

Attributions
·3 mins
Colophon Long-Read Media-Heavy

I have these cover images for all my Stories, and for all my non-stories publications too. I have them for Series. Now, I have them for my tags too!

Tags are topics that can be attached to a story. Tagging stories also helps make ‘Related’ section more relevant.

How
#

First, I wasn’t sure I need to add these hero images, but at some point I realised I like it more. Not from a design standpoint, but from a managerial standpoint.

Visually, they’re nothing special. I just wanted all of them to be unique, minimalistic, and not too heavy.

  • I didn’t bother to think of colours.
    • They’re mostly random, but most times I noticed I like Fuchsia and Aqua colours from Inkscape.
    • I’m considering making the colours either random or programmatically different.
    • Colours play better with the dark theme of my website, compared to a light one. Because I like dark theme more, and consider it as the primary one. I might develop two sets (or re-colour depending on the theme).
  • I didn’t bother to think of consistency in forms.
    • Rather the opposite. I just wanted them to be unique, and very different from each other.
  • I didn’t bother to think of sizes too.
    • Sizes are slightly similar, but not much.

Process
#

I do like this process of creating each icon. I make visual anchors for many things I’m doing, even offline. I enjoy this process, especially its first part of finding the proper association. I’d say it’s the most difficult part in this process.

That’s what I’m proud of with in this project too. That helped me to pick not too clichély ones.

The ones I’m proud of are:

Why
#

Caress
#

Addictions
#

Addictions tag is a tornado

It’s a tornado. I absolutely love this illustration! It has a double meaning.

  • First is literal, an addiction is a wreck, it’s a tornado, it has a very dangerous destructive power. It destroys people, families, neighbourhoods.
  • Second, the illustration shows what every addiction is. Addiction is dangerous not because of the thing one doing, but because of it’s repetitive nature. It’s the habit done over and over and over again.
    • In the beginning, many addictions are tiny little innocent things. They cannot kill you. There’s absolutely nothing wrong with scrolling some Instagram here and there. But one day you’re driving your car and scrolling that Instagram… that can be dangerous!

Aesthetics
#

Aesthetic tag is a woman shoe

Aesthetic tag is a woman shoe.

I was thinking of the ‘aesthetics’ form for days, and couldn’t find any appropriate metaphor.

I even thought of a naked woman body (I’m a male, after all!), but I was concerned of objectifying women, not a good thing. And the metaphor is quite weak. Yes, a woman body is aesthetic. So is a man body, actually.

Dogs can be aesthetic too, cats, all the pets. And even rats!

They eating the dogs, they eating the cats, they eating the pets, of the people that live there!

Yet, a woman shoe fits perfectly well! I adore women shoes, and with one of my partners, we were collecting designer shoes for her. I think there are plenty women, who have a collection of shoes bigger than the times and events they can wear them.

This work is made by a designer from Ukraine, Kate Musaieva. I found her work on svgrepo.com. She has a Twitter profile, inactive too.

I like how its done, it’s a great example of a talented icon designer, a quality vector work. The number of vector points is very limited, yet the image looks stunning. I’ve seen countless of vector works (especially working through all these illustrations for my tags) where it’s clearly visible that the designer knowledge of vector graphics is very limited, and e.g. there is a line that defined not by two points, but three or even more. Sometimes a lot of points!

Notice, I use aesthetics, the British version. I don’t like Americans dropped ‘a’ from it, they kinda lost the whole aesthetics thing in it, the æ.

Automation
#

Automation tag is a logo of Trueowl Group

Automation tag is a logo of Trueowl Group, that’s the group of people (mostly my work mates) that care about atomation. We are a small community focused on automation of everyday life tasks, be it something work-related or just our grocery lists.

I like this owl metaphor much more than some robot, that’s too obvious and too much of a cliché. Owls can rotate their heads 270 degrees, that’s a full circle minus 90º. Almost a full circle. It’s like owl taking control of the territory while you sleep.

Better Place
#

Woman sun hat is a metaphor for Better Place tag

Woman sun hat is a metaphor for a Better Place tag. I like this metaphor for being not-too-obvious sun illustration. Sun isn’t a better place, and I enjoy rainy weather, as much as I enjoy snowy weather, and even stormy weather.

The hat represents this metaphor for me. In the dark places I’ve spent most of my childhood, they wear no hats. Well, apart from Ushankas. (Btw, I had never had one myself.)

This hat is a part of ancient history of our civilisation. It came to us through thousands of years, it can remind us what a miracolous place we all live in.

Blackouts
#

Blackouts is a lightning symbol

This was the very first illustration I made for my other blog, war.basil.

It was different, just a black rectangle. While I like the meaning, lack of electricity, it does not interpretable, actually.

My second thought was to somehow show what a blackout actually is. A battery. A flashlight. A generator. None of the ideas looked good to me.

Then I realised, the light(ning) symbol is plenty in here. I mention this as an interesting thought process, when one tries to find something special, before they realise the obvious is actually quite okay.

Career
#

Career is a tornado too, but a different one. A cyclone.

Career is a tornado too, but a different one. A cyclone. It does not represent the repetitive horror of addictions, it’s more like a ladder (the too obvious metaphor), in a form of a spiral. (And not a spiral either, as it’s too even, while our careers are not, usually.)

Yet, it’s still a tornado.

At least it is for me. It changes many things. First, it allowed me to change my environment by giving me opportunities. Then, it’s chaotic, quite too often.

It’s the kind of cyclone that brought Dorothy to the magical Land of Oz. I like to think of it this way.

Culture
#

Culture is a wave

Culture is a wave.

I’ve been thinking of what would represent culture, it’s a difficult metaphor, actually. There are way too many things. Yet, when I’ve been scrolling through svgrepo website, I saw this one and it was an immediate match.

It’s Japanese (I do like Japanese culture too much!), it’s a wave (meaning the power of it), and of course it’s a painting — The Great Wave off Kanagawa — obviously.

Great job, Max.

Essays
#

Essays is a desk

Essays is a desk. I considered some obvious ideas of pen and paper, but I never use pen and paper. I use my laptop only, and since I type ways faster than I write (and I’m quick to write!), typing is just what I like more.

Frankly, I’m not at my desk while writing the essays, I’m at my sofa, while kids are finally asleep. Yet, the desk symbolises the concentration atmosphere for me.

Family
#

Family is a couple of carp fish

The obvious one would be this family emoji:

👨‍👩‍👧‍👦

Yet, I didn’t like it. It’s not scalable. What if we’d have one more kid?

We were thinking at least of adopting one, at some point in life.

And all the styles of the drawings I’ve been through, they were disgusting to me, I couldn’t find anything I liked even remotely. Then, by chance, I’ve met this Japan-themed illustration by the same illustrator, Max, and it was what I liked!

There’s this ☯ yin-yang vibe, the two that create the family. After all, in the first place, it’s me and my wife and a bunch of random people with our genes. That’s how this family thing started. The illustration is just beautiful, and I like it to be here.

Gadgets
#

Gadgets is a satellite

Gadgets is a satellite. Why? Because grown-up boys should have expensive gadgets. Since we bought satellite, why not place it here too?

Hey, we have our own satellite! Cool, ain’t it?! 🤘

Kindle
#

Kindle is their reading boy logo

Kindle is their reading boy logo. He sits under the tree, reading a (Kindle) book. I intended to make it just a Kindle body, like iPad or iPhone tags. While I think it’s okay to keep Apple Devices as just their stylish icons, Kindle is different.

It is different for me, because it’s not a device, but this portal into the world of imagination.

Linux
#

Linux is a penguin

Linux is a penguin. Historically, its logo is a penguin. I just don’t like this ugly Tux mascot.

Memoirs
#

Memoirs is a blossom cherry floral

It was a very complicated metaphor for me. Max just saved me again here.

Memoirs is a blossom cherry floral. Somehow, for me those falling petals are associated with some memoirs state. Maybe it came from anime.

Operating Systems
#

Operating systems is an Arch Linux logo, simplified by me

That’s a complicated one for me! I was thinking how to represent an operating system. Upon making this illustration, I found out I had two tags:

  • operating systems
  • computer operating systems

That happened because I decided OS, two letters, is just too obscure. The ‘computer’ word meant computer operating systems, as in opposite to mobile. Upon making this illustration, I realised that these days mobiles are more computers than most of our computers are.

  • At home, my computer isn’t much more powerful than my iPhone.
  • And at farm, the computer is less powerful than my iPhone! And I use that computer only to track customers and the relations between them, on a big screen.

So, our smartphones are computers enough. Making these illustrations allowed me to actually work through all my tags, and think of each one of them. That’s not a bad thing per se.

I went through three iterations:

  1. First, I took Debian logo. Debian was one of the first operating systems I used. My way was MandrivaUbuntuDebian. Mandriva is long dead, Ubuntu is too popular and too cliché for me, and I don’t actually use it for many-many years.
  2. Then I took FreeBSD logo, it’s so good, it’s my favourite.
    FreeBSD Logos
    By the way, their documentation website, docs.freebsd.org is made with Hugo. As my website is.
    I deployed this logo first, but realised that one day I could be writing about FreeBSD, and there would be a conflict. Because for FreeBSD, I definitely going to use their minimalistic red logo.
  3. Then I took Gentoo logo, as a symbol of a perfect operating system that I like. But not use! That’s the problem. When FreeBSD is use (on one of my servers), Gentoo I don’t. Also, the same issue as with FreeBSD. I could start using it one day. I consider switching to Gentoo, when the Asahi Linux project would mature enough.

After that I realised, why not take the logo of the system I currently using?

I use Arch, btw.

So, I decided to take Arch Linux logo, but to separate it from Arch Linux tag (if I’ll ever have one), I decided to simplify it. It may be obscure to someone else, but I like it.

Optimisations
#

Optimisations illustration is a vector line with two points

Optimisations illustration is a vector line with two points. To me, it represents all these vector files I went through, most of them having excessive points, so I simplified many of them.

I found this line to be very minimalistic, and I like it.

Personal
#

Finding something that would represent me as a person, and be not photo, but a minimalistic vector image… tough task! Yet, the decision came from sub-conscious.

World, meet my online signature. It’s not the official one, I use it in my illustrations since circa 2007.

Programming
#

Programming is a keyboard

Algorithms? Nah! The keyboard. For me, programming is sitting long hours with keyboard on my laps. That’s how me and my friends were making games together. We used to put these keyboards on our laps, the three of us, and enjoy these long programming sessions. That’s how I learnt the basics of C++ in high school.

Remote Work
#

Remote work is a cat.

Remote work? A cat! Remote work is being able to stay at home, and work in your trousers, from your bed, with your favourite pet, or a family member. What means is how you actually do your job, not where from. It’s not applicable to everyone, and even for those lucky ones who can work from home, it’s not an easy task, actually.

Yet, the benefit of having your cat around… I wanted it to be a cat. It’s a cat.

My Thoughts on Remote Work
·2 mins
Personal Remote Work Essays

Singapore
#

Singapore is their Merlion, of course!

A flag? A coat of arms? A city form? Merlion! I like Singapore, one of my favourite countries. It influenced me significantly in my early years. It was one of the first countries I visited.

War
#

This illustration is originally by Lviv’s illustrator Mykhailo Skop that goes by the name Neivanmade. The vector version is my adaptation of his work.

I use it in my other blog about war.

Workplace
#

Workplace is a desk with display and speakers, and a chair

For getting what I chose for workplace, I need to explain what a workplace is. It’s a place where I work :)

Yeah, so the illustration is a minimalistic workplace that I like, aesthetically. The original one is somewhat different, I adapted it to my liking.

Workshop
#

Among my friends, I’m famous for this 12 displays weirdness. So, while at home I’m the guy who thinks it’s 1 huge display may work well (see the previous illustration). At work, I’m actually the guy who wants 12 displays (or at least 4), and they’re very efficient for me.

Since 2022 I own a workshop, which is also a tiny city farm. See rostymo tag for that. What would represent a workshop? For me, it’s instruments. It’s the place where I can do different things with my hands, it helps a great deal to tame that dissatisfaction of building virtual things all my life. I’d highly recommend it to everyone.

Perfectionism!
#

That’s a special one, hence for the dessert. First, I thought of making nothing. To leave it as an easter-egg, the only one illustration without any illustration. Representing the

Then I thought, well, maybe I’d use this ‘Better done than perfct’ phrase. Was too obvious for my liking.

Then, I thought of this annoying bug. This just ought to annoy perfectionists! (I am the biggest one!)

Not a bug bug from FreeBSD’s freshports.org website

Then… well, I made this picture. You can see, it is:

  • not centered;
  • having some elements unevnely placed.

Oh, it should irritate perfectionists.

The thing is, I am perfectionist. All my life. Yet, I’m working to fix that. Being a perfectionist isn’t a positive characteristics, actually. Yes, it means you care. Yet, it means you care too much. And when you care too much, you make it worse, actually.

Conclusion
#

This attempt allowed me to focus on my tags, and improve them by just being aware of what they are. Previously, I’d tag all my posts randomly, with all the possible words that would come to my head. I was repeating myself, and wasn’t aware of that. Now, all my tags are given the love they deserve. The next step would to write the description for each one of them.

Reply by Email

Related

Blackouts Schedule Redesign: Why Infographics
·13 mins
War Design Redesign Analysis Infographics Portfolio Article Blackouts Better Place Workflow
Adapting Blackouts Schedule Design to Double The Groups
·12 mins
War Design Redesign Analysis Infographics Portfolio Article Blackouts Better Place Workflow
Redesigning Daily Blackouts Schedule
·6 mins
War Design Redesign Analysis Infographics Portfolio Article Blackouts Better Place Workflow
Redesigning Our Weekly Blackouts Schedule
·7 mins
War Design Redesign Analysis Infographics Portfolio Article Better Place Workflow
Making Holiday Postcards with AI
·6 mins
Artificial Intelligence Software Essays Portfolio Illustrations Graphics Design Christmas Clients TOI
My Stance Towards AI
·11 mins
Artificial Intelligence Software LLMS Essays Services Portfolio Design Graphics Christmas Clients TOI Long-Read