Pixels

by Zack on May 18, 2009

pixels_logo

wordpress_login

This is the WordPress login screen. Well… sort of. It has a problem. Can you spot it?

Humans register patterns at a subconcious level and we are very sensitive to differences. Even if you didn’t spot the border being off your brain still registered something was wrong. These little errors are the difference between a professional product and one that just feels wrong. And the difference between a product you trust and one you don’t. Pixels matter.

These small pixel imperfections are the visual equivalent of typos. You’ll never find them all, but someone looking at your work will. You can find visual typos with many of the same techniques that work for written ones.

Go away for a while and then come back fresh. You’ll notice many more errors just by getting some distance.

Invert the colors. Many small problems show up when you invert the color scheme using a tool like Photoshop or GIMP.

Zoom in. Take a screen shot of your UI and zoom in on it. Many problems are easy to spot at 400 percent zoom.

Have someone else look it over. Most people can’t edit their own work. A second pair of eyes will find many mistakes you missed.

Your designs will never be pixel perfect, but they must be close. Especially on your front page or early screens. Your user’s first glimpse of the software affects the way they think about everything after. Find those pixel mistakes and fix them.

Leave a Comment

Your Comment

Your Comment Preview

Previous post:

Next post: