December 4, 2008

Overused Effects

People ripping off design gimmicks from Apple is nothing new. For example, take a look at Microsoft's "New Xbox Experience":

Does this look familiar? If so, it is because it is a blatant ripoff of Apple's iTunes Cover Flow:

Apple starting using the whole fake reflection thing, and it didn't take long for every unoriginal graphic designer in the country to start ripping it off. I hope whoever thought of it got paid well.

Anyway, it seems like the latest Apple style that people are ripping off is the use of a simple white gradient along the middle of an image to make it look like it is a shiny button. It is used most noticeably all over the iPhone home screen. It's nice. But that doesn't mean you need to be using it. Not everything needs to look like a shiny button.

However, if you are going to go for that shiny button look, just make sure you do it right. First of all, the lighter top half needs to have a fading gradient. Just having the top half of your image a little lighter than the bottom half does not a button make. For example, look at this heinous site banner (click on the image to witness the horror in full size):


I put together an example below [I felt like I was doing one of those Bob Ross painting demos the entire time I put this together]. I pretended that I was putting together an iPhone button for my own page. Of course, the 'Q' doesn't match anything on this page or my portfolio page at all, but we'll ignore that. The button on the left has a white overlay with no gradient. See how weak it looks? The middle button has a gradient, which looks considerably better. And the button on the right has a gradient on the background color of button, which looks best.
So yeah, I guess I'm just saying that perhaps this type of thing is best left to the people who know what they are doing. If you don't know how to do the button gradient thing, then just skip it. But if you are awesome like me, you can do a double Apple rip off and put a reflection on there:

No comments: