Archive for April, 2010

Let’s all just relax a little bit…

Thursday, April 29th, 2010

This has been a hot button for a little while now, but if you still haven’t heard, here is a synopses of the prototype iPhone shenanigan…

  • Employee leaves new iPhone at a bar
  • Dudes finds said iPhone
  • Dude calls Apple, they say they don’t know what he’s talking about
  • Dude decides to make a buck off it, since he can’t really return it
  • Gizmodo.com buys said iPhone for $5K
  • Apple flips out, demands return of iPhone
  • Search warrent issued and Gizmodo.com reviewer gets his door busted in
  • Dude who found the iPhone at the bar also gets his place raided by the tech police

Click through to read my response and watch John Stewart’s reaction as well.
(more…)


Monkey + Monkey = Match

Wednesday, April 28th, 2010

The conversation at this morning’s check-in meeting somehow turned to Granimals and Cher’s “hi-tech” computerized outfit picker from Clueless. We were discussing the idea of a Granimals inspired system for guys that involved car or tool related symbols to help them figure out what pieces of clothing are appropriate to wear together. 8am silliness and jabs at Tim and Greg’s fashion sense aside, this made me think of such a program for typefaces. I love the idea, but I’m not sure that typeface selection is objective enough, and it could remove the unexpected combinations that arise from experimentation and going with your gut.

Of course there are some general rules to keep in mind when combining type.

The connection. If you are choosing 2 typefaces to work together there should be something that unites them. This could be similar proportions (e.g. equal x heights), they could come from the same historical period or have a similar distribution of stroke weights. H&FJ’s Techniques for Combinging Fonts gives some good examples of type palettes with unifying elements.

Contrast. Equally important to unity is contrast. As stated in H&FJ’s First Principle of Combining Fonts: “keep one thing consistent, and let one thing vary”. Choosing 2 fonts with too many similarities will cause conflict. The key to clear communication is in the differences, the contrast. And when it comes to contrast, don’t wimp out.

There are many ways to contrast typefaces, for instance:
- Structure: Serif + Sans Serif or Modern + Slab Serif
- Weight: Ultra Light + Bold
- Form: Italic or Script + Geometric Sans Serif
- Color: Not red vs blue but the varying impact of blocks of text when squinting at a page
- Size: If you choose to combine 2 Serif fonts you may need to drastically vary the size in order to provide a clear distinction between all characters of type.

Regardless of how you achieve contrast, just make sure it is there. If your eyes don’t immediately know that there are 2 different typefaces, there is definitely not enough contrast.

Economy. Keep it simple, don’t add a typeface if you don’t need it. Each typeface should fill a definite and specific role within the piece you are creating. Combining different typefaces can provide emphasis and clarity to the reader. However, too many can create clutter and confusion.

Keeping these rules in mind, a typeface matching program could deliver some definite mismatches. Avant Garde + Chalet, absolutely not, Baskerville + Chronicle, don’t make me puke! Here are a few resources for typeface combining tools to avaoid such drastic mistakes!

Alphabetical list of fonts and their matches
Cheat Sheet on mixing typefaces

Top type combos with a PDF to illustrate

Great article from Font Shop about combining fonts with Helvetica
And apparently there is an iPhone app (well of course there is), although I haven’t tired it out.

Still not sure? Check out this info graphic to get you started.

But I say, don’t let the rules get it your way. If you have any unexpected typefaces combos to share I’d love to see them!


Facebook Marketing doesn’t hold back.

Tuesday, April 27th, 2010

“Facebook may not have made any big announcements about local business marketing at last week’s f8 conference, but the company is certainly stepping up its efforts in that area. Today, we discovered that Facebook is sending out window decals with text-to-Like SMS instructions to select local businesses.

Twitter user B.J. Drums, who works with the Museum of Making Music in Carlsbad, California, sent us proof that Facebook is officially getting into the local business marketing fray.

The company received both a window decal and an accompanying letter (see below) that encourages participating businesses to place the decal “prominently on your window or sales counter, since businesses that promote their Page off-Facebook tend to see a 20% or greater increase in connections.”

The sticker in question includes a very prominent Like icon and the iconic blue Facebook branding, as well as a call to action that reads, “text like MuseumofMakingMusic to 32665.”

Facebook is even gifting beta testers with $25 in ad credits to help drive home the utility of the service and propel businesses to participate in on-site advertising as well.

This first step toward serving local businesses is an extremely smart maneuver very much like Google’s Place Pages offering. Also, the day that Facebook correlates your physical location in the real world with their local business Pages does not seem too far off.

If Yelp, Google, Fousquare and Facebook all get their way, local business windows will be covered in window decals. Realistically, one decal will prevail and we tend to think Facebook’s more than 400 million userbase and the value of an instant Fan will make Facebook’s offering especially appealing to local business owners.”

Story courtesy of Mashable.


Design Critique – Bring It.

Monday, April 26th, 2010

Damnit, Jim. I’m a Cat Herder, not a Designer. But for years now, I have created small media pieces for friends and personal use. This is what happens when you know a lot of people in the NFP (Not For Profit) world, as I do. I decided to open myself up to our team here at Zoom Creates, you know, the Professionals and let them school me on a couple of recent projects

