My name is Ivailo

I'm an award-winning designer and writer

I create clean, intuitive experiences that just work

I do

Logo Design
Web Design
UI/UX
Graphic Design
Social Media
Video Production
Creative Writing
Other stuff

Get to know me
See samples of my work
Grab my CSS framework
Currently, I do accept freelance work selectively
Tell me about your project

Ah, one last thing. EU bureaucrats demand that you are well informed about the fact this, and actually every other bloody site on the internet, uses cookies. I only use cookies to keep vague track of how many people visit my site, which is considered essential use. If you don't accept that, I'm sorry, you need to leave. Which will be counterproductive and defeats the whole point of you being here, right?. So let's just pretend you don't mind my essential cookies and in return I will reward you with my best service and pricing. Deal?

About me Arrr, lads! Raise the black!

If I need to describe myself in a single sentence, it would be: ~~innovator, motivator, philosopher, inventor, forward-looker, smooth-tongued speaker and charmer with win-win attitude and proactive approach. Yeah, all that.~~ a bloodthirsty pirate with special flair for aged rum, cigars, space and 20^-th century sports cars.

It so happened that I began my creative career right after I finished high school in 1995 but actually it all started couple of years before that, when I got my first PC and had all the time in the world to learn by trial and error. Which is still my favourite way of learning things. I'd rather rush headlong and try out different scenarios, as there is always an easter egg or hidden gem along the way.

My first years as young professional were absolutely explosive and allowed me to go through various fields that added up to my areas of expertise and helped me immensely widen my professional horizons and knowledge right from the start.

We, creatives, are selfish and arrogant bunch. We just love to be praised for what we do. We are show-offs. Most of us carry that distinct art perception of design. They treat [their] design like something sacred. Like something that should be admired from a distance. Like a bloody Mona Lisa.

I however believe design should fulfil a purpose.

And I also do believe form follows function is probably the best principle there is. So I focused around user-centric design that speaks clearly and is easily comprehensible. Design that does not spark controversy. Design that does the job. Because that's what it's all about and that's what I get paid for. And it is up to my skills and knowledge to do what needs to be done but it is also up to my integrity to do it as effectively as possible. So whether it is a logo, web site, promo clip or just about anything, I stand by the end result with my name.

With that said, would you like to get to know me better by reading some stories, or would you rather skip this and see samples of my work? Or maybe just contact me or even check me out on LinkedIn?

How I wrote two books instead of taking on a venture capitalist offer

It was 2009. I was doing an elevator pitch on the first ever startup conference in Bulgaria. Few minutes later a man silently approached me. "Good day", he said and handed me his business card. "Call me one of these days", he continued and walked away while I was still reading what was written on the card. Then it hit me. "Venture capitalist", that's what was written. I nearly shat my pants.

We met few days later. And we talked. And I was so naive at the time to believe it's ideas that matter. Silly boy. Ideas do not matter. At all.

I would have realised that earlier but the thing is I was not desperate to make this work under someone else's terms and I backed up. I thought yeah, that door's open, will come back later, things might be different then. In the meantime, let's do something different. Say, let's write a book. Just like that. An year later the book was complete and in the spring of 2011 it got awarded the most prestigious fiction debut award in Bulgaria — a 10-kilo bronze Pegasus and I got the "laureate" title stuck next to my name for eternity. Another year and a half later my second book, a sequel to the first one came out. Sadly, it was not such a commercial success to justify writing another one. Still, the Pegasus works great as book stopper to this day.

By the way, the door was not left open and I should have known better. Тried to come back few years later with a completely different mindset. It didn't work out. Which brings us to the story of...

... How I failed developing a computer game

I've been fascinated with games since my early years when I took every opportunity to spend time in front of computers at public locations for the lack of one at home. I tried to code basic games even then, in the mid 80's and throughout 90's. Since you don't know me as a name in the game industry, you can guess these were all failures.

Later on, in the beginning of 00's, I was determined to start doing this for a living and so tried to grab every single opportunity to join different indie game development teams and even form my own. You can tell how this effort ended with relative ease either.

But not everything was in vain. Eventually it all lead to the moment when me and a mate I knew from EVE Online started developing our own game. Outer Space Exiles it was called. It was going to be bloody awesome sci-fi 4X/RTS/RPG/colony management/survival hybrid the world has never seen before. He took the code, I took everything else.

6 months into it we realised we can't go further as we blew all our savings. We launched a hasty, crappy, embarrassing and somewhat desperate Indiegogo campaign but as expected, it failed miserably. And that was the end of my most mature indie game venture so far. But there was a lesson to be learned nonetheless. Game development is an expensive feat and is pretty damn complicated relationwise even with a team of just two. Which brings us to the story of...

... How I went on designing a board game instead

