Principal Design Engineer (AI & Design Systems)

TEKsystems
Full-time$156k-234k/year (USD)Berwyn, United States

📍 Job Overview

Job Title: Principal Design Engineer (AI & Design Systems)

Company: TEKsystems (One North)

Location: Chicago, Illinois, USA (Light Hybrid / Remote Open)

Job Type: FULL_TIME

Category: Design Engineering / Operations (AI & Design Systems)

Date Posted: July 27, 2026

Experience Level: 10+ years (Principal Level)

Remote Status: Light Hybrid (Chicago) / Fully Remote (USA)

🚀 Role Summary

  • This Principal Design Engineer role is pivotal in shaping the future of design-to-code pipelines by integrating Artificial Intelligence (AI) and advanced Design Systems methodologies.

  • The position requires a forward-thinking individual who can leverage AI as a primary creative and technical instrument to solve complex challenges in design systems and code generation.

  • A key responsibility involves building agentic workflows and AI-augmented tooling to automate and accelerate high-friction areas within the design system lifecycle.

  • This role demands expert-level proficiency in Figma, serving as a Subject Matter Expert (SME) to architect robust design systems and guide clients on platform optimization and future capabilities.

📝 Enhancement Note: This role blends deep technical engineering skills with cutting-edge AI capabilities and advanced design system architecture. It is positioned as a leadership role within the design and engineering practice, requiring a strategic mindset and the ability to influence both internal practices and client engagements. The emphasis on AI as a "first-class collaborator" indicates a proactive approach to innovation and automation.

📈 Primary Responsibilities

  • AI Integration & Development:

    • Partner with agency leadership to explore and integrate AI tools that meaningfully accelerate or improve design system work within design-to-code pipelines.
    • Build agentic workflows to automate component scaffolding, documentation generation, token logic, contract authoring, and quality assurance processes.
    • Develop and maintain advanced prompt engineering practices specifically for design system use cases, including structured prompting for component APIs, usage guidelines, and accessibility annotations.
    • Integrate Model Context Protocol (MCP) servers and LLM-powered tooling into design and development workflows, ensuring practicality, repeatability, and shareability.
    • Contribute to internal AI capability-building by documenting learnings, training teammates, and developing the agency's point of view on AI in design and engineering.
    • Apply AI tools fluidly in daily work for code generation, design exploration, documentation, and system scaffolding, pushing the boundaries of AI in a design systems context.
  • Figma Expertise & Design Systems Architecture:

    • Maintain expert-level command of Figma, staying current with its evolving platform, including AI features, Dev Mode capabilities, and third-party integrations.
    • Participate in Figma alpha and beta programs to evaluate new features, forming clear recommendations for client application readiness and fit.
    • Monitor and assess Figma product developments (releases, acquisitions, expansions) and lead internal evaluation, operationalization, and standardization processes.
    • Architect and maintain Figma-based design systems with the structural rigor of a production codebase, including variables, tokens, component properties, advanced auto layout, and the full token pipeline bridging Figma to code.
    • Advise clients on Figma tools and workflows that extend platform value, serving as a credible strategic resource on platform capabilities and future direction.
    • Maintain active engagement with Figma's broader ecosystem, including community programs and partner channels, to keep One North informed and well-positioned.
    • Act as a primary internal Figma SME, setting standards, advising on tool usage, and helping clients maximize their platform investment.
  • Technical Foundation & Collaboration:

    • Apply advanced proficiency in HTML, CSS, and JavaScript, focusing on clean, semantic, accessible markup and CSS architecture at scale.

    • Build and maintain design systems or component libraries in production environments.

    • Work with design tokens and associated tooling (e.g., Style Dictionary, Theo).

    • Utilize modern JavaScript frameworks (React, Vue, Svelte) in a component-driven context.

    • Communicate technical concepts effectively to designers and design concepts to engineers.

