Friday, June 25, 2010

Blog Design from a Juice Label

post signature

I was inspired this week by a bunch of vintage soda bottle labels found on iDiy. I love the vintage type treatments, the color palette, and the illustrations. I thought they'd make a fun combination for a blog design.

post signature

For this design recipe you'll need:

•A fresh color palette with teal blue, sunshine yellow, spring green, cherry red, & a little black.
•A juicy script font. I chose Lobster- available for free.
•A strong serif font. I used ChunkFive- also free.
•A dash of a slim sans serif font. I used Cantarell- free again!
•Some vintage label shapes available free from Cathe Holden
•A vintage fruit illustration available free from The Graphics Fairy
•A few lines drawn in your editing program.

post signature

A blog design like this is broken up into four main parts. The template or code, the background, the header, & the blog elements. Whatever blog platform you use, you should be able to tweak the recipe to fit your own blog.

The first thing is the template- the empty shell of your blog. This recipe would fit for any style blog but I set this one up for a three column blog with the main content in the center and two sidebars. There are lots of tutorials floating around the web on how to customize a template so I won't go into it here. If you use blogger- check out this Squidoo page with some simple tips on how to customize your template. If you use Wordpress check out this custom theme generator.

Next up, now that you have your template set is the background. I used the teal blue color from the color palette. There isn't a pattern or anything in this background so you could just specify that you want the teal color as your background. You can check out a Hexadecimal color chart for help finding the perfect color for your background. You also should check out the CSS of your blog and match the fonts and colors of the post header, links, and other items to your new color palette.

Next, create your header image. I created this one in illustrator, but you could do it photoshop or other image editing program just as easily. Just open a new document to the size you want your header to be.  Import and layer or draw the boxes, lines, text, & fruit images until you have your perfect design.  I started with a yellow background and layered my lines and text and images centered on the main body of the blog.  Use your inspiration juice bottle labels as a guide to see where you could add extra fonts or lines or image. Use the text sizing on the labels as a guide and vary the sizes of each of your text elements so your blog name stands out first. Export or save for the web as a gif, jpg, or png file to use as your header.

Side note on the fruit image above: After I downloaded it, I created a vector file from the image and deleted the extra lines and letters. Alternately, you could take it into an image editing software and erase the background, letters, and lines you don't want in your header. Save it as a transparent png file and you can import it to the top on your other header elements.

Finally, the other blog elements. This is where you get to pull the design into the rest of the blog. I used the vintage labels down one sidebar. They could be filled with text or images and used as links to pages, posts, buttons, or whatever you need. I used the script font as a sub-header image on the other sidebar to break up the text.  Finally, I created a post footer out of the lines to continue that element into the body of the blog.

post signature

That's it! A blog design from a juice bottle label. Enjoy!

Friday, June 18, 2010

Moving Announcement Cards

post signature

There’s a saying in a movie that goes something like “If you build it, they will come.” Well, we’re going to put that to the test. You see, we have been trying to sell our house for the past 2 months, so that we can move. So I decided that I’m going to make some moving announcement cards to announce our move! I hope to send these to our friends and family, once we finalize the move, so that they have our change of address and other information on hand. So as the saying goes, “If I make them, we will move.”

My inspiration for these moving cards comes from pictures like these of moving boxes and shipping labels. I envisioned a piece of a cardboard box with the shipping label slapped across it, with the new address written in.

post signature

For this recipe, you’ll need:

  • A background that looks like a cardboard box. I used this “Moving Day Collection”, available here for less than $8.
  • A font that looks like handwriting that you would find on a moving box or shipping label. I chose to use Chalk Talk, available here. I happened to have this font already, but you could use whatever font you like, that would simulate your handwriting.
  • A narrow condensed font.
  • Some preset brushes, shapes, and lines that come standard in many different software programs (i.e. rounded rectangle, postage stamp shape, wavy lines, and circle).
  • Picture of your family to use as a custom postage stamp.
  • Cardstock and printer, if you are printing them yourself at home. (Or you may send them away to print.)
post signature

Gather all of your ingredients. Feel free to make adjustments, according to your own tastes. Choose your software. I have chosen to design the announcement in Photoshop, with some help from Illustrator. You can use the program you feel most comfortable with.

I opened up a new document in Photoshop that was 6 inches wide and 4 inches tall. I placed my cardboard background. To make the label, I used the shape tool (other similar methods exist in other software programs) and drew a rounded corner rectangle. Then, I added the outline to make it look more like a shipping label. I typed my new address, using the handwritten font I had chosen.

