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

New Default Theme #2587

Closed
tresf opened this issue Feb 18, 2016 · 85 comments
Closed

New Default Theme #2587

tresf opened this issue Feb 18, 2016 · 85 comments

Comments

@tresf
Copy link
Member

tresf commented Feb 18, 2016

This is a thread to discuss the possibility of replacing our current default theme.

Creative decisions naturally bring strong opinions, but with those opinions should also come good arguments.

Some points to focus on:

  1. Should this be the new default theme
  2. What major problems need to be fixed with this theme
  3. Should this new theme be staged for 1.2, 2.0, etc.
  4. What to call this theme (e.g. "Noir", etc)
  5. What to call the old theme (e.g. "Vesa", etc)

Before:
shot-2016-05-29_21-27-40

After
shot-2016-05-30_00-36-20

Marked notes as per @DeRobyJ
shot-2016-05-30_00-20-57

This conversation supersedes #880. The forked repository which contains this theme is located here. Cross-posts are welcome and encouraged.

FYI - @RebeccaDeField @Umcaruje @intemerson @budislav @SimoneIervasi @IvanMaldonado @musikBear @StakeoutPunch @cubician @michaelgregorius

@dednikko
Copy link

As a user, I will say that I prefer the darker "noir" theme, as the higher
contrast leads to faster text and icon recognition, for me.

On Thu, Feb 18, 2016, 1:38 PM Tres Finocchiaro notifications@github.com
wrote:

This is a thread to discuss the possibility of replacing our current
default theme.

Creative decisions naturally bring strong opinions, but with those
opinions should also come good arguments.

Some points to focus on:

  1. Should this be the new default theme
  2. What major problems can need to be fixed with this theme
  3. Should this new theme be staged for 1.2, 2.0, etc.
  4. What to call this theme (e.g. "Noir", etc)
  5. What to call the old theme (e.g. "Vesa", etc)

New Theme
[image: lmmsthemeprogress]
https://cloud.githubusercontent.com/assets/7960169/12161719/24d9e5ae-b4ae-11e5-9d4a-a46289096464.png

Current Theme
[image: image]
https://cloud.githubusercontent.com/assets/6345473/13155476/e61c2150-d64b-11e5-9852-30c693af5acc.png

This conversation supersedes #880
#880. The forked repository which
contains this theme is located here
https://github.com/HDDigitizerMusic/lmms-alt-theme/issues. Cross-posts
are welcome and encouraged.

FYI - @RebeccaDeField https://github.com/RebeccaDeField @Umcaruje
https://github.com/Umcaruje @intemerson https://github.com/intemerson
@budislav https://github.com/budislav @SimoneIervasi
https://github.com/SimoneIervasi @IvanMaldonado
https://github.com/IvanMaldonado @musikBear
https://github.com/musikBear @StakeoutPunch
https://github.com/StakeoutPunch @cubician https://github.com/cubician
@michaelgregorius https://github.com/michaelgregorius


Reply to this email directly or view it on GitHub
#2587.

@SimoneIervasi
Copy link

The name "Noir Theme" is very nice

@DeRobyJ
Copy link
Contributor

DeRobyJ commented Feb 18, 2016

Quite a nice theme, reminds me of Mixxx.
But I don't know if having white ff.ff.ff text on black backgroud is really ok.
Users may change it easily tho.

The BBeditor is fantastic, as well as the icons.
The sample track is a bit invisible xD

I want to try it out asap!

I would actually suggest to change the bars of the windows to make them less visible and contrasting

@tresf
Copy link
Member Author

tresf commented Feb 18, 2016

The sample track is a bit invisible xD

Thanks, this screenshot is slightly dated, that issue is already being addressed.

But I don't know if having white ff.ff.ff text on black backgroud is really ok.

I agree that the shade of white used may be too much against the black or near-black background. @Umcaruje /@RebeccaDeField can we get some mockups with varying intensity? What are your thoughts on this topic?

@budislav
Copy link

Should this be the new default theme

Absolutely.

What major problems need to be fixed with this theme

I think contrast is so high (black is too much black). I had these problem when I was worked on laptop screen. Every design from my laptop was too much dark for others. @RebeccaDeField Try to increase brightness for 20 and decrease contrast to -50.

