ONEPIXELAWAY

Top 5 iOS icons from 2012

5. Daily deeds

It’s an understatement to say there are a lot of to do list applications on iOS. Daily Deeds is probably one of the simplest ones of the bunch. A simple way to keep track of tasks that are repeated every day, the icon is as clean as the app is. It reminds the user that this is not simply a to do list but a calendar of tasks. Memorable, clean, and well designed: all ingredients for a great icon.

4. GMail

Google has outdone itself in 2012 with its array of new iOS apps. Its GMail app, that was highly criticized during its initial launch, received a major facelift and is now garnering much praise. I think its icon is one of the best aspects of the new design. It’s so clean that it’s as if I can smell fresh laundry coming from my iPhone. Its bottom bevel makes it stand out on almost any wallpaper and gives it a subtle 3D feel with out looking corny or overdone. The red envelope is distinctive and bright but not distracting. It does what every great icon should, it begs to be tapped.

3. Temple Run: Brave

It’s all too common to see apps that promote movies to have its movie poster squeezed and retro fitted into its app icon. Not the case with Disney’s Brave. The app, which is created as a clone of Temple Run by the company that develops Temple Run, showcases an unique and memorable image of one of the main characters of the movie (the bear) while maintaining the style of the original Temple Run icon. People immediately get what the app is and isn’t just by looking at the icon. The glossy effect is done right and isn’t exaggerated. The perfect icon for a great game, it’s no surprise the app was in the Top Paid list for so long.

2. Fantastical

Fantastical has always had a great icon for its Mac app. It may seem obvious what their iOS app’s icon would look like but a simple port over wouldn’t have fit properly into iOS’s rounded rectangles. They kept true to their original icon but they rounded the corners within the calendar, toned down the shine and sparkles, and added the right amount of hue to make the app look magical. Looking at this icon on a desktop screen doesn’t do it justice, it was designed for mobile and looks outstanding on anyone’s the home screen.

1. Action Movie FX

The best icon of 2012 explodes off of its rounded rectangle. I’m usually not one to like or endorse icons that are so detailed, they can look messy, crowded, and conflict with a user’s wallpaper, but Action Movie FX pulls it off. The icon explains what the app does in an exciting fashion but doesn’t try to act as a screenshot. The use of a movie reel as a base of the icon reminds the user that this is an app about creation not just consumption. It’s very distinctive and unique and really attracts anyone who glances at it in the App Store. Great attention to detail and colour makes it an easy choice for the best icon of 2012.

“Form and colour defines your perception of the nature of an object, whether or not it is intended to.”
- Jonathan Ive

How People View Social Websites

Mashable, using services from EyeTrackShop, writes a great article on how users view social media profiles.

As an interface designer, it’s important to know where users look most frequently and in what order. Although this data is acquired from testing users on desktops, the findings do give direction for mobile interface design as well.

It’s interesting to see that most of the findings show an F-Pattern, similar to what was found by Jakob Neilson’s study.

The Ultimate Guide to Golden Ratio Typography

The inevitable has happened. I’m becoming a font geek.

Geometric Animated Gifs

Mind = blown.

How and When to use Pictograms

Great article by the folks from PixelResort.

Overall takeaway:

What makes pictograms so powerful is also what makes them so fragile. If you don’t recognize the image being depicted, the convention being communicated or the context it’s being presented in, the icon leaves you very little in terms of contextual hints. All it’s fidelity and details have been shaved away to make it streamlined to deliver a certain message. If the message fails, you’re pretty much screwed.

Gmail Date Formatting

Gmail has good date formatting practices. Here’s a suggestion to make them even better.

Currently within Gmail, on the day an email is sent or received, only the timestamp of the message is shown (ex. “11:36pm”). On the calendar year an email is sent or received, the short name of the month is shown followed by the day (ex. “Jan 12″). If an email is sent or received in another calendar year, then the ugly Middle Endian hypeniated format is shown of the full date (ex. “01/12/2011″).

