Did you know that most picture-taking situations have at least six possible combinations of f-stops and shutter speeds that will all result in correct exposure? They may not all be creatively correct photographic exposures, but they will all be correct. More often, only one or two of these f-stop shutter speed combinations is the creatively correct motion-filled exposure.

(more…)

Freelancing is not easy. Designers out there are good and they are getting better every day, not to mention the up and coming talents who spring forth from the mist of anonymity daily. This leads me to believe that competition for jobs is more real than ever. What’s more, if you take a closer look at the css galleries, many designers portfolios are made up of the same work. Do not go that route. Create for yourself and promote yourself with your work.

It’s not easy to stand out of the crowd as it used to be just a few years ago, but these tips should help you get ahead.

1. Try and be really unique
2. Find your strengths (e.g. wordpress design)
3. Build a brand around you as it’s yourself whom you are selling
4. Create a one-off portfolio focusing on your strongest skill
5. Draft a carefully-wrought CV in PDF format
6. Send your portfolio’s address to all of the css galleries
7. Find job assignments on the most popular job boards
8. Answer all the incoming client emails
9. Write quality-posts in your blog
10. Set up a Twitter account and follow the best ones in the trade
11. Register at LinkedIn
12. Promote yourself at popular blogs and forums
13. Run targeted advertisements
14. Join one of the professional organizations of webdesigners
15. Don’t you ever give it up!

Conclusion

Not giving up is a big one. Like all good things it comes with time and experience. Not everyone can become a successful freelancer over night. If you have any other tips to put on the table leave them in the comments for us all.

What is color? Take a moment to consider this question before reading on.

The first true critical thinking about color occured during the Renaissance in Europe. A number of artists, chemists, and philosophers took it upon themselves to develop working theories about the nature of light and color.

In a previous article, I referred to color as an element of design, one of the basic tools that designers can use when building a composition. I defined color as “the response of the eye to differing wavelengths of radiation within the visible spectrum.” This is a valid definition, but it is only one of many different thoughts on what color is.

Over the course of my next few articles, we will explore the subject of color, including the historical underpinnings of contemporary color theory, key color theories, theorists who have been influential over the past few millennia, and the current state of color—including color in digital environments.

We will, in the end, keep the focus on the discipline of design. But, as in previous articles, we must deviate for a time to better explore the topic at hand. As with all of the principles and elements of design, much is inherited from other fields and we must initially expand the scope of our investigation.

(more…)

In the last three articles, we discussed the fundamental concepts of design. We started with the principles of logo design—the underlying tenets of the profession dealing with the arrangement of objects in a composition. Next, we looked at the elements of design—the objects used to create the composition itself. Finally we looked at the medium of the Web, and at some of the constraints inherent in such an environment that could alter the way we use the principles or elements of design. Taken together, the topics covered thus far form the basis of any design education. And they can help any designer, whether a novice or professional, advance in their profession.

Bridging the Gap
So far we have looked at the fundamentals of design in a rather abstract way, discussing and illustrating the concepts using simple shapes and forms. This is an excellent way to introduce the principles and elements of design, but does not bridge the gap between theory and practice. In this article we will be reviewing many of the topics previously covered, but we will be doing so using actual Web sites so that we can see how everything we have been talking about fits together.

I have reviewed eight designs. I will discuss each one in detail, highlighting the principles and/or elements of design that they make best use of. I’ve included a sample screen shot and a more abstract view of the design highlighting the relevant principle or element. In addition, you can click on the title image to go to the actual site in the Zen Garden for direct reference.

(more…)

In the last two articles we looked at the basic tenets of the design practice, the principles and elements of design. We stepped back a bit from any one medium to investigate the more universal concepts of design in general, and how these axioms are often derivative of other art forms. We tried to establish a solid foundation of design terms and techniques that were independent of any one implementation.

I often get asked what size I design at and whether or not I use fixed-width or percentage-based designs, and why. The best answer I can give is that it depends on the situation. I use both fixed-width and percentage-based designs, and determine which to use based on user research, intended audience and client expectations.

Now it is time to turn our attention to the Web. Within any given medium there are unique constraints that can affect the way designers make use of the principles and elements of design. These constraints can be based on a variety of different things including materials, technology, processes and standards in the industry. The Web is no different. Designing for a Web-based environment enacts a set of unique issues that need to be considered before implementation can be successful.

