Why Good Design is Essential

Everyone loves great design whether they know it or not. At the core, design passively influences decision making which means that your designs can determine your business’s fate. Bold claim? Nope.

Think about it like this: you are researching the best CMS software for your sales team and run across a startup that claims to have the best CMS product that has EVER been invented because of its advanced machine learning, AI, and (insert cliche startup tech here). BUT, their website, marketing materials, and branding looks like they've hired an intern, blindfolded them, and promoted them to lead designer. Subconsciously, you’ve immediately judged the quality of this startup’s product as soon as you’ve seen how they present themselves through their design. If they can’t even manage to present their product in a semi-decent manner, how can potential customers or investors trust that their product will do what they are claiming? They cant and they won't.

I’ve had many people ask how I design my company branding, pitch slides, marketing materials, and more, so here is a breakdown of how I approach design and the fundamentals that can help anyone achieve great design.

Typography

The most critical aspect of any design, is the choice of typefaces (or aka, fonts) and how they are used. Humans rely heavily on literature so wisely choosing your typeface(s) and using them correctly is crucial for your customers and prospective investors to quickly and easily interpret your messaging.

Some quick definitions

• Typeface: A fancy word for “font.”
• Typeface Family: There are different families of typefaces. Serif, Sans-Serif, Slab-Serif, etc. This is essentially a typeface’s classification.

Choosing typefaces (fonts)

• Don’t use more than two typefaces: (and if you’re inexperienced with design, keep it to one to be safe)

• Choose similar typefaces: When choosing a typeface pairing, make sure they are of the same family (serif, sans-serif, script, etc) of typeface. Unless you have some design skills, it’s hard to properly pair different families of typefaces although it is very possible with some practice. If you want to pair two families, a safe bet is a sans-serif with a serif typeface.
• Reliable typefaces are best: Most important of all, make sure the typeface(s) that you choose are easily readable, especially the typeface that you will use for the big chunks of information that people will be reading. Sans-serif and serif fonts are always the safest bet. Here is a list of some good ones.
• Never use Comic Sans.

Using a typeface, effectively

• Use around 2X or more point size variation: For example, have your primary header text be around 48px, secondary header at 24px, and your body text be 12px. These large differences in sizes makes it easy for the reader to identify different sections and will make your designs far more interesting to the eye.

• Vary your typeface weights: The general rule is to “skip a weight” between text hierarchies (headers, body text, etc). For example, if your body text is “normal,” skip “bold” make your header above it “extra bold.”

• Keep text left-aligned when possible: Why? Most languages are read from left to right, so when you are reading multiple lines of text and get to the end of one line, your eyes must snap back to the left to the next line. When text is left aligned, you subconsciously know exactly where the next line will be, which makes reading far easier than having to search for the start of a new line.
• Never center align more than two lines of text: This is for the same reason that was listed above.

• Avoid orphans: No, not that type of orphan. An orphan in typography is a single word on its own line at the bottom of a chunk of text.
• Keep things consistent: If your primary headers are extra bold, 48px, and in Arial on one design, keep them that way throughout all of your designs.

Resources for Good Typefaces

1. Google Fonts: There are tons of great typefaces here and their super easy to download or include in your web projects. You can even easily add them to your Google Docs or Slides by clicking “More Fonts” when choosing your typeface.
2. Fontjoy: This website tends to put together some nice typeface pairings. Although my general rule of thumb is two typefaces, this website will pair different typefaces for you.
3. A List of my go-to typefaces on Google Fonts

Color

Color directly influences mood. Therefore, picking the wrong or right colors for your company can influence that gut feeling a customer or an investor gets about your business. There are many ways to approach developing a good color pallet for your brand. This is my personal take on it and I find that it’s one of the simpler ways for non-designers to create great color pallets as well.

Basics of a Good Color Pallet (5 Colors)

• One “primary” color. This should be a lighter color of your “dark” color or a darker version of your “light” color depending on if you want to go with a lighter color scheme or a darker color scheme. This should typically be a color that is not to dark and is “the” color of your brand. I usually start with this color and have a general idea in my head if I want the brand to be based around red, blue, green, etc.
• One “dark” color. A dark blue, deep red, pure black, or anything that is fairly close to black itself. This or your light color will serve as your primary background color. If you want a darker theme, choose your dark color for your primary background and vise versa
• One “light” color. A light green, light orange, pure white, or anything that is close to a pure white color. Between this and your dark color, you’ll be able to create great contrasts in your designs.
• One “secondary” color. Set your secondary color as a color in-between your dark or light color and your primary color. In-between dark and primary = darker theme. In-between light and primary = lighter theme.
• One “highlight” color. This is typically a color inverse to your primary color if you are going for a color theme that can “pop.” If you want a more monotone theme, choose a color that is between your dark or light color and your primary color (you should choose the opposite from your secondary color in this case).

• Main text color. Typically, black or white for all large chunks of text.
• Other text color. You have a great pallet of 5 different colors and they will work perfectly for text as well. Just make sure that your text color is always easily readable against whatever background color that it is on and its a relatively small chunk of text that is colored. Using color in text is one of the best ways to highlight the most important pieces of information to your viewers.

Resources for Color Picking

1. Coolors: This is my go-to resource for quickly getting a good color pallet. It’s as easy as hitting the space bar to randomly generate a pallet. Typically, I’ll save my favorite outcomes and then start to narrow down to my final selection from there.
2. Adobe Color: This is a great collection of premade themes and you can even create your own through uploading a photo which it will extract the most prevalent colors from and generate a color pallet from them.

Layout

Good layout is all about good “balance.” In non-designer terms, balance is having an about equal amount of content and spacing on the left of the page as you have on the right. What does layout influence? If you haven’t seen from the previous sections, all elements of design influence emotion, which influences decision making of customers and investors, which influences the fate of your business. So, let’s learn how to influence them in the right way with great layout design.

Some quick definitions

• Positive space: Space that is taken up by images, text, graphics, and other content.
• Negative space: Space that is empty and that lacks any images, text, graphics and other content.

The basics of good layout design

• Spacing: Don’t give elements too little “breathing room,” but make sure that elements that are meant to be together are not so far apart that the viewer no longer interprets their connection to one another.

• “Balance” of elements: Getting the right balance can be tricky, but you can achieve good balance by simply having about the same amount of elements on one side of the design as the other. Or, you can strike a contrast with lots of elements on one side, and very few on the other.

• Highlighting elements: Using lots of negative, and a touch of positive space is arguably the best way to make a piece of information stand out.

• Consistent shapes: If you start using squares, images, and other elements with sharp corners, make sure all elements have sharp or corners with the same radius. If you choose to use circles, stay with a “smooth” aesthetic with for your other elements.
• Consistent spacing: If you have 20px between your header and your body paragraph in one design, its safest to keep it that way on all other designs.

Conclusion

Good design really isn’t hard to achieve once you break it down and understand the fundamentals of it’s foundation. The great thing about understanding it is that the fundamentals of good design is universal. UI / UX, Graphic Design, Web Design, and any other type of design relies on these fundamentals.

My last piece of advice for you is to take a look at what some of the best designers in the industry are doing and dissect their work to see how they are using these fundamentals. This will help you gain a greater understanding of how to use them for yourself. Take a look on Behance.