Article from: Envato Tuts+
As a designer, explaining and putting visual work into words can be tricky, as not everybody is a designer. As a freelancer, it is up to you to get the idea across and describe (a.k.a. sell) your design to potential clients. Not only that, but getting feedback and knowing what you are talking about is important in order to be a credible designer.
In this article, we put together a list of 65 design terms that can help you translate visual ideas into a verbal conversation. The design terminology is vast and can get complicated to explain, especially to other non-designers. So we hope this list helps you understand and provides an easy way to describe the must-know design vocabulary terms.
Composition, also called layout, is the visual arrangement of design elements that create a complete image. Within a composition, you may use different principles of design to create visually pleasing work to deliver a functional layout.
Any element placed on a page has visual weight that can be affected by form, size, color, and texture. In order to make a layout balance, some elements might need to have a certain scale.
Alignment refers to the position of the elements on a layout—the way the visual elements are arranged so that they line up. The alignment can be left, right, justified, or centered.
Repetition creates consistency by repeating the same element within a layout multiple times.
Contrast is the level of differentiation between different design elements to create visual hierarchies. The variation may be in form, color, texture, and size.
Negative space is the blank area around a design element. It is used to emphasize certain parts of a layout and to focus on a specific element.
In graphic design terminology, you’ll quickly learn to arrange elements by the level of importance. Hierarchy is exactly that. In order to create hierarchy, you need to have contrast in your design. If one image is larger than the other, this will place the emphasis on the larger image, and the reader will look at it first.
Symmetry refers to the equal amount of elements reflected on a page. If you were to draw a vertical line through its center, the elements can sometimes be mirrored or the visual weight can be the same from one half to the other.
The opposite of symmetry is asymmetry. The elements on both sides of the centerline aren’t equal and can create an unbalanced design.
Grids are groups of intersecting vertical and horizontal lines that can help you structure content on a page. There are many types of grids for different uses, but the common denominator is that they help keep the content organized and clean.
If you are interested in diving into more composition and design terms, be sure to check out:
Let’s see some color terms and definitions. CMYK stands for cyan, magenta, yellow, and key (black). These are the four most basic colors you can use for print. You’ll notice CMYK colors aren’t as vibrant as RGB. This is because CMYK is subtractive—this means that the colors work with reflected light.
RGB colors are used on-screen only. RGB stands for red, green, and blue, and this color mode is additive, meaning that by mixing these primary colors in different combinations, we can simulate a bigger range of colors.
In graphic design vocabulary, grayscale is a monochromatic palette using different shades of gray in an image. A single image is composed of up to 256 combinations of shades of gray.
This refers to the level of transparency on an element. The lower the opacity, the more transparent the element is. If the opacity is set to 100%, it means the object is solid.
Saturation refers to the intensity of a color. You’ll notice saturated images appear brighter and punchier. Desaturated images are dull and almost colorless.
Hue is a way to describe a pure color without tint or shade (added white or black). For instance, any color on the color wheel is a hue (blue, yellow).
Tone refers to a hue with gray added. The tone will lower the intensity of color, and it can become dull.
Tint refers to a hue with added white to lighten it and make it paler. The tint can range anywhere from a slightly lighter color all the way to completely white, with barely any color.
Shade refers to black added to a color. This is the opposite of Tint—instead of making the color lighter, shade will darken it.
PMS or Pantone Matching System is the most widely used system for blending colors that aren’t CMYK. Every hue is identified by a number that is easy for designers to reference and reproduce when printing.
If you want to check out more about color terms and definitions, we have a section on it in this article:
The resolution of an image determines the file quality. A high-resolution image will be crisp, and wherever the focus is, it will have defined edges. The higher the resolution, the higher the quality. A low-resolution image will be pixelated and blurry.
A pixel is the smallest basic unit of color on a computer that makes up images. Depending on the amount of these tiny squares, you can have a high- or low-resolution image.
In graphic design terminology, PPI stands for pixels per inch. It is a measurement used to define the resolution of a screen, most commonly monitors, cameras, and scanners.
DPI is similar to PPI but is used for printing, and it stands for dots per inch. Printers produce images composed of small dots that affect the printing quality of an image.
Cropping refers to eliminating unnecessary parts of an image. By doing this, you’ll change entirely the direction, emphasis, and even composition of an image. Cropping improves the framing of an image to fit your project.
Similar to cropping, close-cropping refers to cutting out a specific element from an image. This is mainly done for headshots if you wish to use a different color background.
Trim size is the final size of a printed project after it’s been trimmed. The trim size is guided by the crop marks that are on a printed sheet.
This technique is used to determine the focal points of an image or design. Imagine a 3×3 grid on top of an image or a design. The four spots where the lines intersect indicate the focal points, and these areas are where the most important elements should be placed.
Learn more about grids in this article:
In graphic design vocabulary, kerning is the space between two specific characters. Certain pairs of letters can create awkward spaces, and by kerning them you can adjust the space between them. By adjusting the space, you can improve the legibility.
Similar to kerning, tracking refers to the spacing between characters. While kerning refers to a pair of characters, tracking applies to a group of letters. Here’s an article you can check to learn more about typography key terms:
Leading determines the distance between multiple lines of text. This ensures that the lines aren’t touching and that there’s enough space to read the lines comfortably.
Weight refers to the thickness of a character relative to its height. A typeface may come in many different weights, and most usually come with a normal and bold weight. It isn’t unusual to see fonts with anywhere from four to a dozen weights.
Here’s another typography key term: A font is measured in point size, and it dictates the height of the character. There are 72 points in 1 inch or 2.54 cm.
Uppercase characters are used at the beginning of sentences or the first letter of proper names. They are also called capitals or caps. The name uppercase comes from the old-school typesetting printing presses. Printers kept capitals in the upper drawer of a desk.
Lowercase glyphs are the non-capital letters that make up the rest of a text block. The name lowercase comes from the old way of setting type with printing presses. Printers kept the lowercase letters in the lower drawer of a desk.
Small caps are uppercase characters that are shorter than regular uppercase given in a font. Some typefaces come with small caps, while others don’t, and the software you are using will generate them. When small caps are designed as part of a typeface, they will usually be the same height as lowercase characters or just slightly taller.
Lorem ipsum is placeholder text that can help you show your design without meaningful content. It is mostly used at the beginning of a design project to mock up the design until the final copy is available.
Readability refers to the way blocks of text are arranged on a page. Legibility refers to how well one character can be distinguished from another.
Widows and orphans are seen when typesetting text. A widow is a short line or a word at the end of a paragraph or a column causing too much white space between paragraphs at the bottom of a page. An orphan is a short line or a single word at the beginning of a column or page.
If you are just as interested in typography as we are, be sure to check out:
A wordmark focuses on the business name alone rather than reducing it to a single lettermark. For instance, Google is already a memorable name, but if it’s combined with a strong typeface and colors, it results in a powerful wordmark.
Also known as a brand mark in logo design style, a pictorial mark refers to a graphic-based logo. It’s usually an icon that has been simplified and stylized to represent a brand. For instance, Twitter’s icon is a bird, and it’s recognized around the world as Twitter.
This is a mix of a wordmark and an abstract mark, a pictorial mark, or a mascot. The layout of this mark can vary depending on the elements you want to use. Think of the Victoria’s Secret logo or the Puma logo.
This is a shortcut icon: a distilled logo based on a primary logo that’s used on websites for branding purposes. These favicons are also used as profile pictures on social media. Some recognizable favicons are the «a» of Amazon and the «W» for Wikipedia.
Raster images are made up of a set of grid pixels that together make an entire image. If you want to stretch a raster image, it’ll get pixelated and blurry.
GIF stands for Graphics Interchange Format. This file format supports animation and transparency. It can only display up to 256 colors, which allows you to have small files, making it perfect for the web.
JPEG is the most widely known raster file. It’s used anywhere from images on an email to photos and anything you find online. JPEG stands for Joint Photographic Experts Group. Unlike PNG, JPEG doesn’t have the ability to be transparent. It’s suitable for web and print.
If you are looking to maintain some quality when an image is compressed, PNG is for you. PNG stands for Portable Network Graphics, and it was created to improve the quality of GIF.
TIFF images are mostly used in layout design and InDesign. It stands for Tagged Image File Format, and the format produces a higher quality image compared to the formats above.
Adobe Photoshop’s document format is PSD or Photoshop Document. This version is an uncompressed raster image file.
Vector graphics are made out of small graphics like points, lines, and curves. The shapes within a vector use a mathematical equation that allows the vector to be resized without compromising the quality. Vectors won’t get blurry, unlike the raster image format.
AI stands for Adobe Illustrator. This format was developed by Adobe to represent single-page vector drawings in EPS and PDF.
EPS stands for Encapsulated PostScript, and it’s a resizable format that contains vectors. They’re mostly used for logos so they can be scaled as needed in any type of project.
PDF stands for Portable Document Format and was developed by Adobe. This format is the most used format to be downloaded and viewed on any computer. From the vector standpoint, Adobe Illustrator can embed PGF data (Illustrator’s native format) onto a PDF so it can be used as a vector format.
Now that you know the fundamental design terminology for your work as a designer, you might be looking for a reliable source of assets for your projects.
You don’t need to worry about layout, composition, negative space, and readability with this ready-to-use magazine template. The InDesign magazine template features a clear layout, structured files, and vector graphics for your next magazine.
We’ve talked about emblem logos, where the name of the business is contained within a single shape. Here’s a fantastic emblem logo template you can easily customize on different design software.
Nothing beats the elegance of a serif font, and you can never have enough in your library. Check out Addington CF and add it to your toolbox. It includes:
If you like minimalism, you’ll love the composition and white space on this flyer template. Get it today and customize it to your needs using InDesign.
In this design vocabulary article, we rounded up 65 design terms that you should know. These terms can help you explain your designs to clients and talk about your work like an expert. Many of these terms we learn during our design studies, and it’s easy to forget them if you don’t use them often. Explaining these terms to your clients can also help them to be on the same page as you when it comes to feedback.
If you liked this article about fundamental design terminology, be sure to check out:
source
Article from: Envato Tuts+