I promise not to cry, or forget to bring the Bagels on Wednesday.

Fundraiser for Human Solutions - My friend Kristan is the Development Director there.

June’s Note: If I had this to do over again, I would not have used Eccentric in the body of the invitation, I would have only used it in the main title/event brand. I actually had to explain to Kristan why I wasn’t going to use that font even more, because, it’s just not that readable in big blocks of text. I was lucky, they had great colors to begin with (Orange, green and Taupe), I just added the pink for a little punch.

This I made specifically for a Facebook application for one of our infamous Game Nights!

June’s Note: I wanted this to be (ironically) Edgy and Dangerous. Our parties are anything but wild. Don’t get me wrong, we have a lot of fun, but no one is jumping off the roof into our (non-existent) pool, or doing naughty things in the pantry. Just a little Texas Hold ‘em and some Apples to Apples combined with rousing debates on Feminist Theory and the roots of Classism. You know, regular stuff. — Anyway, I think I failed to make it as edgy as I could have, and I’d love some feedback.

Corrina! Greg! Robin! – Have at it!

Mrs. Knightly

(AKA – The one who feeds you)


Snuggies Plus

Thursday, April 22nd, 2010

The last time we went to the pet store, something on the clearance table caught my wife’s eye. It was a bright pink Snuggie made specifically for dogs. And it was five bucks. And so we bought it. Poor Pepper. She was a good sport, though. But all she did was sleep in it. From the photos on the box, it looked like she would be playing backgammon with Hoss or using the remote control with this paws-free blanket-like invention. Maybe I put it on wrong.

While doing a quick bit of research for this post, I ran across a few other Snuggie-like products. Behold the Peekaru and the Lippi Selk’Bag.


2010 Web Design Trend: Hand Drawn Elements

Thursday, April 22nd, 2010

Many of today’s websites are now incorporating hand drawn or sketch elements into their designs. A hand drawn element can give a website a more personalized, unique, and organic feel,  making a design stand out from traditional web graphics. They key to this trend is to use the elements as an accent to the design and not as the main focus. You do not want to overwhelm the viewer by having a site covered with doodles, instead, use it sparingly to enhance specific elements in the design. Check out examples of hand drawn elements:

Boompa

Boompa

Yellow Bird Project

Wallace HCL

This is Grow

Web Designer Wall Jobs

Free People

Charming Wall


Does good SEO mean bad design?

Wednesday, April 21st, 2010

Over the years, I’ve heard from more than a few people that “good Search Engine Optimization cannot co-exist with aesthetically appealing design.” In other words, the site that remains after being fully optimized is not as good looking as the originally designed site. Why is this?

I think we can all agree that search engine results are important. In fact, statistics claim that up to 85% of online shoppers use search engine results to find what they will eventually end up purchasing. This means from search bar to search results to click through to purchase, or something like that. Because of this, having a website that will show up in search results is of utmost importance. SEO is the “man behind the curtain” that makes those websites appear in the search results. When we speak about “optimizing” a website, we are speaking specifically about preparing a site to show up as often and as close to the top of the page as possible when a user is conducting an applicable internet search. How is this done?

Allow me to explain…

Keywords and phrases: These are chosen based on the who, what, why and where of your site. What is your site about? What is your product? A keyword best describes what the content of your page is. This is one of the most important pieces of optimizing a site.

Meta tags:
There are many types of meta tags, but the most popular of them are the description and keywords meta tags. Meta tags go in the head section of the page. The meta keywords tag should contain a list of the most valuable keywords and phrases used on the page on which it is placed.  Each page should have a meta keyword list specific to that page.  The meta description tag is a description or summary of the page.  In many cases, this description is displayed by the search engine to the person searching for your keywords.  It should use your keywords and suggest to the user that this is the page they’re searching for.

Image Alt Tags:
An image Alt attribute is a textual description of an image. It is used by screen readers to describe the image, but also by search engines to determine the image’s relevance.  Because “an image is worth a thousand words”, keywords used in alt attributes are heavily weighted.  And because computers are not very good at analyzing the content of images, they rely on the text of the alt and title attributes. To fully optimize the graphics and website, it is important to insert a readable keyword phrase within the Img Alt Attribute.

Title Attributes:
Just about any html element in a web page can have a title attribute.  These are like img alt attributes as they are used to describe the element on which they belong, and are also read by search engines.  They should contain valuable keywords.

Title Tags:
The Title tag of a web page should always contain the most important keyword phrase of the page. This is because it will aid in getting higher search engine ranking results.  Titles should also be inviting and descriptive to encourage people to click on them. “mywebsite.com – home” is not inviting or descriptive.

Text:

Text:
Text plays a key role in determining a website’s page ranking; it is thus of vital significance to optimizing a website. Text for a site should contain plenty of important key words and phrases used in different ways. A generic rule of thumb: keywords and phrases should appear at least three times. but don’t go overboard. Over-using a keyword could look to a search engine like keyword abuse which could lower your page rank, so don’t over-do it.