Edit: @budislav don't tag @Rebecca, instead tag @RebeccaDeField ✅ -@tresf.

1

What to call this theme

Rebecca

@DeRobyJ
Copy link
Contributor

DeRobyJ commented Feb 18, 2016

capture
I think we should also keep the square on those icons

@midi-pascal
Copy link
Contributor

Really, really nice!

  1. For sure :smile: 
    
  2. This theme is very readable except for the digits (Tempo, Time, FX channels,...): for my old eyes one pixel thickness for the numbers make them a bit less readable than before. :cry: 
    
  3. 1.2 would be great!
    
  4. I like "Noir" very much
    
  5. "Classic" or "Gris" ("Grey" in French, referring to "Noir")?
    

Beautiful artwork anyways 👍

@LocoMatt
Copy link
Contributor

Honestly I prefer current theme. It's more friendly for eye. New theme isn't bad but if i were new user of LMMS I'd feel confused. Even if we compare it to any other software (not only DAW), color schemes are not that contrasting as in this theme. For longer sessions it might be very tiring for eyes.

@michaelgregorius
Copy link
Contributor

Should this be the new default theme?

I vote yes as it is much more consistent and polished than the current theme. Although I agree with the others that we should try a version with a bit less contrast as well.

What to call this theme (e.g. "Noir", etc)?

I still think that "Rebecca Black" would be a great name. 😉 On a more serious note I think "Noir" is a quite fitting name (in case the theme will stay rather dark).

@Umcaruje
Copy link
Member

Should this be the new default theme

Yes, so much yes.

What major problems need to be fixed with this theme

The others are right, it needs to get evened out contrast and brightess-wise. I also think the knobs should get redesigned.

Should this new theme be staged for 1.2, 2.0, etc.

I think we should stage it for 1.2

What to call this theme (e.g. "Noir", etc)

'Noir' sounds ok, I would also suggest 'modern'

What to call the old theme (e.g. "Vesa", etc)

'plastique', maybe?, or just 'olddefault'

@IvanMaldonado
Copy link
Contributor

Should this be the new default theme

I also think this should be the new default theme, it looks very cool and replaces the old windows 98 look the old theme had.

What to call this theme (e.g. "Noir", etc)?

'Noir' sounds good to me, and I think the old theme should be called "Classic" since some users could feel like they miss the old theme a little bit and they may want to use it again so "Classic" defines the old theme very well.

What major problems need to be fixed with this theme

I support you guys, this theme needs a bit more contrast, specially in the b+b editor. The gear besides each track looks like a flower to me and the midi icon looks like those things balloons have in the bottom, maybe it could use an icon that resembles more the midi entrance. I also would like to see how the mixer looks when there is something playing.

Huge respect for this theme, I hope I can see it soon in LMMS as the default 👍
.

Should this new theme be staged for 1.2, 2.0, etc.

1.2 please

@budislav
Copy link

I thought you guys are gentlemen :)
This theme should be called by Rebecca. She worked on this too long and since she is a lady I think she deserve it without a question. Little sign of gratitude from us.

@RebeccaDeField
Copy link
Contributor

First of all, I want to say that I am very honored for this theme to have your consideration as the new default. There is a lot of great feedback on this thread that I will definitely implement.

So that we are all on the same page, here is the latest screenshot (there are still things in progress here):
untitled

@dednikko Thank you for the kind words.

But I don't know if having white ff.ff.ff text on black background is really ok.

@DeRobyJ As Tresf said, it is a great idea to try some different shades of off-whites instead of the pure white. 👍

Absolutely

@budislav I means a lot to me that you appreciate our work, especially from a designer like you.

I had this problem when I was worked on laptop screen. Every design from my laptop was too much dark for others.

You are right! I tested the theme on a laptop as well. Thank you for the suggested settings. I will try that out. I also want to test my theme on a couple of different monitors after decreasing the contrast.

I think we should also keep the square on those icons

@DeRobyJ That is a great idea. I'll add it to the list.

one pixel thickness for the numbers make them a bit less readable than before.

@midi-pascal Thanks for the feedback. I will definitely try increasing the pixels and see how it looks.

@LocoMatt I totally see where you are coming from. I still appreciate the old theme as well. Dizzy put a lot of work into making huge improvements, and I took all of his work in consideration when making this theme. :)

