Principal Design Engineer (AI & Design Systems)
📍 Job Overview
Job Title: Principal Design Engineer (AI & Design Systems)
Company: TEKsystems (One North)
Location: Chicago, Illinois, USA (Light Hybrid Onsite/Remote) / Remote across the U.S.
Job Type: FULL_TIME
Category: Design Engineering / AI / Design Systems
Date Posted: 2026-08-10
Experience Level: 10+ years
🚀 Role Summary
-
Drive innovation by integrating Artificial Intelligence (AI) into design-to-code pipelines and design systems.
-
Architect and maintain advanced Figma-based design systems, leveraging expert-level platform capabilities.
-
Develop and implement agentic workflows and LLM-powered tooling to automate high-friction design system lifecycle tasks.
-
Serve as a subject matter expert for Figma, guiding internal teams and clients on platform best practices and future developments.
-
Collaborate with leadership to define and execute the agency's AI strategy within design and development processes.
📝 Enhancement Note: This role is positioned at a Principal level, indicating a need for strategic thinking, leadership in emerging technologies (AI), and deep technical expertise in design systems and Figma. The hybrid/remote flexibility suggests a focus on outcomes and impact rather than strict location adherence. The integration of "One North" (a digital experience agency within TEKsystems) highlights a client-facing or consulting aspect to the role, requiring strong communication and advisory skills.
📈 Primary Responsibilities
-
Partner with agency leadership to identify, test, and integrate AI tools that accelerate or enhance design system work.
-
Build agentic workflows for automating component scaffolding, documentation generation, token logic, contract authoring, and QA within design systems.
-
Develop and refine prompt engineering practices 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 practical, repeatable, and shareable design and development workflows.
-
Contribute to internal AI capability building through documentation, training, and developing the agency's point of view on AI in design craft.
-
Apply AI tools fluidly in daily work for code generation, design exploration, documentation, and system scaffolding, pushing the boundaries of their application in design systems.
-
Architect and maintain Figma-based design systems with the rigor of a production codebase, focusing on variables, tokens, component properties, advanced auto layout, and token-to-code pipelines.
-
Advise clients on Figma tools and workflows to maximize their platform investment and stay ahead of future developments.
-
Monitor and assess Figma product developments (new releases, acquisitions, platform expansions) and lead the evaluation and operationalization of new capabilities.
-
Stay current with Figma's evolving platform, including AI features and Dev Mode capabilities, and bring this knowledge back to the team.
-
Participate in Figma alpha and beta programs to evaluate new features and form recommendations for client application.
-
Maintain active engagement with Figma's ecosystem, including community programs and partner channels, to keep One North informed and well-positioned.
-
Act as an internal Figma Subject Matter Expert (SME), setting standards, advising on tool usage, and helping clients maximize platform value.
📝 Enhancement Note: The responsibilities are heavily skewed towards advanced application of AI in design systems and deep expertise in Figma. The emphasis on "agentic workflows," "MCP integrations," and "prompt engineering" points to a highly specialized and forward-thinking role, requiring hands-on development and strategic consultation. The dual focus on AI and Figma suggests a need for a candidate who bridges the gap between cutting-edge AI capabilities and practical design system implementation.
🎓 Skills & Qualifications
Education: Not explicitly stated, but a strong technical background is implied.
Experience: 10+ years of experience, with a significant portion focused on design systems, engineering, and AI integration.
Required Skills:
-
Expert-level Figma mastery: variables, tokens, advanced component architecture, interactive prototyping, Dev Mode, plugin/API integrations.
-
Active, practiced use of AI tools in daily workflow (e.g., Cursor, Claude, Copilot, v0) for code generation, documentation, design exploration, or system authoring.
-
Demonstrated experience building AI-powered tooling, agentic workflows, or LLM-assisted pipelines (prompt engineering, MCP integrations, automated documentation, 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 environments.
-
Strong working knowledge of design tokens and tooling (e.g., Style Dictionary, Theo, or similar).
-
Experience with at least one modern JS framework (React, Vue, Svelte) in a component-driven context.
-
Strong communication skills, with the ability to translate technical concepts between designers and engineers.
-
A portfolio or work samples demonstrating both engineering quality and design sensibility. Preferred Skills:
-
Agency or consultancy experience, with the ability to manage multiple clients and projects concurrently.
-
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 working 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 a highly specialized skillset. The emphasis on "active, practiced use of AI tools" and "demonstrated experience building AI-powered tooling" suggests that practical application and a proactive approach to AI are paramount, not just theoretical knowledge. The portfolio requirement is crucial for showcasing this blend of engineering, design, and AI proficiency.
📊 Process & Systems Portfolio Requirements
Portfolio Essentials:
-
Showcase practical applications of AI in design system development and code generation.
-
Demonstrate expertise in Figma architecture, including advanced component structures, variables, and token implementation.
-
Provide examples of production-ready design systems or component libraries, highlighting maintainability and scalability.
-
Include case studies detailing the development of agentic workflows or LLM-assisted pipelines, emphasizing efficiency gains and problem-solving.
-
Illustrate proficiency in translating design tokens to code and integrating with development frameworks (React, Vue, Svelte).
-
Present examples of clean, semantic, and accessible HTML, CSS, and JavaScript code. Process Documentation:
-
Detail the process for identifying, testing, and integrating new AI tools into design-to-code pipelines.
-
Document the methodology for architecting and maintaining Figma-based design systems, including version control and collaboration strategies.
-
Explain the approach to developing and refining prompt engineering practices for specific design system use cases.
-
Outline the steps for integrating MCP servers and LLM-powered tooling into practical workflows.
-
Showcase the process for internal AI capability building, including knowledge sharing and team training initiatives.
📝 Enhancement Note: The portfolio requirements are critical for this role, needing to provide tangible proof of advanced AI application within design systems and expert-level Figma skills. Candidates should prepare to walk through specific projects demonstrating their ability to not only use these tools but also to build and innovate with them, showcasing the "how" and the "why" behind their technical decisions.
💵 Compensation & Benefits
Salary Range: $156,000 - $234,000 per year.
Benefits:
-
Medical, dental, and vision insurance.
-
401(k)/Roth retirement plan.
-
Basic and supplemental life insurance, and Accidental Death & Dismemberment (AD&D) insurance.
-
Short-term and long-term disability coverage.
-
Health Savings Account (HSA) and Dependent Care Spending Account (DCFSA).
-
Transportation benefits.
-
Employee Assistance Program (EAP).
-
Tuition assistance for professional development.
-
Paid Time Off (PTO) and Paid Family Leave.
Working Hours: Approximately 40 hours per week, with flexibility implied by the hybrid/remote work arrangement.
📝 Enhancement Note: The salary range provided is for the Chicago area, which is a major tech hub. For remote candidates in other US locations, this range is likely to be a benchmark, though regional cost-of-living adjustments might apply. The benefits package is comprehensive, offering strong support for employee well-being and professional growth, which is competitive for senior-level roles in the tech industry.
🎯 Team & Company Context
🏢 Company Culture
Industry: Technology Services, Digital Experience Agency (One North within TEKsystems). One North specializes in strategy, design, and technology implementation for digital experiences, leveraging AI and advanced design systems. TEKsystems, as a broader entity, is a leader in full-stack technology services, talent services, and application development.
Company Size: TEKsystems is a large organization (80,000+ employees globally, working with over 6,000 clients). One North, as a specialized agency within TEKsystems, likely operates with more agility and a focused team structure, but benefits from the scale and resources of its parent company.
Founded: TEKsystems was founded in 1994. One North's specific founding date is not provided, but its integration within TEKsystems implies a strong, established operational framework.
Team Structure:
-
The Principal Design Engineer will likely be part of a specialized design systems or engineering team within One North.
-
This team will collaborate closely with strategists, UX/UI designers, and front-end developers across various client projects.
-
The role reports into agency leadership, with a strong emphasis on influencing AI exploration and design-to-code strategies.
-
Cross-functional collaboration is key, bridging the gap between design intent and engineering execution, with a significant AI component. Methodology:
-
Data-driven decision-making, leveraging AI and analytics to inform design system development and process optimization.
-
Agile and iterative development practices, with a focus on rapid prototyping and testing of AI-augmented workflows.
-
Emphasis on a "design-to-code" pipeline, ensuring seamless integration and efficiency from concept to production.
-
Collaborative problem-solving, encouraging open communication between design and engineering disciplines.
-
Continuous learning and exploration of emerging technologies, particularly AI, to maintain a forward-leaning practice.
Company Website: https://careers.teksystems.com/us/en
📝 Enhancement Note: The context of One North being a digital experience agency within TEKsystems is crucial. This role isn't just about internal tooling but about shaping client solutions and offering advanced capabilities. The emphasis on "partners in transformation" and "activating ideas and solutions" suggests a client-centric and innovative culture.
📈 Career & Growth Analysis
Operations Career Level: Principal Design Engineer (AI & Design Systems) – This is a senior, highly specialized individual contributor role. It signifies deep expertise, strategic influence, and the ability to pioneer new approaches. It's a role that often leads to technical architect positions, specialized AI/ML roles within design, or leadership in emerging technology practices.
Reporting Structure: Likely reports to a Director of Engineering, Head of Design Systems, or a similar senior leadership role within One North. The role has significant autonomy and influence on strategic direction, especially concerning AI adoption.
Operations Impact: This role directly impacts the efficiency and innovation of the design-to-code process. By leveraging AI and advanced design systems, the Principal Design Engineer can significantly reduce development cycles, improve design consistency, enhance scalability, and unlock new creative possibilities for both internal teams and clients. The impact is measured in time saved, quality improvements, and the successful delivery of cutting-edge digital experiences.
Growth Opportunities:
-
Technical Specialization: Deepen expertise in AI for design, advanced Figma capabilities, and specific front-end frameworks. Opportunity to become a recognized authority in AI-driven design systems.
-
Leadership & Mentorship: Lead AI initiatives, mentor junior engineers and designers, and contribute to setting technical standards and best practices across the agency.
-
Strategic Influence: Shape the future of One North's AI and design system offerings, influencing client engagements and agency-wide technology adoption.
-
Cross-functional Exposure: Gain experience working with a diverse range of clients and project types, understanding different business challenges and how advanced design systems and AI can solve them.
-
Innovation & Research: Drive R&D efforts in AI for design, potentially leading to patents, publications, or new service offerings.
📝 Enhancement Note: The "Principal" title implies a significant level of autonomy and influence. Growth is likely to be focused on deepening technical mastery, strategic impact, and potentially informal or formal leadership in emerging tech areas, rather than traditional hierarchical advancement.
🌐 Work Environment
Office Type: Light hybrid onsite/remote work model for the Chicago area. For remote candidates across the U.S., it will be fully remote. This suggests a focus on asynchronous communication and digital collaboration tools.
Office Location(s): Chicago, Illinois, USA (for hybrid). Open to remote locations across the U.S.
Workspace Context:
-
Collaborative Environment: While hybrid/remote, expect a strong emphasis on digital collaboration tools (Slack, Teams, video conferencing) to foster interaction with colleagues and clients.
-
Operations Tools & Technology: Access to cutting-edge AI tools, Figma, development environments, and project management software will be essential. The agency likely invests in robust technology infrastructure.
-
Team Interaction: Opportunities for virtual team meetings, design critiques, code reviews, and knowledge-sharing sessions will be frequent. For Chicago-based employees, occasional in-person collaboration will be possible.
Work Schedule: Standard full-time hours (approx. 40 hours/week), with potential for flexibility given the remote nature and focus on output. The nature of client work might occasionally require adjustments to accommodate project deadlines or global client needs.
📝 Enhancement Note: The "light hybrid" aspect for Chicago implies that remote work is the primary mode for most, with occasional office visits for specific team events or client meetings. For remote employees, strong self-management and communication skills are paramount.
📄 Application & Portfolio Review Process
Interview Process:
-
Initial Screening: HR or recruiter call to assess basic qualifications, interest, and cultural fit.
-
Technical Interview 1 (AI & Design Systems): Deep dive into AI experience, prompt engineering, agentic workflows, and design system architecture. Expect scenario-based questions and discussions about past projects.
-
Technical Interview 2 (Figma & Engineering): Focus on expert-level Figma proficiency, front-end development skills (HTML, CSS, JS, frameworks), and design token implementation. May involve live coding or problem-solving exercises.
-
Portfolio Review: Dedicated session to present and discuss selected portfolio pieces, demonstrating AI applications, Figma mastery, and engineering quality. This is a critical stage.
-
Cross-functional/Leadership Interview: Discussion with senior leadership or team leads about strategic thinking, client consultation skills, and how the candidate aligns with One North's culture and vision.
-
Final Offer: Contingent on background checks and reference checks.
Portfolio Review Tips:
-
Curate Strategically: Select 3-5 of your strongest projects that best showcase your AI application in design systems, Figma expertise, and engineering capabilities.
-
Tell a Story: For each project, clearly articulate the problem, your approach (emphasizing AI and Figma), the technical solutions you implemented, and the measurable impact or outcomes.
-
Highlight AI Integration: Explicitly detail how you used AI tools (e.g., prompt engineering, agentic workflows) and the benefits achieved (e.g., efficiency, innovation, quality).
-
Demonstrate Figma Depth: Showcase complex Figma architecture, variable usage, token implementation, and any custom plugins or integrations.
-
Code Examples: Be prepared to discuss or show snippets of your production code (HTML, CSS, JS, framework components) to illustrate quality and best practices.
-
Quantify Impact: Whenever possible, use metrics to demonstrate the value of your work (e.g., reduction in development time, increase in component reusability, improved design consistency).
Challenge Preparation:
-
AI Prompting Exercise: Be ready to craft prompts for specific design system tasks (e.g., generating component documentation, scaffolding a new component based on specs).
-
Figma Problem-Solving: Expect scenarios involving complex component structuring, variable setup, or optimizing a design system within Figma.
-
System Design Scenario: You might be asked to outline a strategy for implementing an AI-augmented design system for a hypothetical client.
-
Code Challenge: A small coding task focused on HTML, CSS, or JavaScript, potentially related to component development or design token implementation.
📝 Enhancement Note: The interview process is designed to rigorously assess both deep technical skills and strategic application, particularly in the emerging field of AI for design. The portfolio review is paramount, requiring candidates to not just list skills but to demonstrate their practical application and impact.
🛠 Tools & Technology Stack
Primary Tools:
-
Figma: Expert-level proficiency required for design system architecture, component creation, variables, tokens, and Dev Mode.
-
AI/LLM Tools: Practical experience with tools like Cursor, Claude, Copilot, v0, or similar for code generation, design exploration, documentation, and system authoring.
-
Development Environments: Standard IDEs (e.g., VS Code), version control (Git, GitHub/GitLab/Bitbucket).
Analytics & Reporting:
-
Figma Analytics/Dev Mode: Leveraging Figma's built-in features for design system insights and developer handoff.
-
Potentially: Tools for tracking component usage, design system adoption metrics, and performance metrics for AI-generated code.
CRM & Automation:
-
Not directly applicable: This role is engineering/design focused, not sales/marketing ops. However, understanding how design systems integrate with content management systems (CMS) or other client platforms is beneficial.
-
Workflow Automation: Experience with building automated workflows using AI and scripting.
Design Token Tooling:
-
Style Dictionary, Theo, or similar tools for managing and transforming design tokens from source to various code formats. Front-End Frameworks:
-
React, Vue, or Svelte for component-driven development. Other Potential Tools:
-
Storybook, Chromatic, Zeroheight, Supernova (for design system documentation and development).
-
GSAP, Framer Motion (for animation).
-
Headless CMS platforms.
-
Monorepo management tools.
📝 Enhancement Note: The technology stack is heavily weighted towards Figma and AI development tools, alongside core front-end engineering technologies. Proficiency in these areas is non-negotiable.
👥 Team Culture & Values
Operations Values:
-
Innovation & Exploration: A culture that encourages pushing boundaries, experimenting with new technologies like AI, and defining future practices.
-
Collaboration & Partnership: Strong emphasis on working effectively across disciplines (design, engineering, strategy) and partnering with clients to achieve shared goals.
-
Excellence & Quality: Commitment to delivering high-quality, robust, and scalable solutions, with a meticulous approach to design systems and code.
-
Curiosity & Agility: A drive to understand complex problems, remain adaptable, and respond effectively to evolving client needs and technological advancements.
-
Impact-Driven: Focus on delivering tangible business outcomes and measurable results through strategic design and technology implementation.
Collaboration Style:
-
Cross-functional Integration: Seamless collaboration between designers, engineers, and strategists, fostering mutual understanding and shared ownership.
-
Open Communication: Encouraging direct and honest feedback, with a willingness to discuss technical trade-offs and design decisions openly.
-
Knowledge Sharing: Proactive sharing of insights, best practices, and learnings, particularly around AI and design systems, through internal sessions, documentation, and mentorship.
-
Process Improvement Culture: A continuous drive to identify inefficiencies and opportunities for optimization in workflows, tools, and methodologies.
📝 Enhancement Note: The culture emphasizes innovation, particularly with AI, and a strong collaborative spirit essential for bridging design and engineering. The "boutique solutions" approach for "complex problems" suggests a high-value, consultative environment.
⚡ Challenges & Growth Opportunities
Challenges:
-
Pioneering AI in Design: Navigating the rapidly evolving landscape of AI tools and methodologies, and finding practical, repeatable applications for design systems.
-
Bridging Design & Engineering Gaps: Effectively translating complex AI capabilities and sophisticated design system concepts to diverse stakeholders.
-
Maintaining Figma Expertise: Keeping pace with Figma's rapid feature development and integrating new capabilities strategically.
-
Scalability of AI Solutions: Ensuring AI-generated code and workflows are robust, maintainable, and scalable for production environments.
-
Client Adoption: Guiding clients to understand and adopt new AI-augmented workflows and advanced design system practices.
Learning & Development Opportunities:
-
AI Specialization: Opportunities to lead AI research and development for design systems, potentially attending AI conferences or pursuing specialized AI certifications.
-
Figma Ecosystem Mastery: Deepening understanding of Figma's API, plugins, and community contributions.
-
Advanced Front-End Techniques: Exploring new frameworks, performance optimization, and complex state management.
-
Technical Leadership: Mentoring junior team members, contributing to architectural decisions, and potentially leading technical initiatives.
-
Consulting Skills: Developing client-facing advisory skills and strategic problem-solving capabilities.
📝 Enhancement Note: The primary challenges revolve around the cutting-edge nature of AI integration and the need for continuous learning in a fast-paced tech environment. Growth is geared towards becoming a thought leader and expert in this niche.
💡 Interview Preparation
Strategy Questions:
-
"Describe a time you used AI to significantly improve a design system process. What was the challenge, your approach, and the outcome?" (Focus on demonstrating AI application, process improvement, and quantifiable results).
-
"How would you architect a Figma-based design system for a large enterprise client that needs to scale across multiple product teams and platforms, incorporating AI-driven component generation?" (Assess strategic thinking, architectural rigor, and AI integration).
-
"Imagine a client is hesitant to adopt AI in their design workflow. How would you pitch the benefits and address their concerns, providing concrete examples of its value?" (Evaluate communication, persuasion, and client management skills). Company & Culture Questions:
-
"What excites you most about One North's approach to digital experiences and our focus on AI?" (Demonstrate research into the company and genuine interest).
-
"How do you typically collaborate with designers and engineers on complex projects, especially when introducing new technologies like AI?" (Assess teamwork, communication, and cross-functional collaboration style).
-
"How do you stay current with the latest advancements in AI, design systems, and front-end technologies?" (Showcase commitment to continuous learning and industry awareness). Portfolio Presentation Strategy:
-
Structure for Impact: Begin with a high-level overview of your role and the project's goals. Then, dive into the specific challenges, your innovative solutions (emphasizing AI and Figma), the technical implementation details, and conclude with the results and lessons learned.
-
Visual Storytelling: Use clear visuals (screenshots, diagrams, short demos) to illustrate your work. For AI projects, show the input (prompts, data) and the output (code, documentation).
-
Technical Depth & Clarity: Be prepared to discuss the nuances of your engineering choices, Figma architecture decisions, and AI prompt strategies. Explain complex topics clearly and concisely.
-
Focus on Value: Continuously tie your technical contributions back to business value, client success, and process efficiency.
📝 Enhancement Note: Preparation should heavily focus on being able to articulate the practical application of AI in design systems and demonstrate deep Figma expertise through specific project examples. Candidates should be ready to discuss their "why" and "how" for each technical decision.
📌 Application Steps
To apply for this Principal Design Engineer (AI & Design Systems) position:
-
Submit your application through the TEKsystems careers portal via the provided URL.
-
Portfolio Customization: Tailor your resume and portfolio to prominently feature your experience with AI in design systems, expert-level Figma skills, and production-level engineering. Highlight projects that specifically demonstrate agentic workflows, prompt engineering, and advanced Figma architecture.
-
Resume Optimization: Ensure your resume clearly outlines your 10+ years of experience, focusing on achievements and quantifiable results related to design systems, AI integration, and front-end development. Use keywords from the job description naturally.
-
Interview Preparation: Practice articulating your experience with AI tools and Figma through STAR method (Situation, Task, Action, Result) stories. Prepare to walk through your portfolio with confidence, explaining your technical decisions and their impact.
-
Company Research: Familiarize yourself with One North's work, TEKsystems' broader offerings, and their stated values. Understand their approach to digital experiences and AI.
⚠️ 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
Candidates must possess expert-level Figma mastery and demonstrated experience building AI-powered tooling or LLM-assisted pipelines. Strong proficiency in HTML, CSS, JavaScript, and experience maintaining design systems in production are also required.