Design Elements

ISOD Logo

Design Elements

In the world of design, unfortunately a little math is sometimes a necessity. That's bad news for me, as math has never been a strong suit for me. I do however access the ability to find "center" by eyeballing a layout and can glance at a graphic and tell roughly how many pixels it is.

Oh, wait. Did you want that in Points or Picas? Or Inches?? Oh my. That's where the trouble starts. To be a strong designer you must also be able to translate your work into the measurements of your medium. Back in college laying out yearbook spreads in PageMaker (is that even still around?) we did everything in Picas.

Each interior layout consisted of sharp margins between photos and blocks of text all 1 pica. Exactly. No wiggle room. Soon after, I could hit exactly a 'pica' without even pulling down a ruler guide. Remarkable? Not really. What is remarkable is the ability of a designer to then talk intelligently as they switch mediums. Insert Web design. Picas? No way.

 

If you're new to typesetting it can be very overwhelming. But it doesn't have to be. I've recently been asked by several student designers to elaborate a bit more on Typesetting procedures and best practices.

Overview:

  • All books should be typeset and gathered using InDesign’s “Book” feature. (No books that contain “chapters” (including Slims and Minis) should be set up as a single flowing document).
  • All books should follow a standard “style” labeling schema for both Paragraph and Character styles as detailed below.
  • All elements within a document SHOULD be utilizing paragraph styles.
  • Master pages should be utilized as much as possible.

Let's face it. Being successful as a designer often means we must be everything to everybody. Need business cards? No problem. Need an event banner? Got it right here. And thus is the life of design. To me, that's the best part. I love learning new techniques, new ideas and new technologies that increase my 'value' as a designer. We've already talked a little about ebooks and the new opportunities emerging for designers in this area.

But, I realized that we can't talk intelligently about ebook design until we really get the basics of book typesetting down. Today we are going to cover frequently asked typesetting questions. Feel free to leave comments below with your own questions about the trade and we will address those as well. What program should I use to typeset a book? To create a professional book typeset you will need to use a page flow software.

 

The Outline view of my first successful attempt with the Mesh Tool in Illustrator CS4. As I'm learning and playing with the mesh tool in Illustrator, I've stumbled upon a few tips/tricks that I wish I had Day16_Lillyrealized when I started.

1. Work WITH the Grid. When you first create your simple shape and begin to use the mesh tool to establish your grid lines, be sure to work WITH the grid. Don't fight it and Don't try to work against it. Now, as I was learning a friend kept saying this to me, "Work with the Grid" "Work with the Grid". Unfortunately, what they didnt know was because the initial shape I had selected (a maple leaf) had such a unique outer shape, the grid was automatically SUPER complex and confusing. In order to work WITH the grid, be sure to start out with a SIMPLE shape as you're beginning. 

2. Avoid images with lots of details. While you're learning and playing with this tool, be sure to avoid images that contain lots of super details and a wide range of colors. Initially the first flower I attempted was a Tulip. Well, if you're familiar with Tulips, you know that they have multiple petals and can range in several colors within one flower. That didn't work out so well for me. As I get better, I'm sure I'll be able to move into more detailed images, but be careful what you start out with so that you can get a clear grasp on the function of the tool.

3. Soft blends vs. Hard lines. Another significant tip that my friend pointed out as I began learning this illustration technique was to watch the handle bars on my blending points within the mesh grid. (If you're working with this tool you'll understand what I mean).

In order to get a hard blend line, the handle bars should overlap for crisp edges. However, if you're wanting the colors to softly blend into each other, then you will need to simply pull the handle bars back and keep them shorter and separate from each other. I'm sure as I get more experienced and learn more about the tool myself, I will have more tips and techniques. If you are profecient with the Mesh Tool I'd love to hear your feedback! For now, I hope you enjoy today's bookmark:

My first really successful use of the Mesh Tool to create an illustration. Enjoy! You can download your bookmark here.

 

