This was my final project at the University of Applied Sciences and Arts Northwestern Switzerland FHNW and it also served as my bachelor thesis. It was similar to Happyflowers with the team size being limited to maximum two people, however the scope was as big as my projects in my first and second year of my studies and we only got a little bit more time than a usual semester.

Our client for this project was Dirk Lemmermann software & consulting with an internal employee of the FHNW as a coach. Having an external real world client meant for us to plan everything very well and deliver a good product that can be used in the future.

Goal

Creating forms in JavaFX is a very time consuming and repetitive task. FormsFX should fix this problem by creating a framework that is easy to use, while also allowing flexibility for the user to add custom features. As this was also our bachelor thesis project, we had to write a proper thesis around 40-60 pages. This time we were better prepared thanks to writing a report in our previous project.

Distribution of work with JavaFX forms on top and FormsFX below.

My Role

For this project we didn’t define any specific roles for each other. We worked on most things together by having a day each week dedicated for this project. Each of us worked mostly separately on their part, but we also had some pair programming sessions. We split the work between backend and frontend, however we also switched sometimes if the other knew how to do one thing quicker than the other.

I mainly worked on the frontend part of creating the custom controls and making sure the form had a basic uniform look. My colleague worked on the Fluent API logic and other backend features. For the report we each documented our own parts and then split the rest of the work for the things that still needed to be written down.

Having a 12 column grid was important to be able to structure the form freely.

Process

Unlike my other projects, we didn’t follow any traditional processes. From the start we understood our client’s vision and his goal for this project. In our kickoff meeting we agreed with our client and coach that creating personas, wireframes and prototypes are not necessary as all parties could see how the end product should look like. But most importantly we only had very limited time, so we had to prioritise.

After we finished the administrative tasks, we worked together to get a code base, so that we each could work on separate things. Once the code base was solid, we split the work between frontend and backend. My colleague worked on the backend features and I worked on frontend features.

Showing error messages was an important usability feature requested by the client.

My work was mainly creating these custom controls for all the possible fields a form can have and on making sure that the basic form will be usable and look uniform. A custom control is a set of JavaFX UI controls grouped together to make one single control. These were as simple as just grouping a label and any input field. However the logic behind these were much harder, e.g. I had to make sure that the field reflected the different states a field can take. Some custom controls were easy to do and others were hard, especially the fields with multi selection options were really hard to do, so we worked on them together.

All the custom controls available for FormsFX, this list can be easily extended with new custom controls.

For the report we did it similar to how we did it in our previous project Happyflowers, we each documented the parts we each worked on separately and then sat together, decided what else we need to document as well and split that between us. Having written a report before helped us to finish this report rather quickly, which allowed us to spend more time on the code and also making the report as good as we could.

Lessons Learned

This project was definitely my favourite of all the projects I have done at my university. Mostly because thanks to all the other projects I was experienced enough to do this project to the best of my capabilities. Another reason was that this project was done in Java, which was the main programming language I was taught during my studies and this made it easier for me to learn more advanced stuff by applying all the things I’ve learned to a real world project.

After working together with my colleague on a previous project, it made our teamwork more efficient and our communication had improved as well. This allowed us to focus more on the project itself and also improve on other things, like communication with the client and regular status updates.

These are the different states a field can take and the base design for them in FormsFX.

I had a lot of fun creating all these custom controls and I learned a lot of cool JavaFX features. One thing that was challenging was how to style the different states for a field, like how to visually show a field has changed, has an erroneous input or if a field is required. We struggled a lot with the required state, because the industry standard of just adding an asterisk didn’t really suit our overall look of the form. We used a blue vertical bar to indicate a change and a red bar to show error, so we finally decided to just make that bar yellow for required fields.

Our attempts at designing the required state for a field.

Overall I think this was my best project so far and our client and coach thought so as well. They were really happy with the solution we came up with and this is also thanks to their help as well, because they also helped us with some things when we couldn’t progress further. The client also wrote a blog post about this project, which you can read here. He also decided to make the project open source, so that the community can contribute to it and you can find it here.