Let’s take a few minutes to talk about Design Language!

When I was younger I worked for a printing company. I worked the front desk and mostly handled answering phones and creating new orders for the designers in the back. As I started learning I realized that I had NO IDEA what anyone was talking about. Most fo the questions meant nothing and most of the words were confusing…

Most were basically gibberish to me… crop marks, gradient, jpeg…. yeah sure… huh?

So, let me help you out, and save you some TIME and ENERGY (and maybe keep you from feeling dumb, HA!)

The Text

1. Typography –

   Typography is the actual typeset. This allows you to choose your font, size, spacing and line length

2. Kerning –

   This is the process of adjusting the spacing between characters in your typography. Kerning adjusts the space between individual letters, uniformly.

3. Font –

   A collection of characters with a similar design. These characters include lowercase and uppercase letters, numbers, punctuation marks, and symbols.  For example, Arial has a simple, modern look, while Times New Roman has an older more traditional appearance.

The Look

1. Bleed –

   A printing term that is used to describe a document which has images or elements that touch the edge of the page, extending beyond the trim edge and leaving no white margin. When a document has bleed, it must be printed on a larger sheet of paper and then trimmed down.

2. Grid –

   In the design world this is used to help align elements and build groups with in a page. Using a “grid” will show you where to set things to get the look you are trying to achieve.

3. Gradient – 

   This is a transitional from one color to another (or a similar shade) OR from transparent to opaque

4. Margin –

   The space between the outside of an object and the edge of your document

The Files

1. JPEG –

   “Joint Photographic Experts Group” – best used when you need to compress (careful while editing)

2. GIF –

   animated and often used in web design

3. PDF –

   “Portable Document Format” – ideal for sending images to print

4. PNG –

   “Portable Network Graphics” – supports transparent background and excellent for web use

The Web

1. Web colors –

   Colors used on the web, typically represented by a hexadecimal 6-digit code

2. Resolution –

   This is the number of “dots” (pixels) per inch – the more dots the more crisp the image

3. Responsive –

   This refers to how the design adjusts to different screen sizes

Additional tips…

Check out these acrynons that you’ve probably heard and thought “the wha?”

• CMYK – “Cyan, magenta, yellow and Key (black)” – referring to colors – most often used for print
• DPI/PPI – “Dots per inch/Pixels per inch” – also known as resolution
• UI – “User Interface” – the way the design actually looks
• UX – “User Experience” – how the design flows and may behave