Dmitry's Design Lab: Abstracts | WebReference

Dmitry's Design Lab: Abstracts


Designing with Chaos

Chaos is not only an important philosophical concept, but a powerful design tool requiring a trained eye and a historical perspective. From a historical outline to modern examples, we'll see how the role of chaos was changing over centuries and how the level of regularity defines our perception of a composition. Then, a case study of several chaotic samples leads us to some practical suggestions on the use of random theme in real-world compositions. In a conclusion, I answer some of my critics re: the analysis method I have been using in my articles.

The Art of Animation

Learn the important basics of creating animations that dazzle and entertain - but do not annoy. From an overview of visual aspects involved in the motion of an object (such as its shape, color, and texture), I move on to some important principles of creating animated graphics, with a special attention paid to the principle of nonlinearity. Along with some examples to illustrate the ideas put forth in the article, I briefly describe two of the most popular animation technologies, namely the 3d animation and vector-based Flash animation.

Dynamic Design

Adding life to your designs does not necessarily mean using animated GIFs of DHTML. Master the dynamic power of static objects and learn to direct the user's eye through your page for a seamless experience. We'll go from the basics of adding realistic dynamism to a composition, to analyzing the abstract dynamism of common geometric shapes (notably the straight lines), and to the dynamic eye flows between elements and the big picture of dynamism in the entire composition.

Nonlinear Design

Nonlinear forms, most often represented in computerized design by Bezier curves, hold an immense creative potential and can drastically change the look-and-feel of your composition. The article leads you from Bezier basics, to explaining the curvature range and architectonics as the two most important parameters defining the character of a curve, and then to examples of curvilinear expression in abstract compositions, fonts, and in a number of actual corporate logos.

Using Artwork in Design, Part II

Even after exploring the different aspects of artwork in graphic design in the last column, there's still more to discuss in this versatile topic. Learn what is involved in a real-world design project using artwork, with primers on borrowing inspiration from the classics of the past and on creating your own fine-art universe.

Using Artwork in Design

As you know, using photography is a short, sure, albeit perhaps too common way to add a touch of class to your design.  But to give your page a truly unique, artistic, flamboyant feel, what you need is a piece of professional artwork. In the article I explore several important concepts, such as the value of drawing vs. painting and their underlying opposition of generalization vs. distortion; symbolic and decorative imagery (illustrated by a practical example); and the two main techniques used for incorporating artwork in a design composition, displaying and embedding.

Logo Design Revisited

Logos remain one of my favorite domains in both design practice and design theory.  Reader interest prompted me to return to this topic once again, this time on the material of several commercial logo designs I recently created. The article relates the story of reusing a two-year-old sample logo in a commercial project, demonstrates an unfaltering cleanup of old design mistakes, and finally addresses the issue of creating a coordinated system of logos for a company's identity package.

Designing a Designer's Site

If creating a well-designed site is not easy, building a designer's own mansion is trouble squared. Read about what it took me to create my virtual premises, the site of my design studio at The article covers designing the site's logo (of course!), choosing primary colors, composing the message of the front page, and defining the principles of the navigation system.

Preparing for XML

The idea of purely logical markup and separating content from presentation may sound simple and promising---until you ask yourself, what to do with the huge pile of existing HTML material?  Can it be painlessly adopted to XML syntax and, more importantly, to XML's ideology of generalized markup? I describe the modular approach allowing you to pursue an acceptably orthogonal design style in plain old HTML, and present some practical guidelines for working with modularized sites.  Then I demonstrate the relation of this technique to XML and suggest a way of converting current HTML designs into XSL stylesheets.

The Flesh and the Soul of Information

The skills needed for building a great web site are not only those of an artistic nature.  To manage your information freely and efficiently, you'll need to understand some fundamental abstractions developed by philosophers and computer scientists.  By looking at the origins and modern technology of document abstractions, the article encourages you to reconsider your accustomed way of developing, formatting, and managing your documents. The line of theoretical reasoning leads us to some utterly practical recipes and guidelines for drastically improving a Web site's quality in all its aspects.

The Art of Distortion

Artfully distorting your graphics with effects and filters can rarely be the foundation of your design, but is often very important at the finishing stages.  Learn the principles behind these transformations, how to choose the right one, and how to know when to abstain. The article covers simple (non-texturizing) effects such as color adjustments, complex (texturizing) effects such as blur or diffuse, and the role of complex amorphous shapes in design.

The World of Fonts

No other design discipline requires so much learning and training as fontography, and by no other aspect can amateurs be so easily distinguished from professionals.  The article relates the history of modern serif and sans serif typefaces, showing the main trends of font development in the last several centuries, and explains the principles of choosing and matching fonts in a design composition.

Modular Web Design

Producing a good site takes a lot of time and effort.  Actually, with a large site it may take forever unless you apply the powerful concept of modular design, that is, designing out of consistent modules.  See how the theory of consistency translates into the practice of modular design on the example of a site I recently designed, the Books of Russia online bookstore.  The article covers creating the logo, choosing layout, and designing the main elements for the site's front page and subpages.

The World of Texture

Some of the best web page designs out there rely on something more subtle and yet more powerful than just form, color, or composition: They creatively use textures to make the surfaces of objects look and feel different.  Read the article for an analysis of simple (geometric) and complex (naturalistic) textures, plus an overview of technical and creative issues pertaining to the use of web page backgrounds.