(more…)

The elements and principles of design are the building blocks used to create a work of art. The elements of design can be thought of as the things that make up logo design, a painting, drawing, design etc. Good or bad – all paintings will contain most of if not all, the seven elements of design. The Principles of design can be thought of as what we do to the elements of design. How we apply the Principles of design determines how successful we are in creating a work of art. Previously I wrote about ‘the Principles of Design‘ and now I will continue with the Elements of Design by discussing the components of the composition itself, and provide the designer with a basic set of tools to begin working with.

In The Principles of Design we looked at half of the basic tenets that underlie the field of design. The principles of design represent the basic assumptions of the world that guide the design practice, and deal with the arrangements of objects in any given composition. In this column we investigate the other half of the tenets, the elements of design, in an effort to bring together a solid foundation on which we can base all future investigations.

What are Elements of Design?

The elements of design are the basic components used as part of any composition. They are the objects to be arranged, the constituent parts used to create the composition itself. In most situations the elements of design build upon one another, the former element helping to create the latter, and the elements described in this column are arranged as such. We will be focusing on the elements of point, line, form (shape), texture and color.

Point
A point is an element that has position, but no extension. It is a single mark in space with a precise, but limited, location. Alone it can provide a powerful relation between negative and positive space, but when grouped with other points the Gestalt grouping principal of closure tends to kick in and the brain compulsively connects the points together. Line or form is a natural result of multiple points in space.

Line
A line is an element characterized by length and direction. Lines create contours and form, and are often used to convey a specific kind of feeling or point to an important feature in a design. Lines are also used to create perspective, and dominant directional lines are often adopted to create a sense of continuance in a composition. In addition, lines that are grouped together often create a sense of value, density or texture.

Form (Shape)
The simplest definition of shape is a closed contour, an element defined by its perimeter. The three basic shapes are: circle, rectangle (square) and triangle. Form is the shape and structure of a dimensional element within a given composition. Form can be both two-dimensional and three-dimensional and can be realistic, abstract or somewhere in between. The terms form and shape are often used synonymously, which is why they are both included here. In reality, form is derived from the combination of point, line and shape.

Texture

Texture is used to create surface appearance, and relates to the physical make-up of a given form. Texture often refers to the material that something is made of, and can be created using any of the elements previously discussed. Texture is both a visual and a tactile phenomenon.

Color
Color is the response of the eye to differing wavelengths of radiation within the visible spectrum. The visible spectrum is what we perceive as light. It is the part of the electromagnetic spectrum that we can see. The typical human eye will respond to wavelengths between 400-700 nanometers (nm), with red being at one end (700 nm), violet at the other (400 nm) and every other color in between these two.

There are many different kinds of color systems, and many different theories on color. We will get into that kind of detail in a later column. For now we will focus on the basics, using a color wheel for illustration purposes. There are three main components of color:

• Hue: Where the color is positioned on the color wheel. Terms such as red, blue-green, and mauve all define the hue of a given color.
• Value: The general lightness or darkness of a color. In general, how close to black or white a given color is.
• Saturation: The intensity, or level of chroma, of a color. The more gray a color has in it, the less chroma it has.

Color Harmonies
Color harmonies serve to describe the relationships certain colors have to one another, and how they can be combined to create a palette of color.

• Complementary: A complementary relationship is a harmony of two colors on the opposite side of the color wheel. When complementary colors are placed side-by-side they tend to enhance the intensity (chroma) of each other, and when they are blended together they tend to decrease the intensity of each other
• Analogous: An analogous relationship is a harmony of colors whose hues are adjacent to one another on the color wheel. Analogous colors tend to be families of colors such as blues (blue, blue-violet, blue-green) and yellows (yellow, yellow-orange, yellow-green).
• Triadic: A triadic relationship is a harmony of three colors equidistant from one another on the color wheel. Primary colors and secondary colors are examples of color triads.

Color spaces
Color is typically organized in a hierarchal fashion, based on how colors are mixed. A color space helps to define how the colors are mixed, based on the medium in which the colors are used. There are two different kinds of color spaces:

