Your App Is Burried In A Folder – Make Its Icon Stand Out

Meetup has finally updated its mobile app. More than that, it went through a complete re-branding, and as part of it also redesigned the icon of its mobile app.

From the look of the new icon, it seems that Meetup’s designers assumed their app sits front and center in their users’ devices. I hesitate that’s the case.

 It’s increasingly difficult for smaller publishers/brands to break through — even with downloaded apps — because of folders (being buried) .. — marketingland.com

I’m one of those users… while I use the Meetup app quite often, to stay in touch and communicate with members of the groups I lead, it’s not one of the few apps I spend most of my time on. Therefore Meetup, like 98% of my apps, lives in a folder.

As a foldered app, it should have an icon that’s visually distinguishable, and that stands out with every pixel, otherwise users will ignore the app and won’t use it. Meetup’s new icon is anything but standing out. On the contrary – it blends with the rest of the icons and lacks identity.

Take a look at Meetup’s icon before and after:

meetup-new-icon.png

Figure 1: Left – before, Right – after. In both images, it’s in the top-right folder, the bottom-right icon

The previous icon, while not optimized for mobile – having to squeeze the name in the small icon – had some color contrast to it, which made it recognizable.

Your App Is Not Special

Don’t assume users care about your app; they don’t. After downloading it, they are likely to either delete it, or throw it into a folder. The least you can do is plan for the latter, and design an icon that’s unique, and can be recognized in any size.

Take a look again at the screenshots above – which icons do better job at grabbing your attention, even when placed within a folder1?

Footnotes:

1

My pick would be the Workflow’s icon (same folder as Meetup, bottom-left corner), as well as Spotify (right image, top-left folder, top-left icon) and Overcast (right image, top-left folder, mid-left icon).

An Inconsistent User Experience in iOS

When it comes to user experience, I’m a big fan of consistent design, which gives users confidence that their actions will lead to an expected outcome. When users know what to expect, they are open to experimentations; thay are not afraid to explore wider set of features, and try out new capabilities.

When there’s no consistency, when the same function gets different names or labels, or when it shows in different places, then users get confused. And when users get confused, they’re reluctant to try anything that’s not within their immediate need. Here’s an example for such confusion, which I’ve just experienced on my iPhone, when trying to share an image with a friend.

That’s the flow I went through:

  • Took a screenshot on my iPhone 
  • Went to the iOS photos app
  • Selected the screenshot I’ve just taken
  • Clicked the share icon
  • Selected to share via Messages
  • Selected the friend I wanted to share the screenshot with
  • Clicked send

Or have I…? when I clicked what I thought was send, the Messages’ screen closed, leaving me wondering if the image was actually sent. I repeated the flow, and just before clicking the “send” button1 paused to read its label. Hmm… it says “cancel”. That’s weird. I’m pretty sure it should say “send”. But what made me think that that’s where the “send” button is? was there another app that primed me with this expectation?

There is, off course. It’s called Mail.

In Mail, the send button dominates the top-right corner of the screen. Now, since I send too many emails every day, way more than I share photos, my brain expect the “send” button, in whatever app I’m in, to show at the top-right.

ios-inconsistency-ux.png

Figure 1: To the left is the Messages. On the right – the Mail app. Note the different buttons on the top-right corner of each of those apps.

I love those moment of self awareness, which allow me to test some of my own assumptions…

Footnotes:

1

It’s a little hard for me to call it button, because nothing make it stand out from its background, like you would have expect a button. Is it possible that my brains is still wired in the pseudo physical, skeuomorphism, design…?

Self User Testing

OK, so I’m retracting from agreeing that descriptions are useless. I just had an experience that proved that wrong.

Well, some context will be helpful… let me step back and explain. Yesterday we had a heated discussion in the team about the usefulness of showing a description of a post inside a recommendation tile in our chatbot. Take a look at the screenshot bellow. This is how we currently display recommendations in our Facebook Messenger bot:

fb-chatbot-ctas.PNG

Each recommendation comes with a set of metadata: thumbnail, title, source, and description. The bot.outbrain.com is an ugly appendage forced by Facebook. Then there are the actions you can take on a recommendation. Clicking on the thumbnail will open the article in a webview. Summary will return an auto generated summary1, stash will save it for later, and #{topic} will return more recommendations from the same topic.

You’ll notice that the description in this example (taken from the article page) isn’t great. It’s trimmed, and do little to explain what this story is about. Essentially, it doesn’t help me taking a decision to read or pass on this recommendation.

One of the ideas we came up with is replacing the description with the reason the user see a specific recommendation. We call this feature “Amplify the WHY”. So in the example the image above,  I’m probably seeing this story because I read a lot about science and astronomy. So the “WHY” in this case might read something like “because you’re interested in astronomy”.

It would have been nice to show both description and the “WHY”, but we have limited real-estate to work in, and need to choose one of them.

My team was adamant that we should drop the description and go with the “WHY”. At first, I was reluctant to agree. “I want to see data first”, I said. “Let’s run AB testing”. “Well, we don’t have users yet, so AB testing isn’t relevant at that point. Also, it is clear that ‘amplifying the WHY’ is so much better than showing a crappy description that we should take this as the baseline” was the reply I got. How can you argue with such compelling reasoning…

Now, circling back to my opening, I’m taking my agreement back.

I woke up at 7am today and wanted to read about the results of the debate yesterday night. I didn’t know where I can find this information, quickly and succinctly2. I thought about the CNN chatbot, but CNN’s top stories are posted only at about 9am. Then I figure, let’s try to see if I can find something relevant in our bot.

I typed “hi”, and (to my surprise) the first story I got was right on point –

fb-chatbot-election-debate.PNG

Then I browsed a little more, and suddenly took notice that in any recommendation, which has a relevant title, I skim the description for more context. I also realized that I don’t look for completeness or quality; just few more words that will give better idea what the article is about.

“WHY” I get a recommendation, and why it’s important to me wasn’t relevant in the context I were in – checking the news, the objective news, not that that that’s in my “bubble”.

Summary wasn’t relevant in that usecases either, because much like clicking to read the story, it means “choosing” and focusing on one article, whereas I was still at the decision making stage.

So, what I’ve learned from observing myself (and in that rare instance, I acted as a user, rather than a stakeholder) is that description does have value, and in certain usecased, such as browsing the news, I need objective hooks. Description, in that case, and not personalized reason, were more relevant.

Definitely not representative experience, but one that makes me rethink what should be the baseline. And whatever the baseline is, we should put it to test.

Footnotes:

1

Works pretty neatly. Here’s the summary for this article in the picture: “On Tuesday, thousands of people stampeded into a lecture hall in Guadalajara, Mexico, to hear SpaceX CEO Elon Musk talk about how he wants to colonize Mars. Another question is how — and if — Musk plans to prevent Earth microbes from contaminating Mars, and Mars microbes (if there are any) from contaminating Earth.”

2

I don’t go to sites to look for news anymore, and rarly google for news. And since the extinction of Zite, I now realize, I have no idea where I get my news from…