What to Do When Your Layouts Keep Falling Apart

Certain layouts disintegrate in a loud and obtrusive fashion. Others suffer from more insidious and silent problems. Everything seems to be just fine. The design does not feel entirely broken, and everything still technically works, but something about the whole picture seems off, or difficult to navigate, or lacking. Beginners sometimes respond by changing the entire visual presentation in order to correct the error. A new font is introduced, color choices are modified, and shapes are inserted to try to balance the image, but in doing so, the layout becomes even more challenging to work with. Often a layout is in need of a reorganization rather than a new idea. Before trying to make the design more polished, try redesigning the layout by placing the content more accurately, giving the space room to move and adjusting the weight. Three design elements that are rarely recognized as vital components, placement, space, and weight, are in fact the most essential components.

One good way to determine if a layout is flawed is to eliminate style, to see the image in black and white, grayscale or even just plain white and gray blocks for images and text, and examine what you have created. With these elements out of the way, you are better positioned to determine what is wrong and how to improve it. Does your eye want to stop at a specific area, and then travel to another? Why did your eyes stop at that point? Can you improve your layout? If the design elements themselves are not the problem, the solution may be a more defined emphasis and a greater contrast between the design elements, or perhaps giving the eye more room to move around the composition.

One common mistake is making everything compete at the same volume. The headline is large and bold, but also large and bold is the supporting paragraph. The image is large and bold, and so are the other shapes and copy elements surrounding it. No single element is dominant because every element demands equal attention. This can result in a cluttered and unbalanced layout even if all elements look great individually. Instead of trying to make everything the same size, make sure one element is larger than the rest. If the headline is the largest element, you should ensure it has plenty of room to exist and the paragraph can be slightly smaller. If the image is the largest element, then make it big and make sure the other elements are not competing for the same amount of attention. The key is that there needs to be some size difference.

Try a short exercise to see how this can help you become more aware of this tendency. Choose a piece of content, a heading, date and supporting paragraph, and set a timer for fifteen minutes. Using this content, create three iterations within the allotted time. Take the first five minutes and build a layout where the headline is the largest element in terms of size and placement. In the next five minutes, build a layout where spacing, rather than size, creates the hierarchy. In the final five minutes, review each iteration to determine which one is easier to scan at a glance and take note of why the one is superior. On the following day, repeat this exercise using the same content but a different format, such as square instead of vertical. Repeating this exercise will help your eye begin to recognize how different design choices can help change the way the composition works.

When you start feeling overwhelmed, try reducing the amount of content to see if that will make a difference. Remove some of the text, stop moving things from side to side and stop adding extra elements until you get a better idea of where you need to make improvements. It can also be helpful to step away from the image on your screen and draw three small thumbnail compositions. You do not need to draw detailed elements. The sketches can be rough, but the thumbnails can give you a general idea of how to make better use of the space. Oftentimes, the most effective iteration can be seen in one of the thumbnail compositions, in the sense that the composition is already there, it simply just needs to be built up and refined. Thinking in a thumbnail sense will force you to think more like a designer who is more focused on the composition.

As you start to gain a better eye, you will begin to understand what is good design and what is not. You will begin to realize that often times the strongest images are not the ones where you have crammed a lot of information in, but are instead the ones where elements are well-spaced, hierarchy is obvious and every element is where it is supposed to be. This comes with experience and practice. Through correcting and refining your designs again and again, your eye will improve until you do not even need to make an effort to fix your designs because you will be thinking in terms of design first.