• Subtractive: A subtractive color space is the traditional color space that most people refer to when they talk about color. It is pigment-based color, as in the mixing of paint. In a subtractive color space, the pigments manipulate the wavelengths that our eyes see. The absence of any pigment produces white, and all pigments blended together produces black.
• Primary colors: Red, yellow, blue
• Secondary colors: Orange, green, violet
• Additive: An additive color space is an electronic color space. It is light-based color, as in the mixing of color on the computer. In an additive color space, light is added to the screen in differing amounts to produce color. The absence of any light is black, the presence of all light, or light at full intensity, is white.
• Primary colors: Red, green, blue<.li>
• Secondary colors: Yellow, magenta, cyan

Related Concepts
There are many additional concepts that are related to the elements of design. These can include specific terms and/or techniques that are in some way based on one or more of the above ideas. In they end, they add to the collection of compositional tools available for use by the designer.

Typography

Typography is the art of arranging typefaces, selecting style, line spacing, layout and design as a means of solidifying language. There are many facets to typography, and only a brief investigation will be started here based around some common terms.

• Baseline: The line on which all letters rest.
• Beardline: The line reached by the descenders of lowercase letters.
• Bowl: The round or elliptical parts of a letterform.
• Cap line: The line reached by the top of uppercase letters.
• Counter: The white space enclosed by a letterform, whether completely or partially.
• Extenders: Extenders are the parts of letters that extend either below the baseline (descenders) or above the midline (ascenders).
• Midline: The top of lowercase letters such as a, c, e and the top of the torso of lowercase letters such as b, d.
• Serif: A stroke added to either the beginning or end of one of the main strokes of a letter.
• Stem: The main stroke of a letter that is generally straight and not part of a bowl.
• Topline: The line reached by the ascenders of lowercase letters.
• X-height: The distance between the baseline and midline of an alphabet. The x-height is usually the height of the unextended lowercase letters.

Pattern
Pattern is the repetition of shape or form. It can also reflect the underlying structure of a design by organizing the surfaces or objects in the composition. There are many different kinds of patterns:

• Flowing: A flowing pattern is based on the repetition of an undulating line, and reflects a natural meandering through a composition.
• Branching: A branching pattern is the repetition of forking lines, or patterns of deviation. These kinds of patterns can be found in almost all plants, and in many other places in the natural world.
• Spiraling: A circular pattern, or a pattern that winds in and around itself.

Movement

Movement can be defined as motion of objects in space over time, and is often described in one of two ways:

• Literal: Literal movement is physical movement. Examples of literal movement include: Products such as the automobile, motion pictures and dance.
• Compositional: Compositional movement is the movement of the viewer’s eye through a given composition. Compositional movement can be either static or dynamic. Static movement jumps between isolated parts of a composition. Dynamic movement flows smoothly from one part of the composition to another.

Conclusion
We have thoroughly explored the fundamental concepts of the field of design. The principles of design give us a way of looking at the world. The overarching axioms of the profession affect the designer universally, and provide guidance for any composition. The elements of design discuss the components of the composition itself, and provide the designer with a basic set of tools to begin working with.

In order to explore the fundamentals of design, we needed to step back a bit away from any one medium. Now it is time to focus in on the Web. In the next column we will investigate the constraints of designing for the Web that can effect how we make use of the principles and elements of design. We will look at medium-specific concepts, such as screen resolution, graphics compression and color mixing in additive spaces.

Starting with the Basics

This column is about Web design—really, it is—though it may at times seem a bit distant and distracted. In my opinion, any good discussion about design begins with the fundamentals. Almost by definition, the primary tenets around which any field is based are universal: they can be applied to a variety of disciplines in a variety of ways. This can cause some confusion as principle is put into practice within the unique constraints of a particular medium.

We can group all of the basic tenets of design into two categories: principles and elements. For this article, the principles of design are the overarching truths of the profession. They represent the basic assumptions of the world that guide the design practice, and affect the arrangement of objects within a composition.

Web design is a relatively new profession compared to other forms of design, due to the youth of our medium. As with any design discipline, there are aspects of the Web design process that are unique to the medium, such as screen resolution, additive color spaces and image compression. But too often these more unique details override our sense of the bigger picture. We focus on the fact that it is Web design and push aside core design concepts—concepts that can that make any project stronger without interfering in the more technical considerations later on.

How Does Web Design Fit In?

