How to Create Retina-Caliber Favicons

Friday, 4 January 2013

A few months ago I decided to recreate this website’s favicon to support retina-caliber displays. I found this trickier to accomplish than I anticipated, mainly due to a dearth of good ICO-savvy icon creation tools.

Old (non-retina) favicons are 16 × 16 px; a retina favicon is thus 32 × 32 px. The lazy way to support retina is to replace your old 16 px favicon.ico file with a 32 px file, and allow non-retina browsers to scale the image. The proper solution, however, is to create a single favicon.ico file containing two icon resources: one 16 × 16, the other 32 × 32. ICO files support other resolutions as well, but I see no practical utility in doing so.¹

The app I found that works best is Icon Slate, by Kodlian. It costs $5 in the Mac App Store and is worth every penny. It’s very simple. First, create your 16 × 16 and 32 × 32 px icons in the image editing application of your choice — Acorn, Pixelmator, or Photoshop probably. Export each icon size to its own PNG file. It doesn’t matter what you name them.

Next, create a new project in Icon Slate. Change the build settings to output only ICO (it defaults to outputting both ICO and ICNS). Drag the PNG files for your 16 and 32 px icons into the corresponding image wells in the project window. Ignore the other various icon sizes. Build. That’s it — you should now have a favicon.ico containing two icon resources, one for non-retina and one for retina.

I found no other tool that suited my needs. Apple has a free developer tool named Icon Composer that seemingly does what we want (pretty much the same thing as Icon Slate — with drag-and-drop targets for images edited elsewhere), but the resulting ICO files don’t render in Chrome and apparently don’t render properly on Windows.

iConvertIcons doesn’t do multi-resource ICOs. Neither does Image2Icon. There’s a command line tool named png2ico but it doesn’t handle alpha channel transparency, apparently by design, so it’s only suitable for full-frame icons.

X-Icon Editor is a free web app recommended by Thomas Fuchs in his otherwise excellent Retinafy Your Website flowchart, but the problem I found with it (other than the inherent clunkiness of a web app in general) is that it did awful things to colors — the colors in the ICO files it generated did not match the colors in my source PNG files. ★

Most websites with retina-caliber favicons do exactly what I recommend here: a single ICO file with two icon resources, 16 and 32 px. Apple’s, though, is a weird duck. Theirs has four resources: two each at 16 and 32 px dimensions. Opening it in Preview shows all four resources; I’m not aware of any other icon display app that isn’t confused by multiple resources of the same pixel dimensions. The first two icons in Apple’s file use alpha channels, but the second two seem to have hard-coded anti-aliasing artifacts. Not sure how they made this or what the extra resources are for, compatibility-wise. I presume ancient versions of Internet Explorer. ↩

Friday, 4 January 2013

Thursday, 3 January 2013

Wednesday, 2 January 2013

Monday, 31 December 2012

Saturday, 29 December 2012

Friday, 28 December 2012

Thursday, 27 December 2012

Wednesday, 26 December 2012

Monday, 24 December 2012

Saturday, 22 December 2012

Friday, 21 December 2012

A Big Misunderstanding

Thursday, 20 December 2012

Cliff Edwards’s 2001 “Sorry, Steve: Here’s Why Apple Stores Won’t Work” piece for Businessweek is deservingly notorious in the annals of claim chowder, but there are a few things about it worth keeping in mind even today. There’s more to it than just a few guys who were wrong about Apple’s prospects in retail.

The first is that Edwards wasn’t out on a limb. In the investor and general tech press, it was common at the outset to believe that Apple’s foray into retail was folly. The second is that Edwards was more than just a little bit wrong. He wasn’t merely implying that retail might prove difficult for Apple, that success was a longshot. His argument, backed by quotes from analysts and even former Apple CFO Joseph Graziano¹, was that Apple’s retail foray was surely doomed. His case was based on a severe misunderstanding of Apple as a company, of its relationship with its customers, and of its then-potential for the coming decade:

The way Jobs sees it, the stores look to be a sure thing. But even if they attain a measure of success, few outsiders think new stores, no matter how well-conceived, will get Apple back on the hot-growth path. Jobs’s focus on selling just a few consumer Macs has helped boost profits, but it is keeping Apple from exploring potential new markets. And his perfectionist attention to aesthetics has resulted in beautiful but pricey products with limited appeal outside the faithful: Apple’s market share is a measly 2.8%. “Apple’s problem is it still believes the way to grow is serving caviar in a world that seems pretty content with cheese and crackers,” gripes former Chief Financial Officer Joseph Graziano.

Rather than unveil a Velveeta Mac, Jobs thinks he can do a better job than experienced retailers at moving the beluga. Problem is, the numbers don’t add up. Given the decision to set up shop in high-rent districts in Manhattan, Boston, Chicago, and Jobs’s hometown of Palo Alto, Calif., the leases for Apple’s stores could cost $1.2 million a year each, says David A. Goldstein, president of researcher Channel Marketing Corp. Since PC retailing gross margins are normally 10% or less, Apple would have to sell $12 million a year per store to pay for the space. Gateway does about $8 million annually at each of its Country Stores. Then there’s the cost of construction, hiring experienced staff. “I give them two years before they’re turning out the lights on a very painful and expensive mistake,” says Goldstein.

