QLC+ Icon Redesign - Testing / Help needed

[Yestalgia]

Hey Forum,

I'm trying to modernize the look and feel of V5 and want to ask for some help.

The eventual goal is to come somewhere close to this:
https://www.figma.com/file/bQYxkpRUGU9M ... yOftvHHv-1

I'd like some feedback on the new icons and overall style. You can download a test version by following these steps:

1. Login to GitHub
2. Go to this link: https://github.com/yestalgia/qlcplus/ac ... nch%3Alogo
3. Click the topmost workflow run
4. Scroll to the bottom and download the QML version of QLC+ for your OS (e.g. "QLC+-qt5qml-..................exe" for Windows)
5. Download the qlcplusUiStyle.zip file attached to this post
6. Unzip the folder
7. Put the qlcplusUiStyle.json in your user folder (For Windows: C:\Users\<Username>\QLC+\qlcplusUiStyle.json)
8. Test!

Kind regards,
Lachie

[GGGss]

hmm ... there has to be another way -> creating (another unwanted) account -> logging in -> and having to request permission to view whatever will be shown? NoNo!

[edogawa]

Yep same here, can't watch that image without account. It offers login via gmail address but I didn't try that.
Why not use picpaste, imgur or a similar service?

[Yestalgia]

Hey guys thanks for the feedback,

Please see attached screenshots if you don't want to make a figma account.

Also I made a slight error with my instructions. Classic case of "It works on my machine"

I've updated the original post with how to apply a custom style for QLC+5.

Cheers.

[Ylan]

Hi, as a member of the French QLC+ community,

I think that your mock-up is a very good integration to make in the new version 5 of QLC+ and even in an update of version 4 for the icons which are much more sober and classy, your work of UI/UX is also for me to be implemented in the new versions.

QLight will become even more attractive !

Thank you Yestalgia,

[kproth]

I think the organization of functions into categories is helpful. And I like the icons in your picture. Well done!

[BremDjenzzen]

Hi all,

I have done some further work on the widgets.
But I would be nice to get some feedback on the design and the color selections.

Here I have some options. They are quite similar but with subtle differences.
Currently I'm debating the need for an outline. I also want to know if there is a preference for the name on top or bottom.

I have also been experimenting with different colors. A standard color to differentiate widget looks nice but will in practice maybe inconvenient.
So I suggest making this kind of color arrangement. This way you can customize your widgets in many different ways without making it to complicated.


Please let me know what you think about it, and how you think I can improve the design

[MichelSliepenbeek]

I'm afraid you are going to make the same mistake as what happened when changing the forum's website.
if you sacrifice functionally for looks you are going in the wrong direction.

On the forum's website:
- on the top line you make a selection at "Quick Links" and then you get the result on the bottom half off the screen.
Now all users have to scroll up and down all over the page because someone thought it was a good idea to spent half the size of the usefull area on a picture of a piano (on a forum for lighting software).
In terms of usabilty this picture has no function at all, but it is in the way all the time. To me that is not an improvement.
- in the old situation not only the Title of a Topic was mentioned but also the related category.
If you are a Windows user you could skip all the Raspberry PI topics on beforehand.
If you find an unanswered topic, it makes quite a difference to know whether it is a Fixture Request or a Fixture Definition (they usually remain unanwered till Massimo adds them for a next release).
In the new situation you are forced to open all the topics, only to find out that most of them are not of your intrest. To me that is not an improvement.

If you look at the sliders in the current situation, you should notice that:
- the color of the knob for a Submaster slider (Black) is different from that of a Level or Playback slider (grey/silver). This was done for a reason, people are used to it.
- on the knob of a slider there is a horizontal line that will change color when the slider becomes active (it will show when you hover your mouse over it in operate mode).
This was done for a reason, people are used to it.
- the size of the Button also marks the area where you have to put your finger on a touch screen to move the slider.
Over the years thousands of QLC users have built up a kind of Muscle Memory based on that. I guess they won't be happy if you reduce the size of the button by half.

If you want my opinion: leave it as it is, this is not an improvement.

[mcallegari]

Now all users have to scroll up and down all over the page because someone thought it was a good idea to spent half the size of the usefull area on a picture of a piano (on a forum for lighting software).

I'll reply only to this since I am the mentioned "someone". The piano scene is rendered with QLC+ 5 so to me it is a quite big achievement to be proud of.
Like or not like are opinions. Lots of users complained that the previous site and forum were old and not reflecting a widely adopted software.
I don't want to start a discussion about this

[MichelSliepenbeek]

I don't want to start a discussion about the Forum's website, this was just meant as an example that not every change is also an approvement.

I just wanted to make clear that there is more to a slider (or knob) then shape and color.

[BremDjenzzen]

If you look at the sliders in the current situation, you should notice that:
- the color of the knob for a Submaster slider (Black) is different from that of a Level or Playback slider (grey/silver). This was done for a reason, people are used to it.
- on the knob of a slider there is a horizontal line that will change color when the slider becomes active (it will show when you hover your mouse over it in operate mode).
This was done for a reason, people are used to it.
- the size of the Button also marks the area where you have to put your finger on a touch screen to move the slider.
Over the years thousands of QLC users have built up a kind of Muscle Memory based on that. I guess they won't be happy if you reduce the size of the button by half.

I understand your concern. I did not know there were such standards.
I would like to find a nice middle road that adopts the old standards and puts them in a modern and more customizable shell.
It would be great to know if there are other subtle thing I should keep in mind when designing.
My goal is not only to make it looking modern and nice but I would also like to take usability (touchscreen operation and the switch from QLC+4) and now these subtle ques into a count.
I really want to take the time to make it as good as it possibly can be.

Let me know what I should know,
and also how i could improve the current design to fit the usability standards set by QLC+4

[BremDjenzzen]

A possible implementation can be using default styles to indicate what faders do.
I made a quick illustration here

[Yestalgia]

Hi all,

I have done some further work on the widgets.
But I would be nice to get some feedback on the design and the color selections.

I love your work. Let me know if we should re-enable Figma as I recently disabled it due to the expense. (I'd rather be giving away merch and Enttec adaptors)

I could then add you as a contributor to that platform.

[rajones203]

A possible implementation can be using default styles to indicate what faders do.
I made a quick illustration here
Fader types.png

I did this in my own custom version, I was having trouble making the handles wider, can you share your style sheet?

[GGGss]

Because I'm following this evolution, is there a place we can grab onto the latest build of your work, please?

[BremDjenzzen]

I love your work. Let me know if we should re-enable Figma as I recently disabled it due to the expense.

I'm currently working in Adobe XD but I think it should be possible to export to Figma, so non Adobe users can also see/edit it.
I think I can also put it on my own Figma zo you don't have to make expenses for it.

I'l update you on that soon.

[BremDjenzzen]

I was having trouble making the handles wider, can you share your style sheet?

This isn't currently live in software, its only a design.
If you want I can share the measurements in the design but I sadly can't help you with implementing it.
If I'm not mistaken @Yestalgia knows more about this.

But I am quite curious to see what you have made. I'm always looking for ways to improve the design.

[BremDjenzzen]

Because I'm following this evolution, is there a place we can grab onto the latest build of your work, please?

I can't give you a build, but I can share a link where you see all updates in a simulated environment.
Here you can also add comments to the designs, feel free to do so.

https://xd.adobe.com/view/9cd48269-4e7d ... 4cee-c987/

[rajones203]

I had that thought after I posted. I did manage to change the code in the VCSlider.cpp as well to get the sliders added to the stylesheet. Im not a programmer and am just learning the basics of UI styling in QT by reverse engineering QLC.

[Ylan]

Now all users have to scroll up and down all over the page because someone thought it was a good idea to spent half the size of the usefull area on a picture of a piano (on a forum for lighting software).

I'll reply only to this since I am the mentioned "someone". The piano scene is rendered with QLC+ 5 so to me it is a quite big achievement to be proud of.
Like or not like are opinions. Lots of users complained that the previous site and forum were old and not reflecting a widely adopted software.
I don't want to start a discussion about this

I think there's a nice project to change the icons for v4 as well as the software.