Ideas to maybe replace the blue leaf

So, I actually like the leaf. And I think having it be blue makes sense; at least in the default color scheme. Yellow is a highlighting, attention-drawing color; it makes sense for window tabs and other such things, but not for an important but nonetheless background UI element. Having the image be the Haiku logo or something else would be more obtrusive, and I think the unobtrusiveness of the launcher is actually pretty nice.

The only thing that might make sense to change, in my opinion, is to have the leaf be some color other than blue if the color scheme is changed from the defaults.

14 Likes

I’ve been using the Haiku logo for a really long time(12+ years) as you can see by my old post in the screenshot thread (as augiedoggie). That was back in the day when the Deskbar icon was still a bitmap and not vector, but it’s still trivial to change if you know which files to edit. If you build your own version of Haiku then I can tell you how to do it. I have it set a bit too large at the moment, it gets clipped if Deskbar is in one of the mini-modes. This is the modern version…

Edit: The image keeps getting recompressed when I upload it here and makes it look blurry. Looks better on imgur

10 Likes

Add to Deskbar ability to enter instead of logo some text in color (letters and dingbats) or icon or image. For example:
:sparkles::sparkles::sparkles:

1 Like

NO.

The leaf dont “HAS TO GO”.

Whatever logo you choose, the user should have the ability to set any logo he would like to. There should be no hardcoded styling of the UI.

2 Likes

A post was merged into an existing topic: Simplified Colors preferences in Appearance

Thanks for the offer but I probably won’t build Haiku myself, especially as I’m not inside Haiku much at the moment. I used too modify the BeOS logo with QuickRes once upon a time. That was fun.

I like the leaf and color how it is now!

4 Likes

I don’t think any design philosophy stays mainstream forever, as current trends are now attempting to find the midway point between skeuomorphism and flat design. Microsoft’s Fluent Design System for example attempts to combine elements of Aero and Microsoft Design Language (read: legally-not-Metro). Last couple releases of macOS have also begun introducing non-flat UX elements as well.

These design trends may be driven in part due to fully flat design being an accessibility hindrance for some people, such as according to this study:

Funny thing is, Haiku’s Flat style isn’t actually completely flat and avoids many of the usability pitfalls of most flat designs.

3 Likes

It is a matter of fact the “world” deemed skeumorphism not suitable and moved away from it.
Flat-ish started to be all over the places: websites, UI, industrial design, and more.
It is also my opinion indeed, but it is irrelevant for the sake of this discussion.

To be honest, none of the attempts from Microsoft, Apple and Google were completely flat. The presence of drop shadows for example make the design slightly skeumorphic but there’s a huge difference between the two ends of the spectrum.
Anyway, going back on topic, my two cents for the logo: I like @Lrrr‘s take on this. Way better the the leaf. But if the leaf has to stay I would make it flat in two flavours suitable for both light and dark themes, IMHO.

I love this idea!

If you change the Deskbar color, the leaf is static and doesn’t adapt to the color. So if it’s a shade of blue, the leaf is blue. If it’s a shade of black, the leaf is blue. And so on, it doesn’t change, and it clashes with the colors. The default light gray and a dark gray work alright, but other colors don’t match well with it.

Far as following the background, I suppose if Haiku had compositing, I could see an alpha blended, glassy leaf that could intelligently ‘pick up’ on the color like modern macOS and Windows versions do. But that’d take a lot to implement; it’d be easier to just have a theme chooser, an accent color preference for it, or a gradient option in the color palette in Appearance to set it.

Well… it takes a lot to humbly confess it to everyone – but um, nothing proves me more wrong than actually visualizing what my various ideas would look like (different mockups done with a hi-DPI Deskbar).

The first mockup candidate is with the isometric Haiku ‘H’ logo, which I gotta confess doesn’t look too awful bad compared to the other ones! The 2.5D design fits well with the Haiku look and feel… but this logo variant isn’t really used, and so it clashes in its own way. But – I’ll say one thing I noticed! The black outline fits with the light tone here, and the white works on dark colors… so seeing this gets a mixed review for me with positives and negatives.

‎Haiku_Leaf_Traces.‎001

Second one is a scaled down HAIKU logo, which would look something like this. Negatives first are the space, readability, and you’d need a black and white version for dark and light modes implemented, because an outline around the letters doesn’t scale down well at small sizes. Positives are that it’s definitely official – it is the Haiku logo, it tells anyone seeing a screenshot instantly what this is, and it matches AboutSystem, Installer, and documentation. And it’s wide enough it doesn’t feel like it’s out of place.

‎Haiku_Leaf_Traces.‎002

