Unexpected Surprises of Following Guidelines

I finally got around to downloading Instagram last Saturday. With the exception of the photo compression and excessive pictures of lattes, it’s a great social platform for sharing photos. I also enjoyed the automatic uploads to Flickr, Facebook, and Twitter making my social media whoring easier. What really caught my attention is Instagram’s app icon while it was loading.

The loading overlay is the same size as the camera lens. While watching this install is a one-time action, I was impressed by the thought that the designers made into making the icon.

Later on, @ytsutano pointed out the iOS icon grid system that they followed.

He also mentioned that this was only the case for the iPad, as the overlay is different for iPhones. Sadly, this is indeed the case.

Instagram probably didn’t design their app icon for the loading overlay on iPads, especially given that Instagram’s app is designed for the iPhone and not iPad. However, they likely followed the grid system recommended by Apple.

This reminded me about consistency in design throughout your entire work. You wouldn’t switch your font midway through a document, right? While some companies have products that follow their own rogue guidelines, they aren’t consistent across their systems. Hint: tiles and ribbons. Apple designs the font on their keyboards to match the font they use in their operating systems (I know about the San Francisco font change). You might only own one Apple product, but chances are, you know how to use them all.

I’m unsure whether it’s best to create guidelines before you start your design, consistently modify it in the middle, or focus on it at the end. However, following some design guidelines might lead to unexpected surprises.