Couple of years later I still can't let go of the idea for a sci-fi game and would very much like to continue building over the already existing legacy somehow. Under one condition. I didn't want to fail this time. In order to minimize that risk, I decided to go solo. But there was an obstacle with that concept. Coding a computer game on my own at that point was a no go. So I slightly pivoted the idea and decided to do a sci-fi board game instead. Zenith:Unknown was born.

It's been 5 years already, 6 if we count the year spent in initial writing and research, and the game is nowhere near completion for various reasons. The most important of them is probably because I work on it when I feel the craving. Usually happens once a year for 2-4 weeks. Which brings us to the story of...

... How I went back to developing a computer game

It's March 2020, the COVID madness is everywhere and I have just finished playing a game I've had for 10 years, but never got to play. A cyberpunk-ish/noir game. And suddenly I remembered a series of videos called Deep Space Noir, I did in 2016 and for which I wrote quite a plot. And then it hit me. A game had to be created. With zero industry experience and zero C# knowledge, I grabbed Unity and began putting it all together in Sketchup. But since there was tremendous amount of work already done for Zenith:Unknown, I decided I'll just place Deep Space Noir in the same universe and this way both games will benefit from each other, as Deep Space Noir will actually serve as a prequel to Zenith:Unknown. Sort of.

The game is a point and click tech-noir/cyberpunk adventure and is being developed on a daily basis. It's currently in pre-alpha phase.

Now, ready to see samples of my work or get in touch?

Projects that spark certain pride, joy or excitement

Infiniti Bulgaria

Few years back I got commissioned by Infiniti Bulgaria to clone the official Infiniti web site and localize it. I had 30 days. That's all I've been given. Cloning a website developed by leading London agency is not your ordinary web design task in its own right, let alone when you are left for dead with it.

Long story short, I did it. Alone. From scratch. In 30 days. Everything I did was custom tailored, plus adding improvements over the original. By far this is the most challenging project I've ever been tasked with and one of my favourite.

Деца FUN

Деца FUN (Kids FUN) aggregates events for kids in top three major Bulgarian cities - Sofia, Plovdiv and Varna. I created a complete identity package, a WordPress based site with a custom theme and functionality you don't typically get out of your WordPress, along with all kinds of supporting social media. It was fun, I loved it.

Var-bee-tsa

Var-bee-tsa is a brand I developed from scratch, along with all the supporting jazz - identity package, product packaging, website. They are a producer of organic honey and bee products, based in a village called Varbitsa, the "bi" in which is pronounced as bee. See the tease?

Packaging was minimal and based on recycled/recyclable materials. Tag was printed in biodegradable ink on handmade recycled paper with live seeds in it. Planting the tag produces plants and fertilizer at the same time.

The brand got awarded the "Best Product Packaging" award two years in a row at the largest bee product fair in Bulgaria.

Vivique Hair Lounge

Vivique is newly opened beauty salon in Basel, Switzerland. I was commissioned to develop a logo and corporate identity package.

Omniage

Omniage is yet another brand developed by me from scratch more than 15 years ago and completely revamped twice ever since - logo, corporate identity package, WordPress based website with custom theme, advertising and social media package and 10^-th anniversary promo video.

The Disaster

It's not common that I get tasked with designing a book cover. I mean, even my own books were outsourced to third party because my own samples were "too clean". So I thought I'd do an avant-garde cover for this book instead. To get the concept, one should be familiar with the Treaty of Neuilly-sur-Seine, following WWI that completely devastated Bulgaria. The country had to cede huge chunks of its territory and pay reparations in excess of 100 000 000 British Pounds. Events known as the Second National Catastrophe. That's what this book is about and the key to cover concept.

Terras Gauda

A spanish wineyard that holds annual design competition with thousands of participants from all over the world. Here are my shortlisted entries from few years ago.

Few others

OMG! A free CSS framework for grabs!

That's right, I hereby present my CSS framework. It's called The Minimal Purist CSS Framework for obvious reasons - it's minimal and purist.

The story

What started in October 2018 as a set of helper classes to go along with Bootstrap, soon evolved into a full fledged standalone framework. MPCSSF is the silver bullet for web devs that like to keep things simple and reusable.

Not based on anything existing, MPCSSF was developed from scratch with the ultimate goal to reduce redundant CSS usage in a typical project to an absolute minimum.

Really... And exactly how effective is it?

This very website was built around the aging and quite limited version 1.6 and if you look at the CSS, you will notice just few essential definitions were made. Everything else is handled by the framework. In a real-life scenario, MPCSSF would realistically save you from writing between 70 and 95% of redundant CSS definitions. And here's one for the real lazy ones - it's completely possible to have a stunning minimalist site built without writing a single line of your own CSS.

Most excellent! What are the benefits again?

