ct-blog flight hotel local

[Design nuances] Redesigned hotel icons (Part 1)

About a year ago, we designed a set of icons to represent hotel amenities on Cleartrip’s hotel search. These icons have been in use for over a year now:

We liked these icons, but there was a couple of things that always bothered us about them. Each icon had a different size with some being broader or narrower or taller than the others. These size differences resulted in each icon having a unique “visual footprint,” resulting in a somewhat ragged look when the icons all appeared together. We also felt that some of the icons weren’t easily recognisable, specifically the arrow (Internet access), briefcase (business centre) and room service.

We decided the icons should be redesigned with the following two goals: 1) All the icons should be of the same size, giving them the same “visual footprint” 2) Icon shapes should be easier to recognise. We turned to the extremely talented Aaron Russell for help with redesigning the icons.

The first thing we had to do was select the “visual footprint” we wanted and we had a few choices:

We chose to go with the first rectangular shape–we didn’t think the outline shape at the end would be legible at small sizes and the circular ones felt gimmicky. Besides, we’ve got a great new feature planned that uses circles…

Having selected the “footprint” we wanted, we turned to the shape of the icons and the shading of the rectangular shape.

We chose to go with the option on the extreme right. In Part 2, we’ll take a look at the iterations we went through for the shape of each icon before selecting the final design.