📝 Enhancement Note: The responsibilities highlight a dual focus on pioneering AI applications within design and engineering workflows and establishing best practices for design system architecture within Figma. The emphasis on "agentic workflows" and "MCP integration" suggests a need for candidates familiar with advanced AI orchestration and development patterns. The requirement for cross-functional communication is crucial for bridging the gap between design and engineering teams.

🎓 Skills & Qualifications

Education: While no specific degree is mandated, a strong academic foundation in Computer Science, Engineering, Design, or a related field, or equivalent practical experience, is expected for a Principal level role.

Experience: A minimum of 10+ years of progressive experience in design engineering, front-end development, or a related technical role, with a significant focus on design systems and AI integration.

Required Skills:

  • Expert-level Figma mastery: variables, tokens, advanced component architecture, interactive prototyping, Dev Mode, and plugin/API integrations.

  • Active, practiced use of AI tools in daily workflow: code generation, documentation, design exploration, or system authoring (e.g., Cursor, Claude, Copilot, v0).

  • Demonstrated experience building AI-powered tooling, agentic workflows, or LLM-assisted pipelines: prompt engineering, MCP integrations, or automated documentation and component generation.

  • Advanced proficiency in HTML, CSS, and JavaScript: clean, semantic, accessible markup; CSS architecture at scale.

  • Hands-on experience building and maintaining design systems or component libraries in production.

  • Strong working knowledge of design tokens and tooling (Style Dictionary, Theo, or similar).

  • Experience with at least one modern JS framework (React, Vue, Svelte) in a component-driven context.

  • Strong communication skills: ability to make technical concepts legible to designers and design concepts legible to engineers. Preferred Skills:

  • Agency or consultancy experience: working across multiple clients and project contexts simultaneously.

  • Familiarity with headless CMS architectures and their integration with design systems.

  • Exposure to design system tooling ecosystems (e.g., Storybook, Chromatic, Zeroheight, Supernova).

  • Experience with animation and motion tooling (e.g., GSAP, Framer Motion, CSS transitions at system scale).

  • Comfort in monorepos or multi-package architectures for distributed component libraries.

  • Formal or informal background in product design or UX.

📝 Enhancement Note: The "Must-Haves" clearly define the core competencies. The "Strong Pluses" indicate areas where candidates can differentiate themselves, particularly in agency experience, broader design system tooling, and animation. The emphasis on "AI tools in your daily workflow" suggests a preference for candidates who are already early adopters and practitioners of AI in their professional lives.

📊 Process & Systems Portfolio Requirements

Portfolio Essentials:

  • Demonstrations of expert-level Figma architecture, showcasing complex component structures, variable implementation, and tokenization strategies.

  • Examples of AI-augmented workflows or tools built, clearly illustrating the problem solved, the AI techniques employed, and the resulting efficiency gains or improvements.

  • Case studies of production-ready design systems and component libraries, detailing the build process, key architectural decisions, and ongoing maintenance.

  • Code samples or links to repositories showcasing advanced HTML, CSS, and JavaScript skills, particularly in the context of reusable components and accessible markup. Process Documentation:

  • Clear articulation of your personal process for integrating AI into design and engineering workflows, including prompt engineering strategies and tool selection criteria.

  • Documentation of your approach to architecting and scaling design systems, from initial token definition to component implementation and governance.

  • Examples of how you have collaborated with cross-functional teams (designers, engineers, product managers) to define and implement design system standards and AI tooling.

📝 Enhancement Note: For a Principal level role, especially one focused on AI and advanced systems, the portfolio is critical. It needs to showcase not just technical execution but also strategic thinking, innovation, and the ability to define and document processes. Candidates should be prepared to walk through their portfolio items and explain the "why" behind their technical and design decisions, particularly concerning AI integration.

💵 Compensation & Benefits

Salary Range: $156,000 - $234,000 per year.

