All posts in Design Resources

Favourite Free Fonts : 05

favourite free fontsHere’s a round up of some of my favourite web fonts for download. Most of these are google fonts (free!) and easy to integrate into your website/blog.

The trick to combining typefaces is to choose contrasting fonts with a similar mood. Contrast is key —you can keep it simple with bold + light weight fonts within the same family or serif + sans-serif options with a similar mood. It’s always a good idea to pair fonts with some sort of shape relationship, although I break this rule sometimes. Remember, it’s an art not a science ;)

I’ve linked some of my favourites below. Enjoy!

1. Zona Pro Bold + Zona Pro Thin  /  2. Varela + Tienne  /  3. Homemade apple + Josefin Sans  /  4. PT Sans Narrow + Merriweather  /  5. Playfair Display + Muli

A Creative Life : Year-end Wrap Up

FLOWER4

When freelancing is your livelihood, the holidays can be challenging. Without paid leave we sometimes feel guilty taking a little break. But it’s important to take breaks, ESPECIALLY this time of the year.  If not for your health (the most important thing) then for your business. Breaks let you reflect on what you’ve achieved, where you want to improve and think about all the fun projects you want to tackle in the new year. Giving yourself a little breathing room between busy work seasons helps you wrap up loose ends and prepare for the new. Here’s how I’m wrapping up the year (while munching on baked goods and drinking mulled wine, of course).

Organizing: I’m spending a little time this holiday season planning for the next work quarter. I’m making sure all my time sheets are up to date, files are organized and my work plans for current projects are ready for the new year. Knowing you have a plan to come back to after some much needed R&R should help with post-holiday stress.

Business strategy: Lately, I’ve been thinking a lot about the direction of my business, the types of clients I want to work with, and finally the possibility of hiring and renting a studio (pretty exciting stuff). But of course, these things don’t happen over night.  I need a plan, which requires A LOT of brainstorming and strategizing. I’m using the holidays to bounce ideas off of family and friends that I don’t get to see all that often.  I’m lucky to have such supportive and insightful people in my life!

Goal setting:  Top of the list—improve my illustration and hand lettering skills. With that said, you can expect to see some works in progress in the new year.

Now, I’m off to eat delicious food, hang with the fam and take a little break. Happy holidays!

For Designers : Favourite Fonts

favourite-free-web-fonts2

Today I’m sharing my favourite web fonts all paired up. Not all, but most of these picks are Google Fonts, which means you don’t need to host the typeface yourself (as Google is already doing that for you).  Working with Google Fonts is super easy. Just find your font from here and click on the quick use tab below the typeface. You’ll be able to select the styles you want and retrieve a piece of code to add to your website. The Google Fonts API will generate the necessary browser-specific CSS to use the fonts. All you need to do is add the font name to your CSS styles just as you’d do normally with any other font.

For example:  h1 { font-family: ‘Metrophobic’, Arial, serif; font-weight: 400; }

You can download them too. Just click quick use then the little download arrow at the top. Select the zip file and open. I’m always on the hunt for great fonts + pairings. So feel free to share in the comments. You can download my picks below.

one: (Channel + Cabin)  /  two: (Oswald + Lora) /  three: (Railway + Baskervillefour: (Meddon + Nevis Bold) /  five: (Montserrat Regular + Pecita)

Design Class 02 : Subtle Transparent Textures

Design-class-2

I’ve been working on more strategic, non-design focused documents the past few days (contracts, communication strategies, media kits for clients etc.) and thought I’d open up Photoshop and play. The result, another simple five step tutorial for YOU.  For this tutorial I’m sharing my favourite photoshop texture brushes and how to use them to create transparent or “knock-out” texture. By that I mean, the texture applied erases some of the element to reveal the background behind it. Textures are fun and when used tastefully can add personality to your designs.

Before you get started, download some (the best part) FREE brushes. There are lots out there, but my favourite packs are by Maleika E. A, Chris Spooner, and Caleb Kimbrough. Once you download + unzip, open up Photoshop and follow the simple steps below.

transparent-texture-2

That’s it! Of course, you can use the brushes to add colour too. To do this just use the brush tool instead of the eraser.  If you’ve come across other texture packs that you’re particularly fond of, or have even created your own, leave some love + your link below.

(imagery)

Design Resources : See it + Use it

 

designresources-02.2

Awesome Colour Picker and WhatFont are two of my favourite design resources. These tools (actually Chrome extensions) let you identify which fonts and colours your favourite web pages are using.  If you’re like me, before you begin designing a web project you’re searching your favourite sites, blogs and Pinterest for inspiration, which makes these trusted extensions pretty helpful for putting together colour and type combinations. Feel free to try it out here and here.

Design Inspiration : Layered Font Love

layered-type_favourite-fonts-2

I’m currently working on a new typographic inspired web/branding project so I’ve been looking to layered font types for inspiration. I’ve come across some great fun artistic fonts for download. These trusted little font packs come with lots of stylistic variations (2D and 3D effects, shadows, light cuts, bold cuts and patterns etc.), which means adding font effects is super easy with so many combinations to choose from. I’ve pulled together my favourite font picks in today’s post. You can follow the links below to download for yourself. If you have a favourite layered font, or have developed your own, please share below or send me a note here. I’d love to take a look!

link love:
Yorker  //  Frontage  //  Core Circus  //  Trend  //  Canter