Stark Tech
|
Shipped 2025
Defining the design system & UI style guide for a specialized engineering industry tool
This project shipped in July 2025 and is currently adopted by Stark Tech's programming & engineering teams 🎉
At Stark Tech, I authored design system documentation & standard operating processes for designing IoT user interfaces for building automation systems (BAS). I particularly focused on enhanced UI consistency and accessibility compliance. The updated design system expanded coverage to ~25+ existing components and ~7+ new UI templates.
Role
Design System Documentation
UX Audit
Accessibility Compliance
TimeLine
1 month
Team
1 Programming Manager
1 Engineering Manager
~8-10 Software Engineers
Results
The new standards covered for Stark's design system & standard operating processes ~10-15+ active BAS projects within weeks of adoption in July 2025, resulting in increased team efficiency and 4 new company-wide initiatives to standardize cross-team communication & training.
Context
A blossoming company with growing pains
Stark Tech is an engineering company that specializes in building automation systems (BAS), which utilizes IoT user interfaces to control building conditions (e.g. HVAC, lighting, fire alarms). Stark has been rapidly increasing their presence across multiple states over the past decade, including New York, Florida, New Jersey, and Pennsylvania.
In recent years, Stark has rapidly expanded their services to multiple areas across Florida: Orlando, Tampa, Jacksonville, and the Space Coast. The Orlando location is Stark's largest office in Florida, with the number of staff doubling in size in the past few years. However, with a fast-growing company comes a number of growing pains, like lack of cross-team communication and no standardized team workflows.
Problem
Lack of resources and communication
The few resources available got dated quickly as Stark's Florida team grew rapidly, making them not sufficient for use by larger teams. This was a part of an overarching issue at Stark Tech: most teams provided little to no communication on standard operating processes. This had significant detrimental effects on Stark's projects:
Inconsistent work quality
Slower project delivery times
Technicians identify more project errors while on the field
New team members are forced to figure out everything on their own
Inconsistent interfaces and accessibility issues
Before I joined the team, programmers were designing & building BAS interfaces in addition to their main jobs (programming the BAS system functions). Aside from there being virtually no training or documentation on their main programming jobs, no resources existed for designing & building user interfaces aside from learning from the manager via trial & error on project QA sessions.
As a result, BAS interfaces were inconsistent across projects and most notably did not pass WCAG 2.1:
Poor legibility for both text and graphics
This card’s contrast ratio is 3.99:1 for the normal-sized text and 1:59:1 for the smaller text. Neither do not pass WCAG AA.
No clear sections for groups of technical data
No labels or headings for different types of units are present for screens displaying summaries of different equipment.
Inconsistent navigation and screen names
On certain pages, labels on sidebar navigation & sidebar menus do not match.
Lack of context for abbreviations
On building floor plan screens, there is no context for abbreviated rooms.
Frequent display issues identified on the field
The environment used to design and build BAS interfaces at Stark — Schneider Electric — is unlike standard design & dev tools: components are directly linked to live HVAC system functions and data points, making UI consistency critical. Inconsistent components caused display errors flagged by technicians in the field, delaying active projects — and left unresolved, risked critical issues: incorrect room temperatures and unsafe air quality in commercial buildings.
The interface where points are connected to design system components in Schneider Electric's dev environment
Define
Lack of cross-team communication and training resources
Inconsistent work quality
Slower project delivery times
Technicians identify more errors on the field
New team members being forced to figure out everything on their own
Solution
Audit of existing design system components
To address inconsistencies & accessibility issues, I audited existing design system components and UI templates in Stark Tech's component library. As a result, I identified & resolved 7+ key accessibility issues within several design system components.
Design enhancements & creation of new UI templates
To ensure more consistent BAS interface quality & WCAG compliance on projects, I applied UI enhancements to existing components. As a result, I increased design system coverage across ~25+ components and created 7+ new UI templates for key BAS screens. I also collaborated closely with one of the devs to build & implement a new component for more complex BAS systems into the refreshed design system.
Creating new design system & team workflow documentation
When I joined Stark Tech, the programming team was forced to figure out building BAS interfaces on their own via trial & error in QA sessions. To remedy this, I authored new documentation capturing design component specs & styling, best practices for implementing UI enhancements, and team standard operating processes. Design token management tools like Storybook were unavailable at Stark, so I built a SharePoint site to house the documentation instead.
Sample page from the documentation's final draft
Most importantly, the documentation had to be easy to understand since Stark Tech's staff is predominantly engineers. It included a defined UI style guide with fonts, colors, and spacing, as well as design system best practices, accessible design resources (such as the WebAIM contrast checker), and step-by-step guides for team standard operating processes.
Desk Research
Situational
Looking at a screen in the bright sun
Apprentice technicians learning on the job
Temporary disabilities
Getting injured on the job (e.g. broken arm, twisted ankle)
Cognitive disabilities
Technicians with cognitive disabilities will need to understand things clearly
Aging technicians
May have low vision, hearing loss, limited mobility, etc. due to aging
Results
Takeaways
Want to learn more?
I'd be happy to walk you through the full case study and talk more about my process over a call!