Benefits:

  • Comprehensive Medical, Dental, and Vision insurance.

  • 401(k)/Roth retirement plan.

  • Basic and Supplemental Life & AD&D Insurance.

  • Short and Long-Term Disability coverage.

  • Health & Dependent Care Spending Accounts (HSA & DCFSA).

  • Transportation benefits.

  • Employee Assistance Program (EAP).

  • Tuition Assistance for professional development.

  • Generous Time Off/Leave policies, including PTO and Paid Family Leave.

Working Hours: Standard full-time employment, typically 40 hours per week. Flexibility may be expected given the nature of the role and potential client demands, especially with remote work options.

📝 Enhancement Note: The salary range is competitive for a Principal-level technical role in a major metropolitan area like Chicago, and especially for a specialized role involving AI and design systems. The benefits package is robust and comprehensive, typical of large service organizations like TEKsystems. The mention of "additional earnings may be available through incentive programs like annual bonuses, profit sharing" suggests potential for performance-based compensation beyond the base salary.

🎯 Team & Company Context

🏢 Company Culture

Industry: Digital Experience Agency (part of TEKsystems Global Services, a leading business and technology services provider). One North specializes in strategy, design, and technology implementation for digital experiences.

Company Size: TEKsystems Global Services is a large organization (80,000+ employees globally), operating with over 6,000 clients. One North functions as a specialized agency within this structure, likely maintaining a more boutique feel for its core teams.

Founded: TEKsystems was founded in 1983. One North's specific founding date isn't provided, but it operates as a well-established agency within TEKsystems.

Team Structure:

  • The Principal Design Engineer will likely be part of a multidisciplinary team comprising strategists, designers, and technologists.

  • This role will be a senior individual contributor, expected to lead technical initiatives within design systems and AI exploration.

  • Collaboration will be cross-functional, working closely with design leads, engineering managers, and client stakeholders.

  • The role reports within the agency's technical or design systems practice, likely under a Director or VP of Technology/Engineering. Methodology:

  • AI-Augmented Pipelines: Focus on identifying, testing, and integrating AI tools to accelerate the design-to-code process.

  • Agentic Workflows: Emphasis on creating automated processes that use AI agents to perform tasks within the design system lifecycle.

  • Figma as a Strategic Platform: Deep utilization and expertise in Figma for architecting, managing, and evolving design systems.

  • Data-Driven Design & Development: Using insights from AI and user data to inform design system evolution and implementation.

  • Agile & Iterative Development: Likely employing agile methodologies for project execution and continuous improvement.

Company Website: https://careers.teksystems.com/us/en (TEKsystems main careers site) and likely a dedicated One North site for agency-specific information.

📝 Enhancement Note: Understanding that One North is part of TEKsystems Global Services provides context on the scale and resources available. However, the role's focus on AI and design systems suggests a culture of innovation and forward-thinking, akin to a specialized tech consultancy or agency. The emphasis on "partners in transformation" and "activating ideas" highlights a proactive and client-focused approach.

📈 Career & Growth Analysis

Operations Career Level: Principal Design Engineer represents a senior individual contributor role, often the highest level of technical expertise within a specific domain before moving into management or a distinguished engineer track. This role is critical for setting technical direction, mentoring junior team members, and driving innovation.

Reporting Structure: This role typically reports to a Director or VP of Engineering/Technology within the agency. It will involve close collaboration with Design Directors, Product Managers, and client-side technical teams.

Operations Impact: The impact of this role is significant, directly influencing the efficiency, scalability, and quality of digital product development for clients. By leveraging AI and advanced design systems, the engineer will:

  • Reduce development time and costs.

  • Enhance consistency and quality across digital products.

  • Enable faster iteration and innovation for clients.

  • Establish new, more efficient ways of working for design and engineering teams.

  • Drive adoption of advanced technologies like AI within client engagements. Growth Opportunities:

  • Technical Specialization: Deepen expertise in AI, LLMs, agentic systems, and advanced Figma capabilities.

  • Leadership & Mentorship: Lead technical initiatives, mentor junior engineers and designers, and contribute to the agency's technical vision.

  • Client Strategy: Influence client digital transformation strategies through expertise in AI and design systems.

  • Thought Leadership: Contribute to industry best practices, speak at conferences, and publish articles on AI in design and development.

  • Potential for Management: Opportunity to move into engineering management or lead specialized AI/Design Systems teams if desired.

  • Exposure to Diverse Clients: Work with a variety of clients across different industries, providing broad project experience.

📝 Enhancement Note: The "Principal" title signifies a high level of autonomy and influence. Growth opportunities are geared towards deepening technical mastery and expanding strategic impact, rather than solely management track progression. The role is positioned as a key innovation driver for both TEKsystems/One North and their clients.

🌐 Work Environment

Office Type: The role is described as "light hybrid onsite/remote" for candidates in the Chicago area, suggesting a modern office space designed for collaboration and focused work, with flexible options. For remote candidates, the environment is fully remote.

Office Location(s): Primarily Chicago, IL, with full remote options available across the U.S.

Workspace Context:

  • Collaborative Environment: The Chicago office likely offers spaces that foster collaboration, workshops, and brainstorming sessions, essential for cross-functional teams.

  • Technology-Rich: Access to advanced tools, high-performance computing (potentially for AI model experimentation), and robust network infrastructure is expected.

  • Innovation Hub: The role is at the forefront of AI and design systems, implying an environment that encourages experimentation, learning, and pushing technological boundaries.

  • Remote Work Support: For remote employees, expectations include a commitment to asynchronous communication, digital collaboration tools, and maintaining team connection despite distance.

Work Schedule: While a standard 40-hour work week is typical, the nature of client-facing, advanced technology roles may necessitate flexibility to meet project deadlines or client availability, especially in a hybrid or remote setting.

📝 Enhancement Note: The hybrid/remote flexibility is a key aspect of the work environment. It suggests an organization that trusts its employees and focuses on outcomes and productivity, leveraging digital tools to maintain seamless operations and collaboration regardless of physical location.

📄 Application & Portfolio Review Process

Interview Process:

  • Initial Screening: Likely a recruiter or HR screen to assess basic qualifications, experience, and cultural fit.

  • Technical Assessment (Round 1): An interview with engineering or design leads focusing on core technical skills, AI experience, and Figma expertise. This may involve deep dives into past projects and problem-solving scenarios.

  • Portfolio Deep Dive: A dedicated session where candidates present their portfolio, explaining their most relevant projects, particularly those demonstrating AI integration, design system architecture, and engineering quality. Expect detailed questions about their process, decisions, and impact.

  • AI & Systems Strategy Discussion: A conversation focused on the candidate's vision for AI in design systems, their approach to agentic workflows, and their understanding of the evolving landscape of AI and design tools.

  • Cross-Functional/Client Simulation (Potentially): A session to assess communication skills, ability to translate technical concepts for different audiences, and how they would handle client-specific challenges.

  • Final Round: Meeting with senior leadership (e.g., VP of Engineering/Technology) to discuss strategic alignment, leadership potential, and final fit.

Portfolio Review Tips:

  • Curate Strategically: Select 2-3 projects that most strongly showcase your expertise in AI for design/development, advanced Figma architecture, and production-level design systems.

  • Tell a Story: For each project, clearly articulate the problem, your role, the solutions you implemented (especially AI and Figma), the technical challenges overcome, and the measurable impact or outcomes.

  • Highlight AI Integration: Be explicit about how AI was used – was it for code generation, documentation, design exploration, workflow automation, or prompt engineering? Detail the tools and techniques.

  • Showcase Figma Mastery: Demonstrate your command over Figma’s advanced features, including variables, tokens, component properties, and Dev Mode. Explain your architectural choices.

  • Quantify Impact: Wherever possible, use metrics to demonstrate success (e.g., reduction in development time, improvement in component adoption, increased efficiency).

  • Prepare for Technical Questions: Be ready to discuss your code quality, CSS architecture, JavaScript framework proficiency, and design token implementation details.