As a designer chances are one of your weaknesses is the "details". As artists we tend to look at the big picture. The details get lost somewhere in our need to be expressive and let "it all out"! Unfortunately, not paying attention to the details is one of the fastest way to lose a client. It only takes one print job that gets cut off, or messed up for you to lose good business. So how can we avoid this? 1. Use templates. Hang on now. When I say templates I do not mean for the design but rather for the document setup. For each printer I use I have a folder on my machine filled with Photoshop, indesign and illustrator documents that include the bleed settings and trim sizes. By doing this, not only do I insure that my designs will be the right size but additionally it saves me the time of gathering specs for every basic job. 2. Use master files. I've said it before but it bears repeating. When working with a file that contains multiple pages take advantage of the master file feature in InDesign. By using those master pages you can easily set up running heads ( the chapter titles that appear on the top of each page) that will be uniform, consistent and best of all quick!! Again keep in mind that paying attention to the details DOES not mean that your design time will be increased. 3. Know your color space. One of the biggest issues I see with student designers work is print files that are built as RGB files and web files built in CMYK. When this occurs they are often upset with the quality of the end result when the price is finalized. Pay close attention to your colorspace. If you need to use a filter that is only available in RGB you can convert using the option " do not merge", add your filter and then convert back to CMYK. As you do this you may realize that the RGB version appears more vibrant. You're right. It does BECAUSE YOU ARE VIEWING IT ON A SCREEN. Avoid the temptation to assume that those colors will print properly.

[caption id="attachment_226" align="alignleft" width="214" caption="Golf Example"]Golf Example[/caption]

We all learn from one another. Sometimes watching what someone else does can change the way we approach things ourselves. As designers we are no different. Often we get inspiration from the work of a fellow artist. Unfortunately, this same principle works in the negative as well! We can easily see what NOT to do by learning from the mistakes of others.

If you've been designing any length of time, chances are you're familiar with 3 basic terms of post-production that have to be accounted for in any advertising design. Got 'em?

The concepts I'm referring to are, Live Area, Trim Line and Bleed Area.



Live Area refers to the "safe-zone", this area is close enough to the inside of the page that any text or images that are imperative to the design will not be cut off when the edges are cut off or bound in a magazine or other publication.

Trim Line is the actual "cut-line" where the trim is SUPPOSED to happen. Clearly if that were always precise there would be no need for the Live Area or Bleed Area, but alas, machines are not perfect. When a 100,000 magazines are being mass-produced I'm sure you can understand that a little shifting can occur and the cut will not always be EXACTLY on that line.

Bleed Area is the space on the outside of the Trim Line that accounts for any trim shifting that may occur to the outer edge of the ad. This eliminates the likelihood of there being an awkward white line that is not covered by the advertisement or unintentional edges to the piece.

Recently, I learned an important lesson that really made me chuckle on this particular topic. Now, what made it even funnier this particular time is that the mistake was made by an internationally known brand. They had sent a print-ready ad to be placed in a booklet.

Going what they thought was the extra mile they had added a series of dotted and dashed lines to the ad to indicate the Live Area, Trim Line and Bleed Area, each line was accompanied by a corresponding Word and Arrow. It looked great, until I opened the file in Photoshop and realized that the image they had actually sent me was flattened into a JPEG and their "template" was flattened on top of the ad.

To protect the guilty party here and save any embarrassment I have recreated the effect on a generic a 'dummy ad'. The moral of the story? Make sure you remove your templates before sending in your artwork, or send layers. We can all learn from others---the good and the mistakes!

Stressed Out?If your a designer, whether working at an agency or off on your own freelancing chances are at some time or another you've found yourself working under incredibly intense pressure. The kind where you feel that if one more task or problem comes your way, you'll burst from the sheer weight of it all.

If this describes a recent day you've had, don't despair, tomorrow is a new day, but there are things you can do TODAY to keep the pressure under control and keep your sanity.



  1. Stop Checking Your Email: If you're actively working on a project, complete it before checking your email again. Often, checking in to many times, will not only stop your production, but seeing the list of jobs piling up will only serve to weigh you down.
  2. Make Lists: When you do check your email make a To-Do list. Committing your work to a list will get it off your mind and allow you to concentrate on the task at hand. There are tons of easy to use Web apps for list keeping and organization. Find the system that works for you.

    Remember the Milk
    BackPackIt
    Toodledo
    TaDa List
    Intuit Task Manager
  3. Stay Organized: The more you organize your files and folders when you have time, the less stress you'll have in the crunch times. Being able to quickly and efficiently find the files you're looking for is one of the first steps to managing your workflow.



I'm sure everybody will have tips and tricks that work for them, but on a basic level and across the board, following these three basic principles will help to keep you sane!

[caption id="attachment_173" align="alignleft" width="150" caption="Beginner\'s Corner"]Beginner's Corner[/caption]

We've already discussed when we started this series on typography that typography may very well be one of the most important elements in any design. How do you know if your typography is strong enough? It should answer the following criteria:

  • Lends to the design, not taking away from it.
  • Easy to read and comprehend.
  • Makes an impact and draws attention as needed.

You may be thinking, that SOUNDS easy but it can't possibly be. How do you actually accomplish ALL those things in a single design?