I wanted to create a little call out to draw your attention to the fact that we moved, so I typed “We have moved!” above my shipping label and tilted it slightly askew to look more authentic. I used an artistic brush that came standard with my Photoshop program to draw the circle around that phrase and also the arrow, pointing to my new address. This gives it the look that it was drawn by hand on the cardboard box.

Next, I created my own “postage cancellation stamp” by drawing a wavy line in Illustrator and then duplicating it 3 more times. Using a standard condensed font, I typed the date (hopeful thinking, that we will be moving by then!).

I created my own postage stamp, using a standard postage stamp shape that came with my software and a photo of my children. Then, I positioned the postage cancellation over the custom postage stamp, as if it were canceling the stamp.

Here is my finished Moving Announcement Card. (I really hope I get to use it soon!) Now it’s all done and I can go in and edit the address when we have that information available.

post signature

Friday, June 11, 2010

A Bundle of Compliments

post signature

When my best friend turned 25 a few years ago, I made her an accordion book with collaged pictures and papers that reminded me of her. I included twenty-five words with their definitions that described her sweet personality. I thought this same idea would be wonderful for an amazing dad; a perfect way to pay tribute to him and surprise him with a Father's Day Gift.

post signature

• A pen & paper
• A thesaurus & dictionary
• Any sort of designing software. I like InDesign because I can outline the fonts and manipulate them as I'd like.
• Two contrasting fonts; I used georgia & schoolhouse.
• Scissors & glue
• Cardstock for printing

post signature

First, jot down all the words that come to mind when you think of your father. Imagine you were describing him in detail to a stranger, what words come to mind? What are his best attributes? Why is he so special? Write these words down and look up their definitions.

Type the information into your design software and scatter the words so there is plenty of room to cut them out once they are printed. Use one font for the words and the other for the definitions. Arrange them in whatever method you'd like. Using heavy cardstock, print the pages out and cut out the compliment cards. Use your imagination with the many ways you can present your compliment cards.

post signature

Paste the cards into a scrapbook, an album or keep them loose and tuck the stack of compliments into a shiny metal box for his desk at work. Take it one step further and jot a happy memory on each compliment card about having him for a father. Tie a ribbon around it and present your personalized gift to your pops this Father's Day!

Thursday, June 3, 2010

Modern Thank You Post Cards

post signature

Today I'm going to show you one of my favorite ways to say "Thank You": via postcard. I first discovered the glories of the thank you postcard when Chris and I were getting married. While designing our invitations, I thought to myself: I need to make a personal thank you that's easy and cheap to send. Hmmm. . . A postcard! Perfect. Since then, I've been making postcards for friend's weddings, parties, etc. They're a breeze.

For the inspiration, I found these beautiful paintings of Jennifer Sanchez via Color Collective. They're gorgeous, right? There's something about them that reminds me of mid-century modern art with a contemporary twist.

post signature

To make our Mid-Century Modern postcard, you will need the following tools: a black pen, white paper cut to 4.25 x 5.5 inches and a scanner (or a Wacom tablet). You'll also need a sans-serif font. I used Print Clearly.

post signature

1. Make your illustration. You don't need to have an art degree to do this, just draw a bunch of parallel lines in various directions. Cluster your line groupings in the center of the 4.25x5.5 inch paper.

2. Scan your pen drawing, or do the above drawing with a Wacom tablet.

3. Save 2 versions of your scanned pen drawing (if you mess up & accidentally save like I always do, you'll be thanking me later.)

4. Color your illustration. Open your drawing in Illustrator or Photoshop. Create a new layer and use your brush tool to fill in random shapes over your illustration. Set the transparency of your new layer to multiply before coloring. This way, the color will magically fall behind your scanned illustration.

5. Using your type tool, type in your desired message. Transform your text to be slightly slanted.

6. Set up your file to print. Your final postcard will be exactly a quarter sheet of regular letter paper. These dimensions fall within the approved range of sizes for USPS postcards and they're easy to gang up and cut. Open up a letter-sized document (@300DPI for photoshop users), add guides at the 4.25 and 5.5 marks. Copy & paste your postcard illustration to each of the four sections of your document. PRINT!

post signature


Because I'm super lazy and don't have any desire to set up a double-sided document, I add the vertical postcard line by hand when I'm writing my thank yous (see sample above). Hope you enjoy!

Related Posts Plugin for WordPress, Blogger...