Challenge Preparation:

  • AI Prompt Engineering: Practice crafting effective prompts for design system tasks (e.g., generating component code, writing documentation, creating accessibility annotations).

  • Design System Architecture: Be prepared to discuss how you would architect a complex design system from scratch or scale an existing one, considering variables, tokens, and component library management.

  • Technical Problem Solving: Review common front-end development challenges and how you approach debugging and optimization.

  • Communication Scenarios: Practice explaining complex technical concepts (AI, design systems) to non-technical stakeholders.

📝 Enhancement Note: The interview process emphasizes practical application, strategic thinking, and communication. The portfolio review is central, and candidates must be prepared to defend their technical and strategic choices, particularly regarding AI integration and advanced Figma usage. The "AI & Systems Strategy Discussion" is a key differentiator for candidates.

🛠 Tools & Technology Stack

Primary Tools:

  • Figma: Expert-level command is essential. This includes advanced features like variables, tokens, component properties, auto layout, Dev Mode, and plugin/API integrations.

  • AI Development Tools:

    • LLMs: Claude, GPT-4, or similar.
    • Code Generation/Assisted Tools: Cursor, GitHub Copilot, v0.
    • Prompt Engineering Frameworks/Tools: Not explicitly mentioned, but understanding structured prompting is key.
    • MCP (Model Context Protocol) Servers: Integration experience is a plus.
  • Front-end Development Languages: HTML, CSS (with advanced architecture understanding), JavaScript.

  • JavaScript Frameworks: React, Vue, Svelte (experience with at least one is required).

Analytics & Reporting:

  • Design System Tooling: Experience with tools like Style Dictionary, Theo for design tokens.

  • Design System Documentation Platforms: Familiarity with Storybook, Chromatic, Zeroheight, Supernova would be beneficial.

CRM & Automation:

  • Version Control: Git is standard.

  • Package Management: npm, Yarn.

  • Monorepo Tools: Potentially Nx, Lerna, or similar if working with distributed libraries.

  • Headless CMS Architectures: Understanding integration points.

📝 Enhancement Note: The technology stack is heavily weighted towards Figma and a broad range of AI tools, alongside core front-end development technologies. Proficiency in these areas, especially the ability to integrate AI into existing design and development workflows, is paramount. The mention of MCP servers suggests a forward-leaning approach to AI interoperability.

👥 Team Culture & Values

Operations Values:

  • Innovation & Curiosity: A drive to explore new technologies like AI and apply them creatively to solve problems.

  • Excellence & Quality: Commitment to building robust, scalable, and well-architected design systems and code.

  • Collaboration & Partnership: Strong emphasis on working effectively with cross-functional teams and clients.

  • Data-Driven Approach: Utilizing data and insights (often amplified by AI) to inform decisions and measure impact.

  • Efficiency & Automation: A focus on streamlining processes and leveraging technology to improve productivity.

  • Client Focus: Dedication to delivering high-value digital experiences that drive business results for clients.

Collaboration Style:

  • Cross-Functional Integration: Seamless collaboration between design, engineering, strategy, and client teams.

  • Knowledge Sharing: Actively sharing learnings, best practices, and insights, especially regarding AI and design systems, through documentation, training, and open discussion.

  • Iterative Feedback: A culture that encourages constructive feedback loops to continuously improve processes and outputs.

  • Proactive Communication: Utilizing digital tools to maintain clear and consistent communication, especially in hybrid/remote settings.

📝 Enhancement Note: The culture appears to be a blend of a large, established tech services firm (TEKsystems) with the innovative, client-centric, and fast-paced nature of a digital experience agency (One North). The role itself embodies values of technical leadership, continuous learning, and driving digital transformation.

⚡ Challenges & Growth Opportunities