Graziano’s caviar vs. cheese and crackers gets to the heart of what was — and, I think, remains today — profoundly misunderstood about Apple. First is that the caviar vs. cheese and crackers analogy not very subtly implies exclusiveness and snobbery. That superiority and exclusivity inherently go hand-in-hand, and forever doom Apple to small market shares in the long run. That the company’s market share success, as with the iPhone and especially the iPad today, are short-term aberrations, and will collapse when fads change and commodity-level competitors achieve a certain nebulous “good enough” quality. That every market inevitably will look like the PC market of the 1990s. That Apple is misguided, because it insists upon selling boutique exclusiveness that inherently limits the appeal of its products in tech product markets where mass market scale is essential. What works for, say, actual caviar cannot work for a large publicly-held computer maker.

Part of that thinking is correct: scale matters. Apple today shows that. By selling very large quantities of a remarkably small number of products, Apple operates with economies of scale that are the envy of all its competitors. They can negotiate better prices and lock-in supplies of crucial components such as flash memory chips.

The part that’s wrong is the insistence that broad mass market appeal and an insistence upon superior design are mutually exclusive. Apple’s brand stands for both quality and inclusiveness. It’s a luxury brand for the masses. The company’s retail stores exemplify this. They’re not stuffy or standoffish, like, say, high-end jewelry or fashion stores. Apple’s stores are welcoming — crowded and casual. Apple is like no other computer or gadget maker, and its stores are like no others as well.

What Apple understands and its critics did not (and still do not) is that many people, from all walks of life, simply appreciate nice things. They accuse Apple of pretension and elitism, but it’s they, the critics, who hold that the mass market for phones and tablets is overwhelmingly composed of tasteless, fickle shoppers who neither discern nor care about product quality. That Apple’s lead in these categories is simply because they were first out of the gate in them, not because their products are so good.

Advertising alone can’t convince customers that products are nice, because all ads claim every product is great. You need to see things, to touch and try them, to truly believe. That’s a problem Apple’s retail stores helped solved. That’s a reason why, today, Apple is working with the ultimate mass-market retailer, Wal-Mart, to get iPhones and iPads into the hands of more potential customers (including expanding their market to include more people who do prioritize low prices).

Apple is not selling caviar against cheese and crackers. They’re selling better-tasting cheese and crackers, and all you have to do is come into their store and taste some to believe for yourself. Anyone who believes Apple is about to have the rug pulled out from under the iPhone and iPad by commoditized Android devices should spend a few minutes inside an Apple retail store this holiday week.

By the way, in case you’re curious, Gateway is still in business. ★

Graziano’s time at Apple goes back to the dark days. He quit in 1995 after losing a boardroom showdown with then-CEO Michael Spindler. Graziano, according to this report from the LA Times, “become convinced that the personal computer maker no longer has the wherewithal to go it alone” and wanted to sell the company. Spindler, bless his heart, was of the opinion that Apple should and could remain independent. ↩

Google Maps for iPhone

Thursday, 13 December 2012

Announcement here. It’s replete with vector maps tiles and turn-by-turn navigation. This iOS 6 mapping saga has been a source of tremendous controversy, but here we are three months after iOS 6 was released and iPhone users now have a better Google Maps experience than they did when Google was providing the back-end data for the built-in Maps app. It all worked out.

A few thoughts on the design. The icon looks good, and is based on the Android Google Maps app icon. But the UI of the app itself is very different from the Android app: iOS Google Maps; Android Google Maps. I prefer the iOS design — it’s less cluttered. Perhaps it’s also less featureful, but this new iOS app seems to have all the features I’d want to use. The UI aesthetic is along the lines of Google’s other recent iOS apps (their just plain “Google” search app, and the newly redesigned Gmail app). This aesthetic is quite distinct from the standard iOS look, but it’s unique to Google’s iOS apps, not a port of Android’s look and feel. In fact, if anything, Google’s iOS apps look and feel more Google-y, brand-wise, than Android does. Android’s look and feel match its name: sterile, robotic. Google’s brand has always been very friendly, colorful, humane. Their iOS apps have that same feeling. (Which gets back to my long-standing belief that Android feels like an independent subsidiary of Google, not an integrated part of the company.)

The look is very clean: matte-finished in contrast to Apple’s glossiness; flatter, but not entirely flat.

But certain navigational (no mapping pun intended) aspects of Google Maps feel a tad off to me. You tap or drag a little sideways “…” button in the lower right corner to access optional mapping layers (traffic, public transit, satellite imagery) in a sort of drawer that slides from the right. That vertical “…” button is an Android-ism, and feels out of place on iOS. It’s taking the place of Apple Maps’s bottom-right page curl. The items in Google Maps’s drawer, though, don’t look like overlay toggles. To me they look like items in a source list that are going to take me to entirely new places. And in fact, the bottom one, “Google Earth”, does — it launches the Google Earth app if it’s installed, and takes you to the App Store app if it isn’t. This is a quibble though; once you figure out how the overlay drawer works you won’t forget it.

