Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add old pure black theme #246

Closed
tophf opened this issue May 19, 2015 · 29 comments
Closed

Add old pure black theme #246

tophf opened this issue May 19, 2015 · 29 comments

Comments

@tophf
Copy link

tophf commented May 19, 2015

OctoDroid's old pure black theme, simple and clean, now gone, should be kept as a third alternative.

I believe I'm not the only one who can't stand the new Material Design dark theme, and although I appreciate the effort to modernize app's appearance but for some things like git the oldschool black terminal look is natural. Currently I've reverted to 3.7.2, which is perfect for me, and disabled updates.

  • black

    • OPEN status is immediately visible
    • header is small and unobtrusive
    • subject (title) is emphasized
    • overall: content is dominating

    black-fs8

  • Material Dark

    • OPEN status is practically lost
    • header is huge, bright and dominating
    • header labels are wrapped in a broken way
    • subject (title) isn't the most readable thing in the header, so it looks unstructured
    • avatar is tinted
    • overall: appearance is prioritized, content is subdued, which isn't what Material Design is about, actually.

    gray-fs8

@maniac103
Copy link
Collaborator

Reverting to the old theme, be it the dark or light one, won't happen. We've had discussions about the material theme in #227, but my stance on that (and I think @slapperwan agrees) is that it's utterly pointless to fight the design philosophy set by the platform. Unfortunately there'll always be different tastes, so it's impossible to please every user's taste - shipping both the Holo and Material themes also is too much of a maintenance burden.

About your specific problems:

  • The open/closed status is significantly more visible now by the color of the header.
  • The header is actually smaller now (measure it in your screenshots, action bar + tabs + header were 310px before and are 340px now)
  • I want to make the actual header (PR opener, subject etc.) scrollable at some point so that it can be scrolled out, but it's not exactly easy to do
  • The avatar is as much tinted as before - before it was tinted in black, now in green. That's just a side effect of you using a transparent background in your avatar ;)
  • The tab labels are not supposed to wrap like this, instead they're supposed to scroll horizontally. I'll check that.

maniac103 added a commit that referenced this issue May 19, 2015
@tophf
Copy link
Author

tophf commented May 19, 2015

it's impossible to please every user's taste

Well, I'm happily using the pre-3.8 version, for which I'm thankful to you.

it's utterly pointless to fight the design philosophy set by the platform

The new theme doesn't implement the philosophy of Material Design, which is to make content more accessible, it only tries to imitate the visuals. More like "it's utterly pointless to fight hipster trends in design (wow! much colors! such fun!) and keep being down to earth (booooring!)".

open/closed status is significantly more visible now by the color of the header

It's lost in the header now whereas previously it was visually separate.

The header is actually smaller now

It dominates the content because it's still huge and entirely green. And would do so even if it was two times smaller.

@maniac103
Copy link
Collaborator

shrug Well, you're free to use @ocdtrekkie's fork.

@tophf
Copy link
Author

tophf commented May 19, 2015

Oh, thanks.

@jawshooah
Copy link

Not to pile on, but I can see where he's coming from with the size of the header. While yes, the new header is smaller than the old, the new header is fixed to the top of the screen in its entirety.

IIRC, the section with the issue title, open status, and avatar used to scroll with the issue content, leaving only the issue number and tabs fixed to the top. Duplicating this behavior in the new layout would be a big help.

Keep in mind, this is coming from someone who loves the new theme otherwise!

@maniac103
Copy link
Collaborator

I fully agree to that :) See my earlier comment: "I want to make the actual header (PR opener, subject etc.) scrollable at some point so that it can be scrolled out, but it's not exactly easy to do" (the problem is a) having two scrollable containers inside of each other and b) handling the sizing of the ListView containing the comments)

@tophf tophf closed this as completed May 19, 2015
@ocdtrekkie
Copy link

@tophf My fork has the API fixes from 3.8 needed for 3.7.x to work without errors with the quality Holo UI the app used to have. :) If someone besides me can make use of it, more power to them. It's at https://github.com/ocdtrekkie/gh4a

(Side note: My limited ability to shift pull requests around aside, backporting these API fixes took basically no effort as there was no code conflict and not supporting the Holo version because of "maintenance burden" is largely bull.)

@maniac103
Copy link
Collaborator

It's not. I wasn't talking about 3.7.x having a larger maintanance burden than 3.8, I was talking about supporting both Holo and Material themes simultaneously in the same app.

@ocdtrekkie
Copy link

AH. Yes, that would be relatively silly. Google has gone out of their way to make that difficult. The best example of proper UI support I have seen has offered a different app for each UI they support.

@bkensey
Copy link

bkensey commented May 19, 2015

