Summary
This project consisted of creating a UX and UI for a control panel on SES-X Marine Technologies private vessels. The project was given free reigns to explore and performed a thorough research phase and in-house interviews to create a first edition screen. During all phases the project continuously collaborated with developers, marine technicians and business developers in the company.
Context
Before our project the screen on the leisure prototype featured a simple screen with limited functions, far from commercial grade HMI.
Process
The insight phase included market research on different existing solutions, interviews, personas and user stories. Possible functions were then sorted in MoSCoW and "effort vs impact" boards. This way pain points in current market equipment were found, which guided what functions to include. For example, one key research finding was that it is difficult to navigate around the map on a wet touch screen, which urged the project to end up with three physical elements: joystick, back-button and ON/OFF button.
MoSCoW on Effort vs Impact
After priorization
Categorisation on buttons vs only screen
Initial concept with physical buttons/joystick and touch screen combo
Prototyping
Low-Fidelity
During the prototyping phase low-fi wireframes were created, where users were invited to press the drawn buttons on the paper, and iterating through by placing new frames on top of the old ones until a missing function or a misleading path were discovered.
Iterations on the most logical setup of the menu bar, either vertical or horizontal placement.
Medium-Fidelity
After enough feedback was gathered from the drawn prototypes, a simple, clickable figma prototype was made to handle functionality and size of elements. By using simple placeholder symbols, the process was sped up by not lingering on aesthetics, but purely focusing on the functionality.
Testing of bottom menu vs left side menu
Before the digital prototype was cleaned up, the project went back to the drawing board with all the feedback, to create a drawn sketch of the final version to guide in making the final mockup.
High-Fidelity
The final prototype featured a main menu bar, with a second one opening when in that setting. Included settings were bluetooth and music handling, general display and sound controls, manuals for quick help with the boat and their hull technology, and a control for pumping out water in the boat.
Some of the settings are constantly on the main display, due to safety or convenience, such as lights and windshield wipers. Since the vessel is an electric boat, we enlarged the information on speed in knots (with the regulatory speed limit inside the square, which turns red if over the limit), power consumption statistics and battery percentage remaining.
The project ended up with a solid MVP, which included all the necessary functions, plus some music control. It also provided the company with a categorised list of functions to include in the future, such as the map visualising how far you can go before you have to turn back to charge, depth indication below the boat to avoid hitting the ground, or a quick call button for assistance.
Summary
This project was incredibly rewarding, not only because I got to design a dream screen for a boat—a striking contrast to the more traditional boats I grew up with, where even the buttons for lights and horn stopped working years ago—but also because it taught me valuable lessons about teamwork and prioritization. Working with such a diverse team showed me the importance of designing for the essentials first. Developers often reminded me, “It’s not that it’s too hard—it just requires months of work or a larger team to complete.” Similarly, the business team emphasized that users value updates and reliability, which taught me that starting small with a functional product and gradually implementing stable new features is far more effective than trying to do everything at once. This mindset continues to guide my work.