Typography is funny that way. To ensure that it's ADDING to your design, ask yourself the following questions:

  • Does it really EXPRESS what I want it to say?
  • Can it be read easily from a distance?
  • If I've used "Fancy" fonts, am I sure they are at least 16pt? Large enough to read?

Now that we've determined what your text should accomplish, let's take a step back and discuss some other types of fonts. We've briefly mentioned that any "fancy" fonts would need to be large enough to read, so what does that entail? What are these "fancy" fonts I'm referring to?

To me, "fancy" fonts refer to anything that is not either simply Serif or Sans Serif.

DaFont.com, one of my favorite sites for typography inspiration, has several categories of these type faces, ranging from Grunge, Comic Book to Scripts and Calligraphy. Let's look at a few of these (the fonts I'm showcasing here are avialable on Dafont.com!)

[caption id="attachment_171" align="aligncenter" width="600" caption="Western Fonts"]Western Fonts[/caption]

One important thing to note when you're looking at free fonts, watch the licensing laws they were released under. You will find that information on DaFont on the right side of the screen. Some are only free for personal use, others are simply free.

[caption id="attachment_172" align="aligncenter" width="600" caption="Script Fonts"]Script Fonts[/caption]

We're gonna end here for today in an effort to avoid overloading you with information. We will pick up this topic and continue!

Stunning Typography

Recently a design student was perplexed when I requested that she "spice" up her typography. She let me know that one of her instructors did not allow her to add anything to the typography.

She had learned that typography effects were the first sign of an amateur. While I can definitely confirm that I've seen some typography tricks that were so poorly applied or so hideous that they were indeed the marks of an amateur designer.

However, in an effort to avoid throwing the baby out with the wash, I think it's important that young designers are taught the ins and outs of typography effects without the bias of "simplistic style" so that they can appease the client with the greatest amount of design prowess available.

The next few posts we'll be looking at keys to creating this stunning typography and carefully exploring the effects and techniques available.Typography

Recently a friend of the family approached my mom with a photo he had saved from his childhood. He was hoping to have the photo restored so to present a copy to his sister for her upcoming birthday.

 

When I received the original photo, taken in the 60s, it had definitely seen it's better day. The photo itself was literally torn in 2 pieces and curled around the edges.

 

After some careful taping, flattening and some significant time in Photoshop the results are in! Check out the before and afters!

 

Thank God for the Clone Tool!

 

Before:

Before

After:

After

 


What is a picture worth nowadays? Does it still hold as much value as it once did? If we are talking about online marketing, the answer is yes! Tabloid photos are a different story.

 

A good photo can make up for thousands of words, and we know from studying Web user's habits, that if your pages are too wordy, they won't be read anyway. So save your breath and take photos. 

Photos of what?

 

Everything. Depending on your market, your needs may be different. To get your product/name or service out there, it's imperative that you have photos your target audience can easily access. Here are some ideas to get you started:



 

1. Intinerary Photos: Have you spoken at a conference? Attended a Seminar or class? Take a few pictures and document your trip or speaking experience. Not only will these photos help to establish you as an expert, they also show your audience that you are still learning or active in the field. 



 

 

2. Product Photos: Do you offer a tangible product? Take pictures of it. If the product is something that moves or is "used" take photos of it in action. Make sure the pictures are clear and crisp though. It's better to have NO photo that one that is sub-quality. A poor photos simply harms your product's crediblity and makes you look like an amateur. Digital photos are fairly cheap these days and basic photo composition is easy to master, we'll talk about that a little later. 



 

3. Portfolio Photos: If you are a designer/writer or other professional that requires a portfolio, upload your best work in snapshot form. Be sure to create "sets" to organize your work i.e., logos, Web sites, manuscripts, etc.



 

4. Awards and Trophies: If your business or firm has won awards in it's field, be sure to post some "humble" photos of those as well. Remember the golden rule, that photos are more believable than type. (In today's society that is an oxymoron due to the wonders of Photoshop, but nevertheless we have a innate human desire to believe what our eyes tell us).



 

5. Staff Photos: Regardless of your size, I'd suggest uploading some staff photos with a short "bio" of each employee, their talents and specialties. This will also allow your customers to feel a connection with your business.

More Articles...

Page 1 of 2

Start
Prev
1

Advertise Here

iTunes, App Store, iBookstore, and Mac App Store

Check Out Our Ventures

Paige1Media

Collipsis Web Solutions

Hootpress

Paige1Publishing

Like Us on Facebook!

Advertise Here

Simple Print

$7.99 .COM domains

VerticalResponse free trial

PeachPit (Pearson Education)

Register.com $2.50 Domain Names

McAfee, Inc

LinkShare_120x600SkyscprV1

Latest Comments