Design Systems Engineer (m/f/d)

📍 Job Overview

Job Title: Design Systems Engineer (m/f/d)

Company: DocuWare

Location: Germering, Bavaria, Germany

Job Type: Permanent employee

Category: Engineering Operations / Product Operations

Date Posted: 2026-09-29

Experience Level: Mid-Senior Level (5-10 years)

Remote Status: Hybrid

🚀 Role Summary

• Owns and manages the end-to-end design system pipeline, from design tokens in Figma to production-ready components.

• Bridges the gap between design and engineering, ensuring semantic consistency and code quality.

• Develops and maintains automated workflows for token transformation and component extraction from design tools.

• Implements and governs visual regression testing and accessibility infrastructure for robust component delivery.

• Leads technical aspects of component and token migrations, ensuring backward compatibility and phased rollouts.

📝 Enhancement Note: This role is highly specialized, focusing on the operationalization of design principles into reusable engineering components. It sits at a critical intersection of Product Design, Frontend Engineering, and Operations, requiring a deep understanding of both design system architecture and the technical infrastructure that supports it. The emphasis on "owning the pipeline" and acting as a "steward" indicates a significant responsibility for the system's health, scalability, and adoption.

📈 Primary Responsibilities

• Design Token Pipeline Management: Maintain Figma as the single source of truth for design tokens, driving them through primitive, semantic, and component tiers to consumable CSS/SCSS variables. This includes managing naming conventions, conflicts, and gaps.

• Component Library Development & Governance: Build, maintain, and review the component library against design specifications. Ensure fidelity, govern variants, and manage component APIs for consistent product development.

• Design-to-Code Automation: Develop and implement programmatical extraction of tokens and component context from Figma, building tooling (including AI-assisted workflows) to synchronize design and code efficiently.

• Visual Regression & Accessibility Infrastructure: Establish and maintain a CI-integrated pipeline for visual diffing and automated accessibility checks. Manage baselines and implement PR gating in collaboration with DevOps and cloud teams.

• Technical Migration Leadership: Plan and execute phased rollouts for component and token migrations, swapping legacy elements for modern system specifications while ensuring backward compatibility and providing clear before/after evidence.

• Documentation & Knowledge Transfer: Create and maintain comprehensive documentation for architecture decisions, conventions, and system maintenance to ensure longevity and scalability beyond individual contributions.

📝 Enhancement Note: The responsibilities highlight a proactive, systems-thinking approach to design system operations. The role requires not just execution but also strategic planning for automation, quality assurance, and long-term maintainability. The mention of AI-assisted workflows indicates a forward-looking aspect of the role, focusing on leveraging emerging technologies for efficiency.

🎓 Skills & Qualifications

Education: While no specific degree is mandated, a strong foundation in Computer Science, Software Engineering, or a related field is implied by the technical requirements. Experience and demonstrated skills will be prioritized over formal education.

Experience: Several years of hands-on experience in design systems, ideally with a focus on cross-platform implementations. Proven track record in modern frontend development and operationalizing design systems.

Required Skills:

• Design System Expertise: 5-10 years of experience in building and maintaining design systems, with a strong understanding of cross-platform considerations.

• Frontend Development: Proficient in TypeScript, modern frontend frameworks (specifically Angular), and web components (e.g., Lit).

• CSS/SCSS Proficiency: Strong command of CSS and SCSS, including best practices for theming, variables, and component styling.

• Design Tokens Management: Hands-on experience with design token architecture, including token tiers (primitive, semantic, component), naming conventions, and tooling (e.g., Tokens Studio, W3C DTCG, Style Dictionary, or equivalents).

• Figma Fluency: Demonstrated ability to read and interpret design systems, variables, collections, and component libraries within Figma. Experience with the Figma API or plugin ecosystem for programmatic extraction is essential.

• CI/CD & Cloud Delivery: Solid experience with CI/CD pipelines, package publishing to private feeds, and hosting build artifacts and tooling.

