so you guys really love the last video where i made different designs and showed you before
and after alterations and today we're going to look at some more designs but this time
around it's going to be slightly more advanced so let's get into it now it's great being able
to show people how a design looks but even more impressive if they can actually experience it too
and this leads to them understanding how it's going to behave and so learn
more about framer later in today's video and how to show off your designs
and so we have a pretty basic poster design here on the screen if we then make one crucial
change to this poster as you can see here what would you say has been done to this new design
what graphic design principle has actually been implemented into the second design on the right
and so if you're not aware of all the graphic design principles i do suggest that you look
back at my older videos or just check elsewhere on the internet and do familiarize yourself with all
of the graphic design principles if you can master those principles they will elevate your designs to
new heights okay so the hand and the light bulb on the design on the right is actually using
flow it's going to lead the viewer's eye upwards towards the top left like so flow is all about the
movement and direction that you lead the viewer's eye around your graphic design and it just makes
the composition look really neat and effective so you can see here that the viewer will see
the focal point of the hand and the light bulb and their eye will be ushered up to the top left
it also makes a nice clear diagonal divide across the design and this also creates a nicer focal
point because it's slightly larger and it's just a lot neater than the focal point beforehand and
also some bonus tips who knows what graphic design principle is in use in the text in the top left
of course this is hierarchy but it also could be seen as contrast so let's move on to the
next design which could be seen as a app screen or it could just be like a banner or a poster
so this artwork is going to be around finance and we need to add some text onto this artwork
and i know many people stumble when it comes to choosing fonts and using typography
in their graphic designs so let's try and clear that confusion up so i'm going to have
a title that reads easy finance and then i want a tagline saying save money easily
so i've told you before about how to choose typography for your designs you want to look
at the design and see what kind of vibes it gives off what kind of personality does the design have
and what does the message evoke we can see that we have very bold colors and a very bold kind of
illustration and the design looks kind of playful it's not really serious and it's not really kind
of corporate in a sense so you want to be pulling out all of these words these keywords that relate
back to the design and then relate that back to a typeface style so you want to be thinking are
you going to be choosing a sans serif is it going to be upper or lowercase you might even go for a
serif or even a slab serif and also of course what about a tagline what are you going to use when it
comes to the font choices the financial sector is serious but the artwork doesn't look serious
it looks kind of playful and cartoony so for my design i went to a bold application serif and then
for the tagline below i used a thinner sans serif and of course i aligned everything to the left
so it just looks neater this way and then for a nice final touch let's add in some color contrast
so when you need to add typography onto your designs just remember what is the
design evoking to the viewer in terms of how it looks and then you can adapt your font choices to
those keywords so the third design today is going to focus on something that is quite
subtle in many respects but it is pretty crucial and it is a slightly advanced topic as well we're
actually going to be focusing on these call to action social media icons at the bottom so there
are two different things that we could change to this section here to make it more effective
as a graphic design so i want you guys to think what could we possibly change to this
area to make it more effective to the viewer and as a design solution what would you do here
okay so the first thing i've done is that i've actually made every icon a circle
now you might be asking tom why did you do that they were perfectly fine being a square there's
actually quite an interesting reason behind it and i'm curious to know if you know why i did that
sure they would work as a square but they actually are more functional as a circle and here's why
so if you notice on my design there actually are quite a lot of circles in the cucumber and
the illustrations running down the middle having the icons as a circular shapes creates repetition
now repetition is a great way to reinforce an idea through a design and it just ties everything
together in a neat visual harmony setting sure you could have them as squares and that would create
contrast but you might want to create harmony and using circular options here would be useful
and yes there are going to be some people who say oh squares give off contrast and that makes it
more visible it does come down to the designer's subjective choice at the end of the day but i'm
just using this as an example to show you what you might want to consider in your graphic designs
and so the second thing that you might want to change is actually the color of the icons
because these are call to actions these need to stand out and these are the things that you want a
viewer to click on or to notice and so have them as green yeah it does tighten the design
together but they won't stand out as much as a orangey red as you can see here and again this
is just a small design subjective choice that you might want to be making on your designs
so we've been looking at some contrasts we've looked at hierarchy flow repetition and now
we're going to be looking at balance would you say this web page design has a degree of balance
do you think this is a balanced graphic design
i would suggest that it's probably not balanced no if we look at a revision we can see that we now
have the content on the left in a nice group and then the text content and the call to action on
the right is a similar size that creates a symmetrical balance this again just creates
visual harmony and it doesn't cause a jarring response in the viewer we know the information
and the call to action is on the right and then like the visual candy so to speak is on the left
so this is symmetrical balance but how would asymmetrical balance look on such a design as this
but as you can see we now have the call to action and also the text content
slightly smaller than the illustrations on the left and this would be considered as asymmetrical
balance an asymmetrical balance is when we have a larger kind of group and in a smaller group
as you can see with these pink lines but did you also notice how i've aligned the text content both
horizontally with the illustrations and then also aligned with the home button at the top
so these are the kind of things that you do want to consider when you're designing something
for any kind of purpose like i said at the start of the video those graphic design
principles are going to be fundamental and the building blocks to your graphic designs
now interactive prototyping is the best way to communicate your app and your website designs the
sponsor of today's video framer is a no code free to use tool making it easy for anyone to become
a prototyper so you can import your existing work and quickly swap out your static elements
for pre-built interactive components this includes things like sliders that actually do slide and
inputs that can be filled as well as buttons that can actually be clicked building out a full user
flow is super simple as well you can just link screens buttons and menu items and pretty soon you
will have a prototype that clearly communicates your vision to whoever you want to show it to
now sign up for free by visiting framer.com satori that link is down in the description
box below so do give it a try if you are a web or app developer also click a video on screen if
you want to learn something else today but until next time guys design your future today peace you