Creating and Adding Brand Graphics
In this lesson we are going to:
Learn how to create a collection of 'on-brand' graphics
Explore different design methods for adding graphics to your web
Here, we begin to tie a bow on it. Adding in and playing with graphics, images, and other stylized design elements is what will make your website pop as uniquely you. You've been getting into Canva more and more (hopefully) by this point, so it should be a fun exercise to start drumming up a collection of graphics elements to potentially use on your site.
As mentioned in the lesson video, you won't end up using all of them, but having them already whipped up and available to mess around with is a time-saver step. I also find that it works more fluidly to compartmentalize my design processes.
I give myself ample time to design rabbit hole in Canva. Some elements turn out great, some are so-so, but I just keep brainstorming little 'mini design' elements that go well with my overall branding. Then at a different time completely, is when I start to go design rabbit home inside SquareSpace, playing around with my different design elements which are sitting nice and neat in their folder - ready for me to pull from. Some are an easy yes and some I find to be a pretty quick no, once I try uploading them onto the web page.
Only after playing around with them a bit, do I find that the ones meant to stay have spiraled themselves into the weaving of my web. And the ones that find their way into the design, with then be woven into the other pages throughout the site... hello cohesion!
What you should know after this step:
How to change PNG graphic colors using 'duo tone' in Canva.
How to create a collections of transparent PNG graphics, that are on-brand and support your brand guidelines.
How to create and use a graphic in an image black, to use as a text background.
How to make a 'cut off' graphic that you can use on the side edges of a website section
Action Steps:
Create a collection of on-brand graphics.
Download your graphics collection as transparent PNG's.
Create a 'graphics' folder inside your website design folder, along with your stock images folder.
Play around with the techniques taught in this lesson, in order to gain confidence in using and adjusting graphics and image blocks in your sections.
Add in the graphics and images needed to complete the look of your home page layout, top to bottom.