A mostly negative self-review I’d give would be to the maple leaf idea – while it matches the startup disk and some of the emojis and what not like I’d said earlier, it’s too small. And it’s kinda ugly (at least to me) and doesn’t match (in fact visually clashes with) the isometric feel of every desktop applet and app icon.

‎Haiku_Leaf_Traces.‎006

And… now we start descending into the autumn foilage… and this one is a contender for the worst one. Going with an orange leaf is… just bad. Somehow in my head it looked better. I have nothing good to say about it. And I have tried making the outline thinner, thicker, darker, lighter, and played with the gradient… the orange just doesn’t vibe with me. In the end I just left it with this half-baked ugly version, but I don’t like it.

‎Haiku_Leaf_Traces.‎003

Which led me to try a black leaf, which is left with a thick border here – but even without one, I can say it just feels too imposing. It’s too big, unlike the little tiny apple in the Mac’s Menubar (when in light mode; in dark, it’s white). Honestly, the first image in my mind of it (maybe because of the curves and stem) looks like a leftover banana that’s went bad. For real, I could show different variations to everyone (like thin or no outlines) and no matter how, it still looks like a dark, ugly shadow.

‎Haiku_Leaf_Traces.‎005

That led to lightening the leaf a bit to a gray gradient, and this one works a bit better I think, but… sigh, it makes the menu feel like it’s inactive and the look just doesn’t sit well with me. But honestly, I think with some more love, focus, and tweaks to it, this might work like the ‘graphite’ Apple logo did in old Mac OS X versions. But I’d have to mess with it to get it to that point.

‎Haiku_Leaf_Traces.‎004

The final non-blue version I messed with was a silvery leaf reminiscient of the silvery Apple logo that iOS used to have. And honestly, like the H logo, I kinda like this one. It’d need more fine tuning to get looking nicer, but it fits both in a light and dark environment.

‎Haiku_Leaf_Traces.‎007

Finally, we get back to the blue leaf – and this is what I wish would happen to it if it stays – please align it with the Deskbar! The current version sinks below the button and it takes away from the polish of the OS experience.

Haiku_Leaf_Traces.‎008

So what are the takeaways of the mockup experience I’ve been bold enough to share in public? :laughing: My personal favorites are:

  • Full Haiku logo – it just makes sense as it fits all system branding and would increase brand recognition, (although it has it’s drawbacks I’d mentioned, and needs a dark and light version).
  • Isometric H – it matches the style of all the system icons, it’s simple, and it matches light and dark themes.
  • Graphite/silver leaf – with more work to them, I feel these would be a good alternate that would replace the traditional blue one.

All my other ideas I’ve proposed (and tried to make mockups of here) I personally would throw into the trash.

deskbar-for-mockup

But – please, if I could kindly suggest to align the leaf so it’s not sinking below the line Gnome 3.0 style (as shown in the screenshot above), and allow users to change the color of the leaf by making gradient options available to Appearance preferences, maybe just that would solve the problem.

Anyways, hope everyone liked seeing me try the mockups and this idea; it’s fun to read what everyone’s thoughts on this are.

10 Likes

The „Sinking“ is deliberate branding, not a bug in deskbar


I agree with the contrast issues however, that should be fixed.

3 Likes

I also vote for not changing anything. The blue leaf looks good, it is distinctive from other elements in the ui yet remains in the general branding (which the maple leaf or 3d logo don’t), and it is not “someone just slapped the project logo in there for no reason” (this is not an advertising placement, it’s a menu icon…).

Basically, everything about it (including the off-center placement) is intentional, and I don’t think it is going away.

8 Likes

In my opinion, the “Sinking” leaf looks good only as a background item, as in those screenshots, and does not look good in the foreground, as in the Deskbar.

6 Likes

It is in the background of the button, if you compare all the other versions with a pronounced icon it becomes much more noisy, and is harder to figure out what you should click on.

I mean behind other things when I say “in the background”.

I take it back, anyway - I changed background to a restful deep green, and the blue leaf looks even better now! Maybe the match with the background color doesn’t really help a bit. Anyway, I think we have a winner: the way it is.

Indeed the blue can clash but any fixed colour will do. It all depends of background menu colour chosen by the user and the orange one would have certainly looked better if you had tried it with one of the dark theme around. So, I’d say give the choice between blue, orange and green original colours and maybe add the silver one. This way, it would stay the same Haiku recognizable design but, you can avoid the clash.

I prefer the ones that actually say ‘Haiku’ on them, even just capital letters in black, on a light grey background, wouldn’t clash with desktop background colours - a definite improvement over that blue ‘leaf’ logo…

1 Like