I think everyone can agree that this theme will benefit from decreasing the dark shades and giving the buttons/knobs more contrast. I will work on this.

@michaelgregorius Haha. Although this theme might is darker, I actually rarely used pure black. If anything, it would be Rebecca Dark Grey instead of Rebecca Black ;P

I also think the knobs should get redesigned.

@Umcaruje Yes, the knobs in that screenshot are just placeholders. I am either going to create something custom or come up with a new design.

specially in the b+b editor

@IvanMaldonado Please clarify what part of the BBeditor you are referring to. Great suggestions on the icons. I will add those to my list. :)

She worked on this too long and since she is a lady I think she deserve it without a question. Little sign of gratitude from us.

Again, I really want to thank everyone for the kind words and consideration. I also want to thank all of the many people that made great contributions to this theme.

What major problems need to be fixed with this theme

You can see all of the issues here --> https://github.com/HDDigitizerMusic/lmms-alt-theme/issues
I will be adding all of the new issues to the fork that people have mentioned on this thread as well.

What to call this theme (e.g. "Noir," etc)

It seems that the names people have really liked so far are Modern and Noir. Modern Noir might be a great compromise between the two. I sort of like the juxtaposition in Modern Noir. :)

What to call the old theme (e.g. "Vesa", etc.)

I really like the idea of Classic or Classic by Vesa.

@Spekular
Copy link
Member

Spekular commented Feb 19, 2016 via email

@musikBear
Copy link

My thought are like @budislav and several others

I think contrast is so high (black is too much black).

budislavs lower contrast is more eye friendly.
Especially the sliders are almost not visible for us with low eyesight.
You should btw not look at the image on this page, open it in full size and resolution, in order to judge the visuals (sorry if that is too obvious)

I also have to say, that it would need to be used for an hour to be able to really access the ergonomics. But it is with no doubt a very fine design.

Should this be the new default theme

with a tiny change in contrast, yes

What major problems need to be fixed with this theme

how the sliders stand out in respect to the background, eg contrast

Should this new theme be staged for 1.2, 2.0, etc.

I see no reason not to use this in 1.2

What to call this theme (e.g. "Noir", etc)

RebeccaNoir. :)

What to call the old theme (e.g. "Vesa", etc)

VesaGris, to stick to nomenclature

Btw how does normal, nolength and selected notes look like in piano-roll. That is after all where most work is done, and hence what is looked at the most :)

@IvanMaldonado
Copy link
Contributor

bb

I was talking of this part, the contrast between the clear and dark squares is minimum to me, I have to make a little bit of effort to tell when a step ends.

I have to say that I am not able to see colors properly which means I could be the only one who complains about this but if just 1% of lmms users are colorblind like me, we would be grateful to have a bigger difference in contrast 😄

@StakeoutPunch
Copy link

I think the old theme should be called "Classic" since some users could feel like they miss the old theme a little bit and they may want to use it again so "Classic" defines the old theme very well.

I feel a little late to the party, but I wouldn't mind seeing the theme before Vesa's redesign included and named "Classic" ;)

I'm not being serious

@RebeccaDeField It is looking great!

@RebeccaDeField
Copy link
Contributor

@Spekular I can make the border smaller, but the reason it is blue was so that it matched the track color. I thought it would be clearer that way, but I can still try making it green.

@musikBear The contrast issues on this theme will be taken care of :) As for the piano roll notes and such, a lot of hard coding has recently been removed from the program, so a lot of the more finite edits are still to come.

@IvanMaldonado I see what you're saying. Good point. I'll add it to the list. BTW I can't seem to locate the balloon looking midi icon. Can you crop the screenshot so that I can understand? Thanks!

