Designing a Designer's Site. Front page with an attitude

he site's front page allows me to raise several important stylistic issues pertaining to different kinds of Web sites.  As I once wrote, "It is immensely instructive to compare practical sites, where design is one of the means to communicate something, with artistic presentations where the thing to communicate is design itself."  A design studio site is, by necessity, a combination of these two types of presentations.

So, a designer faces a really daunting task when creating his own stronghold on the Web.  On one hand, his site must immediately appeal to a wide audience of those interested in outsourcing Web design services (and this is indeed a wide and diversified audience these days).  On the other hand, it must comply, or at least somehow coordinate, with the current design "haute couture," although far from everything dictated by the elite design culture or designer's own creative burst may positively affect the site's commercial potential.  Simply put, being too artsy may scare away some of your visitors.

I can't say, however, that this contradiction - the source of frustration for some designers - was of too much significance in my studio site project.  I don't care much about any demands of the vogue if they don't come easy on my own design conscience.  Ironically, perhaps the very fact that this was my own personal project made me especially wary about risky design decisions that could cause too many viewers to shrug their shoulders.  Instead of trying to surprise my audience by any means (which seems to be the main goal of many designers) I just strived to implement my vision of an ideal Web site.

One aspect is especially interesting in this regard.  "Pure design" sites are often characterized by a very scarce textual part: their creators seem to be certain that their design can speak for itself, and the brief text pieces, if present on the pages, are sometimes uncommonly obscure and pretentious.  This results in the easily recognizable "enigmatic air" liked by some people and despised by some others (and often obstructing the use of the site for all categories).  As for me, I agree that design must speak for itself, but I believe that it can do it only if no misunderstanding stands on its way.  The proportion of how much you say and how much you silently imply says nothing about your design sense, but only about your sense of reason and politeness towards your visitors.  So, I stated plainly and honestly what this site is all about right in the middle of its front page.

This created the problem of presenting this (probably a bit too wordy) mission statement so as to avoid visual monotony, but it was already solvable by purely design means.  Fastened by the powerful contrast relation between the large, light, bold sans serif lines (set in Arial Black) and the small, black, italic serif fragments (set in Garamond Italic, the same face as that of the logo), this composition introduces the two colors and the two fonts used in headings and navigation throughout the site.  (The lightweight Frutiger face used in "Dmitry Kirsanov Studio" banner proved to be too closely related to the logo graphic and therefore unstable in a standalone position.)

Hey, but what about the "enigmatic air"? Isn't it that my message became too straightforward? Of course I didn't forget to throw in several layers of hidden information, but I did it in the most suitable media - in the illustrative images, not in the informative text.  The photographic visuals, occupying the most prominent space on the left of the mission statement and changing upon mouseovers, were carefully selected to match and link together the four parts of the mission statement on the right and the four sections of the navigation panel below.  Let me quote myself one more time: "It is enough to add just a touch of purposefulness for a photo to become meaningful and fit the topic."

So, here are the "touches of purposefulness" as I conceived them for my front page (in fact, this is only one possible interpretation):

• The eye -"we are" - "portfolio" - "see what we are and what we can do for you."

• The clock - "offering" - "interested?" - "don't waste time but contact us immediately to discuss our offerings."

• The tools - "specializing" - "classes" - "teach yourself the use of design tools."

• The toy airplane - "integrating" - "dmitry" - "enjoy the air of personality and the various media in which the author expresses himself."

Getting down to design, here are the main relations and counterbalances holding the page together:

• A single solid light olive bar at the top (below "Dmitry Kirsanov Studio") is balanced by the three rows of discontinuous bars in the navigation panel at the bottom.

• Again at the top, the page-wide composition that uses the shapes and colors of the logo starts a diagonal strain extending towards the small logo at bottom right.  This direction crosses another diagonal, the one going from the mission statement approximately at the page center to the bunch of textual material at bottom left ("portfolio" plus "latest additions").

• The zone of vertically oriented gradients above the title bar contrasts with the horizontal left-to-right gradients prevalent on the rest of the page (in the photo visuals, in navigation bar, and in the bottom right logo).

Overall, my goal in creating the page was to make it as beautiful as I possibly can, while abstaining from most of the features commonly associated with "high end" design sites.