If you're a programmer, then at some point you've had to design and style something on a website. And truth be told, you probably thought that it was pretty fantastic. This div goes here and this padding goes there. You use an image as a background and voila! Project complete. At least, that's how many of my sites get designed. And it's functional for the most part. But it will be different from what an actual web designer would create. It will be missing something. Some would call that something "Art".
A programmer can spend hours on a single function or an idea making sure that it generates the appropriate data in the best possible way. But ask them to design something and there will be a momentary lapse in thinking. Ask a designer to design however, and they already have a thousand and one ideas ready to give life to. So today we'll break down the biggest difference between how a designer designs and how a programmer designs. And we'll explore the middle area and come up with a somewhat artsy but yet still functional concept that may just work for most programmers.
Functional Design
If you ask me to draw a computer, it will look something like this:
It gives you a general idea of what it is. You're like "yeah, its a computer, kind of". If you ask an artist to draw a computer, it might resemble the following:
And there's a reason for that. A programmer will normally tend to steer towards a functional design. Something more procedural that essentially works, but maybe doesn't do much else. Which for the most part usually resembles a top-down and left-to-right approach to design. There's a header, a menu, content, and a footer. And in the middle other elements that are required. Nothing will overlap probably.
As an example, here is a version of this blog's homepage. It might be different than the one you are seeing now.
It's not pretty, but then it isn't suppose to be. It's suppose to be functional. At least to a programmer. It's suppose to be a "menu", which traditionally means a horizontal bar with smaller bars with text in between. The only real design comes down to the background colors and to the fonts. A designer however has a different goal in mind. And that goal is capture the viewers attention. It might not be a horizontal bar. It might not even be a menu. It will someone's idea. It will someone's vision.
Artistic Design
But that's not to say that art has no place in web design. The web is a sort of new age canvas for those with an eye for shape and color. Artists think more abstractly. They layer elements in ways that only they can understand. They can see the results before the first brush stroke is placed. Take the following for example:
It belongs to a good friend who is a designer. It's an eye-catching design full of intricate elements and which, both, gets the point across and does it in a fashionable way. A good programmer could attempt to copy the design and do a fine job of coming close. However, if it were up to them to come up with the design, then it fall short for sure. Notice the various layers in use, that while you might ignore at first glimpse give the overall look and feel a more professional feel.
To a programmer, a circle is just a circle. It isn't a cone. It isn't a triangle. It isn't a watch. It isn't the sun. But to a designer, it's all of these things and more. But a programmer, of course, can program. While the color and shape are what the designer looks for, the programmer looks for data, performance and functionality.
In the middle
And somewhere in the middle the two will meet. Not quite artsy, and not quite functional. But a mix of both. That's where a programmer would hopefully reside. At least, that's the inevitable goal. You get a taste of the abstract and the freedom of expression but at the same time your technical vision doesn't get blurred or distorted. You won't be layering too much and your elements will flow in the traditional sense of left-right and up-down, but maybe it will do that in its own way.
The design of this blog is one of many that came to mind when first endeavoring to change it. It's linear, procedural, but functional. It isn't too overwhelming and things are positioned for the most part where you'd expect. And for now, that's just fine. It will probably get a reboot at some point as the content changes. And it won't be "better" than the previous design. But it will be different. Perhaps the adventurous side will kick in and something completely unique and out there will come about. It might not make sense, but it might be different. And sometimes, different is good enough.
Walter Guevara is a software engineer, startup founder and currently teaches programming for a coding bootcamp. He is currently building things that don't yet exist.
Stay up to date
Sign up for my FREE newsletter. Get informed of the latest happenings in the programming world.