I tend to define Web design as being one of many disciplines within the larger field of design (a peer to print design, industrial design, interior design, etc.). To step back even further, I see design as a discipline within the field of art (a peer to painting, illustration, sculpture, etc.) The point is that in order to start with a discussion about the fundamentals of design as they relate to Web design we need to understand that there is a good degree of inheritance that design has received over the years from other art forms. These art forms, such as lithography, typography, painting/illustration and industrial design, evolved over many centuries, and a number of basic ideas have emerged as providing universal guidance to any artistic endeavor. When talking about fundamental concepts we inevitably look outside our discipline and adopt a slightly larger perspective.

The Principles of Design

There are many basic concepts that underlay the field of design. They are often categorized differently depending on philosophy or teaching methodology. The first thing we need to do is organize them, so that we have a framework for this discussion.

We can group all of the basic tenets of design into two categories: principles and elements. For this article, the principles of design are the overarching truths of the profession. They represent the basic assumptions of the world that guide the design practice, and affect the arrangement of objects within a composition. By comparison, the elements of design are the components of design themselves, the objects to be arranged.

Let’s begin by focusing on the principles of design, the axioms of our profession. Specifically, we will be looking at the following principles:

• Balance
• Rhythm
• Proportion
• Dominance
• Unity

Balance

Balance is an equilibrium that results from looking at images and judging them against our ideas of physical structure (such as mass, gravity or the sides of a page). It is the arrangement of the objects in a given design as it relates to their visual weight within a composition. Balance usually comes in two forms: symmetrical and asymmetrical.

Symmetry

Symmetrical balance occurs when the weight of a composition is evenly distributed around a central vertical or horizontal axis. Under normal circumstances it assumes identical forms on both sides of the axis. When symmetry occurs with similar, but not identical, forms it is called approximate symmetry. In addition, it is possible to build a composition equally around a central point resulting in radial symmetry1. Symmetrical balance is also known as formal balance.

Asymmety

Asymmetrical balance occurs when the weight of a composition is not evenly distributed around a central axis. It involves the arranging of objects of differing size in a composition such that they balance one another with their respective visual weights. Often there is one dominant form that is offset by many smaller forms. In general, asymmetrical compositions tend to have a greater sense of visual tension. Asymmetrical balance is also known as informal balance.

Rhythm

Rhythm is the repetition or alternation of elements, often with defined intervals between them. Rhythm can create a sense of movement, and can establish pattern and texture. There are many different kinds of rhythm, often defined by the feeling it evokes when looking at it.

• Regular: A regular rhythm occurs when the intervals between the elements, and often the elements themselves, are similar in size or length.
• Flowing: A flowing rhythm gives a sense of movement, and is often more organic in nature.
• Progressive: A progressive rhythm shows a sequence of forms through a progression of steps.

Proportion

Proportion is the comparison of dimensions or distribution of forms. It is the relationship in scale between one element and another, or between a whole object and one of its parts. Differing proportions within a composition can relate to different kinds of balance or symmetry, and can help establish visual weight and depth. In the below examples, notice how the smaller elements seem to recede into the background while the larger elements come to the front.

Dominance

Dominance relates to varying degrees of emphasis in design. It determines the visual weight of a composition, establishes space and perspective, and often resolves where the eye goes first when looking at a design. There are three stages of dominance, each relating to the weight of a particular object within a composition.

• Dominant: The object given the most visual weight, the element of primary emphasis that advances to the foreground in the composition.
• Sub-dominant: The element of secondary emphasis, the elements in the middle ground of the composition.
• Subordinate: The object given the least visual weight, the element of tertiary emphasis that recedes to the background of the composition.

Unity

The concept of unity describes the relationship between the individual parts and the whole of a composition. It investigates the aspects of a given design that are necessary to tie the composition together, to give it a sense of wholeness, or to break it apart and give it a sense of variety. Unity in design is a concept that stems from some of the Gestalt theories of visual perception and psychology, specifically those dealing with how the human brain organizes visual information into categories, or groups.

Gestalt theory itself is rather lengthy and complex, dealing in various levels of abstraction and generalization, but some of the basic ideas that come out of this kind of thinking are more universal.

Closure