Dude, you can take your ax and grind it somewhere else. Supporting both themes isn't impossible, clearly, but maintaining extra styles and assets can be a PITA and takes effort that could be applied elsewhere. Kudos to @maniac103 for his work. I for one appreciate the effort to modernize the app and make it look and work like the growing majority of other quality apps out there.

@ocdtrekkie
Copy link

@bkensey Many of the reasons @tophf specified above are the reasons that Octodroid 3.8 is, to be blunt, a terribly designed app. The entire top segment is a muddled mess of random floating words in a sea of green. The open flag being the same color as the rest of the screen is probably the most hilarious travesty. I pointed these issues out in my comments in the earlier issue on Material, but it doesn't seem anyone even bothered to address the poor way Material was implemented in Octodroid, perhaps disregarding legitimate design feedback because the preference for Holo was stated.

Just because it's Material does not make it good.

@maniac103
Copy link
Collaborator

@ocdtrekkie As mentioned before: You would severely strengthen your point by not only using strong words to express your dislike, but instead pointing out alternatives. And no, 'just revert to Holo' is not a viable alternative.

As for the open flag, am I underestimating the number of color blind users of Octodroid or are you two the only ones of those? And about the 'sea of green', well, previously it was a 'sea of black' if you look at it that way.

@ocdtrekkie
Copy link

@maniac103 There's no 'sea of black' in the Holo UI. The upper level navigation, the tabs, and the PR's descriptive information each have a clear segment at the top of the Holo UI screenshot. Proper separators exist that show the hierarchy of navigating the app. Meanwhile, on the Material version, four different levels of information are just dumped into one big green box.

The open flag, unless you're suggesting is a slightly different shade of green than the rest, is now matches colors with the app heading. This looks very poor. It makes the "OPEN" status easy to miss, as the text, on the side of the screen, is unusually placed and easy to miss without the highlighting it had before.

Even Gmail's lousy Material theme has clearly defined hierarchy: https://lh3.ggpht.com/oBOGoEOSPRnoo1RM9t8k5dcmCc3Nhb0gautw-dx0eosnHCm56HULM5pS8SPiGX0yZnM=h900
Notice the email subject and associated tags are on a different color bar, and the tags have a distinct color that does not blend into the background.

Looking at YouTube, there's a lot of reasons this is a terrible app design (including horrible text color contrast) https://lh3.ggpht.com/Wpna_TXqiooJLSHbgLVyyR31GrZEVlxKjygo50j5_3WTy9pDpAF-W3Y8SYBX_oKSjg=h900 Here they do put the tabs and the top level navigation on the same unseparated blue sea, which I think is a terrible trend, but not uncommon. Yet they still have a distinctly separate hierarchy level with the title of the page and associated information separated.

Octodroid 3.8 is completely unique in it's dumping of four levels of information into one endless green blob. It's not just a bad UI in general, it's a bad Material UI.

@ocdtrekkie
Copy link

Here is some guidance, attached below: You'll notice that every issue here is not an issue in your Holo UI. Buttons are distinctly buttons, flags are clearly flags, hierarchy is easy to discern, the title looks large and clear, and your tab descriptions fit on one line in the tabs.

59b42568-fe39-11e4-80a8-4ffb5fe1145d

@ocdtrekkie
Copy link

There is no clear indicator to lead you to see what in 3.8's UI is clickable and what is not.

Here is all the text on your green box:

Pull Request #107
JasonBarnabe/stylish-chr...
CLOSE
tophf
on Apr 30
OPEN
Make iframe observer 10-100 faster
CONVERSATIO
N
COMMITS
FILES

Which of those pieces of text are clickable and which are not? The subtle separators between tabs make them generally discernible as clickable things, but the rest you have no way to know.

@maniac103
Copy link
Collaborator

The tab description wrapping is already acknowledged and (!) fixed. I'm not sure why the open status 'gets lost' ... after all, closed issues have a red background. You say that's not distinguishable?
The close and open (as in button and state) are distinguishable by placement and font. It's common UI that actions are placed in the toolbar and it would be very uncommon if something at the right of the toolbar would be not clickable, so users will kinda expect being able to 'close' be clickable. It would probably be a bit easier to distinguish if open/reopen/close were icons instead of text; if anybody has suggestions for descriptive icons for those I'm all ears.
The title already is the second largest item in the screen (just after the activity title, which contains information belonging to the PR as well). Making the font even larger means wasting screen estate.

But again, you haven't said anything on how you think it should look like. @LeoColomb's suggestions in #227 are a good example of constructive criticism.

@ocdtrekkie
Copy link

You should have at least one more large separator (perhaps, by making it multiple bars of different shades or colors), probably where indicated on my big giant red line. The title should be larger, the author of the PR should be below the title.