The app very much wants you to sign in with a Google account. There’s a full screen prompt to sign in upon first run. I declined, and the app is fully functional without signing in. But there’s a prominent prompt to sign in every time I search, and one of the very few buttons on the main screen’s delightfully minimal interface is for your Google account profile. Fewer people will use Google Maps now that it’s an App Store download instead of the back-end for the built-in Maps app, but those who do will be far more likely to engage with the Google ecosystem. (Read: Google will be able to collect more, and more identifying, location and search information.)

Mapping data aside, I consider Apple’s new Maps the better-designed app, but this new Google Maps is very good.

A Few Updates, a Few Hours Later:

“It all worked out”: My “It all worked out” observation was in no way an attempt to argue that this was Apple’s plan all along. In fact, quite the opposite. What makes it remarkable is that it’s all worked out despite clearly not being Apple’s plan. Apple’s plan was for their own mapping service to be, if not as good as Google’s, at least good enough that it didn’t make us miss Google’s map data. I think Apple — where by “Apple”, I mean the company’s collective executive leadership — is seething regarding the way this has played out. Everything from Apple Maps being the butt of jokes to the accolades and joy that have accompanied the release of the new Google Maps iOS app. Seething.

Google has lost something valuable, too: its place as the default mapping data provider for iOS. What’s interesting is that this is a case where it’s us, the users, who’ve won. We’ve got two apps with turn-by-turn-navigation and vector map tiles where before we had none. Ideally, yes, Apple Maps would have best-of-breed data and search, but the situation was even further from ideal prior to iOS 6.

“Data aside”: Regarding my original concluding sentence, Nick Bergus tweets:

Wouldn’t @gruber jump all over a review of a mapping app that concluded the judgement with the line “mapping data aside…”?

Fair point. My intent there was to avoid opening a rather enormous can of worms. The entire piece was focused specifically on the interface design of the app, not the quality of the mapping data and search results. No argument that the quality of the mapping data and search results are foremost in the experience of actually using a maps app. But that’s all well-trod ground. We know what Google Maps data is like, what their search results are like. This new iOS app introduces nothing new in that regard.

Further complicating a discussion of mapping data/search results quality is that I personally have found Apple Maps’s data and search quality to be just fine: fast, accurate, attractive. Obviously, many people disagree. Complicating this point even further: I don’t use maps frequently. I go weeks at a time without venturing more than a few blocks from home, and when I do travel, it’s generally to places I’m already familiar with. So while I really have personally found iOS 6 Maps to be a nice update over the old Google Maps-backed iOS Maps, I don’t feel it’s a point I should hammer upon because, as someone who seldom uses Maps, I have no sense of whether I’m right that Apple’s Maps is actually pretty good and getting an unfair bad shake in the public’s perception, or, if I simply don’t use it enough to see just how bad it really is. I feel confident critiquing the design of the apps themselves; I feel unqualified to judge the quality of their service.

Privacy, Signing In, and Contacts: One thing I missed initially is that, if you’re not signed in to a Google account, your search history is not saved. And, dare I say bizarrely, Google Maps does not use your iPhone contacts data for search. It only uses your Google account contact data, which means if you’re not signed in to a Google account you can’t search for addresses in your contact data, and even if you are signed in, you can only search by contact data if you give Google your contacts data. An iOS app that doesn’t use iOS contacts data is just wrong. Me, personally, I don’t sync contact data with Google, and I don’t trust Google with my location data. Google’s decisions here reinforce the notion that they seek to collect and cross-index anything and everything about you.

Update: It ends up Google Maps for iOS doesn’t even use your Google contacts, even if you’re signed in. It just plain doesn’t search contact data. Even on Android, apparently.

Second, with the anonymous location and traffic data collection, Google does make this optional in the first run experience with a checkbox. But it’s an unusually small checkbox, not just visually but also in terms of tap target size. And checkboxes of any size are wrong on iOS; iOS uses On/Off toggles (which provide bigger tap targets). To change the setting later, you have to tap:

The profile icon on the main screen → the gear menu on the Profile screen → “About terms & privacy” on the Settings screen → “Terms & privacy” → “Location data collection”.

Five layers of hierarchy qualifies as “hidden”. (Although once you get to that page, it is a standard iOS On/Off toggle.)

On the second screen of the first-run experience, where they want you to sign in with your Google account, there’s no indication that this is not required — that pressing the (faint, low-contrast gray) “Skip” button will allow you to use the app without signing in. This is designed to imply, without saying so, that you have to sign in to use the app.

Horizontal Ellipsis: August Joki found this Unicode glyph, “Presentation Form For Vertical Horizontal Ellipsis” for Google’s Android-inspired menu icon: ︙ ★