UI Redesign

[fadikdawoud]

Hey there Openboard, my Name is Fadi KD

I wanted to ask if I could have the ability to redesign the UI for openboard.

I am completely new in the Github + Opensource projects thing and I just need guidance and a bit of help on how to download and edit the source code for openboard so that I remake the ui button images and perhaps tweak some stuff and become a volunteering member of your team. (I tried following the steps on github for contributing but they are very hard for me)

I have 10 years of knowledge in graphics design and I have been into html, css and Javascript for the past couple of years. And as a frequent user of openboard I want to contribute as well.

Thank you so much for your amazing work by the way, I am a Number One fan of openboard since I use it daily for my work.

With best regards Fadi KD

My email for better conversations: fadikdawoud@gmail.com

[letsfindaway]

Hey there Openboard, my Name is Fadi KD

Hello and welcome!

I wanted to ask if I could have the ability to redesign the UI for openboard.

I am completely new in the Github + Opensource projects thing and I just need guidance and a bit of help on how to download and edit the source code for openboard so that I remake the ui button images and perhaps tweak some stuff and become a volunteering member of your team. (I tried following the steps on github for contributing but they are very hard for me)

I think it is important to know how the OpenBoard project is organized. Currently, OpenBoard is maintained by the Education Department (DIP) of the canton of Geneva, in Switzerland. It is widely used in schools in Geneva, and the main focus for OpenBoard development is that it has to fulfill the needs and wishes from the Geneva team. That in turn means, that "arbitrary" changes to OpenBoard, which do not meet a desire or requirement from that team, are likely not accepted.

So before putting any effort in this I would like to ask the maintainer @kaamui whether there are plans to modernize the UI and in which direction they go.

There already has been a pull request (PR) of a user about two years ago replacing and modernizing some of the images: https://github.com/OpenBoard-org/OpenBoard/pull/635. This PR was not merged.

I have 10 years of knowledge in graphics design and I have been into html, css and Javascript for the past couple of years. And as a frequent user of openboard I want to contribute as well.

This is a nice idea and in fact this is how open source works! So thanks for your offer!

Thank you so much for your amazing work by the way, I am a Number One fan of openboard since I use it daily for my work.

With best regards Fadi KD

My email for better conversations: fadikdawoud@gmail.com

I would like to keep the conversation here on GitHub. Open source also means open discussions, so what we discuss here should be open and readable by everybody.

[fadikdawoud]

Thank you for the quick response and for giving me insight into the project's direction. If there's ever a decision to modernize the UI, I’d be more than happy to contribute.

If it’s not too much trouble, could you kindly guide me on how to download and work with the OpenBoard source files? I’d love to experiment in my free time and potentially share my work with you. I’d greatly appreciate any help you can provide.

[kaamui]

Hi @fadikdawoud,

thank you for your proposal. It is actually not requested nor planned or expected, but it doesn't mean it could never be considered. But it's true that at this point it probably won't be prioritized and thus not looked at before a long time. What's on the pipe though, but not done yet because of a lack of time is the complete redesign of the applications and interactivities (especially interactivities). You could work on that and have a very good chance to have your work merged in the application. If you're interested, I can directly contact you to discuss about this.

For the global design, if you still want to, maybe first make a mockup, so I'll be able to discuss it with the team. Please pay attention that the current design is adapted to the philosophy of OpenBoard : intuitive and simple. Some of our users are very young and must intuitively understand what a button is about. It must keep this "educative app" feeling.

Please also note that the main GitHub repository for OpenBoard is https://github.com/OpenBoard-org/OpenBoard. We're here on @letsfindaway's land ^^ (a fork of OpenBoard that @letsfindaway uses to help us improve OpenBoard). I opened the "Discussions" feature, that will probably be easier to manipulate for you as you're not familiar with GitHub (the Discussions tab behaves more like a usual forum).

@letsfindaway

I think it is important to know how the OpenBoard project is organized. Currently, OpenBoard is maintained by the Education Department (DIP) of the canton of Geneva, in Switzerland. It is widely used in schools in Geneva, and the main focus for OpenBoard development is that it has to fulfill the needs and wishes from the Geneva team.

Let me precise that we don't choose ourselves what is needed or wished, but we have tools internally to gather requests from our teachers, and that the "Geneva team" maintaining OpenBoard is actually composed almost exclusively by these teachers.

That in turn means, that "arbitrary" changes to OpenBoard, which do not meet a desire or requirement from that team, are likely not accepted.

It's not true. We accept as much as possible the features requested by the community, as long as it doesn't introduce any regression and doesn't go on the opposite direction. Like the Seyes background, or "run in a window", etc, that is not used at all in our schools but could be provided by the community without introducing any regression and not breaking the simplicity of OpenBoard.

[kaamui]

Thank you for the quick response and for giving me insight into the project's direction. If there's ever a decision to modernize the UI, I’d be more than happy to contribute.

If it’s not too much trouble, could you kindly guide me on how to download and work with the OpenBoard source files? I’d love to experiment in my free time and potentially share my work with you. I’d greatly appreciate any help you can provide