1. The grid. You can control grid and element spacing with unparalleled flexibility throughout various screen resolutions and without the need of writing your own media queries. While there is a wide variety of options by default, there are also ~~two~~ now three predefined breakpoints - one targeting devices with render resolutions of ≤~~1280px~~ 1200px, another focusing on devices with render resolutions of ≤~~575px~~ 640px and the newly added in-between breakpoint, targeting resolutions of 992px or less. This way you can create effective, well-spaced, clean, fluid layouts with the application of just a couple of classes. For more information on breakpoint changes, see version history at the bottom.

2. Containers. Setting widths, heights, floats, position methods, box model and z-indexes is a breeze. Widths and heights can be set in either pixels or per cent.

3. Text. Font sizes, casing, styling, line heights, forced word breaking, forced lists. Effectively control readability and placement of your content.

4. Element design. Basic borders, lines, colors, backgrounds, highlights and mouse pointers to enhance appearance and usability.

5. FX. Animations, transformations, shadows and glows. Jazz up your design a little. Just a little. It's about purism after all.

Holy crap! How to make use of it?

Just download, unpack in your CSS folder and link it in the head of your document along with your existing CSS. Load order should not really matter. I guess. Maybe?

<link rel="stylesheet" type="text/css" href="css/mpframeworkXX.css" media="all">

Please note there is no user guide besides some examples that follow and I would not provide support of any sort. But I promise you this—it's pretty self-explanatory once you look at the code.

A couple of examples

Let's start with the grid.

<div class="w50p h200 pos-a pos-rm pos-fxm pos-t0 pos-l0 bg-wht"><p class="cl-gry">Wonderful <span class="bold">bold</span> plus <span class="italic">italic</span> sentence that is gray and <span class="smtxt">this part is actually smaller than the other.</span></p></div>

This shall create a white container that is 50 per cent wide and 200 pixels high and is placed absolutely at the top left corner by default but positioning will be transformed to relative on devices with render resolutions of ≤1280px if you use version 2.5 or lower and ≤1200px if you use version 3.0+ and fixed on devices with render resolutions of ≤575px if you use version 2.5 or lower and ≤640px if you use version 3.0+. Inside that div there will be a gray-coloured sentence showing off bold, italic and font size modification.

Another example featuring borders and colors.

<div class="bd-fat bd-wht br10 bg-err cl-wht p20 rot10">Fatal error! You are screwed!</div>

In this example, our container will receive 10 pixel solid white border with 10 pixel border radius, red background, white text color, 20 pixel padding and the whole thing will be rotated 10 degrees clockwise. Easy, see?

Now here comes the icing of the cake. Grid paddings and margins for various devices so your 8k layout looks right on smaller screens as well without media queries and explicit element-level definitions.

<div class="bd-sld bd-blk cl-blk p100 p50sm p20xm">Well padded and readable text.</div>

This will create a box with 1 pixel solid black border and padding of 100 pixels on large screens, 50 pixels on tablet-sized screens and 20 pixels on mobile screens so your black text is both well padded and readable on all of them while not occupying excessive amount of screen real estate.

For a couple of real-life examples, check the source of deepspacenoir.com and pornstache.pro.

Other than that, take your time and go through them ~~2700~~ ~~7600~~ 8100-ish lines of code on your own, I reckon it will take just few minutes to scan the logic.

Finally, the download!

Licensed under GNU General Public License v3.0. No visible credit or explicit linking to this site is required but will be highly appreciated.

Please note that due to breakpoint change (have a look at version history below), versions 3.0+ may break websites created with version 2.1 or earlier! While it's unlikely, it's not completely out of question.

Version history, sort of

3.2 Positioning, width, height and few other classes expanded, max-height definitions added, few minor fixes;
3.1 Minor bugfixes and additions;
3.0 Major milestone. New margins added, min- and max-width reset added, new "sm" breakpoint added at 992px, existing breakpoints changed to 1200px for "m" and 640px for "xm", to reflect "industry standards", number of definitions increased by 38% to a total of 97KB CSS;
2.5 Major milestone. Fluid image model change, new margins added, auto height added, new widths added (including auto), three erroneous "xm" definitions fixed, missing height definitions and box models added for breakpoints, special adjustment percentage based definitions added;
2.1 Width, margin, padding, color and background definitions expanded, float revised, fluid class, text modifiers for breakpoints, form field focus effects and block definitions added;
2.0 Major milestone. Width definitions immensely expanded, new body height modifier added and MPCSSF is no longer a Bootstrap helper but full fledged standalone framework;
1.8 Width, floating and text alignment expanded;
1.7 Forced text alignment added;
1.6 Width and height definitions expanded, text modifiers expanded;
1.5 Major milestone. Breakpoints added, positioning added, floating added;
1.1 Bootstrap reset added, animations added, effects added;
1.0 A bunch of helper classes mostly adding variety of padding, margin, width, height and text presets.