• Legacy Modernization: Proven ability to incrementally modernize legacy frontends without disrupting existing consumers.

• Problem-Solving: A proactive and curious approach to identifying and solving complex technical and design-related challenges.

• Communication: Excellent verbal and written communication skills in English.

Preferred Skills:

• Azure Cloud Experience: Familiarity with Azure services such as Static Web Apps, Container Apps, Blob Storage, and Entra ID is a significant advantage.

• AI/ML Workflow Integration: Curiosity and passion for integrating AI-assisted design and engineering workflows.

• German Language Proficiency: The ability to communicate in German would be beneficial for team interactions.

📝 Enhancement Note: The experience level is inferred from the "several years of design system experience" and the depth of responsibilities, suggesting a mid-to-senior level role. The emphasis on specific tools and technologies like Angular, Lit, Tokens Studio, and Figma API points towards a need for highly specialized practical experience.

📊 Process & Systems Portfolio Requirements

Portfolio Essentials:

• Design System Case Studies: Showcase at least 2-3 comprehensive case studies detailing your experience with building, maintaining, or significantly improving design systems.

• Token Architecture Examples: Include examples of your design token architecture, demonstrating your understanding of primitive, semantic, and component tiers, and how you've managed them.

• Component Library Showcase: Provide links or detailed descriptions of component libraries you have developed or contributed to, highlighting API design and variant management.

• Automation & Tooling Demonstrations: Present examples of automation scripts or tooling you've built to streamline design-to-code processes, including any AI-assisted workflows.

• CI/CD & Quality Assurance Integration: Detail your experience integrating visual regression testing and accessibility checks into CI/CD pipelines, with examples of gating mechanisms and baseline management.

Process Documentation:

• Workflow Design & Optimization: Demonstrate your ability to map out and optimize the end-to-end design system pipeline, from design handoff to production delivery.

• Implementation & Automation Methods: Detail the methods you use for programmatic token extraction, component generation, and synchronizing design and code.

• Measurement & Performance Analysis: Show how you measure the impact and performance of a design system, including metrics related to adoption, efficiency, consistency, and quality.

📝 Enhancement Note: Given the technical and operational nature of this role, a strong portfolio is crucial. Candidates should be prepared to demonstrate not just theoretical knowledge but practical application of design system principles, automation, and quality assurance processes. The emphasis on end-to-end ownership means the portfolio should reflect the entire lifecycle of design system elements.

💵 Compensation & Benefits

Salary Range: Based on the role's seniority (5-10 years experience), specialization, and location in Germering, Germany, the estimated annual salary range is €70,000 - €95,000. This range accounts for the highly specialized skillset, the demanding responsibilities, and regional market rates for senior engineering roles in the Munich metropolitan area.

Benefits:

• Flexible Work Location & Hours: Hybrid work model with flexibility to arrange your own working hours, supporting work-life balance.

• Comprehensive Training & Development: Access to regular, tailored training, including conferences and internal team-building events, to foster continuous learning.

• Generous Paid Time Off: 35 vacation days per year for rest and rejuvenation.

• Mental Health & Well-being Support: Employee Assistance Program offering free, confidential access to resources for well-being and stress management.

• On-site Amenities: Free Fairtrade coffee, organic milk, snacks, and fresh fruit. Subsidized lunch options via the Foodji fridge.

• Complimentary Tuesday Lunch: Enjoy a free, varied lunch every Tuesday.

• Commuting Benefits: Options for a leased e-bike, train travel, or highway access with free e-car charging.

• Team Spirit & Events: Regular virtual or on-site employee and team events to foster global collaboration.

• Sustainability Focus: Company commitment to paperless work and support for social initiatives.

• Company Pension Plan: DocuWare subsidizes your company pension plan for future financial security.

• Unique Benefits Package: Choice of one from three great options: Bonago (employee benefits platform), E-Gym (fitness), or subsidized Deutschlandticket (public transport).

