Sam Soffes

Don’t Forget the Little Things

Posted on

Tonight I spent an hour on a simple animation. Instead of the UI element simply appearing, it now fades in and fades out. To get this right takes time. You wouldn't believe how much nicer it feels with the simple animation. It feels polished and complete instead of jarring and hacked together.

It's funny how a 0.2 second animation can make something feel a million times nicer

@soffes April 13, 2012

The fade in takes 0.3 seconds, moves the element 100 pixels, and scales from 80% to 100%. The fade out takes 0.25 seconds, moves the 45 pixels, and scales from 100% to 90%. (All of these values are relative to the element's size.) The point being, getting all of this right took awhile. It's a lot of trail and error to get it right. When you get it, it will just feel right.

It's worth the time. Take it. Seriously. Do it. At this point in my project, I just need to get stuff done. If I did this with everything, I'll never ship. The plan is to take the time for more important things and leave less important things for later. I'll spend a week once everything is firmed up and just write little animations that are a fractions of a second. Can't wait.