PERFECT LAYOUT DESIGN Step by Step *With Examples*

Video Statistics and Information

Video
Captions Word Cloud
Reddit Comments
Captions
so today i'm going to share a step-by-step method for you to follow along with so you can actually perfect layout design in your graphic designs each and every time today's video doesn't concern logo design but more the layout of print and web design projects i've also partnered with 3m visual attention software also known as vas in today's video to show you all about layout and how to use this tool to check if your design layout is achieving the visual hierarchy that i'm looking for so the first thing i'm going to do is establish a grid for the layout now of course you should know the dimensions of your document so maybe it's a3 as an example using a grid can inform the position of different elements on your page and you're going to create a connection between the different elements that make up your design this can provide a sense of order to your page layouts providing the reader or the viewer with a clear structural reference to fall back on and this also increases the success of your design now the grid you use is entirely up to you but here are some popular choices now column grids utilize well pretty much columns and they do this by creating areas that run down the page or your design column grids are typically used in magazines or brochures but also a lot of websites incorporate them as well now in layout design the areas that are in between the horizontal flow lines or vertical lines are also known as modules and these areas will be set up for your content or your negative space more about that later now modular grids are similar to column grids apart from they have rows as well as the columns that go down each module is often a square in modular grids and you don't need to fill up all of the squares in your modules again we're going to see more about that later now modular grids are very easy to apply to pretty much any design so these are the two main grid systems but there are many more and you can create hierarchy by just using square modules but of course there are things like rule of thirds or even the golden ratio which i personally have never used i don't like the golden ratio but yeah you can use any grid that fits your design but when you're working on a print project you have to be mindful of the bleeds and the margins as well so once you have your grid let's move on to the next stage you should have a good idea what your design's message is or what you want the design style to evoke that's all concluded in the research phases that you should be doing today's video is about laying those ideas out efficiently so one of the most effective ways to provide a sense of balance right out of the gates is to choose a single focal point for your design now a good example of a solid focal point is the use of a large image as the biggest single element or a large source of simple typography the focal point is going to be that thing that pulls in the viewer to your design and that grabs attention with a hook without a focal point a design falls flat and is easily missed or forgettable the focal point is where the viewer starts the journey on your design but where did you go after that initial attention grab so we want to direct the viewer's eye around our designs and that's because we want them to stay with our work and then we want to lead them to information that they should consume this can be achieved by creating little pockets of interest on your designs or you can use the principle of flow but one really awesome way to gauge whether the viewer's eye is traveling where you want it to is by using vas now i've talked about this software before on my channel it utilizes complex ai to test your designs and in this instance we can run the design through the software to track where the viewers are is likely going to travel from the focal point onwards and that is with the gaze sequence so i want the viewer to recognize and to land on my call to action button learn more yet you can see the path clearly isn't achieving this if the path isn't to your liking then change up the order of your design or just create pockets of interest and mini focal points as i mentioned earlier so i'm going to edit the location and the color of my call to action and that's going to create a more optimum layout for this call to action being recognizable if we run a design through the gay sequence again we see the call to action is likely going to be hit by the viewer's eye movement now negative space is crucial to your design layout and it's your friend not your enemy negative space gives your designs that room to breathe and it establishes which groups are associated with each other and it helps other things such as hierarchy you can use grids to set up this negative space and personally i think having a modular grid with quite a lot of modules does work well for establishing your negative space now i like to keep things simple and for me it's a good tool for doing that a repetition can also provide a strong sense of connected design balance to a composition the idea is that by identifying and reusing a motif or a design element throughout your design layout can provide a reference for the reader so that separate errors feel connected and are part of the same overall composition so you can do this by repeating shapes or symbols in areas of your design or the method i really like to apply is to use colors to connect different aspects of my design together so heading back to vas if you do run your designs through its testing parameters you will see how effective your focal point really is now remember this is where the audience is going to start their journey so you need to have a high score around your focal points using faces or human form is a good method also contrasting colors and to simply using size to your advantage works really well now i like to use vis to highlight my focal point and then other important areas that i want the viewer to see as areas of interest these numbers tell me the percentage likelihood a person will notice these areas of my layout and then checking the visual element score i see what is about the area that is driving my score this section does relate back to those aspects that i spoke about in regard to faces and contrasting colors and so forth so here it's intensity edge contrast faces if i wanted to i could adjust any of these elements within my design to see if i can increase the probability that it'll attract the viewer but if you think this software is useful you can also grab yourself an extended free trial version of vas by clicking the link down below and also make sure to use that code thomas to ensure you do gain those five extra free trial credits i hope you did learn something about layout and how to actually structure your designs from one step to the other and if you do want to learn something else about design click a video on screen until next time design your future today [Music] peace [Music] you
Info
Channel: Satori Graphics
Views: 503,083
Rating: undefined out of 5
Keywords: perfect layout design, design, layout, how to, perfect layout graphic design, layout graphic design, grid layout graphic design, graphic design layout techniques, layout graphic design tutorial, graphic design layout tutorial, satori graphics, satorigraphics
Id: eiV7E_LVlxs
Channel Id: undefined
Length: 7min 10sec (430 seconds)
Published: Fri Dec 18 2020
Related Videos
Note
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.