Please note that applications and interactivities are actually html+js+css code encapsulated in folders with the .wgt extension. It will probably be easier for you to manipulate as it corresponds to your skills. Changing the whole design of OpenBoard will be far more complicated as you'll also have to make changes in the code and thus compile OpenBoard. But if you want to do so, there's good documentation to learn how to build OpenBoard from source : https://github.com/OpenBoard-org/OpenBoard/wiki/Build-OpenBoard-from-source

Actually, if you want to test to change the design of an application or an interactivity, you can simply install OpenBoard and work directly in it. Please follow this link to find documentation about how to : https://github.com/OpenBoard-org/OpenBoard/wiki/Creating-Web-Widgets

After drag and dropping an application or interactivity on the board, you can also work directly on this copy: go to the data directory (location depends on your OS, %localappdata%/OpenBoard/document on Windows for example), locate the document where you added the application, go in it, go to the "widgets" folder where you should find a copy of the widget you dragged and dropped (copy is renamed to something {7b65428....}.wgt). Edit the files, and you can then simply right click on the app on the board and click on "Reload" to see the changes.

[fadikdawoud]

For the global design, if you still want to, maybe first make a mockup, so I'll be able to discuss it with the team. Please pay attention that the current design is adapted to the philosophy of OpenBoard : intuitive and simple. Some of our users are very young and must intuitively understand what a button is about. It must keep this "educative app" feeling.

Hey @kaamui that would be a great idea and I will try to follow the Build openboard from source guide to be able to make edits on the UI design of Openboard and test them as well and then I will send it to you to see if it fits the app's audience and team standards

Please also note that the main GitHub repository for OpenBoard is https://github.com/OpenBoard-org/OpenBoard. We're here on @letsfindaway's land ^^ (a fork of OpenBoard that @letsfindaway uses to help us improve OpenBoard). I opened the "Discussions" feature, that will probably be easier to manipulate for you as you're not familiar with GitHub (the Discussions tab behaves more like a usual forum).

What a funny misunderstanding, I fell into a black hole in Github just trying to find a way to contact the team here, Thank you for clearing that up

Please note that applications and interactivities are actually html+js+css code encapsulated in folders with the .wgt extension. It will probably be easier for you to manipulate as it corresponds to your skills. Changing the whole design of OpenBoard will be far more complicated as you'll also have to make changes in the code and thus compile OpenBoard. But if you want to do so, there's good documentation to learn how to build OpenBoard from source : https://github.com/OpenBoard-org/OpenBoard/wiki/Build-OpenBoard-from-source

Now I understand more clearly why I found css files in the main folders of Openboard, I would actually be glad to help in that as well if you need something in it

After drag and dropping an application or interactivity on the board, you can also work directly on this copy: go to the data directory (location depends on your OS, %localappdata%/OpenBoard/document on Windows for example), locate the document where you added the application, go in it, go to the "widgets" folder where you should find a copy of the widget you dragged and dropped (copy is renamed to something {7b65428....}.wgt). Edit the files, and you can then simply right click on the app on the board and click on "Reload" to see the changes.

I am really glad to be getting an expert's help from someone like you and that you made me understand things on a higher level now, I am again very thankful for your amazing guides

Best regards Fadi KD

[fadikdawoud]

But if you want to do so, there's good documentation to learn how to build OpenBoard from source : https://github.com/OpenBoard-org/OpenBoard/wiki/Build-OpenBoard-from-source

I tried following the steps on this page before and I encountered problems with the QT download part, since I dont know what to download exactly and which version. (PS: I am on windows 11)

Can you help me out with this part so that I can be able to test the icons on openboard myself and finalize the designs that way

[letsfindaway]

I tried following the steps on this page before and I encountered problems with the QT download part, since I dont know what to download exactly and which version. (PS: I am on windows 11)

For Windows, the instructions are here: https://github.com/OpenBoard-org/OpenBoard/wiki/Build-OpenBoard-on-Windows

For problems or missing information please tell exactly at which step you're struggling. Is it the Qt version? I think currently the windows builds are using Qt 5.15.x.

I'm on Linux so I can probably not help you with the details, but I can try to do my best.

[fadikdawoud]

For Windows, the instructions are here: https://github.com/OpenBoard-org/OpenBoard/wiki/Build-OpenBoard-on-Windows

I tried following them but still I encounter multiple issues.

The first issue is the installation of Qt from the online Qt installer: In the custom Installations which choices should I leave on, only three are mentioned to be turned on what about the rest? Am I gonna need any of that?

The second issue is with qmake: after I set the directory in the enivornment variables "Path" (for example "C:\Qt\5.14.2\msvc2019_64\bin") I still get errors when running the code (qmake quazip.pro) in git bash, but in x86_x64 Cross Tools Command Prompt for VS it's working fine.

The third issue is Downloading the openboard sources: When i download openboard through git bash two files are installed Openboard and Openboard-Thirdparty........When I go to git bash and try "cd freetype" it tells me there are no files with that name, the same goes with "cd xpdf" and only the quazip folder is there and when i try to run qmake quazip,pro it says some files are missing and doesn't work

I appreciate it a lot and I know it would be kinda frustrating since you are on a different operating system but maybe you know someone who has it running on windows. And of course you know I am unable to test the finished icons on openboard that way.