• Work from Abroad: Opportunity to work remotely from abroad for up to 30 days per year.

• Onboarding Support: Buddy Program pairing new hires with experienced colleagues for smooth integration.

• Family Support: Preferential registration in a selected daycare center in Germering (subject to availability).

• Modern Technology: Work with the latest technologies, as detailed on Stackshare.

Working Hours: The standard working hours are approximately 40 hours per week, with flexibility offered in scheduling to accommodate individual needs and team collaboration.

📝 Enhancement Note: The salary estimate is based on industry benchmarks for senior frontend engineers specializing in design systems in Germany, considering the specific technologies and responsibilities outlined. The extensive benefits package reflects a company culture that values employee well-being, development, and work-life integration.

🎯 Team & Company Context

🏢 Company Culture

Industry: Software / Enterprise Content Management (ECM). DocuWare provides cloud-based software for document management and business process automation, serving a wide range of industries. This context means the design system engineer will be working on a product with broad applicability and diverse user needs.

Company Size: DocuWare operates with globally distributed, international teams. While the exact number isn't provided, the mention of multiple global locations (Germering, New York, Sofia) suggests a medium to large enterprise size, likely falling within the 500-1000+ employee range, which implies a structured yet agile operational environment.

Founded: The founding date is not explicitly stated in the provided data, but the company's established presence and global reach suggest a history of growth and innovation, likely founded several decades ago. This history implies a mature product suite and established operational processes that the design system will support.

Team Structure:

• Operations Team: The role sits within a team focused on product development and engineering, likely part of a larger Engineering or Product department. The Design Systems Engineer will collaborate closely with UI/UX Designers, Frontend Engineers, and potentially Backend Engineers and DevOps specialists.

• Reporting Structure: The role likely reports to a Lead Frontend Engineer, Engineering Manager, or Head of Product Engineering. The emphasis on "ownership" suggests a degree of autonomy within the team structure.

• Cross-functional Collaboration: High degree of collaboration is expected with Product Designers to define token semantics and component behavior, Frontend Developers to integrate components, and DevOps/Cloud Engineers for pipeline infrastructure.

Methodology:

• Data-Driven Design: Decisions regarding the design system are likely informed by user feedback, product analytics, and engineering feasibility, emphasizing a data-driven approach to design and development.

• Agile Development: The company's flexible work arrangements and emphasis on continuous improvement suggest an agile methodology for product development and design system iteration.

• Automation & Efficiency: A core tenet of the role is to drive automation and efficiency, minimizing manual work in design-to-code processes and ensuring robust quality through automated checks.

Company Website: https://www.docuware.com/

📝 Enhancement Note: The company's focus on digitalization and business process automation suggests that operational efficiency and robust system design are key priorities. The Design Systems Engineer will play a pivotal role in ensuring consistency and scalability across DocuWare's product suite, directly impacting the user experience and development velocity.

📈 Career & Growth Analysis

Operations Career Level: This is a specialized, mid-to-senior level engineering role. The "Design Systems Engineer" title, combined with responsibilities for end-to-end pipeline ownership, automation, and infrastructure management, indicates a position requiring significant experience and a strategic mindset. It's beyond a typical frontend developer role, focusing on the foundational layer of product development.

Reporting Structure: The role likely reports into a Frontend Engineering lead or a Product Engineering Manager. While operating with autonomy in their domain, they will be part of a larger engineering organization and expected to contribute to broader team goals. Collaboration will be key with design and other engineering disciplines.

Operations Impact: The design system is the operational backbone for UI consistency and developer efficiency. By owning this system, the engineer directly impacts:

• Product Consistency: Ensures a unified look and feel across all DocuWare products, enhancing brand identity and user trust.

• Development Velocity: Accelerates product development by providing pre-built, well-documented components and tokens, reducing redundant work for individual teams.

• Code Quality & Maintainability: Establishes standards for component architecture, visual regression, and accessibility, leading to more robust and maintainable codebases.

• Scalability: Provides a scalable foundation for new features and products, enabling faster iteration and market responsiveness.

Growth Opportunities:

• Technical Specialization: Deepen expertise in design systems, component architecture, tokenization strategies, and advanced frontend technologies.

• Leadership in Operations: Grow into a lead role for the design system, mentoring junior engineers and influencing product development strategy.

• Cross-functional Influence: Expand influence across product design, engineering, and potentially QA, becoming a key stakeholder in product development processes.

• Emerging Technology Integration: Lead initiatives to integrate new technologies, such as AI for design-to-code automation, positioning oneself at the forefront of innovation.

• Broader System Architecture: Potentially transition into roles with broader responsibilities in frontend architecture or platform engineering.

📝 Enhancement Note: This role offers significant growth potential for individuals passionate about the intersection of design and engineering operations. The opportunity to own a critical system that impacts multiple product lines provides a strong platform for career advancement within DocuWare.

🌐 Work Environment

Office Type: DocuWare offers a hybrid work model. This means employees will split their time between remote work and working from their modern office in Germering. The office environment is designed to foster collaboration and innovation.

Office Location(s): The primary office is located at Planegger Str. 1, 82110 Germering, Bavaria, Germany. This location is accessible via public transport and major highways.

Workspace Context:

• Collaborative Spaces: The office is likely equipped with collaborative workspaces, meeting rooms, and common areas designed to encourage interaction and knowledge sharing among colleagues.

• Technology-Rich Environment: As a software company utilizing the latest technologies, the workspace will be equipped with modern hardware, high-speed internet, and access to necessary software and development tools.

• Team Interaction: The hybrid model allows for focused individual work remotely and collaborative sessions, brainstorming, and team-building activities in the office. Regular employee and team events, both virtual and on-site, are emphasized.

Work Schedule: The role involves a standard work schedule, likely around 40 hours per week. However, DocuWare emphasizes flexible working hours, allowing employees to arrange their schedules to suit personal needs and optimize productivity, provided team collaboration and responsibilities are met.

📝 Enhancement Note: The hybrid nature of the work environment requires self-discipline and strong communication skills for remote collaboration, alongside an ability to engage effectively in the office for team-focused activities. The emphasis on flexibility suggests a results-oriented culture.

📄 Application & Portfolio Review Process

Interview Process:

• Initial Screening: A recruiter or hiring manager will review your application and resume, focusing on relevant design system experience and technical skills.

• Technical Interview(s): Expect in-depth technical discussions covering your experience with TypeScript, Angular, CSS/SCSS, design tokens, Figma, and CI/CD. This may include live coding exercises or deep dives into your portfolio projects.

• Design System Deep Dive: A session dedicated to your design system experience, focusing on your approach to token architecture, component development, automation strategies, and problem-solving methodologies. This is where your portfolio will be heavily referenced.

• Team/Cross-functional Interview: An opportunity to meet potential colleagues from design and engineering teams. This assesses cultural fit, collaboration style, and communication skills.

• Final Interview: Often with a senior leader, focusing on strategic thinking, long-term vision for the design system, and alignment with company values.

Portfolio Review Tips:

• Curate Selectively: Focus on 2-3 of your strongest, most relevant design system projects. Quality over quantity.

• Structure for Clarity: For each project, clearly outline the problem, your role, the solutions implemented (tokens, components, automation), the technologies used, and the measurable outcomes or impact.

• Demonstrate End-to-End Ownership: Highlight your involvement across the entire pipeline – from design interpretation to code implementation and testing.

• Showcase Automation & Tooling: Emphasize any custom scripts, tools, or AI-assisted workflows you've developed to improve efficiency and synchronization.

• Quantify Impact: Wherever possible, use metrics to demonstrate the success of your design system contributions (e.g., reduction in development time, increased consistency, adoption rates).

• Prepare to Discuss: Be ready to walk through your portfolio in detail, answer questions about your design decisions, technical choices, and problem-solving approaches.

