Updating the default themes

[akleja]

As I understand it there are big plans for the future for migrating from wxWidgets. However that seems quite far away at the moment. In my opinion the default dark theme is nearly unusable as it stands now. So I thought it might be a good idea to improve the themes a bit, even if it's temporary, so a first release might look a bit nicer.

I've begun working on an improved dark theme. It's not finished yet, but it's usable at least, which is a start. I'm making everything as vectors so it'll be quite easy to make light and high contrast versions from this. Integrating it is fairly straight forward, since the tools for converting themes to source files are already built into the program.

Is this something people want me to keep working on, or should I scrap it?
Screenshot:

(note: some parts aren't possible to theme, I think you can tell which those are)

[Songtech-0912]

Excellent! I think that is a good step ahead. However, as UI/UX designer I have a bit of feedback: be careful of blue tinting unless if you're trying to go with the blue-gray look, because the colors you chose have unequal amounts of blue tint, which may be annoying to the user.

Also, see this - maybe this is of interest?

[akleja]

True. Yeah that'll be useful with a more long term design goal. One thought I had on your design was that the contrast between the waveform and the background was a bit too low. It's nice to be able to see the details.
What I'm doing here is limited to the current state of the program. Like a bit of a stepping stone. So I decided to not change too much (symbology of icons for one) to not confuse old users too much. Also it means I can't change position/size of stuff.

[Songtech-0912]

I get it, that's perfectly reasonable. My choice of colors admittedly wasn't the best. Not changing too much is the way to go for now. That said, keep up the work! This is definitely something I would like to see implemented!

[akleja]

Sure, but the layout was really nice! Ok cool, I'll keep working on it and see how things progress. What's left is mostly final polish (which usually takes 50% of the time) and then updating the other themes. And then have people test it out.
I'll post updates as things progress.

[sosasees]

I actually like the Bright Blue waveform better than the Dark Blue.
I can actually see the Bright Blue, while the Dark Blue waveform is practically invisible.

[akleja]

I'll stick with the bright blue for now, just tweak it slightly.

[n0toose]

Is this a mock-up or an actual screenshot from Audacity? O_O

[n0toose]

I'm not so sure about making this the default theme but this has to be the new dark theme at the very least. Jeez. This is unbelievably awesome and I have to congratulate you on that.

[n0toose]

Maybe the color palette may need a couple of changes, but this is SO much better than before.

[n0toose]

Did you also have to change your system's theme, by the way? (Adwaita Dark)

[akleja]

Thanks!
This is intended as a replacement for the dark theme, and I intend to make a matching light version based on the standard light theme.
Yeah I'll work a bit on the colors.

[akleja]

The dropdowns that are slightly bluish in this screenshot is themed by the system unfortinuatly

[fossdd]

Really awesome work! I personally would accept it as default theme. However can you create a draft PR that we already now can review changes?

[n0toose]

The light theme could definitely use some love too. We could dynamically switch between them on platforms like Windows.

[akleja]

Thanks!
I think that might be a bit tricky at the moment. I'm trying not to change any of the code except for the files containing the themes.
As it works now the bitmaps and colors are stored as chunks of raw data. For the dark theme it is the file DarkThemeAsCeeCode.h
I can generate those files, so it is a drop in replacement, to minimize merging conflicts.
It's however not a very convenient workflow for tracking changes.
I do most of the work in a svg file that is exported and loaded from the theme panel that can be enabled in Experimental.cmake
Generating the header file would be an extra step which at least at this point would really slow things down for me.
If you have any suggestions how this could be done in a better way please tell me.

[akleja]

With that said I'll post a PR for review when the theme is a bit more complete, as of now there are quite some things that are unfinished.

[akleja]

I've been working a bit more on the theme. Here's how it looks now:

Will try to post a PR later for testing

[akleja]

I've also made an attempt at a light theme.
Doing this I noticed there are quite a few hard coded black elements that really disrupts the design.
So there are some options:

• Keep the light theme mostly as is, and just copy over icons.
• Include some changes to the code to change color of the track border and remove the shadow.

Here is a screenshot with those changes:

This is very much a first draft. I haven't touched the waveform color yet for one.

So what I'm wondering is, should I stick to the original theme, or keep working on this one even though it requires some minor code changes?

[sosasees]

This is much better than the original.
I really like this approach to retheming software:
Keep what works, improve what doesn't.
In Audacity's/Tenacity's case, nothing but the colors needed to be changed.

Even as a developer, I don't really like the look of "computery" colors like 0xff0000 or 0x00ff00. Even when I start with them for testing purposes, I quickly change them to something more "organic" with the HSV color sliders (as suppose to RGB).

A basic (introductory) understanding of color theory already comes a long way.
Although some of the colors still look a bit too computery for my tastes, you already put understanding of color theory to really good use.

Oh, and I have another color tip:
The color palette should either tend to use cool (blueish) or warm (reddish) colors. Mixing both of them without knowing can result in some really strange color combinations that don't exactly work together,
such as with the waveform icons in the top toolbar right now, where the light shade uses a cool blue but the dark shade uses a warm blue.

[akleja]

Thanks!
I've actually studied basic color theory believe it or not. I agree that the hsv sliders are the way to go.

Yeah I mainly use 0x00ff00 an the like for testing purposes when I need to identify an element. I grew up on the c64 with it's lovely palette.

Yeah the icon with waveforms will eventually match the actual waveform, but since I haven't decided on the waveform color, I didn't pay too much attention to it.
I'll keep making some improvements.

[akleja]

New version of the light theme.

And an updated version of the high contrast theme. Kept things mostly the same for now with this one.

[sosasees]

The new light theme looks
exactly the same as the original
yet much better at the same time.
In my opinion this can gladly be
the final version of the new light theme.

And about the high-contrast theme:
I can't comment on that one
as I find high-contrast themes in general
often confusing and sometimes painful to look at.
I believe this can't be fixed
without defeating their purpose
since they've always clearly been for people
whose vision works in a certain way
that is different from mine.

[akleja]

Perfect, thanks for the feedback!

Yeah I'm didn't dare to change too much since I don't know too much about what's important for them to function as intended, mostly just copied over the new icons and redrew the rest.

[mc776]

Those colours on the light version are so much easier on the eyes than current Audacity.

[akleja]

Thanks! I've never done any light-mode themes before so I was a bit unsure.
I've updated the draft PR with all the new themes if anybody wants to try it out.