Graphic Design Foundations: Layout and Composition by Sean Adams
What defines a successful layout? It attracts attention, provides a clear, powerful message, and communicates the story and tone of the project.
What’s a bad layout? Anything that’s dull.
Remember how lines, repetition, and contrast can drive a layout
Strive for clarity, legibility
Lines are great for separating information and guiding the reader between them (both visible lines and implied lines)
Be confident with color. It helps to sell any combinations
Warm colors advance visually (push) and cool colors recede (pull)
When we first view an image, we always try to find a recognizable image and decide if we understand it
Is there a person? Do we know them? Do we understand what they’re doing?
Then we look for large text, and then smaller text
Using large, colorful, meaningful words can do a lot of legwork for your piece. Consider font and hierarchy
Never forget negative space. It can create more interesting and eye-catching designs if you allow the space to say something as well. It provides clarity, pause.
Always ask:
Where will this piece be seen?
How will it be delivered?
What is the budget?
There’s a fine art between balance and tension
Avoid halves. Avoid something centered with everything else far away. Avoid “towers” with everything evenly spaced in a stack. (Of course, unless you don’t want to)
Contrast: light and dark, vibrant and somber, large and small, complicated and minimal
Art without contrast is boring.
If you need to go bigger, go much bigger rather than only fractionally so.
Don’t edit yourself in the process. Just allow yourself to explore, try, and fail.
Repetition can be a guide, but it can also be a crutch. Be conscious and thoughtful
Harmony is not repetition. It’s things working with similarities to create cohesion
Symmetry doesn’t mean you can forget balance, tension, and harmony (consider a chandelier)
Asymmetry can allow the forms to feel like they have movement
Can be challenging, but interesting
Square proportions (like bootstrap) can create organized, harmonious design
Consider how to use the golden ratio
If the negative and positive space (or layout is too even), the layout loses energy
Grids can be a useful tool for trying out layouts. Consider rule of thirds, margins, columns, gutters, markers (place where page numbers go). Start by defining your grid.
Columns should generally be no wider than 52 characters
Remember that digital things work on pixels, so keeping square proportions is helpful
Consider how you can change the assets you work with to make them work with a grid (negative space, cropping, rotating, adding supporting elements, etc.)
More stuff does not equal better design — it can be confusing, cluttered, or misleading
We look for patterns, establishing them can do a lot of work for making something easy to engage with, but it can also make it boring if there is no change (and no identity)
Surprise can make the work memorable
Variation is required in larger, multi part works. Strive for rhythm (energetic contrast) in order to keep the viewer engaged
Text and images shouldn’t repeat each other, they should each provide information the other lacks
Consider letting the image guide the design decisions. Align text/shapes with the movement in the image.
Remember the impact of sequential storytelling
UX Designer by Cory Lebson
Interaction design: focuses on how to create efficient and effective interactions between users and interfaces
Information Architecture: how information is organized behind the scenes and presented to users
Information Design: makes sure that content can be consumed as intended
Technical Communication: makes sure that important technical information is understood by the intended audience groups
Service Design: assuring the quality of a customer’s entire interaction with the company
Human Factors: how physical products are used in light of human capabilities