9 Ways To Improve the SEO of Every Website You Design

Sometimes enhancing the user experience goes beyond making your site usable. If it’s not findable what’s the point? This post by Six Revisions give you 9 ways to ensure your site gets found!

It’s a well-established principle that on-site SEO is one of the most basic building blocks every business needs to have as they start on the road to search engine domination. So it makes sense to add another string to your own marketing bow as a web designer and incorporate some simple SEO strategies into every web design you deliver.

Read The Entire Post Here!

5 Can’t-Miss Usability Tips for Mobile Website Designs

It’s seems everyone and their mother has a mobile site nowadays. What sets yours above the rest is how usable it is! Spyre Studios has a list of 5 well thought out tips to ensure your mobile website hits the mark!

Finding your way around a majority of the mobile websites that exist has become a nightmare with the lack of proper usability being implemented into their designs.

Read The Entire Post Here!

Explaining UX Design to High Schoolers

Sometimes trying to explain UX to anyone can be a challenge, this great post give some great insight that can be applied to high schoolers but could be anyone whos attention-span can me measured in nano-seconds.

How do UX designers tell their story in a relevant, meaningful way, to audiences who have no exposure to UX? UX practitioners are keenly aware that everything we use in our lives was designed by someone. But outside of our industry (and related ones), most people aren’t aware of the many decisions that were made (or not made) on their behalf when a product or service was designed.

Read The Entire Post Here!

Crafting Subtle & Realistic User Interfaces

This is an oldie but a goodie. We stumbled on this post via @dougneiner on Twitter. It has really solid tips on applying some realism to your interface bits.

From thinking about what objects would look like form a side view, to using vectors when possible. These tips should get locked into your arsenal and considered every time you start designing an interface.

The underlying secret to beautiful user interface design is realism: making 2D objects on your screen appear to sit in 3D space with volume, surface properties and undulations that might appear in real life. These faux 3D objects have highlights and shadows just like objects on your desk might have, and they have textures that emulate real objects from glass to sandpaper and everything in between. Designing beautiful user interfaces has more to do with the why than the how.

Read The Entire Post Here!

The Secret to Designing an Intuitive UX: Match the Mental Model to the Conceptual Model

Pretty neat stuff in this post. It talks about how people perceive how something SHOULD work before using it and how UI designers solve for this scenario.

Imagine that you’ve never seen an iPad, but I’ve just handed one to you and told you that you can read books on it. Before you turn on the iPad, before you use it, you have a model in your head of what reading a book on the iPad will be like. You have assumptions about what the book will look like on the screen, what things you will be able to do, and how you will do them—things like turning a page, or using a bookmark. You have a “mental model” of reading a book on the iPad, even if you’ve never done it before.

Read The Entire Post Here!

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)

Cogni-Huh What-O-Nance?

A powerful cause of dissonance is an idea in conflict with a fundamental element of the self-concept, such as “I am a good person” or “I made the right decision”. The anxiety that comes with the possibility of having made a bad decision can lead to rationalization, the tendency to create additional reasons or justifications to support one’s choices. A person who just spent too much money on a new car might decide that the new vehicle is much less likely to break down than his or her old car. This belief may or may not be true, but it would reduce dissonance and make the person feel better. Dissonance can also lead to confirmation bias, the denial of disconfirming evidence, and other ego defense mechanisms.

Options

Everyone likes having options, right? I mean, if there was only one car ever made, regardless of how well it was built, or how cool it looked, there is nothing fun about being forced into a decision.

We want to personalize! We want the red convertible with the tan leather interior and the iPod hook-up, with custom rims. Green just won’t do! It’s this definitive decision that makes us happy, even ecstatic when we find the perfect [insert your idea of perfect here]. However, it is this same choice that can ruin an otherwise perfect experience.

Observed in many cases is the paradox that more choices may lead to a poorer decision or a failure to make a decision at all. It is sometimes theorized to be caused by analysis paralysis, real or perceived, or perhaps from rational ignorance. A number of researchers including Sheena S. Iyengar and Mark R. Lepper have published studies on this phenomenon.[2] This analysis was popularized by Barry Schwartz in his 2004 book, The Paradox of Choice.

I Want More Options… No, You Don’t

We are very busy people, we have schedules to keep, places to be, things to do. We don’t always have a gratuitous amount of time to make an informed decision and rely on what we’re presented with to help us make that choice. User Interface Designers, UX Professionals and hopefully “decision makers” know the value of a persons time, and ensure choices are as simple as possible.

Consumers have been bred to think more is better. We’re all guilty of it in some way or another but the fact is, choice suppresses conversion. We are more likely to be unhappy with our decision if we have too many options to choose from.

If we can not limit the number of options, there needs to be some method to narrow them down. This could be anything from a customer rating system to, putting the most common choice(s) up front.

Conclusion and Sources

Sometimes we can’t take away the number of options we’re asking the user to choose from. But we can try and solve for the best possible outcome. By giving the user a means to drill down their choices, or offering up a “Best Value” or “Popular Choice” we help minimize cognitive dissonance thus giving them a richer user experience.

When Choice is Demotivating: Can One Desire Too Much of a Good Thing?
Cognitive Dissonance Wiki
Changing Minds

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)

“Above the fold” is a graphic design concept that refers to the location of an important news story or a visually appealing photograph on the upper half of the front page of a newspaper. Most papers are delivered and displayed to customers folded up, meaning that only the top half of the front page is visible. Thus, an item that is “above the fold” may be one that the editors feel will entice people to buy the paper. Alternatively, it reflects a decision, on the part of the editors, that the article is one of the day’s most important. By extension, the space above the fold is also preferred by advertisers, since it is the most prominent and visible even when the newspaper is on stands.

The term can be used more generally to refer to anything that is prominently displayed or of highest priority.

This term has been extended and used in web development to refer the portions of a webpage that can be visible without scrolling. However, some have suggested that this term is inaccurate as screen sizes vary greatly between users, especially in an era where websites are viewed with mobile devices as much as home computers.

The problem is that the people asking this question haven’t been properly educated as to where the fold actually came from and how we can use it or if we should even care.

Resources For Educating Fold-Mongers

To start off here are links to some valuable insight from industry experts both recent and spanning back several years.