Closure is the idea that the brain tends to fill in missing information when it perceives an object is missing some of its pieces. Objects can be deconstructed into groups of smaller parts, and when some of these parts are missing the brain tends to add information about an object to achieve closure. In the below examples, we compulsively fill in the missing information to create shape.

Continuance

Continuance is the idea that once you begin looking in one direction, you will continue to do so until something more significant catches your attention. Perspective, or the use of dominant directional lines, tends to successfully direct the viewers eye in a given direction. In addition, the eye direction of any subjects in the design itself can cause a similar effect. In the below example, the eye immediately goes down the direction of the road ending up in the upper right corner of the frame of reference. There is no other dominant object to catch and redirect the attention.

Similarity, Proximity and Alignment

Items of similar size, shape and color tend to be grouped together by the brain, and a semantic relationship between the items is formed. In addition, items in close proximity to or aligned with one another tend to be grouped in a similar way. In the below example, notice how much easier it is to group and define the shape of the objects in the upper left than the lower right.

Related concepts

There are many additional concepts that are related to the principles of design. These can include specific terms and/or techniques that are in some way based on one or more of the above tenets. In they end, they add to the collection of compositional tools available for use by the designer.

Contrast or Opposition

Contrast addresses the notion of dynamic tension – the degree of conflict that exists within a given design between the visual elements in the composition.

Positive and Negative Space

Positive and negative space refers to the juxtaposition of figure and ground in a composition. The objects in the environment represent the positive space, and the environment itself is the negative space.

Rule of Thirds

The rule of thirds is a compositional tool that makes use of the notion that the most interesting compositions are those in which the primary element is off center. Basically, take any frame of reference and divide it into thirds placing the elements of the composition on the lines in between.

Visual Center

The visual center of any page is just slightly above and to the right of the actual (mathematical) center. This tends to be the natural placement of visual focus, and is also sometimes referred to as museum height.

Color and Typography

Many would place color and typography along side the five principals I have outlined above. I personally believe both to be elements of design, so I’ll give them some attention in my next column. In addition, both topics are so robust that I plan on writing an entire article about each of them in the future.

Conclusion

In Web design it is too easy to get engrossed in the many unique constraints of the medium and completely forget some of the underlying concepts that can strengthen any design. To better discuss such concepts, we need to step back from our specific discipline and look to the history of the field. It is here we find the axioms of our profession.

In this article we looked at half of those axioms, the principles of design. The principles of design are the guiding truths of our profession, the basic concepts of balance, rhythm, proportion, dominance and unity. Successful use of these core ideas insures a solid foundation upon which any design can thrive.

In the next column, I will discuss the elements of design—the basic components used as part of any composition including point, line, form (shape), texture, color and typography. Comments or suggestions are welcome and appreciated.

I decided recently to move my Network News section to the front page of Lucas Cobb Design because of the quality of articles that were being submitted. I want to give credit where credit is due and feel that they belong on the front page of my site. This will give a broader range of articles to you all and will showcase the talent of the design community as a whole. I am still contemplating on whether or not to keep the site as it is now or change it back to how it used to be (8 or so posts on each page and a separate page for Network News).

What I need to find out is how you all feel about this change? I value your opinions as much as my own and want the best possible site for my readership. I am focused on ease of use and a pleasant design aesthetic that builds community between my readers and designers. I feel that if you only read what I put out there then you only get what I know and nothing from other designers out there with valuable input to this thing we call design. I feel with how the way the site is laid out now gives everyone a voice on my blog and I want to know if you feel the same way.

So what it comes down to is should I leave it this way or change it back? Let me know how you feel in the comments and I will take it to heart. You all make the decisions right along with me on this one. I look forward to seeing what you have to say. Take care!

Here is another list I compiled of my favorite photography books of all time. Earlier this week I compiled a list of web design related books and graphic design related books you should add to your collection and I feel that these are the graphic design related books that need to be in your collection as well. They are packed with tips and tricks that will push your designs to the next level. If I missed any books that you just can’t design without, let me know in the comments and I just might add it to my collection. Have a great weekend everybody!

1. National Geographic Image Collection By Michelle Delaney & Maura Lulvihill (5.0 out of 5 stars)

Behind National Geographic’s worldwide reputation as a powerhouse of photography lies one of the finest, most extensive, and most unique graphic resources on Earth: the National Geographic Image Collection. For the first time ever, readers will plumb the fascinating depths of this immense archive from the earliest photographs collected in the late 19th century to the cutting-edge work of today.

