Navigation Bar : Back to black

[COPtimer]

Related passage: Android's System Bars And Your Interface - Whether And How To Theme

---

Reply to the issue #1520 :

Obvious though the status panel exists, what about the cases like "The drawer was pulled out" or performance on a tablet. By the way, in system bars, black is understating, not boring.

Also, I think the reason why we implementing our app with Material Design is "Tested by history, Material Design is an excellent design system. Since we can not create a better design system, so we developing our app which follows the guideline while having a modest attitude.", not because "Google is using Material Design" so we use Material Design or "Google created Material Design" so we followed Google instead of the guideline. One of the cores of Material Design's guideline is its scientificalness, which is we should follow through.

"Legislatures can also break the law."

"Immersive" doesn't exist anymore.

---

Problem:

Wrong usage of colouring navigation bar.

Solution:

Reset to the default state. Black is just perfect.

Why?

As one of the Principles "Bold, graphic, intentional" said:

The foundational elements of print-based design – typography, grids, space, scale, color, and use of imagery – guide visual treatments. These elements do far more than please the eye. They create hierarchy, meaning, and focus. Deliberate color choices, edge-to-edge imagery, large-scale typography, and intentional white space create a bold and graphic interface that immerse the user in the experience.

Guideline's examples

Since the goal of colouring is to make the visual experience more immersive...

1. Hierarchy & Focus:

Hierarchy refers to organizing content according to different levels of importance. Color can convey how important some content is relative to other content.

According to the literal meaning of System Bars, they are not part of the application, they are at a higher position than the application. Colouring them is an action to ask them cooperate with -- not to manipulating them cater -- the application.

For example, a brightly colored button on a colorless background makes that button stand out. Alternatively, colorless bars and buttons allow bright content to take prominence in a UI.

Although I don't know the purpose of colouring the navigation bar with other colour in Shadowsocks, I'm clear that the meaning of colouring it with black -- silence itself. Black navigation bar lets users ignore it while they are using application, which makes the experience more immersive.

2. Meaning:

Color may be used to communicate the meaning of various elements on a screen.

Since the black navigation bar is humbleness, what's the meaning of coloured navigation bar in Shadowsocks?

[Mygod]

We need colored navigation bar for this animation to work.

The examples you linked talk about coloring in general instead of the coloring of navigation bars.

1. I agree that black would look good if there hadn't been a status panel there. But since it's there, it actually has a symmetry feeling to it which in turns help hierarchy and focus.
2. Vibrancy.

P.S. Almost nobody uses Android tablets any more afaik.

At the end of the day, design is just a matter of opinion. For now I'd say we keep the colorful navigation bar.

[COPtimer]

@Mygod

0. Could you explain why? (I couldn't read the code...)

1. However, those guidelines are universal. Is the colour on the navigation bar is not the colour?

2. The truth is, blue-grey will never be vibrant, blue-grey has "grey". And beauty is not the goal of design.

3. One of the goals of Material Design:

Develop a single underlying system that allows for a unified experience across platforms and device sizes.

4. May I ask you two questions? Since Shadowsocks is free, what‘s your purpose of developing Shadowsocks? What do you think about Material Design?

[Mygod]

0. Why what?
1. See the link (it's from material.io so you know it's much more official and up-to-date than androidpolice.com) I posted in the previous issue that tackles specifically about navigation bar coloring schemes;
2. That's just your opinion. 😄 Blue-grey is still more vibrant than black.
3. I'll consider tablets if I have one;
4. Back in the days I developed it mainly for my personal use and as a pastime (I still do). Therefore I will accept anything that looks good to ME (yes it's highly subjective). And I push my changes to GitHub just because I'm very nice.

Thanks anyway for your suggestions. I may reconsider this in the future but for now I'm not planning to change it to black.

[COPtimer]

@Mygod

0. I couldn't figure out why the animation requires a coloured navigation bar.
1. We confused each other. You mean the passage, I mean the "Guideline's examples".

1&2&3. These seem doesn't matter now. On the basis of 4--purpose, I got my ultimate answer.

It's lucky for Shadowsocks to has many contributors like you. I'll be moving forward to build a web-based redesign preview of Shadowsocks. Thank you for your patience and my unimpeded access to the Internet.

[Mygod]

Oh alright. For the animation, please wait for 4.4.3 to release.