1. Blasting the Myth of the Fold
2. The myth of the page fold: evidence from user testing
3. Utilizing the Cut-off Look to Encourage Users To Scroll

These three examples alone should be enough to convince even the most staunch fold evangelists. Hell, even this report from 1994 by usability expert Jakob Nielsen says,

In more recent studies, we have seen that most users scroll when they visit a long home page or a long navigation screen. This change in behavior is probably due to users getting more experience with scrolling Web pages.

When We Should Pay Attention To The Fold

Now that we have truly established that paying attention to the fold is stupid, I will put on my stoopid hat and give you a couple reasons where we SHOULD pay attention. These are more common sense examples and really will help the usability and user experience.

1. Short Pages

If you have a limited amount of content that CAN all fit on one screen (above the fold) it’s best to try. There’s no reason to force the user to scroll a couple hundred pixels.

2. Don’t Give A Reason To Second Guess

Check your designs at different resolutions. If you have any hard horizontal breaks across the page, make sure they’re not right at the fold. Easy to fix by vertically spacing your content. We want to avoid guessing if this is the bottom of the page or not. Guide them down the page by trying to avoid these fold breaks.
These two examples may seem contradictory to the posts title, however they’re not meant to be strict usability guidelines and are more design common sense.

Summary

Whew! Glad you made it. This is below the fold and I was a little worried.

There are mountains of data and information slaying the fold myth. Some are backed by years and years of expertise and research and some are more comical and intended to prove a point. It is almost as absurd as not turning the page of a book if it ends with a period.

It is our responsibility to educate those who aren’t familiar with the findings and continue to study user behaviors to educate ourselves.

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)

In the first in the series last week we talked about the Product Detail page. We looked at two of the top 100 ecommerce sites and picking out the good parts and making suggestions to improve. In today’s post we’re going to take a trip downstairs and have a look at the footers of two more sites from the same list, Bluefly, and GAP but we won’t focus on the good and the bad but more of how the footer can be used in an overall UI design strategy. In the past footers were where you stuck information like copyright info and privacy policies but nowadays footers have become an integral piece of the ecommerce puzzle.

Often times the forgotten child in the overall scheme of a sites design. Organizationally speaking, they are the last item on the page but are not any less important than any other element of a sites structure, and should be treated strategically equal.

Bluefly.com

bluefly.com

Email Solicitation

Bluefly.com has a very basic footer. The first thing we see is an email signup form that’s titled, “be the first to know!”. But first to know what? There’s no context behind what I’m signing up for. Daily, weekly, monthly emails? Am I getting emails about the brands I’m interested in or when new items are added to their catalog? Being the first to know could be a good thing or bad thing depending of Bluefly’s email campaign strategy.

A better approach to soliciting email sign-ups in the footer would be to first give the customer some explanation of what they’re signing up for. Provide a link to more info or just come out and say it. something on the lines of…

Now we know at least how frequent, and how many emails we’re actually signing up for. There is a fine line between too vague and over explanation. In this particular case, one short sentence would have sufficed.

Link Relevance and Order

Bluefly doesn’t have many links in their footer so my next point may be moot, but the grouping of links seem out of order. It could very well be for symmetrical appearance and to keep the four column of three links, this was the most logical order, but in general people (in most countries) read left to right and top to bottom, so we want to make sure that customers can find the most frequently used information first. My best guess would be, “ORDER STATUS” and “RETURNS” even before email sign up.

I don’t have any metrics from bluefly to base my assumptions on, but items we would look at changing would be moving the email sign-up to the far right and placing order status and returns in the first column, with security and privacy next to it one column over.

I also noticed Bluefly is looking for a UI designer on their careers page, so to any of you New York UI Designers, here’s an opportunity for you to make an impact. I won’t even ask for a kick back. :)

Gap.com

Gaps

Not as far as I can see. At least not in the footer. It’s a little odd to admire a footer, but Gap really did a good job. If we have to say something negative about it, we could look at how tall it is. Or if we REALLY wanted to split hairs, the orange color is a little on the heavy side, but over all a great example of good design.

Email Solicitation

I still have a small issue with the email solicitation. We still don’t know if we’re going to get one email or several. In fact they even say “email(s)” which leads me to believe that I will in fact get more than one, or at least have the option to select which emails I will get. The reason we’re not picking apart Gap on their email solicitation is because that’s exactly what they do.

After enter your email address you’re taken to a page where you can select which emails you will receive and Bluefly does not. This is truly a User Experience faux pas for Bluefly and leave it to Gap to pull it together nicely.

Wrap Up

Next time you’re shopping online, take a look at the footer. See if you can spot things that don’t seem to fit. Think about what you would do to improve the design. We don’t only learn from our own mistakes, but we can also improve our skills by analyzing good ui design and thinking about the user experience.

Photo Credit
Header image courtesy of George Eastman House and has no known copyright on it’s usage

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)

Is there a magical recipe that will convert that browsing customer to a paying one? Perhaps the key is a magical button, so magnificent that the user has no choice but to click. Or maybe it is the number of licks it takes to get to the center of a tootsie roll tootsie pop?

In this series of posts over the next several weeks we’ll look at some of the top internet retailers, and see what they’re doing to achieve their success. I think you will be surprised at what we find.

The Product Detail page or PD page is where most online shoppers will spend their time. Whether it’s reading reviews, product information, or looking at alternative (alt) images, the PD page is the heart an soul of the online eCommerce experience.

For the purposes of this part of the series we will take a look at two of the Top 100 eCommerce websites of 2009, straight from the Internet Retailers Top 100 list. Well look at 1 well designed page and 1 not so well designed, and talk about the good and the bad of both.

Anthropologie

Creatively speaking this entire site is gorgeous. Anthropologie certainly has their brand down, and it’s reflected from page to page. The PD page is no exception.

WHAT THEY DID RIGHT

Simple, concise information. The customer can get all the information about the product within a glance. This works well for sites like Anthropologie who’s clientele may be more concerned with what the label says, than what it’s actually made of. But that’s ok. Some of us do the same thing with Apple products. :)

From the on mouseover zoom to the tooltip message on the “Add To Bag” button when you don’t select a color or size. It’s those little touches that improve user experience and make the sites usability effortless.

