We’re taught to communicate with words. We write essays, prepare speeches, and take written notes. But words aren’t always the best option for conveying information and ideas. Sometimes the best way to tell stories is through thoughtfully crafted visuals, not long paragraphs of text. Visual storytelling is the process of conveying ideas using things you can see. In this article, Elizabeth Lin will explore visual principles, highlight why visual storytelling is a valuable skill for everyone to learn, and demonstrate how you can improve your visual storytelling through play.
Read more…
Design is a creative field where forms and space intermingle to lend us a variety of experiences. Whatever design we come across, our brains are hardwired to transform that piece into simpler components made up of basic shapes and forms that are at play with the spaces. When the elements are arranged in an orderly manner, the intelligent use of spaces draws our eye to the most noticeable space –be it positive or negative. As much as the positive space seems to dominate the negative counterpart, both are used in equilibrium to tell a harmonious, coherent, and a seamlessly complete story. But what kind of story do spaces tell in web design?
Read more…
The human to computer interaction is heavily based on interacting with graphical UI elements, and color plays a critical role in this interaction. When designing a new app, it’s often difficult to decide on a color scheme that works well, as there are an infinite number of possible color combinations out there. In this article, Nick Babich will go over the most important points related to color in apps. He’ll cover traditional color scheme patterns, custom color combinations that aren’t based strictly on any one pattern, and he’ll also learn how to choose colors and contrasts for your app that support usability. If you’d like to hone your own color usage skills, you can download and test Adobe XD for free, and get started right away.
Read more…
Depending on your browser, you may not be able to see all emoji featured in this article (especially the Tifinagh characters). Also, different platforms vary in how they display emoji as well. That’s why, in this article, Rob Reed always provides textual alternatives. Don’t let it discourage you from reading though!
Read more…
In this final part of this series, Jon Hensley will focus on the principles of continuation and common fate, which involve movement, both implied and animated, to create relationships. Using these principles, along with the principles of similarity, proximity, closure and figure-ground, will strengthen your own design skills and help you create a better experience for your users. Oh, and one final thing. After applying these principles, make sure to test out your designs with users to see what works best for them.
Read more…
In this article, Jon Hensley will focus on the principles of closure and figure-ground, which play with positive and negative space to build relationships and create wholes with the sum of their parts. As in the first article, he’ll look at how the principles work and then move on to real-world examples to illustrate them in use. Understanding how to use closure and figure-ground will help you build strong relationships and differences between elements in your designs.
Read more…
Understanding how to use similarity and proximity to affect the relationships between elements in your work will help you create designs that enable easier organization and improve the usability of your work. In this first article, Jon Hensley will take a look at how the principles of similarity and proximity work, and look at real-world examples to illustrate them in use so that you can begin to use similarity and proximity to create both relationships and differences between elements in your designs.
Read more…
Balancing a composition involves arranging both positive elements and negative space in such a way that no one area of the design overpowers other areas. Everything works together and fits together in a seamless whole. The individual parts contribute to their sum but don’t try to become the sum. An unbalanced composition can lead to tension. In some projects, unbalanced might be right for the message you’re trying to communicate, but generally you want balanced compositions. However, design principles aren’t hard and fast rules. They’re guidelines. There’s no one right way to communicate that two elements are similar or different, for example. You don’t need to follow any of these principles, although you should understand them and have a reason for breaking them.
Read more…
Compositional flow determines how the eye is led through a design: where it looks first, where it looks next, where the eye pauses, and how long it stays. You have a lot of control over where people look when they’re viewing a webpage you’ve designed. On a text-heavy and graphic-light page, a visitor’s eye likely follows something like a Z-pattern or F-pattern across and down the page. However, as soon as you design page elements and add graphics, those patterns no longer apply. Your visitor’s eye will follow the flow, movement and rhythm you create.
Read more…
Emphasis is relative. For one element to stand out, another has to serve as the background from which the first is to stand out. Some elements need to dominate others in order for your design to display any sort of visual hierarchy. By varying the visual weight of some elements and the visual direction of others, you can establish different levels of dominance. Three levels is ideal; they’re all that most people can discern. Designing different levels of emphasis or dominance will create a visual hierarchy in your design, with more important information being more visually prominent. It will help you communicate with visitors quickly and efficiently.
Read more…