On the heels of last week’s post about giving your posts and pages an instant design upgrade with a sexy “Feature Box”, today I’m bringing you another tutorial that will forever change the way you blog.
In fact, by the time you’re done with this post, you may find yourself overcome with the desire to shower your computer screen in kisses and dance a jig in your living room. At least that’s what I’m shooting for. :)
So, let’s get to it!
Today I’m going to show you how to create those cool collections of images that you see on all the top design, fashion, and decor blogs.
You might call them “collages”, “mood boards”, or “inspiration boards”, but however you refer to them, the bottom line is that they are the ultimate blog post enhancer.
Why are they so awesome? Well, because when you know how to make a mood board, you’re no longer stuck inserting images one at a time (stacked one on top of the other) in your blog posts. (Cringeworthy, right?).
Instead, you can create artfully-arranged collages that perfectly illustrate the topic you’re talking about in your post – whether that’s “magical places”, “modern little black dresses”, or “the best digital cameras money can buy”.
Today’s tutorial is also extra-special because I’ve taken it straight out of the course material for The Girl’s Guide to Web Design.
It’s basically a sneak peek at the laid-back, non-intimidating teaching style I use throughout the entire online course – so if you’ve been wondering what the “tone” of the course is like, this will give you a good indication. :)
The tutorial is a little on the long side, but I guarantee that once you press “play”, time will officially begin to fly. You’ll instantly begin to see all the possibilities for YOUR little corner of the web, which is one of the most wonderful feelings you can have, if you ask me.
You can watch the video in full screen mode if you click the little icon with the expanding arrows that you see at the bottom right of the video. That will make it easier for you to see everything that’s happening. I suggest you open up Pixlr in another browser window so that you can follow along as you watch (choose the “Advanced” editor for best results).
So, without further ado…here’s the tutorial! When you’re done with it, don’t forget to keep reading the rest of the post to find out how to place your newly-created mood board on your site or blog.
So you’ve got your mood board ready to go. Now, how do you put it on your blog or site?
- First, save the image by going to File –> Save at the top left of the Pixlr screen.
- I recommend saving your mood board as a .JPEG, because in general, JPEGs load faster than PNGs on websites. The other file formats are weird, so you don’t have to worry about them.
- When you click “OK”, you’ll be able to choose the location you want to save your file to on your computer. Make a mental note of where you put it.
- Not it’s time to add the image to your post or page. If you have a WordPress blog or site, you can use the Upload/Insert tool that’s located immediately above the big white window that you type your post content in. In the “caption” box, you may want to put the description of all the items in your mood board, like this: “Clockwise from top: x, y, z”.
Now you can repeat this process for every post that you think would benefit from a mood board – and you can use the skills you learned in this tutorial (manipulating layers, drawing your own geometric shapes, etc.) to create endless combinations of items and elements in your mood board projects.
For more on Pixlr, check out my posts on designing your own logo:
Design your own logo: video tutorial #1 (the “sophisticated” logo formula)
Design your own logo: video tutorial #2 (the “playful” logo formula)
Design your own logo: video tutorial #3 (the “clean” logo formula)
And if you’re liking the way you’re feeling right about now (empowered, excited, and full of creative “can-do”), I’d love to teach you to create the web presence of your dreams – so that every last element of your blog or site looks exactly how you want it. To learn more about The Girl’s Guide to Web Design, click here.