Nice use of whitespace, and typography as well as the consistent product photography, and great use of a left nav, especially the strong call out to where you are as well as breadcrumbs, this site makes my top list for the design alone.

WHAT THEY COULD DO BETTER

Just as I mentioned typography as a strong point I’d also like to point out the inconsistencies. I’m not going to make a big deal about it because it is more than likely part of the quirkiness of the brand and if this is true then who am I to tell them differently.

Next I have to point out that the placement of some features seem odd to me. Grouping “add to wish list” with “send to a friend” and social network sharing feels a little off.

On to the “Add To Bag” button itself. It is the same color as the left nav and even though the page is clean and uncluttered it could benefit from standing out a bit more. I’m not saying they need a BOB (Big Orange Button) but perhaps just a simple color change would make a stronger call to action.

Overall, Anthropologie is definitely one of the better designed eCommerce sites. Easy to navigate, consistent user interface and branding. They have carved their niche, and provide their customers with a great shopping experience. They are able to achieve this great experience because they don’t try to be all things to all people. which is a perfect transition to our next site.

Amazon

Amazon.com is the #1 eCommerce website. It’s the first place I go when I want to compare pricing. They will typically be the best price on the net and often have free shipping. Their product catalog is larger than Han Solo’s ego, and they outperform most, if not all of the competition by billions (with a “B”) in annual revenue year after year.

WHAT THEY DID RIGHT

As cluttered and confusing as Amazon may look there is actually some method to the madness so to speak. Scrolling down a PD page on Amazon is like long checkout lines at the world’s largest flea market on Christmas Eve. If you want it, it’s there and probably cheaper than anyone else. But we’re here to talk about the UI and overall design.

Amazon has clearly defined each section as you move down the page, and even though there are a million things that could distract you, Amazon does a nice job at grouping it’s content so that each section is easily distinguished.

Another thing they did right was putting the “Add To Cart” button in the same place on each PD page. With all the variable content, can you image what it would be like if the button was under, oh lets say the “Product Description”? On some products you would have to scroll 4 screens down to get to it. So, as much of a no-brainer this was, they did it right.

They also put the basic info right at the top and left a plethora of statistical info for further reading if you so choose. I think Amazon knows they are not a browsing site per se. I don’t know anyone who goes there to see what’s new, or to watch videos about a product specifically. You go there when you already have something in mind.

WHAT THEY COULD DO BETTER

Well, firstly you might be thinking who am I to tell the #1 online retailer they could do better. Well, I buy stuff from Amazon all the time. I’m a customer. The customer is always right! :)

I have a lot of issues with Amazon.com. As a designer, I wouldn’t know where to begin with attempting a redesign but lets start with the PD page. Amazon could really benefit from a tabbed structure to clean up some of the clutter. I realize this would put some things an extra click away, but from a user experience standpoint, choice suppresses conversion. I’ve said this before in a different context, but the principle is the same.

…people, confronted with a large pool of options will be less satisfied with a decision. The more options there are, the higher their expectation. So even if they have made the best possible choice, their satisfaction level has by default, dropped.

Amazon could also stand to drop so many of the up-sells or at the least moving some of the less relevant ones to a click away. Things like “Customers Who Bought Also Bought” is fine, but “What Do Customers Ultimately Buy After Viewing This Item”? Seriously? I’m sure these are extremely valuable metrics for their business, but I could care less if 2% of the people viewing this product bought some other product. The only thing this does is make me second guess my decision, potentially abandoning my cart for fear of making the wrong choice.

These aren’t just business decisions. As interaction designers, we need to take on some accountability. We’re supposed to be improving the customers experience through well thought out UI and persuading them to convert. Amazon somehow manages the conversion part very well, but leaves user experience at the door quicker than Luke left Dagobah to save Leia.

I could write pages on how we could improve Amazon’s Product Detail page, but the truth of the matter is, they’re #1 and probably will be for the foreseeable future so the point really is moot.

Summary

We’ve taken a look at 2 of the top100 eComemrce sites PD pages and talked about their good points and bad points. To recap:

ANTHROPOLOGIE
The Good

• Great design
• Clean layout
• Nice use of whitespace and typography
• Good usability
• Strong brand definition

The Bad

• Strange link grouping (wish list with sharing)
• Need stronger call out for “Add To Bag” button

AMAZON
The Good

• Clearly defined sections
• Great Add To Cart/Wishlist placement
• Important description info at the top
• Plenty of product images

The Bad

• Clutter
• Too many up-sells
• Poor layout
• Too much useless information

What say you? We would love to hear your thoughts.

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)

First off, a warning

This warning goes for anyone really, both designers and non-designers; be careful when defining just what being “productive” really means. We often can mistakenly equate productivity with the amount of money or the number of jobs we receive; productivity, in all reality, is a much broader term than we give it credit for. Productivity, in its most natural form, is the verb form of production; it basically means the act of producing, and creation. With that said, productivity is often measured conventionally in order to assess the different methods and practices we employ, and that does deserve the respect it requires. So, don’t throw away your benchmarks just yet, but do realize that it will benefit you to redefine your holistic view of productivity. Examples:

• Learning about your area of practice can be very productive.
• Learning about surrounding areas of practices that are related to yours can also be very productive.
• Taking time off can be very productive.

Say what? You mean, I can walk into my boss’s office and let them know I’m not coming in for the rest of the week, and they will give me a raise?

No.

The world isn’t quite that easy. Here’s a few ways to increase your productivity.

Note: As you can see above, some of these “productivity tips” may not necessarily be what your boss believes to be productive (unless, of course, he’s as high-class as you and is reading FUEL blogs…). Be careful in the application of the following, and remember that sometimes you do have to follow the definition of productivity as outlined by your boss’s standards. Of course, if you’re your own boss… This is article may just change your life. Or not. Let’s find out, shall we?

On to the list…

1. Become an Expert

We’ve said it before, folks – it makes much more sense for you to find an area in which to focus (whether that is design, front-end development, backend development, or even just creative production) and hone in on it. Don’t just get to the point where you know your stuff pretty well… Instead, know it so well you could teach it from front to back.
Memorize things. Read through jQuery documentation or tutorials in your downtime, or practice with pro bono work to sharpen your production skills. Find your niche, and sprint towards that direction.
The why: Being an expert will allow you to move forward in your job unhindered. Having the knowledge available to you will cut out the unneeded “guess and check” time, and will open up your freedom for creative expression.

