Click on the Image icon in the Toolbar, or via Insert > Image… You have 2 options of adding images manually. If you want more control over the images that you add to your design we’re going to have to do it the hard way (it’s really not).
If you’re wanting to create a mockup, without a specific style of image it’s cool for that, and such a timesaver.Īlso remember that the layer your image has just been inserted into is currently a Vector, so if you want this layer to act like a bitmap image then you need to go to the Menu bar, and click on Layer > Flatten Selection to Bitmap. The only restriction you have via this option is that the images are randomly chosen by the plugin. This is the most straightforward option for quickly dropping images into your design. Option 1: Adding images via the Unsplash It plugin
ICONJAR TUTORIAL HOW TO
Now you can choose to stick with the Unsplash It plugin that we installed earlier, to add the header image (and all other images that will be required throughout the tutorial), or, if you really want to use the images I’m going to be using in the examples below (And who wouldn’t, they’re some great images), you can grab them from here, and I’ll quickly show you how to add images manually to your design below. Ok, so firstly we’re going to drop in our large background (Hero) image. Now, let’s start with the Header where our background image, logo, navigation, and introductory text will reside. So we’ll be covering the header, about section, and portfolio section.Īwesome! Let’s get down to creating some design goodness folks… Let’s take it straight from the top In Part 2 of this tutorial series, we’re going to work through the first half of our Desktop template.
Google Fonts (Raleway, Open Sans, Satisfy)Īnd the following setup inside of Sketch….SkyFonts (not essential, but a great app to have).
ICONJAR TUTORIAL GENERATOR
Sketch Toolbox & Plugins that I recommended ( Content Generator for Sketch and Unsplash It).Sketch (If you don’t we may have some trouble with this tutorial).So by now, hopefully, you have the following installed… (It was just 4 parts originally, but I wanted to break it down a little to cover some aspects in more detail). Let’s make some progress on Part 2 of this 5 part course.