Minimalism in design and code

Have you ever though about what minimalism is about? In 2014, minimalism was a big hit and this year, it looks like it even gets more traction. Many web designers are embracing this style in their work in various ways. However, it should be mentioned that good minimal design is very hard to achieve. Paradoxically, it requires a lot of knowledge and experiences in order to be done right. So, let’s talk about what is the point of minimalism.

Perfection is achieved, not when there is nothing more to add, but when there is nothing left to take away.

— Antoine de Saint-Exupery, French writer (1900–1944)

Minimalism on the web

It was a big trend of 2014 and this year it appeared on the “current trends” list again. In the beginning, I said that minimalism is hard to achieve. Many good designers fail in trial to bring pure minimalism into their projects. The main reason for it is, by my opinion, not understanding the fundamental principle. What is the one thing, or function, you want to use the product or service for? That’s it. Minimalism is about focusing on that one essential function and removing everything else.

When you know what the user want to get done via interaction with the object you are designing, focusing on that is the key to achieve pure Minimalism. Everything else is just a distraction, barrier or clutter. This way of creation, focusing only on the most important task (function), challenges you and pushes you to ask the fundamental questions. What is the reason why a user is visiting this site, use this product? What they need to get done?

Your job, then, is to make accomplishing this no.1 task as easy and distraction free as possible. You have to ask yourself and the users, potential and real, why are they there? Why should they want to go there or use it? This is the only way to create functional minimal design that works. Sure, you can use trial-and-error approach and heuristic to remove some stuff here and there, but without understanding the essential ONE thing, it’s in vain.

Everything should be made as simple as possible, but not simpler.

— Albert Einstein, German physicist philosopher of science (1879–1955)

Minimalism in the code

Until now, we were talking only about minimalism in design. Let’s change the direction a bit and move to another field where minimalism can be a double-edged sword. This field is programming. Have you ever though about minimalism in this field. You might not consider it useful to talk about it. However, in programming, I think, there is even bigger difference between what is minimal and what is usable. Consider the following simple examples of creating a person.

JavaScript:

// as a bunch of variables
var f = “John”,
 s = “Quick”,
 a = 49,
 l = true,
 g = function(f) {
 console.log(“Hi, my name is ” + f + “.”);
};

// or more a dense version
var f = “John”, s = “Quick”, a = 49, l = true, g = function(f) {console.log(“Hi, my name is ”+f+“.”);};
// or as an object
var john = {
 f: “John”,
 s: “Quick”,
 a: 49,
 l: true,
 g: function() {
 console.log(“Hi, my name is ” + this.f + “.”);
 }
};
// or more a dense version
var john = {f: “John”, s: “Quick”, a: 49, l: true, g: function() {console.log(“Hi, my name is ”+this.f+“.”);}};

The example above is, luckily, very easy to understand and to deduce what individual variables stands for, no matter how minimalistic they are. As you probably guessed, “f” is for first name, “s” for surname, a for age. The last two can be a bit harder, the “l” for sure. It means living. The “g” stands for greeting. It is simple minimalistic, but hardly readable or usable and that’s the point. Imagine having few more objects like john in an and looping through them to count who is still living.

JavaScript:

// Five nested john objects in JSON
var nd = 0,
p = {
 first: { … },
 second: { … },
 third: { … },
 fourth: { … },
 fifth: { … }
};
for (var k in p) {
 if (p[k].l) {
 nd++;
 }
};
console.log(nd); // 4

If you have never seen the instructions leading to the code above, or don’t know what it is about, on the last line with console.log you are probably lost. In order to understand what the hell is the function of this snippet you would need to either read the documentation (if any exists), to talk with the programmer (if you can) or go through every line. Only then you could guess that “nd” is “not dead”, “p” is “persons” and so on.

Since you have probably better things to do than any of the possible options I mentioned, You would rather try to avoid this kind of code. Similar confusion can happen when declaring variable and assigning a value to it via if statement while embracing extreme minimalism and liking binary numeral system. Take a look at it and consider it on your own if you understand what is going on under the hood.

JavaScript:

var l = false,
nd = (l) ? 1 : 0;
console.log(nd); // What the f… ?

Let me explain it. In programming, 1 is true and 0 is false (in JavaScript use “==” or probably equal to get this result), so 1 will mean “alive” and 0 “dead”. The variable names are the same as in previous example, so “l” is for “living” and “nd” is for “not dead”. Now, when the program spits out a zero, you know what does that mean. Same thing for one. All these examples are pretty easy and I kept them on beginner’s level. By the way, have you heard about Regexp?

Let’s switch the gears for a moment and think about a more eye pleasing, usable and still clean code. What exactly do I mean by pleasing, usable and clean code and it is achievable through minimalism? Short answer is any code you can understand without spending whole day in documentation or by interrogating the creator of code. The second answer is yes, it is and I will show you one way to make the code more human-friendly.

JavaScript:

var living = false,
notDead = (living) ? true : false; // or keep the numbers
console.log(notDead);
// or modify the condition
notDead = (living === true) ? true : false;

The last modification of condition statement is in question because, well, is it really necessary? Any one having basic understanding of if statement should now that it returns Boolean values, so the true is not recommended. However, it will help the non-programmer understand the whole point of the statement faster and with less hustle while keeping the it short and simple. That is, again the main point of minimalism, no matter the environment.

Conclusion

Minimalism is all about focusing on the function. It is removing everything not necessary to do some specific action. Minimalism, in essence, pushes you to ask what is the reason why a user is visiting this site, use this product, etc. Your job, then, is to make accomplishing this no.1 task as easy and distraction free as possible. That is, I think, the fundamental principle of minimalism. What do you think is the purpose of minimalism, what’s your opinion?

Do you have any questions, recommendations, thoughts, advice or tip you would like to share with other readers of this blog, and me? Please share it in a comment. You can also send me a mail. I would love to hear from you.

Did you like this article? Please subscribe.

Are you on social media? Let's connect! You can find me on Twitter, GitHub and Dribbble.

Alex Devero

I'm Founder/CEO of DEVERO Corporation. Entrepreneur, designer, developer. My mission and MTP is to accelerate the development of humankind through technology.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.