2. Exercise

Bet you didn’t see that one coming. Don’t worry, I’m not giving you a workout plan and a bottle of overly-priced herb pills… It’s a well-known-fact that exercise will help your productivity. In particular, exercise has been studied and shown to increase your ability to learn. There’s quite a bit of science behind it, but the proof is in the pudding… What does that even mean? Anyway, just try it out yourself. “Exercise” doesn’t mean that you have to kill yourself in the gym for 3 hours a day. Listen to the latest YayQuery podcast while you take a jog around your neighborhood (or on a treadmill if it’s too cold) or go get a cheap bike from Wal-Mart and ride around town with a few friends. Even if it’s thirty minutes a day, exercise can drastically improve the way you work and the way you feel about yourself.

3. Get a Google Calendar

A much more specific example, admittedly… It’s a well known fact around FUEL that the tools Google offers are pretty great. Specifically, Google Calendar is very useful, especially if you already have a Google account.

Here’s the big deal: Google Calendar syncs via CalDAV, which means it comes automatically to your iPhone or Android, iCal, Outlook, and any other calendar program worth its salt. We know you may already be using some kind of calendar that you love. Google allows you to import calendars from feeds and local files as well. There’s no way we could list every feature here, but this would mean that you could create a collaborative calendar between you and any specific employee/coworker/family member/client/you-get-the-idea; these shared calendars also can be controlled to be “only viewable” or “show only busy/free” or “completely editable.” The flexibility is incredible.

Oh, and don’t forget, Google users… with so much of your information available on Google already as a Google account holder, integration is pretty simple with your other everyday tasks, and Google is making it a point to consolidate functionality across their different products.
Note: Don’t forget to back up your appointments before moving them to Google, just in case your computer you all of a sudden for something.

Okay, so why is this such a big deal?
Once you get in the swing of using your Google calendar, it will be accessible from anywhere you are. You don’t have to worry about downloading or adding the same entry multiple times. If you are an employer/supervisor, this could be the solution to scheduling, or any number of other things.

A Few Other Tools

Surprise for Windows users!

Since we’ve admittedly been a bit biased towards Mac OS X in the past, we figure it’s about time to throw Windows users a bone or two. (Oh come on, you can take a joke.) GNOME Do is a similar program to Blacktree’s Quicksilver for Mac users. This will change your workflow forever! Be sure to read up on its capabilities. Also, take a look at this Flickr set to see some of GNOME Do in action.

A Little bit of 7 in your X

For mac users, you may want to check out Cinch. One of the cool features introduced in Windows 7 is its window resizing shortcuts. If you haven’t seen it yet, just give it a glance at least.

What are ways you’ve employed that have made you more productive?

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)

There’s a ton of these little applications floating around to change up your desktop. Check out Bowtie for iTunes, TinkerTool for a bunch of cool hidden preference tweaking for things like shifting your dock around from it’s normal centered position.

This doesn’t even touch the surface, but I found this stuff over the course of the past few days and thought it way too interesting to not share.

A cool idea

Nerdtool actually allows you to use a snippet of a website as part of your background. As I was looking through the program, I thought of a cool idea for those of you who have a domain and hosting; with a little bit of time and work, you could set up your own little networking, blogging, or RSS home right in your “wallpaper”.

So what have you done with your desktop? Show us by posting in the FYI Flickr group!

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)

Whether you are a light user wanting to transfer your twenty-something kilobyte documents between computers across town, or you run a multi-national business and want to transfer large presentations, video files, and many other things between you and hundreds of co-workers, Dropbox has an account for you. It’s like a jump drive that gets to where you’re going before you do… and also, doesn’t ever take up space on your keychain. Oh, did we mention it has a mobile interface and a dedicated iPhone application? There’s way too much to say about Dropbox. Just go check it out here.

It’s pretty obvious how big of an impact Twitter has had on the world of Social Media, and therefore the entire web, and therefore interface design. Twitter began this year, however, with some experimental things (a la Google); one of these experiments is Twitter Lists. Obviously, because of the immense number of people who tweet daily, you can quickly end up with quite a few folks on your Follow list. How do you keep track of them? Some apps implemented lists before Twitter finally caught on. And, of course, because Twitter now supports lists, they are going to be a lot more functional (and universal) for Twitter users. Check it out here.

Everyone has wasted time on Facebook. If you haven’t, then maybe now is a good time to start. Why, you ask? Well, instead of wasting time pressing the refresh button, you now can waste time stalking your old classmates from ‘95. Or, perhaps you just want to watch the feed, as if it were a tv show. Thanks to Facebook implementing real time updates, you can do that. Thanks for making us more productive at being less productive, Facebook!

Also, don’t forget those wonderful Facebook iPhone applications. Not only are we more productive at wasting time when we’re supposed to be finishing up some spreadsheet or another… we also are able to have Facebook Chat at our fingertips while we drive! But seriously… Facebook really has taken some leaps and bounds in making the world more connected this year by changing the way we see the dynamic abilities of Social Media.

If you haven’t watched Google’s super-long introduction video to Google Wave, you can do so here. That will tell you a lot of the details… but even Google doesn’t tell you everything in that video. The truth of the matter is, Google Wave’s long-anticipated arrival will slowly but (almost) surely become a big player in the game of collaboration and Social Media, as well as blogging, in the future. As it is currently in beta (what else do you expect from Google?), not everyone can use it just yet. Remind you of any other successful social networking stories? (Okay, in case you didn’t know… Facebook was limited to college students until 2005, and only in 2006 was it opened to anyone and everyone.) Get to Waving, folks – there’s a LOT of capability here, and the more people who use it, the more powerful and useful the platform will become.

For those of you who are iPhone users, you know why this is such a big deal. It made the list not because it’s groundbreaking or because it changed any game. No, it just changed hundreds of thousands of users’ experiences. Why is this genius (and, make no mistake, it IS genius)? Well, we can’t promise these things, but it’s quite likely that Apple knew from the beginning just how badly people would want this feature. So customers sit and wait on a “big feature” of iPhone OS 3.0, which, turns out, Apple knew how to do a long time ago. So a brand new selling point of the iPhone comes out of what is, for other phones, just a normal feature. This is just another great example of why Apple easily garners lasting brand loyalty that is built on excitement and buzz. I mean, what iPhone user didn’t get excited when they heard about cut/copy/paste for iPhone? Exactly.