Challenge Preparation:

• System Design Scenarios: Be prepared for hypothetical scenarios asking you to design a token architecture for a new feature, or how you would approach migrating a complex component.

• Code Review Exercises: You might be asked to review a piece of code or a component definition for adherence to design system principles.

• Figma API/Token Extraction Logic: Anticipate questions or small tasks related to programmatically extracting information from Figma or transforming tokens.

• CI/CD Pipeline Design: Discuss how you would set up a CI/CD pipeline for visual regression and accessibility testing.

📝 Enhancement Note: The interview process emphasizes a blend of technical proficiency, practical experience with design systems, and strong collaborative skills. A well-prepared portfolio that clearly articulates the candidate's impact and operational approach to design systems will be critical for success.

🛠 Tools & Technology Stack

Primary Tools:

• Design Tokens: Tokens Studio for Figma, W3C DTCG specifications, Style Dictionary.

• Component Libraries: Angular, Web Components (e.g., Lit), potentially custom frameworks.

• Design Software: Figma (expert-level fluency required, including API/plugin ecosystem).

Analytics & Reporting:

• CI/CD Tools: Jenkins, GitLab CI, GitHub Actions, Azure Pipelines, or similar for automated builds, testing, and deployments.

• Visual Regression Tools: Percy, Chromatic, Applitools, or similar integrated into CI.

• Accessibility Tools: Axe-core, Lighthouse, integrated into CI/CD or browser dev tools.

CRM & Automation:

• Version Control: Git (essential).

• Package Management: npm, Yarn for publishing to private feeds.

• Cloud Infrastructure: Azure (Static Web Apps, Container Apps, Blob Storage, Entra ID) is preferred, indicating experience with cloud-native development and deployment.

• AI/ML Tools: Potentially tools or libraries related to AI-assisted workflows for design-to-code.

📝 Enhancement Note: Proficiency in the specified tools, particularly Figma, design token methodologies, Angular, and CI/CD, is non-negotiable. Familiarity with Azure cloud services is a strong plus, indicating the company's technology direction.

👥 Team Culture & Values

Operations Values:

• Ownership & Accountability: Taking full responsibility for the design system's lifecycle, from conception to production delivery, and proactively addressing issues.

• Collaboration & Communication: Working effectively with diverse teams (design, engineering, DevOps), sharing knowledge openly, and providing clear, constructive feedback.

• Efficiency & Automation: Driving continuous improvement by automating repetitive tasks and optimizing workflows to maximize productivity and reduce manual effort.

• Quality & Consistency: Upholding high standards for visual fidelity, code quality, and accessibility across all components, ensuring a unified user experience.

• Innovation & Curiosity: Exploring new technologies and methodologies (like AI-assisted workflows) to enhance the design system and development processes.

Collaboration Style:

• Cross-functional Integration: Actively engaging with product designers to translate design vision into robust engineering solutions and collaborating closely with frontend developers to ensure seamless integration of components.

• Process-Oriented Feedback: Fostering a culture where constructive feedback on processes, components, and documentation is welcomed and acted upon.

• Knowledge Sharing: Proactively documenting best practices, architectural decisions, and system conventions to empower other teams and ensure maintainability.

📝 Enhancement Note: DocuWare emphasizes an open corporate culture and active participation. For this role, it means contributing to a team that values proactive problem-solving, continuous learning, and a shared commitment to building high-quality, scalable products through operational excellence.

⚡ Challenges & Growth Opportunities

Challenges:

• Balancing Design Fidelity and Engineering Constraints: Ensuring that design intent is accurately translated into code while respecting technical limitations and performance requirements.

• Managing Token Complexity: Dealing with intricate token hierarchies, naming conflicts, and ensuring semantic consistency across a large product suite.

• Driving Adoption: Encouraging and supporting product teams to adopt and correctly utilize the design system, overcoming resistance to change or integration hurdles.

• Maintaining Legacy Systems: Strategically migrating and modernizing components and tokens from older systems without disrupting ongoing development or introducing regressions.

• Keeping Pace with Technology: Continuously evaluating and integrating new tools, frameworks, and methodologies (like AI) to keep the design system cutting-edge and efficient.

Learning & Development Opportunities:

• Advanced Design System Architecture: Opportunities to delve deeper into advanced patterns for cross-platform design systems, theming, and accessibility.

• Cloud & DevOps Integration: Enhance skills in CI/CD, cloud infrastructure (Azure), and automation pipelines for robust system delivery.

• AI in Design & Development: Explore and implement AI-assisted workflows for tasks like token extraction, component generation, or code validation.

• Mentorship & Leadership: Potential to mentor junior engineers, lead design system initiatives, and influence product development strategy.

• Industry Conferences & Certifications: Access to relevant industry events and training to stay abreast of the latest trends in design systems, frontend development, and operations.

📝 Enhancement Note: The challenges in this role are significant but directly tied to opportunities for professional growth. Successfully navigating these will position the candidate as a highly valuable specialist in a critical area of product development operations.

💡 Interview Preparation

Strategy Questions:

• "Describe your approach to establishing and maintaining a design system as the single source of truth for tokens and components." (Focus on pipeline, automation, and governance.)

• "How would you reconcile a naming conflict between design tokens in Figma and the semantic variables in SCSS, ensuring consistency for developers?" (Highlight your process for conflict resolution and communication.)

• "Walk me through a time you had to migrate a significant set of components or tokens. What was your strategy, and what were the key challenges and outcomes?" (Emphasize phased rollouts, backward compatibility, and documentation.)

• "What metrics would you track to demonstrate the success and adoption of a design system?" (Discuss adoption rates, development speed improvements, consistency scores, reduction in design debt.) Company & Culture Questions:

• "How do you see a Design Systems Engineer contributing to DocuWare's goal of digitizing everyday work?" (Connect your role to product consistency, efficiency, and user experience.)

• "Describe your experience working in a hybrid or remote team environment. How do you ensure effective collaboration and communication?" (Highlight your proactive communication and use of collaboration tools.)

• "What are your thoughts on leveraging AI in design and engineering workflows? How might you explore this at DocuWare?" (Show your curiosity and willingness to experiment with new technologies.) Portfolio Presentation Strategy:

• Start with the "Why": Clearly articulate the problem or opportunity your design system project addressed.

• Detail Your Role and Process: Explain your specific contributions, the methodologies you employed, and the tools you used across the entire pipeline.

• Showcase Automation & Quality: Highlight the automation scripts, CI/CD integrations, and testing frameworks you implemented.

• Present Tangible Results: Use metrics and visual examples (screenshots, demos) to demonstrate the impact and benefits of your work.

• Be Ready for Deep Dives: Prepare to answer detailed questions about your technical decisions, trade-offs made, and how you handled challenges.

📝 Enhancement Note: Interviews for this role will heavily scrutinize practical application of design system principles, automation skills, and the ability to operate effectively at the intersection of design and engineering. A strong portfolio is essential for demonstrating these capabilities.

📌 Application Steps

To apply for this Design Systems Engineer position:

• Submit your application through the provided link on the DocuWare careers page.

• Tailor Your Resume: Ensure your resume clearly highlights your experience with design systems, TypeScript, Angular, CSS/SCSS, design tokens, Figma, and CI/CD. Quantify achievements where possible.

• Curate Your Portfolio: Select 2-3 of your most impactful design system projects. Prepare detailed case studies that showcase your end-to-end ownership, automation efforts, and measurable results. Be ready to present this during interviews.

• Prepare for Technical Deep Dives: Review common design system challenges, token architecture best practices, and modern frontend development concepts. Practice explaining your technical decisions and problem-solving approaches.

• Research DocuWare: Understand their product offerings, company culture, and values. Consider how your skills and experience can directly contribute to their mission and operational goals.

⚠️ 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.