As we’ve just started a new year, the ugly Middle Endian full date format is all over my inbox for messages from 2011. As shown in the picture above, this view is unpleasant and makes sorting through emails difficult. Gmail should instead show the short name of the month followed by the day (ex. Jan 12) for emails sent or received within the last 365 days rather than just the current calendar year. This would make the interface cleaner and more consistent early in the year.

Top 5 iOS icons from 2011

5. Tiny Wings

With so many icons featuring birds (way to go, Rovio) it’s hard to stand out with a feathered friend. Andreas Illiger, however, nailed it. Tiny Wings features a gorgeous icon with beautiful bright colours and a subtle charcoal-like texture. It’s fun, cute, and unique while providing a great resemblance to the app’s gameplay and artwork.

4. Instapaper

Clean, crisp, and easy to remember, the Instapaper icon is stunning. The newspaper-like text is detailed but the subtle inner glow around it ensures it isn’t distracting nor cluttered. The strong “I” does such a good job at establishing the app’s brand identity it should be used as the logo for the entire service. The page curl at the bottom is not distracting nor overwhelming (unlike other apps) but works, as intended, to remind the user of paper.

3. procreate

It’s simply too tempting to include real-life tools within an icon for a painting/drawing application. Too many use tacky/corny palettes (Brushes app) and/or paint brushes (Art Rage app). procreate didn’t follow the crowd. They designed a beautiful icon that’s pleasantly colorful and establishes a strong brand identity. Their subtle canvas texture and paint drop reminds the user of the app’s purpose but does so in a respectable and distinctive way.

2. Tweetbot

There seem to more Twitter apps popping up daily than there are children born. Unlike children, however, the twitter apps do not all look unique. The iconic blue bird is found in almost every Twitter icon and although it’s been remixed in thousands of ways, most of them are unpleasant. Then came along Tweetbot’s icon destroying the notion that a Twitter client cannot be original. Following with their ‘a-robot-per-app’ theme, they’ve designed an extraordinary icon that’s fun and attractive while not being patronizing. It’s got it all: brand identity, detail, and beautiful colors.

1. JELL-O Jiggle-It

The best icon of 2011 comes from an unlikely source. The icon for the JELL-O Jiggle-It, a frivolous app that animates JELL-O cubes to dance to your iPod library, captures the JELL-O brand in a beautiful and memorable way. The realism is spot-on. When installed, the icon looks as if a real JELL-O cube is resting on the user’s homescreen background. It’s a great reminder of the JELL-O brand while resurfacing fond childhood memories of the snack.

The iOS Gray Pinstriped Background

Short, snark-free, tl;dr version:
The gray pinstriped background is present in the UITableViewStyleGrouped UITableView and is most commonly seen within the Settings App on the iPhone. The style looks outdated and drab. Even Apple strays away from it in their own apps, especially on the iPad where not a single Apple made app uses it.

Apple needs to give it a facelift in its next major iOS release.

Longer (sarcastic) version:
O people of the Internet! With great efforts, I have managed to come up with 3 alternatives to the unimaginably beautiful lined background found in iOS.

Behold! First, from the most popular operating system in the world, the wallpaper that everyone has a secret crush on.

Can’t get enough of our cute friends from Rovio? Everyone could always, and I mean absolutely always, use more Angry Birds in their life.

Ah! And finally, the infamous, iOS linen pattern. Found all over iOS. It’s on the multi-task bar. It’s on the notifications pane. Why not go for the full hat-trick?

UPDATE: Multiple people have told me they thought I was serious with these suggestions. Oh dear. We’ve put men on the moon but we still haven’t found a way to show sarcasm in writing. Perhaps I should have put the text of the whole article in italics? (I’m being sarcastic again.)

Pagination

Pagination is the act of dividing content into smaller parts and showing the user only a part at a time when in a rested state.

The following is an example of pagination, commonly seen on touch screens:

It is most effective for reading/consuming content, rather than traversing content (ex. lists) quickly.