CoTweet is a platform that helps companies reach and engage customers using Twitter. Or so it says on their homepage. And yet, it’s so much more! Do you have multiple Twitter accounts? Or one account that you need multiple people to post to? CoTweet is the tool for you. A gorgeous web-app in the purest sense. You can schedule your tweets to post at a later date, assign DMs to users, automatically repost your tweets to dozens of other social network sites like, Facebook, LinkedIn and MySpace, monitor keywords and trends and even click tracking via Bit.ly integration. The list goes on and on! But don’t take our word for it, one look at the features page and you will easily see how this interface makes the list.

Alright, we lay down arms for a minute here to recognize the beauty of the new operating system from Windows. Sure, the editor of FYI (that’d be me) owns and uses two Apple computers, but for Christmas this year, it may just be time to spring for a dual-boot endeavor. Why? Well, there are simply a litany of really cool interface enhancements to make everyday workflow incredibly easier. It’s the little things, folks, and Microsoft has (finally) learned how little things can stack up to be quite huge. (For instance, the “Snap” feature may just make us Mac fanboys a little… territorial. Jealous is a strong word…)

Apple’s Snow Leopard fixes a lot of usability issues that have been around since Leopard (10.5). Stacks works better, Spaces and Exposé… oh, and did we mention the fact that it upgrades the entire operating system and all Apple applications to 64-bit? Just you all wait until CS5 comes out… if it finally supports 64-bit, it is expected that Mac users will see some enjoyable speed increases. The usability of every day processes has been laid out wonderfully by Snow Leopard, both for now and for the future.

There are also a lot of brand new features Apple introduced (for instance, GPU accelerated processing).

This tool can be seen in use on Abduzeedo; basically it allows all of these wonderful social networking tools that work on their own (Facebook, Twitter, etc.) to be integrated together, right on a website, such as Abduzeedo. This tool is simply fantastic for bringing it all together; talk about usability! Not only can you drag photos straight from the page to the sharing tool, but you can also traverse across multiple chat clients (that’s what Meebo does best anyway). This made the top of our list for many reasons. One, it’s extremely powerful and time saving; instead of popping open seven tabs for each and every sharing service, you just drag and drop. It just simply rocks. And we like things (and people) that rock. It’s pretty simple, don’t you think? The only negative points so far is that it’s not available to the public just yet… hearsay says 2010 will bring it to your domains. UPDATE: Thanks to one of the comments below from Meebo for this update – there is now a version of the Meebo sharing bar available! Check it out here: http://bar.meebo.com

Now, what are your top picks of 2009?

WANT MORE?

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)

I’m no superhero, I just have a secret weapon. Which I’m going to share with you, right now.

Let me step out of the usual coy article-writing character, and say it up front:

You wanna kick butt? Read a lot of research papers.

Yes, research papers. The publish half of publish or perish. Dry, academic, boring, inaccessible (and sometimes expensive) research papers.

They’re simply a gold mine.

They will make you smarter, better, and yes, even hotter (when your eyes start going bad from all the tiny type, you’ll resort to getting yourself a sexy monocle).

I know, you’re thinking that this is the very definition of hyperbole. But stick with me til the end of this article. I obviously can’t force you to read citations til your eyes blur, but I would bet you money I can convince you that you should.

We all agree that great interaction design is important, or we wouldn’t be here.

So, let’s talk about interaction for a moment.

Everybody says that excellent interface is one of the big reasons Google wins. It’s so simple; it just works; it’s a big friendly question box, just sitting there, waiting to help us. And, of course, Google was founded by two very ambitious PhD students.

So, if some research came out that totally demolished our view of how people search for information, you’d think that Google would be first on the scene. Right?

Sadly, wrong.

Let’s take a look at what they’re missing out on.

The Berry-Picking Model of Search

According to Marcia J. Bates, graduate researcher in the Library and Information Sciences department of UCLA, our existing models of search are dead wrong.

She proposes a different model, more accurate by her measure (and also by mine). She calls it berry-picking.

In reality, she says, users almost never find the desired result on the first try. This isn’t just because they don’t enter the correct terms. Their very idea of what they are looking for evolves over multiple searches and their desired documents extend across multiple searches, too.

Imagine a little girl tra-la-la-ing through the forest as she picks berries. She stops at this berry bush, and that berry bush, then returning to the first because it just looks so good, taking some berries from each. Then you pretty much have got it down.

Imagine, then, a search engine that helped you when you searched like that—the natural way to search. It would show you your old search terms, so you could revisit them, in case your newest forays were unproductive. You could “pin” results to some part of the page for later, in case you found nothing better, or wanted them in addition to the new goodies you found.

Wouldn’t that be great?

Doesn’t that sound exactly like the kind of thing Google should be doing, to push the boundaries of search engine design?

Or, if not them, then a competitor trying to get a leg up?

Now: I want you to guess when this research paper came out.

I’ve never seen any of these feature ideas implemented on any search engine, ever. Have you? So this paper must be really cutting-edge, right?

Actually, it wasn’t even published in this decade. Or this century. In fact, Marcia Bates published this remarkable paper in 1989.

You could be first on the scene with a practical application.

There are tons of research papers out there, like this one, that are just ripe for the picking (no pun intended).

Thanks to the publishing model of science, there are many people who spend their entire academic careers doing research in user interface-related topics. They don’t typically develop or release software. They often don’t even offer specific feature suggestions. But they do describe reality, and tests they made, and what does and doesn’t work.

You can read their papers and come up with the features and design them yourself.

Convinced yet?

How to get started

There are four major sources for computer-related research papers online:

1. The General Web
   Many researchers and/or their universities publish their papers online for free. If you read papers, or books, that cite papers, you can often find their citation lists online for free. You can find Marcia J. Bates’ paper,THE DESIGN OF BROWSING AND BERRYPICKING TECHNIQUES FOR THE ONLINE SEARCH INTERFACEfor free. I recommend it.
