6

I have a discussion with my developer where he refuses to change the status bar color of our IOS application, his argument is that all the big companies do it like that and that it is usual for the users to see the status and the navigation bar as one.

I'm mainly changing it because I want to enclose the app into our brand colors, the UI is very clean and light and I'm using the color only in a few places, in the first 5 screens only in the status bar and the call to actions. I want the users to relate the color to our brand and to always see the color without over using it.

So, the thing here is that I don't want to force him to do as I say but I want to show him that there are some advantage on doing it like that rather than following what mostly everybody does, what do you guys think of this ?

3

iOS Human Interface Guidelines - Status Bar tells that the Status bar should not be customised.

Use the system-provided status bar. People expect the status bar to be consistent systemwide. Don’t replace it with a custom status bar.

My understanding is that it refers to the UI not the background-color.

Obscure content under the status bar. By default, the background of the status bar is transparent, allowing content beneath to show through. Keep the status bar readable and don’t imply that content behind it is interactive. There are several common techniques for doing this:

  • Use a navigation bar in your app, which automatically displays a status bar background and ensures that content doesn’t appear under the status bar.
  • Display a custom image, such as a gradient or solid color, behind the status bar.
  • Apply a blur to the content behind the status bar.

As you can see the second point states: "Display a custom image, such as a gradient or solid color, behind the status bar"

My interpretation is that it is ok to use a background-color for the Status bar, keeping the bar with the same UI as the OS and the text-color white or black.


As @Harshith points in his answer, Google recommends doing so for Android.

According to iOS Human Interface Guidelines - Branding:

Incorporate refined, unobtrusive branding. People use your app to be entertained, get information, or get things done, not to watch an advertisement. For the best experience, subtly incorporate your brand through your app’s design. Using colors from your app icon throughout your interface is one great way to provide context in your app.

It doesn't explicitly mention the Status and Navigation bars, however it encourages the use of your brand (app icon) colors in the interface.

1

If you have a mockup that you could attach, that would be helpful. I made a quick mockup of what I think you're trying to explain.

enter image description here

If this is correct, I would recommend trying it out and seeing what looks better, these 4 options are the standard options provided by Apple and I wouldn't deviate too much from these.

  • thnx for the edit BDD ;-) – Sam Apostel Jan 27 '17 at 21:30
0

I can name a few big brand apps that have changed the background color of the status bar just for this reason, to show the brand colors and to be recognizable for their users even when they don't show a navigation bar. I think the most common example of this is the Facebook app. To save precious screen real estate while scrolling the app hides the navigation bar but it's still recognizable as the Facebook app because of the status bar having the same brand color.

Just make sure that the information displayed in the status bar is still clearly visible, so make sure there is good contrast between the background color and the white or black information that is shown.

  • The IOS fb app has the same color in the status and navigation bar – user2634544 Dec 21 '16 at 19:53

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.