2. The Digital Photography Book, Volume 3 (4.3 out of 5 stars)

This book truly has a brilliant premise, and here’s how Scott describes it: “If you and I were out on a shoot and you asked me, ‘Hey Scott, I want the light for this portrait to look really soft and flattering. How far back should I put this softbox?’ I wouldn’t give you a lecture about lighting ratios, or flash modifiers. In real life, I’d just turn to you and say, ‘Move it in as close to your subject as you possibly can, without it actually showing up in the shot.’

3. VisionMongers: Making a Life and a Living in Photography (4.9 out of 5 stars)

A book for any photographer who’s ever felt compelled to combine their craft with the world of commerce and make the transition to becoming a vocational photographer. More like a sketchbook of ideas and wisdom than it is a system to get rich quick on photography, VisionMongers takes a look at the changing landscape of professional photography and the various journeys that can be taken to get there.

4. Within the Frame: The Journey of Photographic Vision (4.8 out of 5 stars)

A book about finding and expressing your photographic vision, specifically where people, places, and cultures are concerned. A personal book full of real-world wisdom and incredible images, author David duChemin (of pixelatedimage.com) shows you both the how and the why of finding, chasing, and expressing your vision with a camera to your eye.

5. The Photographer’s Eye: Composition and Design for Better Digital Photos by Michael Freeman (4.6 out of 5 stars)

Design is the single most important factor in creating a successful photograph. The ability to see the potential for a strong picture and then organize the graphic elements into an effective, compelling composition has always been one of the key skills in making photographs.

6. The Digital Photography Book, Volume 2 by Scott Kelby (4.6 out of 5 stars)

In Volume 2, Scott adds entirely new chapters packed with Plain English tips on using flash, shooting close up photography, travel photography, shooting people, and even how to build a studio from scratch, where he demystifies the process so anyone can start taking pro-quality portraits today! Plus, he’s got full chapters on his most requested topics.

7. The Moment It Clicks: Photography secrets from one of the world’s top shooters by Joe McNally (4.2 out of 5 stars)

Joe McNally, one of the world’s top pro digital photographers, breaks new ground by doing something no photography book has ever done-blending the rich, stunning images and elegant layout of a coffee-table book with the invaluable training, no-nonsense insights, and photography secrets usually found only in those rare, best-of-breed educational books.

I’ve seen a few posts floating around dealing with the best design blogs to read on a daily basis and I wanted to put my two cents in. These are the design blogs that I read on a daily basis and I find they help me improve as a designer because of the tips and tricks they provide on a regular basis. I’m not saying all you should do is read design blogs, but it wouldn’t hurt to stay ahead of the game by keeping tabs on them.”

My Faves

Abduzeedo is a great place to see inspirational posts. The user-news section is top notch and always up to date with the design trends.

Color Burned is always chalk full of freebies and giveaways. He also has great insight into design as a business and shares that knowledge.

Creative Opera is a new blog I just started following, but any info you need on Facebook you can find here. There is also a personal touch to the posts that is not to be missed.

Congrats to them for making it into the Smashing Network recently. I stop by this blog daily for all my CSS updates and all things code.

Design Juices keeps you in the loop on upcoming artists, photographers, designers, etc. The artists they showcase are very impressive and appreciated.

Design Ora keeps me up to date on the latest machinery and flash web design. There is always free backgrounds to be had at this place also.

Echo Enduring has a spaced out theme with amazing posts ranging from designing to the Olympics. They also offer exclusive texture packs and tons of freebies.

Line25 is another blog that just made it into the Smashing Network so congrats to them as well. You can see all kinds of design related posts here. Great read for sure.

LBOI just turned 1 year old so a HUGE CONGRATS to them. The posts here have a personal touch that you just can’t find on any other blog. Great design related articles all the time.

What is there to say about Six Revisions that hasn’t already been said. One of the first and still one of the best design blogs out there. You have to check them out.

Three Styles has boat loads of tutorials and design resources posted daily. They are also celebrating a 6 month birthday so another Congrats to them.

Web Designer Depot is your one stop shop for all things web design. These guys post everything from code snippets to graphic optimization. This is not to be missed.