@StakeoutPunch But don't you miss that lovable note face?
lmmssmiley
(Couldn't help myself from making this)

@IvanMaldonado
Copy link
Contributor

I meant this one:

captura de pantalla_2016-02-19_14-28-40

Sorry, not the best comparison :P

varillas-para-globos

@RebeccaDeField
Copy link
Contributor

@IvanMaldonado No problem. Makes sense now. I'll try to rework the controller icon.

@lotalaki
Copy link

I've just noticed that icon with the face, did not read all the things you wrote here. Just one thing: leave the current icon as it is. Please.

@DeRobyJ
Copy link
Contributor

DeRobyJ commented Feb 20, 2016

That cute logo should be used in some kind of kawaii theme xD

@rubiefawn
Copy link
Contributor

I actually like Rebecca's remake of the old logo a lot. It's cute but not tacky.

@RebeccaDeField
Copy link
Contributor

@DeRobyJ @cubician Thanks! A kawaii theme would be awesome, but I just made it for laughs yesterday in a few minutes :P

@lotalaki Yes, the current geometric icon stays for this theme.

If anyone would like to contribute to the Modern Noir Theme you can take a look at what needs to be done here.

@RebeccaDeField
Copy link
Contributor

RebeccaDeField commented May 30, 2016

I have finished my version of this theme and I am ready to create the pull request. Please see the updated screenshots below. 😄 🎉

Before:
shot-2016-05-29_21-27-40

After
shot-2016-05-30_00-36-20

@tresf please update this issue with this new screen shot. 👍

Marked notes as per @DeRobyJ
shot-2016-05-30_00-20-57

When I try to push my commit to create a pull request I get a permission denied error. I'm obviously missing something, but I haven't created a pull request before, so I would really appreciate some more detailed instructions if someone would be willing.

@liushuyu
Copy link
Member

@RebeccaDeField : I assume you tried to push to LMMS/lmms repository instead of yours. But actually, PR is issued from your own repository. Just push your latest changes to your own repository. And click on Create Pull Request to issue the pull request.

If you have any further concerns, please feel free to ask us 👍

@RebeccaDeField
Copy link
Contributor

RebeccaDeField commented May 30, 2016

I assume you tried to push to LMMS/lmms repository instead of yours.

@liushuyu Thank you, that is exactly what I needed to know about the pull request.

Just push your latest changes to your own repository.

I'm having troubles with updating my fork. I can't seem to get it to update to the latest version or pull in all of the newest commits correctly. Do you have any ideas for what I could do to reset my fork to the latest version. I already have backups of the theme files that I can put in place once that is done.

@liushuyu
Copy link
Member

I'm having troubles with updating my fork. I can't seem to get it to
update to the latest version or pull in all of the newest commits correctly.

A pull request will only include your unique changes to the main repository
base, you can try to issue a pull request and see if there were some
unresolvable conflicts. If there weren't any, you'll be fine and just
confirm opening the PR

@DeRobyJ
Copy link
Contributor

DeRobyJ commented May 30, 2016

Looks awesome! Great work!

@musikBear
Copy link

Amazing work @RebeccaDeField -Absolutely stunning 🎉

@RebeccaDeField
Copy link
Contributor

Thank you for the kind words, everyone! Thanks to @liushuyu and @Umcaruje I think I have some direction for getting my fork in working order and making the pull request. I will let you know if I have any other questions 👍

@tresf
Copy link
Member Author

tresf commented Jun 15, 2016

Am I the only one that feels that there is not enough contrast between the workspace background and the content (window title, sidebar, etc) ?

screen shot 2016-06-14 at 10 10 21 pm

@RebeccaDeField
Copy link
Contributor

@tresf Can you edit the screenshot in GIMP to what background color would be optimal for you? The "Select by color" tool should make that easy.

@tresf
Copy link
Member Author

tresf commented Jun 15, 2016

Sorry, I won't have time to make mock-ups for a while, just inquiring about general usability.

@tresf
Copy link
Member Author

tresf commented Jun 15, 2016

To clarify a bit... I'm not trying to criticize the background color used in the new theme, but rather question the contrast between components as they tend to bleed into eachother on my screen. For example, the sidebar's color and the window title bar's color is almost indistinguishable from the background color on my PC (Dell monitors) as well as on my Mac (LG Television). Perhaps this is intentional, but I'm not sure that making mock-ups of different background colors is the best approach, but perhaps a conversation about how the end-users feel so that the designers can offer some solutions which don't sacrifice their own wishes/fundamental design.

@DeRobyJ
Copy link
Contributor

DeRobyJ commented Jun 15, 2016

I suggest we create a google form for a survey after RC2 is out, because this overall low contrast (cool, imo, and also good for the eyes) might be bad on some screens, thus we need feedback from the users.
Even tho we still deliver the classic theme!
In the maintime, we should discuss what questions to put there.

Let's say our goal is to avoid that most users return to classic theme.

For me, the recent changes on pianoroll are in the right direction, while this black backgroud is cool for two facts: it's similar to KXStudio distro, and it encourages the user to put their custom background.

@tresf
Copy link
Member Author

tresf commented Jun 15, 2016

Let's please not survey. We have well suited testers and designers right here on this tracker. Let's not make this bigger than it is.

@liushuyu
Copy link
Member

Besides changing the background color, there's another way: adding bold clear window border. I don't know if this works for 'half-blind' people (like me) 😄

@RebeccaDeField
Copy link
Contributor

RebeccaDeField commented Jun 16, 2016

Sorry, I won't have time to make mock-ups

No problem. As one busy person to another, I respect your time.

Getting this kind of feedback is what helps to improve things 👍

I am definitely open to tweaking the background color as this is one of the design elements that I found myself changing often when creating the theme. Notice that earlier screenshots had a much darker background.

When I received feedback that the contrast was to high, I decreased it on all of the elements considerably. This could have left the BG a little too light for the rest of the elements. I can easily make a PR for this if other LMMS users feel that darkening the BG will improve the usability for them as well.

Requesting some feedback from:
@LocoMatt @budislav @michaelgregorius @BaraMGB @Umcaruje @midi-pascal

@budislav
Copy link

2

@BaraMGB
Copy link
Contributor

BaraMGB commented Jun 16, 2016

In my opinion, the suggestion of @budislav goes in the right direction. All looks a little bit clearer. The difference between the elements are better to see.

@musikBear
Copy link

It is a known issue that pure white in text, has a tendency to 'spill' into other colors, and just a few percent graying can inhance readability. But is the font pure white? I do see fuzzy 'spill' in the screenies

@RebeccaDeField
Copy link
Contributor

RebeccaDeField commented Jun 17, 2016

@musikBear The text is an off-white color (not pure white), but Budislav edited the screenshot and may have different monitor settings for his font rendering so there may be some other variables.

Busy atm. Will reply with more info later.

@musikBear
Copy link

@RebeccaDeField 👍

@grejppi
Copy link
Contributor

grejppi commented Jun 17, 2016

I'm concerned about the lack of contrast between overlapping windows:

kuvakaappaus 2016-06-17 15-10-52

@RebeccaDeField
Copy link
Contributor

RebeccaDeField commented Jun 18, 2016

@grejppi Great observation. I believe that this could be fixed by adding more clear outlines around the windows. I'm thinking that #14171a would be a good shade as it would look a bit closer to the classic theme.

@budislav Thanks for the feedback! 👍 I appreciate it. I took a look at your screenshot and it looks to me that you decreased the contrast in an image editing program.

I have noticed that there are two sorts of conflicting opinions among LMMS users when it comes to contrast. There are those who prefer very low contrast to reduce eye strain and those that prefer very high contrast to increase the clarity and readability. I believe that lowering the contrast this much might only work for some.

Someone would have to take screenshots of every section of the program updated them in an image editor with decreased contrast, color pick and then update each element in CSS, followed by updating all of the SVGs. This is what I did when I decreased the contrast to be very close to the first screenshot you posted here. This process takes quite a bit of time (more than I have to spare), but if someone has the time, there is no reason why they can't go through the steps necessary and make a PR for that.

I wonder if adjusting the BG color and border individually instead of changing every color in the program could solve the lack of contrast that Tres and grejppi are experiencing with those elements.

As you all know, I love collaboration and I'm open to other ideas :)

@Serkan-devel
Copy link

can we have a deticated way to use custom themes like on owncloud with at deticated css folder?
I know that this project isn't written in a web language but could it be possible?

@Sawuare
Copy link
Member

Sawuare commented May 8, 2017

@RebeccaDeField
I think that the steps in the "Beat + Bassline editor" should be green just like the notes in the "piano roll". It doesn't make sense that these steps are the only thing that is cyan and everything else is green.

@RebeccaDeField
Copy link
Contributor

@Hussam-Eddin-Alhomsi The BBeditor is blue to match the color in the song editor, just as the automation is purple and the piano roll is green.

shot-2017-05-08_16-38-26

sdasda7777 pushed a commit to sdasda7777/lmms that referenced this issue Jun 28, 2022
ModernNoir Theme For The New Default
Closes LMMS#2587
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests