Design Systems Engineer II

📍 Job Overview

Job Title: Design Systems Engineer II

Company: Heavy Construction Systems Specialists, LLC

Location: Remote (USA)

Job Type: Full-Time

Category: Engineering / Design Systems

Date Posted: 2026-09-04

Experience Level: Mid-Level (3-5 Years)

Remote Status: Fully Remote with Periodic Travel

🚀 Role Summary

• Architect, scale, and govern design systems, treating them as living products to ensure a clear, 1:1 translation between design assets and the front-end codebase.

• Serve as the critical technical partner between Product Design and Development, guiding UI implementation and eliminating technical and UI debt.

• Own and evolve the visual component library, ensuring strict architectural parity between design variants and development frameworks.

• Leverage AI to accelerate development productivity by refining prompts, synthesizing logic, and integrating AI-assisted coding tools into workflows.

📝 Enhancement Note: This role is situated at the intersection of design and engineering, requiring a deep understanding of both visual design principles and front-end development practices. The emphasis on "treating design systems as living products" and "AI-ready design infrastructure" indicates a forward-thinking approach to product development and a need for candidates who can innovate within established systems. This isn't just about building components; it's about building a scalable, efficient, and future-proof design ecosystem.

📈 Primary Responsibilities

• Architect, scale, and govern the design systems to ensure a clear, 1:1 translation between design assets and the front-end codebase, eliminating technical and UI debt.

• Build systems that empower everyone (e.g., UX, product management, and development) to make sound design decisions.

• Own and evolve the visual component library, ensuring strict architectural parity between design variants and development frameworks.

• Govern the creation of new patterns by actively reviewing and approving/rejecting custom UI requests to prevent system bloat.

• Manage and scale the centralized design system documentation to serve as the primary authority, structured for adherence to design standards without always requiring intensive UI work.

• Collaborate directly with development to map design tokens to code variables, optimizing the developer experience (DX).

• Act as the definitive bridge between Product and Development, translating validated product and UX strategies into polished, functionally robust interfaces ready for development.

• Manage the UX Enablement intake process, triaging component requests, and providing UI/IXD consultations to unblock technical implementation.

• Produce clean design artifacts, interaction specs, and redlines that significantly reduce guesswork for the development team, while prioritizing system improvements that enable cross-functional teams to build without continuous, intensive UI support.

• Conduct research and usability testing focused on validating system patterns, ensuring components are intuitive for end-users (e.g., field personnel) and internal developers.

• Leverage market trends in UI/UX architecture (e.g., emerging AI interfaces, WCAG accessibility standards) to proactively shape the direction of the design systems.

• Structure and maintain machine-readable design documentation to ensure our systems are prepared for AI-assisted development.

📝 Enhancement Note: The responsibilities highlight a proactive and governance-focused approach. The emphasis on "eliminating technical and UI debt," "preventing system bloat," and "enabling cross-functional teams to build without continuous, intensive UI support" points to a need for strategic thinking and process optimization. The role requires not just execution but also foresight in system evolution and a strong understanding of developer experience (DX) and user experience (UX) for both internal and external users.

🎓 Skills & Qualifications

Education:

• Bachelor’s degree in Interaction Design, HCI, Computer Science, or equivalent experience is preferred but not required. Experience:

• 3–5 Years of relevant work experience with a proven track record of bridging design assets and front-end code.

• Experience conducting usability testing to ensure new patterns are intuitive for teams to implement.

• Experience managing complex system deprecation strategies (sunsetting old components across a live product ecosystem without breaking workflows). Required Skills:

• Strong working knowledge of development delivery automation and design-to-code integrations; actively reviews coded front-end components to ensure 1:1 visual parity with design assets.

• Ability to operate with minimal oversight as a direct technical partner to Development, working alongside software developers to guide UI implementation instead of relying on traditional design deliverables.

• Advanced proficiency in modern design collaboration platforms and design-to-code automation integrations.

• Proficiency in component-based front-end frameworks, UI component development environments, and agile project management tools.

• Ability to look 1–2 quarters ahead to anticipate what coded UI components will need to be built, refactored, or safely adapted to prevent technical debt.

