Design systems from the ground up
HEGLA-HANIC | Lead UI/UX Designer | March - May 2025 | Desktop Apps
Going into the project
HEGLA-Hanic had no design foundation. Interfaces had been built with Windows Presentation Foundation, with no design language or patterns. On top of that, the software is used both in offices as well as production lines in warehouses: dimly lit spaces where screen readability is critical but rarely prioritized.
The brief was to establish a complete system from scratch without an existing baseline to build on.
Start with what exists
The only anchors were the company logos and existing font choices. Those became the foundation, extracting the brand's color intent and typographic styleto derive a token set.
Use the Material Design system
As an underlying framework I chose the Material Design system by Google. Its component structure and spacing logic fit the brand, elevated the design into a more modern look and kept the code developer friendly.
Consider the real environment
Warehouses are often poorly lit and the screens hang quite a ways away from the workers. A high-contrast mode was not a feature, but a necessity to begin with.
Defining standards
A design system always needs to consider those who come after. Proper documentation and a clear foundation for future employees and developers is a must.
For every component there was a standardized way of documentation that would help and build context around the functionality and choices made.
Results
Improved accessibility
The high contrast mode was designed for real people and conditions, not only to be WGAC compliant.
Visual consistency
The unified component library built the foundation for a shared design language across all products.
Brand recognition
Before, it was very hard to distinguish the HEGLA-HANIC products from the competitors, save for the logo placed on the software.
Future-proof foundation
Standards and documentation are in place, ready to be used and extended by future designers and teams.
A repeating pattern
I have done similar work at my 4 years at SMA Solar Technology. Due to NDA constraints I cannot show the entire library. However, I will gladly talk to you about the process!
