33
Visual Design DMET 255

Visual Design

Embed Size (px)

Citation preview

Page 1: Visual Design

Visual DesignDMET 255

Page 2: Visual Design

Focal Point

Page 3: Visual Design

Find your FocusThe focal point of this piece is the model and her clothes. So, she has been placed centrally, has type and a block of color positioned in a way that highlights and draws attention toward her face and then to her outfit, and leading lines direct the eye down her frame and gradually toward more information.

Page 4: Visual Design

Focal PointThe focus on the photograph of the man. The design orients the focus to this image by placing him centrally, framing him with the graphics, and using the doodled graphics to lead the eye in toward the photograph.

Page 5: Visual Design

Leading LinesJust like you point at something when you want people to look at it, by positioning certain lines and shapes in certain ways you can control the viewpoint of your design, aka where viewers’ eyes go when they see your design.

Page 6: Visual Design

FlowchartsFlowcharts use lines to direct your eye from one point to the next in an obvious way.

Page 7: Visual Design

Leading Lines = Focal PointThis poster design by Design By Day that uses strong leading lines to first guide the eye toward the main focal point (the title), and then to various rungs of information.

Page 8: Visual Design

Scale and HierarchyIn a very brief explanation, hierarchy is the arrangement and design of elements in order to visually signal importance. So, you might make a more important element bigger and bolder than a less important element which might be smaller and fainter.

Page 9: Visual Design

Type HierarchyThese days, our headlines or titles don’t have to be six inches tall to catch readers’ attention, but the image to the right provides a dramatic reminder of just what typographic hierarchy is all about — organizing and formatting your type choices in such a way that readers or users can clearly see what’s most important, which enables them to easily navigate the layout at a glance and quickly scan to find the information they’re looking for.

Page 10: Visual Design

ScaleThis poster design by Jessica Svendsen uses a scaled-up image as the largest element, which helps it attract the most attention and focus. 

This poster design by Scott Hansen uses a scaled-down, small silhouette of two people to help communicate the massive scene in front of them. This instantly gives viewers a sense of the grandeur and size of the scene.

Page 11: Visual Design

BalanceSymmetrical & Asymmetrical

Page 12: Visual Design

Symmetrical BalanceA symmetrical composition by reflecting the positioning of type and graphic elements. By using symmetry, this design is made elegant, clean, and beautifully balanced.

Page 13: Visual Design

Asymmetrical BalanceIn the above design, the three central circles are the largest elements in the design, but they are balanced out both by the type, the fine line graphics, and the small, heavily textured circle in the bottom corner.

Page 14: Visual Design

Complimentary Elements

Page 15: Visual Design

Complimentary photosUse photos from the same photoshoot. This is an easy way to ensure your photographs look cohesive as they were likely all under the same art direction and photographic style.

Page 16: Visual Design

Photo ColorColor your photos similarly. With the prevalence of filters and image adjusting tools, you are able to color and adjust your photos to have more cohesive and complementary palettes. 

Page 17: Visual Design

Contrast

Page 18: Visual Design

Boost Contrast

Page 19: Visual Design

Low ContrastThis poster by Melanie Scott Vincent uses a yellow paperclip on a yellow background, creating a low contrast difference between the object and backdrop. While this is usually a thing to avoid, in this case it reinforces the event name ‘ignored everyday’.

Page 20: Visual Design

Repetition

Page 21: Visual Design

Multi-Paged LayoutTo maintain consistency and a logical layout, try to take specific elements from one section of your design and apply it to other sections. Maybe a style of type can be applied to more than one section of your design, or perhaps a graphic motif can be used more than once. So, try to tie your design together with repeated elements.Repetition is a key factor when it comes to multi page layouts. Repeating elements of your layout and/or design helps each page flow into the next, creating a cohesive set of pages.

Page 22: Visual Design

Repeat StylesThis poster repeats certain type stylizations, graphics, and line weights throughout to maintain a cohesive and effective design. If it were to suddenly use a thick, bold, pink line-based graphic somewhere in the middle, the cohesion would be lost. So, by keeping the font palette and color palette small and the graphic styles simple and alike, the design is kept beautiful and strong.

Page 23: Visual Design

White Space

Page 24: Visual Design

ClarityWhite space when used strategically can help boost your design’s clarity and overall look by balancing out the more complicated and busy parts of your composition with space that helps your design to breathe.For example, this design uses white space to balance out the image, texture and type to keep the design clean and sophisticated.

Page 25: Visual Design

Create a FrameScale down your graphic elements. By scaling down your imagery, type, graphics etc. you can create some luxurious white space around your focal points while staying within the frame of your original graphic. 

Page 26: Visual Design

Alignment

Page 27: Visual Design

Create OrderThe strong degree of alignment between its elements creates a sharp, neat and effective layout that is easy to navigate and is pleasing to the eye.

Page 28: Visual Design

Text AlignmentAlignment is also very important when dealing with type. There are many ways to align your type, but a good rule of thumb for longer pieces of copy is to stick with left alignment as this is the easiest for the eye to navigate and make sense of.

Page 29: Visual Design

Rule of ThirdsThe rule of thirds is a simple technique where designers divide their designs up into three rows and three columns, and at the points where the vertical and horizontal lines meet is where your focal points should be.

Page 30: Visual Design

Focal PointsBy placing focal points at each line intersection, his design is made striking and effective. Beachy also notes that “By avoiding a centered design you add some motion and interest.”

Page 31: Visual Design

Rule of 3rds

Page 32: Visual Design

Good Luck!

Page 33: Visual Design

Resources

• https://designschool.canva.com/blog/visual-design-composition/