Size and Proportion in Web Graphics

. . . So, you've finished your preliminary drafts and are at the point of casting your ideas into GIFs and HTML.  But why is it that images that looked beautiful when magnified in a graphics program lose much of their charm after reduction to browser-ready sizes?  In this article, you'll learn about space limitations and proportioning principles applicable to web design, as well as some very peculiar laws that govern the realm of very small graphics (as always, with examples).

Putting It All Together: A Case Design Project

What does it take to design a web site from scratch?  What steps are involved in the process and where should one start?  Is it as scary as it sounds? :)  This article analyzes my redesign of the Quiotix Corporation web site, describing in depth all the stages of the project: from creating a company logo, through perfecting the front page and subpage drafts, to the implementation problems and accessibility issues involved.

Preview of HTML Unleashed, Professional Reference Edition

This book, now in preparation, is a professional reference edition of HTML Unleashed published this August by Publishing.  For this edition, I've contributed two new chapters that, thanks to the publisher's permission, are posted at this site.

Chapter 43: Strategies for Indexing and Search Engines.  For users, search engines are one of the major web tools; for webmasters, they are one of the most important sources of traffic and visibility. Read this chapter to learn all about luring search spiders, efficient keyword strategies, using META tags, and other secrets of search-friendly HTML design.

Chapter 42: Creating Widely Accessible Web Pages.  This chapter summarizes the techniques and approaches used to make web pages, without sacrificing their presentational sophistication, more accessible to people with physical disabilities.  With the recent launch of W3 Consortium's Web Accessibility Initiative (WAI), focusing on reconsidering web standards from the accessibility viewpoint, all webmasters and web designers should be aware of the needs of the disabled.

Photography in Web Design
Photography is an immensely powerful design tool capable of transmogrifying a beginner's exercise into an engagingly professional composition.  The article discusses what photos to use, where to find them, and how to integrate them into the page.
Geometric Primitives in Web Design
Before attempting to tame complex design elements, you must be utterly familiar with simple geometric forms, their uses, misuses, behavior, and limitations.  In the article, we'll investigate examples of using basic geometric primitives---straight lines, rectangles, and circles---on several well-crafted web pages.
Preview of HTML Unleashed

In spring 1997, I've written three chapters for HTML Unleashed, a comprehensive tutorial and reference volume published this summer by Publishing.  Now, thanks to the publisher's permission, you can read these chapters right here:

Chapter 3: SGML and HTML DTD.  SGML (Standard Generalized Markup Language) is a formal system designed for building text markup languages, HTML being one of them. Learn the foundations of SGML to see how understanding SGML ideology and design principles may aid you in learning and applying HTML.

Chapter 38: The Emergence of the eXtensible Markup Language (XML).  XML is a simple and compact subset of SGML designed specifically for use on the Internet in the way that HTML is currently used. This new project of W3C is gaining momentum at a surprising rate, and everybody seriously concerned with the future of HTML may want to check it out.

Chapter 39: Internationalizing HTML.  This chapter discusses the ways to overcome the pronounced Western bias in HTML and to make it more usable in the worldwide multilingual environment.  You'll learn about the use of character encoding standards, about the real-world problems of serving international web content, and about the new internationalization provisions of HTML 4.0.

Designing Site Navigation
Even with the best possible design of any single page, your site will fail to attract visitors if not equipped with a neat, consistent, and intuitive navigational interface.  We'll start by examining navigation bars on the home pages of Sun and Digital, then investigate their subpages' navigation machinery, and finally discuss a number of other navigation design options.
The World of Color
Giving your page a unique appeal is as simple as selecting the right background and text colors.  But first, you need to spend some time exploring the color universe and looking for the most captivating and least hackneyed colors.  In the article, I offer a guided tour around the color wheel and a number of illustrated tips on selecting stunning colors for your pages.
Being Creative by Example
Today's plain vanilla business site is much more artistic looking than it could be even 25 years ago (if, of course, the Web had existed in those times). In the survey, we'll surf a number of sites of professional designers to see what the future of mainstream web design might look like. The design aspects I've chosen for this study are layout and typography where, in my opinion, the design-oriented sites exhibit the best of their creativity.
The Art of Logo. Part II: Your Tools
The second installment of this tutorial introduces you to the most important concepts used in logo design. You'll learn how to choose the right proportions for the elements of your composition, how to use contrast to energize your design, how to achieve interesting effects with repetition, and how to finish your work with a dash of nuance. Sample logo projects are analyzed along the way to help you master these rather theoretical issues.
The Art of Logo. Part I: Your Media
On the Web, logos often serve as the main graphic heading---or a part thereof---on the page and, consequently, as the visual culmination of the entire page design.  This study of the art of making logos from a creative viewpoint, illustrated by a sample logo project, may be of interest to all graphic artists, both amateur and professional.  Read a comprehensive analysis of all stages of the creative process, from choosing the basic visual shape to applying finishes such as highlights and drop shadows.  Part I discusses the media of the craft, i.e. the materials you work on: forms, colors, fonts, and finishesBonus Tip: How to produce the "Venetian blind" effect of engraving a shape onto a lattice of parallel lines of varying width.

Had enough of this nutritious design dinner? Click here to help yourself to some links I served for a dessert---not necessarily design-related, but always thought-provoking and immediate fun!