MKW Graphics
Helping small businesses turn brand vision into visuals
mkw_coffee filter sculpture.jpg

Tips + Thoughts

To call myself a blogger feels all too millennial. Instead, I consider this portion of my website to be part knowledge library, part design magazine and part entreprenurial-digital-nomad travel journal. Hope you enjoy reading my musings!

- MKW

Designer Hack: 9 STEPS for D.I.Y. Gmail Signature

 

You've asked! I've answered! Adding a custom email signature to your Gmail is super easy, but it definitely takes a few round about hacks. Here's my tutorial (based on a combination of a whole bunch I tried to make mine.) 


Screen Shot 2017-11-06 at 2.03.18 PM.png

STEP 1: Create a Google Drawing

Go to your Google Drive account and hit "New" then scroll down to "More." From there you will see the icon for Google Drawing. Open that.


Screen Shot 2017-11-06 at 2.06.32 PM.png
 

STEP 2: Set Dimensions

You'll want to size your Artboard correctly to sit well as an email signature. Do this by changing its size. Go to file > page set up > custom. 

I like mine to be measured in Pixels. I used 800x200 pixels as my size.


STEP 3: Add your Headshot (if you have one... you should have one)

To add an image, go to Insert > Image. Find your headshot and upload it to the Artboard. You can crop your headshot to any shape you want by hitting the crop icon, and selecting your shape. I like the circle crop best.


Screen Shot 2017-11-06 at 2.24.26 PM.png

STEP 4: Add in other elements like Name, Business Web, Phone, Tagline etc.

If you've used Google Drive systems before, this step will probably come easily to you. Add in elements that you'd like using lines, textboxes etc. For example, I am going to add my name, business name, tagline, offerings, website, phone number. *Social Media links will have to be separate. Think of what you're making here as one image a.k.a. you can only link it once. 


Screen Shot 2017-11-06 at 2.27.00 PM.png

STEP 5: Export as .png

Once you get your signature looking the way you want it to, you'll want to export the whole thing as a png file. Save it somewhere you can find it, you'll need it for the next step.


Screen Shot 2017-11-07 at 8.52.02 AM.png

STEP 6: Add your .png in the Signature Field of your gmail Settings

Open up your gmail account. Hit the gear icon in the upper right corner and scroll down to settings. Once in settings, scroll down to signature. Upload your png by hitting the photo icon (between link icon and text alignment icon in toolbar). Resize by scrolling over, I set my signature to the "large" size. 

Be sure to link your .png signature to your website. To do this, double click on the image, and you'll get a dialogue box that will allow you to add a link. Drop in the URL and save.


Screen Shot 2017-11-07 at 8.59.11 AM.png

STEP 7: Download Social Icons

I love flaticon.com for all kinds of illustrations, icons, graphics, etc. Search in the search bar which icon you are looking for, and add them to your 'cart.' You'll be able to download for free! I added: 

  • facebook icon

  • instagram icon

  • linkedin icon

  • twitter icon

  • pinterest icon

When you're ready to download, do to the right side bar and hit download. You'll be presented with download options. I chose pngs at 64 pixel size (larger than you need, but we will resize later). Download your collection of icons and save them where you will find them. I really liked these stylized versions.

*Create Buttons or other Elements

Use the same process as the email signature to create other elements like buttons or calls to action.

 


Screen Shot 2017-11-07 at 9.37.58 AM.png

STEP 8: Add Icons to Signature and Link Appropriately

Add the corresponding links to your social icons and buttons in your email signature and save! 


Screen Shot 2017-11-07 at 9.34.27 AM.png

STEP 9: HACK Write a Test Email to yourself, resize elements, Copy & Paste back into Signature Field

I wasn't totally happy with the size of the icon elements in my signature. Draft a new email and you'll notice you can resize the elements of your signature. Once you've got it looking the way you want it to, highlight the whole thing, copy, and paste into the signature field of your settings. The links, layout, and configuration will stay in tact!

VOILA! You're in business! 


 
Print+Branding-02.png

Before you Go…

Get your Branded Documents in Check with this Guide!

 

Did you find this helpful? I would love if you could write me a quick review on my facebook page,
or consider making a donation to my favorite non-profit.