2. The ACM
   The Association for Computing Machinery offers a yearly subscription of about $200 for anybody off the street, and this gives you access to a large portion of their online library. It dates back decades and is fairly searchable. You can also buy individual papers instead of a membership.
3. Other online services
   The other two major sources I’d recommend are Questia and Highbeam, although not in any specific order. They are not as affordable or comprehensive as the ACM, but the ACM does not have everything.
4. Books
   There are also many available books that compile industry research papers. Some analyze a whole body of papers so you don’t have to read and digest them yourself.

One more easy place to get started

If you’re new to research, I can recommend no better place to start than the personal information textbook Keeping Things Found. The author talks about berry-picking, among other things. (It’s not a bad read, either.)

In conclusion…

Most user interaction professionals never bother to read a single research paper. Those who do, have a huge leg up on the competition. And a greater chance of making happier users.

Research papers are available, they give you a professional & competitive edge, and they’re not terribly expensive (sometimes they’re free). Usability researchers even tend to write better than, say, philosophy PhD’s.

You’ve got nothing to lose, and everything to gain.

It’s time to kick some interface designing butt! Now, go read.

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)

Well, obviously we aren’t talking about needing any kind of extended astronomical knowledge; space is the area with which we choose to do things. Today we will talk about this area in many different ways.

White space

White space is the area within a design where there is no imagery or text; it is instead a solid color (more often than not it is actually white). White space is an essential part of any design. Our eyes naturally desire balance; but balance doesn’t mean a fifty-fifty draw of color space “A” versus color space “B”. Rather, it is a psychological interpretation of a physical visualization. (Don’t worry… it’s not as confusing as it sounds.) The use of white space allows for a place for your eyes to move in order to escape the text; this makes the text itself a much more effective means of communicating.

Huh?

Okay, so if you don’t understand, white space is essentially the “breathing room” in your design. If it looks crowded, well… it probably is. The way our minds perceive things is different from the way we might calculate them. Reason might tell us that as long as the letter isn’t misconstrued by another color object, too small, or too large, then it is readable. But as we have learned in the past, design itself is not a science; rather, it is an art that observes science and rationality within the process of execution.

What does this mean for me?

Essentially, it means think about your design and the amount of resting space you have. Since we are talking about interfaces, obviously you should go through the process of using the interface multiple times; if anything stands in your way of using the interface, it’s probably time to shift some things around. Don’t be afraid to space out your body copy and headers. Use this breathing room to section different portions off from other portions (for instance, navigation from content, and content from sidebar, or whatever is applicable).

On the other side of the coin, if the white space you are incorporating detracts from usability, it is probably time to reconsider; for instance, body copy line spacing shouldn’t be so large that you aren’t able to differentiate between a new paragraph and a new line. Use white space, as we have already said, to your advantage, not for your to-do checklist.

Rule of Thirds

One easy way to ensure a good use of white space is by employing the design principles of composition; allow your design to follow the rule of thirds or the golden ratio, both of which are very common and effective design practices that apply a little bit of science to the art. The rule of thirds splits the composition into nine equal parts (separated by two horizontal and two vertical lines). The golden ratio is based on many historically congruent sources, including the human body; it has been used for the design of sculpture and the progression of many types of art.

Read the White Space

Of course we have talked about visual white space; but what about textual white space? When people read, they look for resting points in the dialogue. This, in a way, can be considered white space. Be sure to allow your creative vocabulary its time to shimmer AND its time to stay sheathed. Not everyone necessarily appreciates your large vocabulary, much less do they care to take the time to read your seventeen-syllable words and overly-complex sentences. Take a breath! Haven’t we already said this?

If all else fails…

Sometimes in design, we realize that every tip we heard about “best practices” doesn’t apply to a particular job. As much as it pains me to say it, there are times when white space just simply doesn’t have its place in the design (newspapers are a perfect example for those of you print and page layout designers). Consider the psychological implications of the design, always. Understanding your audience is the first step to success, and ultimately is the most important concept in interface design.

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)

Big Goal Number Two

As an interface designer, you are often given assignments with one big goal in mind: make this interface as usable as possible.

Now, ancillary to this goal are a lot of “mini-goals”, such as maintaining a holistically congruent branding image, communicating certain messages, conveying certain feelings, developing for certain platforms, and the list goes on.

But what if we have been missing out on big goal number two?

Let’s take a step back, as many of us probably often forget to do, and look at the reality of our situation.

On a daily basis, we as interface designers don’t have the task of designing an interface that targets everyone in the entire world (such as Google, eBay, Amazon, or Yahoo). Instead, we are given a target audience to build an interface for. This usually takes a backseat as one of our mini-goals, but we need to change our thinking. This needs to become our Big Goal Number Two.

“Target audience” is a pretty familiar term for most interface designers. Most of us know that we have to understand demographics and psychographics of the target audience, and study them in both quantitative and qualitative ways. We know that we should take into consideration all of the data we gather about the target audience in order to build our specific interface, and so on and so forth…

The Principle of Disagreeable Design

What we often forget to realize is that while we are designing for a specific group of people, we are effectively designing against everyone who is left over. What this means is that you are no longer designing with the “accidental audience” in the back of your mind. The target audience becomes the only focus, and therefore you estrange the rest of the world. This is an important principle to understand, for one simple reason.

Designing for an elite group is more effective!

Okay, so of course, you build your rules and boundaries around that ever-so-important target audience. But without the Principle of Disagreeable Design, you wouldn’t really be able to commit to that group completely. You still employ your overarching “best practices” and ideas that are rooted in the status quo’s opinion of what is usable, “good” design, or any of a number of other adjectives we use to describe our somewhat shaky “objective” design standards. Sometimes these shaky standards are the cause for a compromise when it comes to Big Goal Number Two, and we don’t connect with our target audience as efficiently.

But what happens when you take a daring leap towards an elite group that rejects almost everyone in the whole world? In fact, it DOES reject everyone except your target audience (the elite group)? That same daring leap that rejects an enormous number of people, as a tradeoff, very closely knits you as the communicator to your target audience.

That leap may be the difference that your interface needed to go from functional to awesome.

