was successfully added to your cart.


Your website hurt my eyes: 5 free and easy tools to help with visual design

Business woman with tired eyes and stressLet’s not beat around the bush, most of the fair trade producers’ organizations I visit have a problem with their website. I’m not saying that it’s not interesting, or that it doesn’t contain the necessary information… I’m just saying it’s plain ugly! And most of them agree with me.
So I started to ask myself why these fair trade businesses (that develop and export good looking products on the other hand) struggle so much with web design and visual communication in general?

Early in my analysis I noticed a clear difference between “Northern” (retailers, fair trade federations and NGO’s) and “Southern” organizations in terms of design. Much more importance is given to visual communication in the North and as a result their website but also business cards, Facebook pages and print materials seems to be more “professional”. Southern organizations also seem to invest less time and resources in marketing and visual design, it is simply not a priority for them.

One of Fair Trade Connection’s mission is to help fair trade producers gain more visibility. We of course do that through our core business of producing videos but since we encountered so many organizations that were struggling with their brand image and visual communication, we’ve developed social media and visual design trainings that we propose along the way.
These 5 free tools have been borrowed from our training on visual design.

1/ ColorLovers
From all the tools, this one is my favorite. ColorLovers is a website that focuses on colors…as you might have guessed already.
paletteTheir main feature is their palette library. A palette is a selection of colors that match well together. Usually palettes display from 3 to 5 different colors. The awesome thing about this website is that it gives you the HEX and RGB references so that you can reproduce the exact color you are seeing in photoshop or similar softwares. palette 2

Just copy the HEX number of the color you like, paste it in photoshop… and voila!
Browse the thousands of palettes by date, popularity or number of likes. The website also features an interesting pattern library. Try it now!

2/ Color picker add-on for Firefox
This is the perfect companion for any graphic designer or anyone involved in the creation of visual designs. This little Firefox add-on will install a color picker (similar to the one you find in photoshop) in your browser. Allowing you to pick any color you like while surfing your favorite websites or social networks.
color pickerJust click on the color picker to open a small window in the top left corner of your screen, then move your mouse anywhere to receive the HEX and RGB references. Press ESC to copy the HEX. This is great to grab a color you like on the fly.

3/ Snipping Tool
This is screen capture made easy. Or super easy.
Forget the hassle of going through a print screen then paste in a photo editor, snipping tool will allow you to capture whatever is on your screen with only 2 clicks. You can also highlight or add annotations with the simple tools that are offered to you.
snipping tool
The best thing about Snipping Tool is that you already have it installed on your computer (if you have a windows computer).

Find it under: Start Menu/Accessories/Snipping Tool

4/ Free Fonts Sites
As a designer you’ll always need nfontew and appropriate fonts for a Facebook post, the new product catalog or that flyer that needed to be done for yesterday. Of course you could use the same old fonts that you have already installed on your computer, but there are plenty of free websites out there that will allow you to grow your font collection. The influence of fonts is simply HUGE, different fonts can totally change the tone of a piece of design. Choosing the right font is very important but not always easy. At least now, you’ll have plenty of choice.

I personally like to go through blog posts that have already skimmed the best fonts for us, doing this will save you time and spare your eyes. Indeed finding and selecting fonts is a time consuming process. Why not use the work of other people who have already done that for you. Moreover, these blog posts usually display visuals created with the fonts, which allows you to have a better idea of how they look like and what you could do with them.
Here are a few examples of posts that have done a good job selecting fonts.
If you don’t know how to install new fonts, watch this video.

5/ Social Media Design Blueprints
If you are in charge of the visual communication of your organization that means that you will most definitely post those designs on social networking sites such as Facebook, Twitter or Google+. But do you know the dimensions of the Facebook cover image? Or the Google+ profile picture?
Each of these platforms have different sizing guidelines and finding out about them before starting your designs will save you a great deal of hassle.

Fortunately for us, some nice bloggers out there have compiled most of what we need to know in easy to read infographics.


Be sure to update your sources regularly as social media sites keep on changing their designs. Use the keyword “Social Media Design Blueprints + date” in Google to find what you are looking for.


Ronny Hermosa

Author Ronny Hermosa

Hi, I'm a video producer and a digital marketing consultant. With this website we wanted to build the largest video & photo library about the fair trade producers. You can purchase our content to develop your own marketing campaigns.

More posts by Ronny Hermosa