With that being said, I want to circle back to my original question: why do so many of the properly optimized sites appear so unattractive to look at (IMO). For example, this site comes to straight to the top of the search results for “hot air balloon”, but what it HAS in optimization, I feel it LACKS in design. Ads all over, copy galore, is this even a real site? I do not feel extremely confident about this site. It feels more like a bed for advertising than anything else, which is the exact opposite of what any legitimate site would want their viewers to feel.

However, on the other end of the spectrum, when searching for “dog”, the site below came up in the search results at almost the very top. To me, the site has a better look and feel, is easier on the eyes and I come away feeling a little more trusting in the site itself. It’s still busy, yes, but it is obvious that some thought was given to the user experience and making the site a little easier to navigate. “A” for effort.

What is the solution? I am of the school of thought, as I believe most reputable design agencies are, that SEO is something that should be considered from the get-go. The reason for this is that if left until after the site has been designed and developed, the only real option is to begin adding things to the site. This would mean that although perhaps the original vision for the site was dead on, the afterthoughts being added here and there and everywhere will ultimately cheapen the overall look and feel of the site. If SEO is considered at the onset, the proper keywords, phrases, tags, links, text and so on can be built in, all while maintaining the branding, aesthetic appeal and positive user experience. While some feel that optimizing a site is the LAST thing that is to be done, there are those among us that believe all things work TOGETHER for good.

Conclusion? Let’s do the brand, message and website a favor and think of SEO as part of the big picture, rather than something that is done after the fact. As with anything, there are times that optimizing a site will be the last thing that is done, or maybe due to circumstances, a site isn’t built for SEO at the beginning. With the right team of professionals (ahem, Zoom Creates) having a beautiful site built from the ground up while still being fully optimized for the highest search rankings is not a pipe dream, but in fact, a reality.


A Decade of Kerning

Tuesday, April 20th, 2010

Recently, I have been laying out some signs and banners for an upcoming trade show. The headline of each piece includes the number 2010. In each instance, the spacing between 0, the 1 and the o needs to be adjusted because they are too far apart. Typographically speaking, this is called kerning. Kerning is the adjustment of space between two specific characters.

A font usually has hundreds of kern pairs built in, but sometimes, especially in display type, you have to make manual kern adjustments to balance out the negative spaces between some letter combinations. 1′s are very bothersome characters, especially when preceded by a hyphen or flanked by round characters. Take our phone number for example.

It’s not that I don’t like the process of kerning because I really do. I don’t mind the extra time it takes. In fact, I get into it and appreciate a good kerning session. (Plus it’s my job.) In the process, I have become hyper sensitive to un-kerned words. They look like spelling errors to me. Kerning really makes the difference between something that looks professionally done and something that looks “desk-top published”.

As I was doing this I started thinking to myself “I can’t wait until this year is over so I don’t have to worry about accidentally overlooking the kerning on the date anymore”. But then I realized it is going to be the same in 2011. Then I realized that this is actually going to be an issue until at least 2019. That’s nine more years! Just think, though, by the end of this decade, I will have a lot more kerning experience under my belt.


Delicious food that won’t kill the planet

Monday, April 19th, 2010

I’m one of those people that likes to do green things. I’ve also been trying to eat better, meaning eating more vegitables. It’s really quite amazing how good asparagus is. And it’s really easy to cook!

Anyway, today I wanted to spotlight a local eatery that tries to help the planet out while feeding humans. They have some delicious options! I went there for lunch today and got the Mole burrito. It was super tasty. If you happen to be a vegan, and that includes not eating food that was prepared on the same stuff as meat products, don’t worry! They have your back by making sure that all vegan options are cooked on their own gear, so you never have to touch meat if you don’t want to!

Anyway, I highly encourage you to check them out. You’ll be full, and you can feal good about not eating food with a ton of chemicals in it. They have a pretty sweet flash website too, so check that out.
Laughing Planet


Some cool stuff

Friday, April 16th, 2010

Happy Friday! Here are a few cool things I’ve found around the web. Hope you enjoy

I LOVE Shawn Wolfe’s posters and illustrations. Browse around his site for inspiration and entertainment.
http://shawnwolfe.com/

Wondering what its like to be a designer? Check out this crazy site! Are your eyes bleeding yet?
http://iamnotanartist.org/index.php

I love the idea of these plants in a can! I’ve been trying to grow my own veggies but I’m no master gardener and don’t have a ton of space so I love that this makes it so easy
http://www.brooklyn5and10.com/Microgiardini-s/199.htm

Speaking of veggies… I love these clever dental floss ads. They also comes in corn and broccoli. This is a great site for browsing a lot of ads.
http://adsoftheworld.com/media/print/colgate_dental_floss_strawberry_thread

Man oh man this site never fails to make me laugh!
http://unhappyhipsters.com/

Another fun site to peruse. I love these google map envelopes (although they are not yet a reality).
http://incrediblethings.com/tech/google-maps-envelopes/

I also love these customized band-aids. Genius!
http://incrediblethings.com/home/customized-band-aids/

Need to send a message that an email just won’t quite communicate? Try this.
http://www.bigassmessage.com/