In the previous article, I tried to give small hints about getting prepared to set up and start the design process with ease.
Once we have the blocks of information and the important information areas determined, we can have a look at the design elements and how they can be used to interprete the ideas and messages, using the visual language.
So, here we go:
Design Elements:
- Points:
Points are the elements that have positions, which are basically root for lines. The difference is; while lines have continuing extension, points are individual objects without extensions:
Still, according to “Gestalt Visual Perception Theory”, when multiple point elements are gathered within a relative space, human eye tends to connect the point elements and visualize the form and shape:
We can see how Addcomm website uses the point elements grouped within forms, lines and shapes in the homepage illustration:
- Lines:
Lines are the spaceless figures between points, hacing direction, length and angle.Lines help building forms, shapes and figures to represent an idea or matter. For illustration purposes; lines are also used for imitating perspective, dominance and continuity:
- Forms and Shapes:
Shapes are the figures created by connected lines, having 2 or multi-dimensional formats.Shapes are mostly the resemblence of real life figures, used for imitating the real life concept in graphical preference:
Typography, which is another form of shapes, is used for creating type content and visual language.
So in short, we can say following objects refer to as shapes:
- Figures
- Icons
- Drawings
- Figured elements of illustrations
- Types / Fonts
- Marker shapes
See how web2.la website uses the shapes effectively:
- Textures:
Textures are complex combination of forms, shapes, lines and figures. Mostly used to create surface appearance or visual image.In this matter, background patterns, surface imitations and pictures are categorized as texture elements:
- Color:
Color is one of the strongest elements for design. It is used to create harmony, represent a feeling and completing the design concept. Shades, tints and tones of color is percepted by the source of light. Without light, it is only black. Knowing that do help illustrators, photographers and designers create good imitations of reality and visual compositions with the effective blend of light and color.Typical human eye will respond to wavelengths between 380-740 nanometers (nm), with red being at one end (740 nm), violet at the other (380 nm) and every other color in between these two.Sometimes in the spectrum of colors, heat of the light source (kelvin values) also affects on the range of color distributon.
Basically there are mainly 3 properties of color:
- Hue: Is the position and direction from “white” of the colors. The hue value of a color determines the position of the color in the color wheel. Hue value is referred as the exact and pure tone of a color without tint and shade properties.
- Value, Shades and Tints: Value is the measure of where a particular color stands along the lightness–darkness axis. Tint is used to add white balance, and shade is used to add black balance to the color.
- Saturation: Determines the strength of color tone. It is practically the the amount of gray in a color. The more the color has gray tones, the more it is saturated
There is a lot more to talk about colors and characteristics of them, but it is another big issue that I would like to mention later.
Usage of a good color harmony alone can make the design effective, or bad usages can sink the job. I can say color is almost the biggest and most powerful element among all other design aspects.
See how tweetapp uses a great color palette and blend it in the design nicely:
Knowing what elements are needed, what style they need and why are they needed is important.
Good design has never been popular, it is the effective design that does the score, which also covers good design.
Tags: color, elements, forms, points, web design, white space