I love to find examples of small details around the web that impress me in their innovation, craftsmanship, beauty, or structure. Here’s one I ran across last week:

When you type in a bad password on MobileMe, it doesn’t simply show an error dialog, but animates in a bubble that points to the password box and hovers over the existing text. This is a nice departure from error messages that insert themselves into the 2D HTML layout that’s typical of most websites.

This provides that modern feel through layering, shadows, and animation that make it feel like the iPhone — human in its approach to UI interactions with you. All the subtle cues are there, and all the mechanisms to help you adjust to the new layout naturally. I really like it.

I captured and annotated this screenshot using Awesome Screenshot (available for Safari, and Chrome). I like to grab screenshots with it, and then annotate them with text and arrows, then drop them into Evernote and let it index the text it sees inside the image. That way I get notes close to the things I care about, I can point instead of say “that box up above the blue one”, and I don’t lose the benefits of searching my notes. Overall it’s a pretty effective way for me to take notes about designs I like around the web.

I think I’ll try to snag an example or two each week for a while and post them here in my Impressions area to share with you.

Got any favorite design examples? Leave a comment and share with everyone!