The basic rules of modern digital design

Rule #1: Learn the basics of typography again
You can tell a lot about a designer by their typography. That’s because typography is a fundamental element of design.

Typography as a visual medium

You can use fonts to create entire designs. In addition, you can also build on the fonts you choose to use in your design. To improve typography in your design, go back to basics.

First, increase your vocabulary with special terms. Figure out what tracking, kerning, and liding are. A Beautifully Illustrated Glossary Of Typographic Terms You Should Know is a great visual resource for learning these terms.

Next, if you want a solid understanding of how to apply typography to the Web, read Web Typography: The Elements of Typographic Style Applied to the Web.

The combination of fonts can make or break a design

Finally, learn how to mix and match fonts. FontWolf and FontPair are great resources for this. Being able to combine fonts correctly will greatly increase the dynamism of your design.

If you’re interested in learning more about typography, you can read my article: Typography can make your design… Or break it.

Rule #2: Use space to create balance.
Space helps achieve vertical and horizontal balance in a design. Space is simply necessary to create a visual hierarchy and to form connections between elements.

Work on balance and visual harmony

You can always turn to sites like Behance and Dribbble: there you’ll find plenty of inspiring examples of how to work with space. But it’s also important to develop your own “spatial” intuition – it comes in handy for creating balance and visual harmony.

As you study typography, you’ve probably noticed how important space is in fonts. Setting up the kerning and liding is a great exercise to get your hand in working with space. That’s why I recommend playing KernType, a game in which you compare your version of kerning to the version suggested by a professional.

Another skill-building exercise: take an existing design, draw the x- and y-axes, simplify the design to basic shapes and analyze the balance, and then repackage the elements. Pay particular attention to how negative space affects the balance of elements.

Rule #3 Use size to create a visual hierarchy
When it comes to creating a visual hierarchy, there is nothing more important than size. By creating visual connections between elements through size, you set the direction of attention.

Grids are very useful when working with size.

When working with size, grids are a great helper. They help set the right size ratio to properly indicate the importance of each element.

Once you have sized an element, stick to it in all use scenarios. Consistency is a key aspect of design.

Use size to build a visual hierarchy

Here’s an exercise to get a handle on sizing.
It’s all about feedback.

Sketch out a sketch or a rendering of a branding. Because ask a friend to take a look at your design. Have him circle the elements that stand out. Then have him or her number the highlighted elements in order of importance, based on their visual weight. Does the result meet your expectations?

As you do this exercise, keep the following questions in mind:

What is the conversion goal of this page? How can you optimize the page to achieve that goal?
What is the relationship between the elements? Which elements do you want to make more meaningful?
Does the page’s leeway direct the user’s attention in the way you want it?

Rule #4: Use color to convey meaning
Color plays many roles. It carries meaning, creates emotional resonance, and brings unity to the design.

Color helps convey the idea behind a design

If you want to dive deeper into color theory, read my article Designing in Color. Here are a few key ideas from that article:

Before you start picking a palette, determine the purpose of your design. In a good design, the color palette is always consistent with the purpose.
Determine your audience. People perceive colors differently, and colors affect people differently: it all depends on their personal preferences, culture and upbringing, and life experiences.
The key to selecting the right color palette is simplicity. First, choose a neutral background color. Then choose accent colors: primary and secondary. Finally, based on the selected colors, determine the “color of error” and “color of successful operation” – they are useful for different states of the interface.
When you get a good understanding of color theory, you can start experimenting. Try to constantly step out of your comfort zone and try new color palettes.

Movies and different programs are an inexhaustible source of color inspiration. .