chronicons.com/news/2015/1/11/designing-chronicons-icon-size

When I started working on Chronicons I was committed to following the  Human Interface Guidelines to the letter. For menu images the HIG recommends the following:

42mm Watch: 80x80px canvas, 54x54px content area

38mm Watch: 70x70px canvas, 46x46px content area

Let's look at a search icon designed for the 42mm Watch, for example.

I've added a grey background to make it easier to see the size of the canvas. This icon meets all of the recommendations in the HIG. 80x80px canvas. 54x54px content area. 9px stroke, since it's a pretty simple line glyph.

Good to go, right? Well, let's take a look at the simulator running iOS 8.2 Beta 3.

Hold on. Something doesn't look quite right. Look at the stock Mute icon. It just looks better than our custom Search icon. It wasn't until I extracted the stock icons that I realized what was going on.

In some cases, Apple isn't following their own guidelines.

The canvas size is 80x80px, as expected, but the content area is 63x54px.  Next to the stock icons, our Search icon looks a bit small. Let's try expanding the content area to 62x62px.

That's more like it. Now our magnifying glass looks like it can hold its own against Apple's icons. But we have a problem. With iOS 8.2 still very much in flux, should we design our icons to the HIG, or to what looks right ? 

Since I design every icon in Sketch it's easy to scale them up or down as needed. I'm sticking with the HIG, for now, and I'll be doing extensive testing with each new beta. 


Comments (0)

Sign in to post comments.