• Ability to use AI to accelerate development productivity by refining technical prompts, synthesizing complex UI logic, and integrating AI-assisted coding tools into workflows. Preferred Skills:

• Experience configuring design token management systems or automated data pipelines that push assets directly from design platforms to code repositories.

• Background in optimizing the developer experience (DX) through the creation of interactive component sandboxes or developer playgrounds.

📝 Enhancement Note: The experience requirements emphasize a practical, hands-on approach to bridging design and development. The "3-5 years" with a "proven track record" suggests a need for demonstrable impact. The required skills highlight a blend of technical proficiency (front-end frameworks, automation) and strategic foresight (anticipating technical debt, AI integration). The preferred qualifications point towards candidates who can go above and beyond by optimizing DX and managing complex system lifecycles.

📊 Process & Systems Portfolio Requirements

Portfolio Essentials:

• Demonstrate experience in architecting and scaling design systems, showcasing clear 1:1 translation between design assets and front-end code.

• Provide examples of owning and evolving visual component libraries, with emphasis on architectural parity between design variants and development frameworks.

• Showcase governance processes for new pattern creation, including how custom UI requests were reviewed and managed to prevent system bloat.

• Include case studies or examples of managing and scaling centralized design system documentation, illustrating its effectiveness as a primary authority.

• Present examples of mapping design tokens to code variables and optimizing developer experience (DX) through collaborative efforts with development teams. Process Documentation:

• Illustrate your approach to translating product and UX strategies into robust interfaces ready for development, highlighting your role as a bridge between Product and Development.

• Detail your experience managing intake processes for UX enablement, including triaging component requests and providing consultations.

• Present examples of producing clean design artifacts, interaction specs, and redlines, emphasizing how they reduce guesswork for development teams.

• Showcase system improvements you've implemented that enable cross-functional teams to build efficiently with less intensive UI support.

• Document your experience conducting research and usability testing specifically for validating system patterns and ensuring component intuitiveness for both end-users and developers.

• Provide examples of how you've leveraged market trends (e.g., AI interfaces, WCAG) to shape design system direction.

• Demonstrate your understanding of structuring and maintaining machine-readable design documentation for AI-assisted development readiness.

📝 Enhancement Note: For a Design Systems Engineer II, a portfolio is crucial. It should not only display visual design work but also demonstrate the candidate's ability to manage complex systems, collaborate effectively with engineering, and implement scalable processes. The emphasis on "1:1 parity," "governance," and "developer experience" means that case studies should clearly articulate the challenges, solutions, and quantifiable outcomes of their design system work. Documenting processes for intake, documentation, and testing will be key.

💵 Compensation & Benefits

Salary Range:

• Given the mid-level experience (3-5 years), the remote nature within the USA, and the specialized skill set of a Design Systems Engineer II, a competitive salary range is estimated between $110,000 - $140,000 USD annually. This range is benchmarked against industry standards for similar roles in technology companies with a focus on design systems and front-end architecture, considering the need for specialized expertise and the ability to work autonomously remotely. Benefits:

• Flexibility to work Remotely across the USA.

• Comprehensive Medical, Dental, and Vision coverage options, with significant company contribution.

• Generous Paid Time Off: Including holidays, sick days, and personal time off.

• Employee Resource Groups (ERGs) to foster connection, inclusion, and professional development.

• On-site amenities at the Sugar Land, TX campus (for optional visits): Covered basketball court, soccer field, track, pickleball/tennis courts, gym.

• Dog-friendly campus and WiFi-accessible courtyards for optional on-site work.

• Strong Retirement Savings: 401(k) plan with a substantial 5% company match.

• Investment in Employees: Coverage for professional development and wellness programs.

• Additional perks and benefits as outlined by the company. Working Hours:

• Standard 40-hour work week. Flexibility is offered with the remote work arrangement, but core collaboration hours may be expected to align with team needs and project timelines.

📝 Enhancement Note: The salary estimate is based on aggregate data from industry salary surveys for Design Systems Engineers, Front-End Architects, and UI Engineers in the US tech sector, adjusted for a mid-level role. The benefits listed are directly pulled from the job description and are presented to highlight the company's commitment to employee well-being and professional growth, which are key attractors for specialized technical roles.

🎯 Team & Company Context

🏢 Company Culture

Industry: Heavy Construction Software. HCSS has been a pioneer and leader in developing software solutions to streamline construction company operations for the past 40 years. This industry context means the design system must cater to a diverse user base, potentially including field personnel who may have different technical proficiencies than typical office workers.

Company Size: The company size is not explicitly stated in the provided data, but the recognition as a "Best Companies to Work for in Texas" for 18 consecutive years and "USA Today Top Workplace" suggests a well-established, mid-to-large sized organization with a strong focus on employee satisfaction and retention.

Founded: Founded 40 years ago, HCSS has a long history of innovation and stability in the construction technology space. This longevity implies a mature organization with established processes, but also one that values continuous improvement and adaptation, as evidenced by their "technology innovation" recognition.

Team Structure:

• This role likely sits within a Product Development or Engineering department, collaborating closely with UX Design and various development teams across the product ecosystem.

• As a Design Systems Engineer, you will operate with minimal oversight, acting as a direct technical partner to Development, suggesting an autonomous yet highly collaborative role.

• Cross-functional collaboration is key, involving UX Designers, Product Managers, Software Developers, and potentially QA/Accessibility specialists to ensure system adoption and integrity. Methodology:

• HCSS emphasizes a customer-centric, end-to-end solutions approach, which translates into a design system that must be robust, user-friendly, and integrated across all products.

• The company's recognition for "technology innovation" and focus on "streamlining operations" suggests an environment that values efficiency, automation, and forward-thinking solutions, aligning with the goals of a Design Systems Engineer.

• Agile project management is implied by the mention of agile tools, suggesting iterative development cycles and a focus on delivering value incrementally.

Company Website: hcss.com

📝 Enhancement Note: The company's focus on the construction industry is a critical differentiator. Candidates should consider how a design system can best serve users in this sector, potentially including those in mobile or field environments. The company's long history combined with its innovation awards indicates a stable yet dynamic culture, likely valuing both proven methods and emerging technologies like AI.

📈 Career & Growth Analysis

Operations Career Level: Design Systems Engineer II signifies a mid-career professional with specialized expertise. This role is beyond foundational design/development tasks and requires strategic input, system ownership, and the ability to influence technical direction. The "II" designation suggests a progression path from a more junior role, indicating a need for demonstrated impact and leadership in system development and governance.

Reporting Structure: While not explicitly stated, this role likely reports to a Design Systems Lead, Engineering Manager, Director of Product Development, or similar senior leadership position. The emphasis on operating with "minimal oversight" and being a "direct technical partner to Development" implies a high degree of autonomy within the reporting structure.

Operations Impact: The Design Systems Engineer plays a pivotal role in ensuring a consistent, high-quality user experience across HCSS's entire product ecosystem. By providing a unified set of components and guidelines, this role directly impacts development velocity, reduces redundant work, lowers maintenance costs, and ultimately contributes to the overall usability and adoption of HCSS software. The integration of AI and focus on developer experience further amplifies this impact by modernizing workflows and enhancing productivity.

Growth Opportunities:

• Specialization & Leadership: Progression to a Senior Design Systems Engineer, Design Systems Lead, or Architect role, focusing on more complex system strategy, cross-product alignment, and potentially managing a team.

• Technical Skill Development: Deepening expertise in front-end frameworks, AI integration for development, advanced accessibility standards, and performance optimization of design systems.

• Broader Impact: Opportunities to influence broader product strategy through design system adoption, contribute to developer tooling, and evangelize best practices across engineering and design teams.

• Cross-Functional Expertise: Developing a deeper understanding of construction industry software and user needs, enabling more tailored and impactful design system solutions.

📝 Enhancement Note: The "II" in the title strongly suggests a career progression track. Candidates should look for opportunities to mentor junior engineers, lead specific design system initiatives, and potentially contribute to the strategic roadmap of HCSS's product development. The emphasis on AI and developer experience also points to potential growth in cutting-edge technology adoption.

🌐 Work Environment

Office Type: This role is designated as fully remote within the USA, offering significant flexibility. However, there are structured on-site requirements for onboarding and periodic visits to the Sugar Land, TX office.

Office Location(s): The primary office location mentioned is Sugar Land, TX.

• Initial Onboarding (First 3 Months): Employees in the Houston area are required to work on-site at the Sugar Land office 3 days per week.

• Hybrid Model (Post-Onboarding): Employees may request an on-site workspace and work up to 2 days per week in the Sugar Land office, subject to manager discretion and team needs.

• Fully Remote: Periodic visits (up to once per quarter) to the Sugar Land office are expected, along with attendance at HCSS-sponsored events as directed by the manager (e.g., UGM - User Group Meeting).

Workspace Context:

• The remote setup allows for a personalized work environment, optimizing focus and productivity.

• The hybrid model and periodic travel provide opportunities for in-person collaboration, team building, and direct interaction with colleagues and leadership at the Sugar Land campus.

• The company offers on-site amenities (gym, sports facilities, dog-friendly campus) that may be accessible during on-site visits, contributing to a positive work-life balance.

Work Schedule: A standard 40-hour work week is expected. While remote, there's an implied need for asynchronous communication skills and potentially some flexibility to accommodate team collaboration across different time zones within the US, though core hours for collaboration are likely maintained.

📝 Enhancement Note: The hybrid and periodic travel requirements are important for candidates to consider. While fully remote, there are defined expectations for on-site presence, particularly during the initial phase. This blend aims to balance the benefits of remote work with the advantages of in-person collaboration and company integration.

📄 Application & Portfolio Review Process

Interview Process:

• Initial Screening: A recruiter or hiring manager will likely review applications and resumes to assess alignment with core requirements, particularly the 3-5 years of experience and specific technical skills.

• Technical Interview(s): Expect in-depth discussions focusing on your experience with design systems, component architecture, front-end development, design-to-code integration, and system governance. This may involve live coding exercises or deep dives into your portfolio projects.

• Portfolio Review: A dedicated session where you will present and discuss your design system work. Be prepared to articulate your process, challenges, solutions, and the impact of your contributions, focusing on 1:1 parity, technical debt reduction, and developer experience.

• Cross-Functional Collaboration Discussion: Interviews with members of the development and product teams to assess your ability to partner effectively, communicate technical concepts, and integrate feedback.

• Behavioral & Cultural Fit Interview: Questions assessing your problem-solving skills, ability to work with minimal oversight, AI utilization strategies, and alignment with HCSS's customer-centric and innovative culture.

Portfolio Review Tips:

• Focus on Impact: For each project, clearly articulate the problem you solved, your specific contributions, the processes you implemented, and the measurable outcomes (e.g., reduced development time, improved consistency, decreased bug reports).

• Demonstrate 1:1 Parity: Showcase examples where you ensured strict adherence between design components and coded implementations.

• Highlight Governance: Present how you’ve managed system growth, reviewed requests, and prevented bloat.

• Showcase Developer Experience (DX) Improvements: Detail initiatives that made it easier for developers to use and contribute to the design system.

• Explain AI Integration: If applicable, discuss how you've used AI tools to enhance design system workflows or development productivity.

• Structure: Organize your portfolio logically, perhaps by project or by theme (e.g., System Architecture, Component Development, Documentation, Governance).

Challenge Preparation:

• System Design Challenge: You might be asked to design a new component or a process for managing component requests within a hypothetical design system. Focus on scalability, maintainability, and adherence to established principles.

• Code Review Simulation: You may be asked to review a piece of front-end code for adherence to design system standards or to identify potential technical debt.

• AI Prompting Exercise: Be ready to discuss how you would use AI to generate documentation, suggest component variations, or assist in code refactoring related to the design system.

• Case Study Presentation: Prepare a concise presentation of a significant design system project from your portfolio, focusing on strategy, execution, and results.

📝 Enhancement Note: The interview process will likely be rigorous, focusing heavily on practical application and demonstrable skills. Candidates should prepare to "show, don't just tell" their expertise through their portfolio and be ready to discuss technical challenges and solutions in detail. The emphasis on AI and developer experience means these aspects should be prominent in their portfolio and interview responses.

🛠 Tools & Technology Stack

Primary Tools:

• Design Systems Platforms: Proficiency with tools like Figma, Sketch, or Adobe XD for design asset creation and management.

• Component Development Environments: Experience with Storybook, Ladle, or similar tools for building, documenting, and testing UI components in isolation.

• Front-End Frameworks: Strong knowledge of component-based frameworks such as React, Vue.js, or Angular.

• Agile Project Management: Familiarity with tools like Jira, Asana, or Trello for managing workflows and tracking progress.

Analytics & Reporting:

• Design Analytics Tools: Understanding of how to track design system adoption, component usage, and impact on development velocity (though specific tools may vary).

• Version Control Systems: Expertise in Git for code management and collaboration.

CRM & Automation:

• Design Token Management Systems: Experience with tools or methodologies for managing design tokens (e.g., Tokens Studio, Specify).

• Automation Tools: Familiarity with CI/CD pipelines and tools that automate design-to-code deployment or component generation.

• AI-Assisted Coding Tools: Experience with tools like GitHub Copilot, ChatGPT, or similar AI assistants for code generation, refactoring, and documentation.

📝 Enhancement Note: The technology stack emphasizes a modern approach to design systems, integrating design tools, component development environments, and front-end frameworks. The explicit mention of AI-assisted coding tools and design token management systems indicates a focus on efficiency and advanced automation within the design and development process. Candidates should be prepared to discuss their experience with these specific types of tools and how they leverage them.

👥 Team Culture & Values

Operations Values:

• Customer-Centricity: A core value at HCSS, meaning the design system must prioritize the needs of construction professionals, ensuring usability and effectiveness in their demanding environments.

• Innovation: Recognized for technology innovation, HCSS likely fosters an environment where new ideas, especially those involving AI and process optimization, are encouraged and explored.

• Helpful Service: This extends internally, implying a collaborative and supportive team environment where members assist each other in achieving goals.

• Excellence: A drive for high quality in both products and employee experience, reflected in long-term recognitions as a top workplace.

• Efficiency & Streamlining: As a software provider for construction operations, the company values building efficient systems, which directly aligns with the goals of a Design Systems Engineer.

Collaboration Style:

• Direct Partnership: The role requires operating as a direct technical partner to Development, indicating a collaborative style focused on mutual understanding and shared problem-solving.

• Cross-Functional Integration: Expect close collaboration with UX, Product Management, and various engineering teams, requiring strong communication and the ability to translate between different disciplines.

• Governance & Guidance: A collaborative approach to system governance, involving reviews and approvals to ensure consistency while also providing guidance and consultation to unblock other teams.

• Knowledge Sharing: The emphasis on documentation and building empowering systems suggests a culture that values sharing knowledge and best practices to enable broader team success.

📝 Enhancement Note: HCSS's culture appears to be a blend of established stability (40 years in business, multiple workplace awards) and forward-thinking innovation (technology innovation, AI integration). Candidates should highlight how their approach to design systems aligns with these values, particularly in serving the unique needs of the construction industry and embracing new technologies.

⚡ Challenges & Growth Opportunities

Challenges:

• Maintaining 1:1 Parity: Ensuring perfect visual and functional alignment between design assets and coded components across a growing product suite can be challenging.

• System Scalability & Governance: Growing the design system to accommodate new features and products while maintaining strict governance to prevent bloat and technical debt requires strategic planning.

• Adoption & Evangelism: Encouraging widespread adoption of the design system across diverse development teams and ensuring consistent usage requires strong communication and support.

• Integrating AI: Effectively leveraging AI tools to accelerate productivity and prepare systems for future AI-driven development without compromising quality or introducing new risks.

• Deprecating Old Components: Managing the complex process of sunsetting older components across a live product ecosystem without breaking existing workflows.

• Balancing Remote & On-site Needs: Navigating the requirements for periodic on-site visits while maintaining productivity and engagement in a predominantly remote role.

Learning & Development Opportunities:

• Advanced AI in Development: Deep dive into emerging AI applications for design systems, code generation, and automated testing.