Note: I know what you’re thinking. Don’t take me out of context here and say that “that crazy editor at Fuel Your Interface is an interface-design-usability-relativist!” (Okay, let’s face it… none of us are that dramatic… I hope). Of course, there are almost always some things we retain as understood musts. For instance, text that is meant to be read must be able to be read. These are the obvious ideas.

Why does this work?

Tribes, by Seth Godin; Published by Portfolio Hardcover, 2008

Web marketing guru Seth Godin discusses this idea in his book, Tribes (check it out here). Seth’s big idea is that everyone belongs to at least one tribe, and almost certainly to more than one tribe. Each of our tribes have distinguishing characteristics that set them apart from other tribes. These have been referred to as “sub-cultures”, “sects”, and, in our case, “target audiences.” What is it about your target audience tribe that sets them apart from every other tribe? What are their defining characteristics? Do they have quirks or a specific language and terminology that is unique to only them (can I get a shout out from the Star Trek fanatics!)? Do they have a corporate emotional connection to a certain object, animal, idea, or even person? Maybe they all wear a purple shirt on a certain day of the year, or perhaps they are committed to going environmentally “green”. Asking these questions will push you towards taking the leap that will knit you closer with your target audience (while unashamedly rejecting everyone else).

It works because this tribes psychology goes beyond the simple process of categorization of people. People find a sense of belonging within a tribe. If everyone was allowed to be a part of every tribe, there would be nothing special about being a part of it. So, tribes allow only those who subscribe to their particularities to “join,” though the process of joining is rarely formal.

So, in the same way, if everyone uses your interface, what’s so special about using your interface? Instead, very acutely pursue your target audience. This will, in the end, be the most effective way to achieve BOTH of your big goals.

Conclusion

In conclusion, it should be noted that this in no way means that you should reject outsiders directly or textually; this article, rather, is to help you realize the value in rejecting traditional practice if it means a more accurate and efficient communication to the people that matter: your target audience. They are by far the most important objective, even if focusing on them means that you end up estranging the “accidental audience”.

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)

It’s Thanksgiving. A day to eat turkey and pie. A day to watch a parade, and then football. A day to think about the Mayflower, if you feel like it. A day to… give thanks. And I, as editor, am very thankful for the readers of FYI. That’s why I am giving out four Google Wave invitations to four of you.

The selection process will be random as always, but to be eligible, you must either add @fuelinterface on Twitter and tweet an @reply with the following message: “@fuelinterface A Thanksgiving Google Wave invite would be awesome!” (or something along those lines), or comment here on this post.

Thank you all for reading, commenting, and tweeting around with us!

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)

Vector vs. Raster

A smart object is basically a vector object inside Photoshop’s (mostly) raster world. If you don’t know the difference between vector and raster, a basic rundown goes like this;

Vector images are created by using calculated lines. This essentially means that the curves, shapes, lines, et cetera are displayed as a result of a lot of calculations on the part of the program you are using (in this case, Illustrator and Photoshop). It’s kind of like an extended version of what you learned with point-plotting, sine waves, and function graphs in geometry, mixed with colors and transparency values.

Raster images are basically plots of color on a pixel map. This means that each pixel in your image is assigned a color, and depending on what kind of file, sometimes an alpha value.

If this still doesn’t make sense, the best thing to remember is basically that vector images can be blown up or shrunk to any size and will not lose quality; a raster image will lose quality if blown-up above its original size. Vector, thus, is the preferred format for logo design and typographically based design. However, vector images are somewhat limited in their ability to be manipulated in Photoshop. Be sure to check out the last tip in the article for a possible workflow-based solution to this problem!

What is a smart object?

A smart object in Photoshop can be one of two things.

1. A version of a raster layer that doesn’t lose quality when it is transformed down and then back up
2. One or multiple vector lines/shapes/information

Today, we will only be dealing with the second variety.

Traditionally, vector images are created inside Illustrator; however, as many designers have found, it helps to be able to move from Illustrator to Photoshop fluidly. One of the easiest ways to do this is by using – you guessed it – copy and paste.

So, say we need a striped design we have created inside Illustrator for a design we’d like to finalize in Photoshop. What is an easy way to get it into Photoshop? Cmd or Ctrl + C, of course! With the document open, copy either with the copy keyboard shortcut (Cmd or Ctrl + C) or by going to Edit > Copy.

Switch to your active document in Photoshop and either use the keyboard shortcut for paste (Cmd or Ctrl + V) or choose Edit > Paste. You are given the option to paste with different forms. Smart Object is one of the choices. Make sure the radio button next to smart object is selected, and press OK.

You then have the option of transforming the object in the same manner as you would if you chose Edit > Free Transform. Here, you can scale, skew, etc.

Once you have made any transformations you’d like to make, press Enter to accept the transformation. In your layers palette you will see a smart object layer.

If you decide later that you’d like to change something about the object, simply double-click the layer thumbnail. This will open an Illustrator editing window. Once you have made any changes you’d like to make, choose File > Save and exit the window.

The Photoshop document will automatically reflect the changes.

Tip: It helps to duplicate smart objects up front so that if you decide to use any kind of filters or warping on the layer that requires you to rasterize it, you will have a copy of the original vector object. An easy way to duplicate layers is to first select the layer you’d like to duplicate, then press Cmd or Ctrl + j. After doing this, you can place it in a folder, such as the “Originals” folder below, along with any other layers you’d like to preserve the original version of. This is mostly effective when using effects or filters that “destroy”, or change the value or location of, the actual pixels in the layer.

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)

Mistake #1: Waiting

You’ve done countless hours of studying. You’ve visited hundreds of tutorials and spent hours in classes and conferences. You’ve heard, read, and practiced the best practices, and you know Photoshop shortcuts like the back of your hand. You can quote every line of jQuery, and you could reproduce every Flash site on the FWA. You can type 90 words per minute. You know a lot. So, you’ve made a few interfaces, and you’ve posted your stuff online on Behance, Flickr, or even your own online portfolio. This is the important part, ladies and gentlemen: now what?