The open flag should either be distinct in color or removed entirely. What you seem to be lacking in understanding, is that a single word floating sideways on the page has no context. It looks very strange, and it makes no logical sense. (And OPEN and CLOSE sharing font and verbage make it look like either both or neither are buttons, and the someone screwed up and accidentally rotated the word OPEN.)

The open flag on Holo is like a Post-It flag: https://www.bing.com/search?q=post+it+flags&pc=MOZI&form=MOZSBR Or a Gmail tag or what have you. The fact that the green highlight in Holo is constrained to that word is what makes it appear as such. But there's no context for it in the Material version. It's just a floating word. The fact that the rest of the window is green has no relevance to the word OPEN.

Green is the Octodroid theme color, based on it's icon, and Material UI toolbars are generally the same color for an entire app. So there is no way to discern from this screenshot that the fact that the area is green has any relevance to the fact that there is a random sideways word "OPEN" on the side of the screen. (On Holo, the fact that the green color is limited to the word OPEN on the page clearly associates the color and the text.)

You may realize what is what because you're a significant contributor to the app, but to everyone else, it's just bad UI.

@slapperwan
Copy link
Owner

For me, the material theme must go on and any suggestions to improve on the UI are welcome.

@maniac103
Copy link
Collaborator

I've pulled most of the information out of the header and into the listview. The reason for that was no so much this report (as I still don't think the issues brought up here actually impair usability), but using the app again in the Gingerbread simulator: The header could simply grow too large. See commit 17505e0 for the change; this is how it looks now:
octodroid-pr-header-new

(NB: I didn't change the colors; the different shades of green are either caused in the process of making the screenshots or are due to me using the emulator)

@tophf
Copy link
Author

tophf commented May 21, 2015

Yep, that's better.

BTW do you know that non-pure-black themes kill the battery on AMOLED displays? This is something quantifiable unlike that 'tastes differ' thing.

@maniac103
Copy link
Collaborator

Yes. But read your link again, it's comparing a predominantly black app to a light app. It doesn't compare a pure black app to a a-grey-so-dark-it's-almost-black app ;)

IOW: I don't think there's even a measurable difference between the old and the new Octodroid themes, even assuming you're staring at Octodroid all day (which you aren't overly likely to do).

@tophf
Copy link
Author

tophf commented May 21, 2015

However, people sometimes make the mistake of thinking this is a function of brightness—that dark colors like gray are similarly efficient.

Do we read it differently?

If you spend several hours each day in OctoDroid the new theme will eat the battery noticeably. For example I'm quite used to charging the phone once a week, but if more app developers will switch to the hipster themes I'd have to do it twice per week or more unless I use old versions.

Eh, I forgot to unsubscribe from the issue after closing it, did it now :-)

@LeoColomb
Copy link

Do we read it differently?

Hi @tophf. I don't think your last comment is very constructive: in fact, the best way to save the battery is keep off your phone...

I mean, right there are (little) consumption differences, but we are speaking about a human interface for human eye, not for batteries. I'm sure your article is based on a solid scientific research, but I'm pretty certain that Google's engineers have worked to build an enhanced interface for human.

As Google recommend for every app on its Android platform, this app (gh4a) is supposed to follow design guidelines (http://www.google.com/design/).

@maniac103
Copy link
Collaborator

@LeoColomb Amen, precisely what I was thinking :)
I indeed missed the reference that only black will give you the ultimate power savings, but as mentioned above I'm not going to fight the platform design guidelines (and helper libraries).

@tophf
Copy link
Author

tophf commented May 21, 2015

Disclaimer: the issue is closed, I don't have any intention to persuade the developers, but I think one has to answer when being addressed directly.

Hi @tophf. I don't think your last comment is very constructive: in fact, the best way to save the battery is keep off your phone...

Some people could regard your mockery of my comment as nonconstructive either, so let's not see things from personal perspective.

we are speaking about a human interface for human eye, not for batteries

  • As a human and a designer I definitely don't like how it looks, which I didn't want to say explicitly until now (not that it changes anything though)
  • Since the battery is 'working' for human comfort it's reasonable to use battery-friendly apps, which I personally do

@ocdtrekkie
Copy link

After a lengthy conversation with the developer yesterday on IRC, my advice is to just use my fork.

@ocdtrekkie
Copy link

But the improved screenshot posted is a significant improvement.

@tophf
Copy link
Author

tophf commented Jan 12, 2016

Having updated the phone to Android 5 Lollipop I like the new Octodroid, it looks natural and the animations are cool.

@maniac103
Copy link
Collaborator

@tophf Oh, nice. I guess you see why I insisted on visual consistency to the platform before :)
The upcoming version will have the issue of header screen space fixed by making the green/red headers scrollable. Only issue of those you mentioned before is the AMOLED thing, but there I still think that staying with the platform theme is more important (because people aren't likely to use Octodroid for multiple hours a day for this to make a difference)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

7 participants