• WCAG Accessibility Standards: Becoming an expert in accessibility compliance and integrating best practices into the design system.

• Developer Experience (DX) Optimization: Leading initiatives to further enhance the tooling and processes that support developers using the design system.

• Cross-Disciplinary Expertise: Gaining deeper insights into the construction industry and the specific workflows of HCSS users to inform design system evolution.

• System Architecture & Strategy: Opportunities to contribute to the long-term strategic vision and architectural decisions for HCSS's design systems.

📝 Enhancement Note: The challenges presented are typical for a growing design system in a dynamic tech environment. Candidates should frame these challenges as opportunities to apply their problem-solving skills and demonstrate their ability to drive positive change. The growth opportunities are directly linked to staying at the forefront of design systems engineering, AI integration, and accessibility.

💡 Interview Preparation

Strategy Questions:

• "Describe your process for ensuring 1:1 parity between design and code. What tools and techniques do you use?" - Prepare to detail your workflow from design handoff to coded component verification.

• "How do you approach governing a design system to prevent bloat and maintain consistency? Provide an example of a time you had to reject a custom UI request." - Focus on your decision-making process, communication strategy, and understanding of system integrity.

• "Discuss your experience with AI in design or development workflows. How would you leverage AI to improve our design system or accelerate developer productivity?" - Be ready to discuss specific tools and practical applications, including prompt engineering.

• "How do you balance the needs of different stakeholders (e.g., designers, developers, product managers) when evolving a design system?" - Emphasize your collaborative approach and ability to find common ground. Company & Culture Questions:

• "What do you know about HCSS and the construction software industry? How do you see a design system supporting users in this sector?" - Research HCSS's products and the challenges faced by construction professionals.

• "This role requires working with minimal oversight. Can you give an example of a time you took initiative to solve a problem or improve a process without being asked?" - Prepare a STAR method (Situation, Task, Action, Result) response.

• "How do you stay updated on the latest trends in design systems, front-end development, and AI?" - Showcase your commitment to continuous learning. Portfolio Presentation Strategy:

• Narrative Arc: For each portfolio piece, tell a compelling story: the problem, your approach, the execution, and the impact. Quantify results whenever possible.

• Visual Clarity: Use clear visuals (screenshots, diagrams, code snippets) to illustrate your points. Ensure your presentation is well-organized and easy to follow.

• Focus on Process: Emphasize your thought process, decision-making, and how you navigated challenges. This is crucial for a systems-focused role.

• Demonstrate Technical Depth: Be prepared to discuss the technical implementation details of your design system components and integrations.

• Address AI and DX: Explicitly highlight any contributions related to AI integration or improving developer experience.

📝 Enhancement Note: Interview preparation should focus on demonstrating not just technical skill but also strategic thinking, problem-solving ability, and a deep understanding of design system principles. Candidates should be ready to articulate their value proposition in terms of efficiency, consistency, and innovation, particularly in the context of HCSS's industry and embrace of AI.

📌 Application Steps

To apply for this Design Systems Engineer II position:

• Submit your application through the provided link on jobs.gem.com.

• Customize Your Resume: Tailor your resume to highlight your 3-5 years of experience in design systems, front-end development, component architecture, and design-to-code integrations. Use keywords from the job description such as "Design Systems," "Component Architecture," "Front-end Development," "Design-to-Code," "AI-assisted Coding," and "Developer Experience."

• Curate Your Portfolio: Select 2-3 key projects that best showcase your ability to architect, scale, and govern design systems. Ensure these examples clearly demonstrate 1:1 parity, your governance processes, and any contributions to developer experience or AI integration. Prepare to walk through these projects in detail, focusing on challenges, solutions, and measurable impact.

• Prepare for Technical Discussions: Review common design system challenges, front-end best practices, and AI integration strategies. Be ready to discuss your experience with specific tools like Figma, Storybook, React, and Git.

• Research HCSS: Understand HCSS's mission, products, and the construction industry. Consider how your role and the design system contribute to their customer-centric approach and drive for innovation.

⚠️ Important Notice: This enhanced job description includes AI-generated insights and operations industry-standard assumptions. All details should be verified directly with the hiring organization before making application decisions.