The mistake most people make is simply sitting back and waiting. Even if your work is top-notch, and you eventually are hired, there is no positive motion that happens as a result of waiting. So, what do you do? Now what? This happens often with freelancers at the beginning of their careers. They get a little bit of work under their belts, and then sit back and wait on customers or employers to come their way; this is one of the worst steps for your career for many reasons. First of all, you are not guaranteed that anything will happen. Secondly, most clients and employers would much rather see someone who is active in their field and informed about the latest aspects of that field than someone who is, essentially, a “has-been.” In most other occupations, a “has-been” is one that is from years past; however, in professional media, a “has-been” can be someone who is just a few months out of the loop. So what are a few ways to stay active in interface design?

• Do mock jobs
• Involve yourself in a community of other designers and developers, and offer advice or help.Note: A good way to do this is through Twitter, Facebook, and other social networks. Also, by leaving comments here on the Fuel Network sites! Be sure to follow FYI on Twitter @fuelinterface, and feel free to follow me personally as well @jcutrell
  
• Take old designs and improve on them.
• Work for free (for non-profit companies, friends, etc.)Note: Be sure that working for free will not affect the quality of the product you release!
• Explore new facets of your occupation, or cross over into another practice to supplement your interface design skills. For instance, try out typeface design or art illustration.

Mistake #2: Ignoring The Garmon Principle

Don’t worry if you haven’t heard of The Garmon Principle. Considering it was invented about 30 seconds ago, you’re probably not the only one. Chris Garmon is a good friend of mine that recently sat me down and changed my thinking about all of my professional media work. Garmon isn’t necessarily a design professional, nor could he write more than a line of HTML.

I showed him an interface idea I was working with at the time. I was very excited; it used some jQuery effects and Ajax loading that I had just learned, and the CSS and HTML were both on-spot. It was designed with intentional design theory, and it was ready to have content infused. As I showed him the product, his face disfigured a little bit, and he said, “it’s not really that great.” In the back of my mind, I thought, “Oh yes it is. You have no clue what it took to make this do that, and that do this. And the jQuery is cool, and the black and white theme is really in…” But then I realized, you know… it really isn’t that great. In fact, it’s nothing but a waste of time. Then, Garmon went on to tell me what I have come to know as The Garmon Principle.

The first thing you should do is close your laptop, put away your cool bag of tricks, and think. Think, “What would be the perfect site for this? What would it look like? If there were no boundaries, what is the coolest thing, or the most functional way, to make this happen?” Also think, “What will make this worth existing as much or more than the next guy’s interface?” Once you have decided what the best possible solution would be, figure out how to do it. If there is something in your original idea that just simply isn’t possible, then amend it. “Re-idea,” if you will. But never, ever, EVER sit down and start doing things simply because you know how to do them. Because the truth is, no one really cares how much you know about coding or development. The people who are looking at this site aren’t thinking about what it took to make it, or how many advanced lines of code you wrote. They’re thinking about how it is now, as a whole.

All Garmon was telling me was that the concept is far more important than the method. The function trumps form. It is easy for us, as designers and developers, to get caught up with our practical coding knowledge; but the truth is, it’s not a bunch of little things that make a site good. It is, almost infallibly, one thing. Now, what that one thing is, you have to figure out before you ever type a single line of code or push a single pixel.

Mistake #3: Spreading Too Thin

This is the most often committed mistake in every professional field. Without going into too much detail, we can understand this concept fairly easily. In international trade, different countries trade a limited number of goods that they have the comparative advantage creating. For instance, the United States isn’t nearly as good at producing bananas than a tropical island would be, and the tropical island isn’t at good at producing commercial aircraft as the United States is. Therefore, for a certain number of airplanes, the United States can trade the tropical island for a certain number of bananas. The reason this works well is because each country is doing what it does best, thus being as productive as possible.

The same concept can be applied to people! If you are really great at designing ecommerce or photo gallery sites, then don’t be afraid to focus solely on ecommerce or photo gallery sites. By doing any other kind of interface design, you will be taking away time from the thing you are best at, and therefore you are not being nearly as productive as you could be. This can be detrimental to your career; If you were free to focus on what you do best, you would produce your best possible product.

Note that this doesn’t mean, however, that you completely ignore every other practice surrounding your field. Sometimes, other practices supplement your practice. An example of this, for many designers, is photography. Practicing some in photography will increase your knowledge and understanding of color, 3D space, composition, and many other important concepts that cross over into your practical knowledge of design. The important thing is that you focus mostly or completely on what you are best at.

Conclusion

In conclusion, we can be a lot more successful if we avoid these three things. What are some other mistakes you’ve learned from? Comment here, or tell us through Twitter!

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)

One of the easiest ways to create a color state is to use an adjustment layer in Photoshop. In basically one step, you can create great looking buttons for your interface!

Let’s get it done.

Open your color button in Photoshop. It is important that your button has a transparent background; you will likely be opening a png image unless you have a layered PSD file. If you do have a layered PSD file, it would be easier to put the button layers into a layer folder.

Next, click the “Create a New Fill or Adjustment Layer” button at the bottom of the Layers Palette. This will give you a flyout menu with multiple options, some of which you may be familiar with from the Image > Adjustments menu. For this tutorial, we will select the Hue/Saturation option.

Adjust the settings in the Hue/Saturation window (the screenshot is of Photoshop CS4, but the options are very similar in other CS versions) until you are happy with the result. I’ve chosen to desaturate the button entirely, and add a bit of lightness into the button (value for saturation: -100; value for lightness: +20). These aren’t the only settings possible, of course; perhaps you only want to desaturate the button slightly, or even just add lightness? This is the place where your discretion is in play.

So your final result will look something like this if you chose the options suggested.

The Best Part is…

But wait! It gets better. There are a few perks with using this technique. Adjustment layers are non-destructive; this basically means you can always change your values later if you don’t like the result. This also means you always keep the original button underneath the adjustment layer.

Also, you can always drag adjustment layers between multiple Photoshop documents; you can even take all of your buttons and place them beneath a single adjustment layer in one Photoshop document, and voilà! You’ve created another button state for all of your buttons with just one layer. From there, all you have to do is save as a PNG with transparency, and you’re set!

We could go on, but…

There are a million things we could say about adjustment layers in Photoshop, and how effective and time saving they are; but hey, we’re trying to get this done in three minutes, right? Don’t worry, you can always come back for more FYI tips in the future. Follow use on Twitter for the latest information!

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)