Challenges:

  • Rapidly Evolving AI Landscape: Keeping pace with the constant advancements in AI tools and techniques, and identifying which are truly impactful for design systems.

  • Integrating AI into Legacy Workflows: Helping clients and internal teams adopt new AI-powered processes which may require significant change management.

  • Balancing Innovation with Practicality: Demonstrating the tangible ROI of AI investments and ensuring practical implementation rather than theoretical exploration.

  • Figma Platform Evolution: Adapting quickly to new Figma features and ensuring design systems remain compatible and leverage the latest capabilities.

  • Cross-Disciplinary Communication: Effectively bridging the gap between highly technical AI concepts, sophisticated design principles, and client business objectives.

Learning & Development Opportunities:

  • AI Specialization: Opportunities to become a leading expert in applying AI to design and development workflows.

  • Cutting-Edge Technology: Direct exposure to and hands-on experience with the latest AI and design technologies.

  • Client Impact: The chance to shape significant digital transformations for major clients.

  • Industry Recognition: Potential to become a thought leader through contributions to the field, speaking engagements, and publications.

  • Formal Training & Certifications: Access to professional development resources through TEKsystems.

📝 Enhancement Note: The challenges are directly tied to the innovative nature of the role. Success will require a proactive approach to learning and adaptation. The growth opportunities are significant for individuals looking to be at the forefront of AI and design system advancements.

💡 Interview Preparation

Strategy Questions:

  • "How would you define and build an agentic workflow for automating component documentation within a design system using AI?"

  • "Describe your process for evaluating and integrating a new AI feature from Figma into an existing client's design system."

  • "Walk us through a complex design system you've architected in Figma. What were the key decisions regarding tokens, variables, and component structure, and why?"

  • "How do you ensure accessibility and semantic correctness when using AI for code generation?"

  • "What is your strategy for staying ahead of the curve in both AI development and design system best practices?" Company & Culture Questions:

  • "How do you see AI fundamentally changing the role of the design engineer in the next 3-5 years?"

  • "Describe a time you had to influence a team or client to adopt a new technology or process. How did you approach it?"

  • "How do you balance the need for rapid innovation with delivering reliable, production-ready solutions for clients?"

  • "What excites you most about One North's approach to design and technology?" Portfolio Presentation Strategy:

  • Structure Your Narrative: For each project, lead with the business problem or user need, followed by your strategic approach, the technical solutions (highlighting AI and Figma), the challenges, and the measurable outcomes.

  • Show, Don't Just Tell: Use live demos or well-annotated screenshots/videos to illustrate your work, especially for interactive Figma elements or AI tool outputs.

  • Be Prepared for Deep Dives: Anticipate detailed questions about your code, architectural decisions, AI implementation specifics, and your rationale behind every choice.

  • Emphasize Collaboration: Explain how you worked with designers, other engineers, and stakeholders.

  • Connect to the Role: Frame your experience and portfolio items in the context of the Principal Design Engineer (AI & Design Systems) role and One North's mission.

📝 Enhancement Note: Interview preparation should focus on articulating a clear vision for the intersection of AI, design systems, and engineering. Candidates must be able to demonstrate both deep technical expertise and strategic thinking, with a strong emphasis on practical application and demonstrable results.

📌 Application Steps

To apply for this operations position:

  • Submit your application through the TEKsystems careers portal.

  • Tailor Your Resume: Highlight experience with AI tools, prompt engineering, advanced Figma capabilities, design systems, and modern JavaScript frameworks. Quantify achievements wherever possible.

  • Curate Your Portfolio: Select your strongest projects that showcase your capabilities in AI-driven development, Figma architecture, and production-ready design systems. Ensure clear explanations of your process and impact.

  • Prepare for Technical Discussions: Brush up on HTML, CSS, JavaScript, React/Vue/Svelte, design token principles, and AI concepts relevant to design and development. Practice articulating your thought process.

  • Research One North & TEKsystems: Understand their mission, values, and recent work to articulate your fit and interest during interviews. Focus on their digital experience and technology services offerings.

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

Application Requirements

Requires expert-level Figma mastery and demonstrated experience building AI-powered tooling and LLM-assisted pipelines. Candidates must be proficient in modern JavaScript frameworks and have a proven track record of maintaining production-level design systems.