microsoft logo old
microsoft logo old

Don’t worry if your new app has a crappy user interface, I mean, you’re a startup right, so you don’t have any money, you probably don’t have any staff, and hell, I’m sure you don’t have a User Interface Design Department!

But that’s ok, because even the big boys don’t get it right, even with billions of dollars up their sleeves.

We all love “the cloud”, it makes everything accessible. Microsoft’s OneDrive is a great example of cloud usability. I frequently move photos directly from my phone to my cloud for use later on my computer.

citizenrod bad design app navigation access

In the above image you can see OneDrive’s typical interface. Pretty straight forward, you think. To bring you up to speed, what I am trying to achieve at this point, is to upload a photo from my phone, to my personal OneDrive cloud. I have already selected the photo, I just need to tell OneDrive where I want to save it.

I want to save it in the “design” folder, so I touch that folder, which takes me to the following page.

citizenrod bad design app navigation

Firstly, I am assuming I pressed the correct “design” folder. Yes, “assuming”, because there is no indication on this screen to reinforce that my fat fingers did not accidentally press the “thinking” folder instead.

Where is the feedback?

Bad design.

Moving on..

On this screen you have:

  • a ‘hamburger’ icon at the top left
  • a ‘tick’ icon at the top right, and
  • a ‘plus’ icon at the bottom right

Now, the ‘hamburger’ icon has been universally accepted as the “menu” button, which in this case, it is. But the other two buttons, in this particular instance, are not as straight forward as they should be.

Think about the point at which I am currently at, in the process of saving my photo to the cloud…

I have reached my destination, the “design” folder (I believe). I want to save the photo here.

What do I press next?

The ‘tick’ or the ‘plus’?

Uhh.. the ‘plus’, because I want to “add” the photo here? Also, the icon itself is physically located in the same white block area that I want to save the photo in, right?

Uhh.. the ‘tick’, because “yes” this is the location to save to? “Correct” this is the spot?


Well, it appears Microsoft’s user interface design team did recognised this little conundrum. I can just imagine it now:

Didn’t we mock up this process from start to finish? Didn’t someone walk through the entire process? Weren’t there sketches? Weren’t there wire frames? Weren’t there user stories? Didn’t we test this? Sh#t, we got this far with these icons. The icons work everywhere, except here. The language is not clear. We’ll need to redesign the “tick”, or the interface. What is the impact of doing that? It will need to be changed, and everywhere it will need to be re-evaluated. Damn, that sounds like a lot of work, and time, and money! When do we need to ship? …I have an idea!

citizenrod bad design instructions

Yep, instructions… welcome to 1975.

Who needs icons, when we have words…

Startups, you have an excuse. Microsoft, you don’t.

Citizenrod art design think

Citizenrod | art | design | think

Sharing is caring: