Principal Design Engineer (AI & Design Systems)
📍 Job Overview
Job Title: Principal Design Engineer (AI & Design Systems)
Company: TEKsystems (One North Digital Experience Agency)
Location: Chicago, Illinois (Hybrid Onsite/Remote); Remote within the U.S. considered
Job Type: Full-Time
Category: Design Systems Engineering / AI Integration
Date Posted: July 19, 2026
Experience Level: 10+ Years
Remote Status: Hybrid/Remote OK
🚀 Role Summary
-
Drive innovation by architecting and implementing AI-augmented design-to-code pipelines, leveraging artificial intelligence as a primary creative and technical instrument.
-
Lead the development of agentic workflows to automate high-friction aspects of the design system lifecycle, including component scaffolding, documentation generation, and QA processes.
-
Serve as a Subject Matter Expert (SME) for Figma, architecting sophisticated design systems and advising clients on maximizing platform capabilities and future developments.
-
Integrate LLM-powered tooling and Model Context Protocol (MCP) servers into practical, repeatable, and shareable design and development workflows.
-
Foster internal AI capability-building through documentation, training, and the development of the agency's point of view on AI in design and engineering.
📝 Enhancement Note: This role is positioned at a Principal level, indicating significant autonomy, strategic influence, and the expectation to set technical direction and mentor others. The focus on AI and Design Systems suggests a highly specialized and forward-thinking position within a digital experience agency.
📈 Primary Responsibilities
-
Partner with agency leadership to identify, test, and integrate AI tools that accelerate or enhance design system work.
-
Build and maintain prompt engineering practices tailored for design system use cases, including structured prompting for component APIs, usage guidelines, and accessibility annotations.
-
Design and implement agentic workflows for automating tasks such as component scaffolding, documentation generation, token logic, contract authoring, and quality assurance.
-
Integrate MCP servers and LLM-powered tooling into design and development workflows, ensuring practicality, repeatability, and shareability.
-
Contribute to internal AI capability development by documenting learnings, training teammates, and shaping the agency's perspective on AI in design and engineering.
-
Apply AI tools across daily work, including 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 production-grade structural rigor, including variables, tokens, component properties, advanced auto layout, and token pipelines bridging Figma to code.
-
Stay current with Figma's evolving platform, including AI features and Dev Mode capabilities, and evaluate new features for client application readiness.
-
Monitor and assess Figma product developments, leading internal processes for evaluating and operationalizing relevant new capabilities.
-
Advise clients on Figma tools and workflows to extend platform value, acting as a credible strategic resource.
-
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 SME, setting standards, advising on tool usage, and helping clients optimize their use of the platform.
📝 Enhancement Note: The responsibilities clearly delineate a dual focus on cutting-edge AI integration and deep expertise in Figma for design systems. The emphasis on both building internal capabilities and client-facing consulting highlights the strategic importance of this role.
🎓 Skills & Qualifications
Education: While no specific degree is mandated, a strong foundational understanding of computer science principles is expected, often gained through a Bachelor's degree in Computer Science, Engineering, or a related field, or through equivalent practical experience.
Experience: A minimum of 10 years of progressive experience in engineering, with a significant focus on design systems, front-end development, and practical application of AI in technical workflows. Agency or consultancy experience is highly valued.
Required Skills:
-
Expert-level Figma mastery, including variables, tokens, advanced component architecture, interactive prototyping, Dev Mode, and plugin/API integrations.
-
Active, practiced use of AI tools in daily workflows (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, including prompt engineering and MCP integrations.
-
Advanced proficiency in HTML, CSS, and JavaScript, with a focus on clean, semantic, accessible markup and CSS architecture at scale.
-
Hands-on experience building and maintaining production-level design systems or component libraries.
-
Strong working knowledge of design token tooling (e.g., Style Dictionary, Theo).
-
Experience with at least one modern JavaScript framework (React, Vue, Svelte) within a component-driven development context.
-
A portfolio or work examples demonstrating both engineering quality and design sensibility.
-
Strong communication skills, capable of translating technical concepts for designers and design concepts for engineers. 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 such as Storybook, Chromatic, Zeroheight, or Supernova.
-
Experience with animation and motion tooling (e.g., GSAP, Framer Motion) at a system scale.
-
Comfort with monorepos or multi-package architectures for distributed component libraries.
-
Formal or informal background in product design or UX.
📝 Enhancement Note: The "10+" years of experience requirement, coupled with the "Principal" title, signifies a senior-level role demanding deep expertise and leadership capabilities. The "Must-Haves" list is extensive and technical, underscoring the need for a candidate who is both a practitioner and an innovator.
📊 Process & Systems Portfolio Requirements
Portfolio Essentials:
-
Showcase of production-ready design systems built from the ground up, detailing architectural decisions, token strategies, and component development.
-
Demonstrable examples of AI integration within engineering workflows, such as automated component generation, documentation creation, or code scaffolding.
-
Case studies detailing the application of Figma's advanced features (variables, tokens, Dev Mode) to solve complex design system challenges.
-
Projects illustrating mastery of HTML, CSS, and JavaScript, emphasizing semantic structure, accessibility, and scalable CSS architecture.
-
Examples of prompt engineering and LLM application for specific design system tasks. Process Documentation:
-
Detailed documentation of AI-augmented design-to-code pipelines, including workflow diagrams and implementation guides.
-
Clear articulation of prompt engineering methodologies and best practices for design system use cases.
-
Documentation of Figma best practices, including architectural patterns for scalable design systems.
-
Examples of how design tokens bridge the gap between design and code, with accompanying tooling configurations.
-
Case studies on the automation of design system lifecycle phases through agentic workflows.
📝 Enhancement Note: A strong portfolio is critical for this role, requiring tangible proof of applied AI in engineering, expert-level Figma utilization, and the successful implementation of production-ready design systems. The emphasis is on demonstrating practical application and strategic thinking.
💵 Compensation & Benefits
Salary Range: $156,000 - $234,000 per year.
Benefits:
-
Comprehensive Medical, Dental, and Vision insurance plans.
-
401(k) and Roth retirement savings plans.
-
Basic and Supplemental Life Insurance, including Accidental Death & Dismemberment (AD&D).
-
Short-term and Long-term Disability coverage.
-
Health and Dependent Care Spending Accounts (HSA & DCFSA) for pre-tax savings.
-
Transportation benefits.
-
Employee Assistance Program (EAP) for confidential support.
-
Tuition Assistance for continued learning and professional development.
-
Generous Paid Time Off (PTO) and Paid Family Leave.
Working Hours: Standard 40 hours per week.
📝 Enhancement Note: The salary range is competitive for a Principal-level engineering role with specialized AI and design systems expertise in a major metropolitan area like Chicago. The benefits package is robust, covering health, financial planning, and work-life balance. The "remote OK" status for the US further enhances the value proposition.
🎯 Team & Company Context
🏢 Company Culture
Industry: Digital Experience Agency / Technology Services. One North, as part of TEKsystems, operates within the technology consulting and digital transformation space, focusing on strategy, design, and implementation for clients seeking to enhance their digital presence.
Company Size: TEKsystems is a large organization (80,000+ employees globally), while One North is presented as a boutique agency offering specialized solutions. This combination provides the resources and stability of a large corporation with the agility and focused expertise of a smaller agency.
Founded: TEKsystems was founded in 1983. One North's founding date is not specified but operates as a key agency within TEKsystems. This history suggests a stable, established entity with deep industry experience.
Team Structure:
-
The AI & Design Systems team is likely small and highly specialized, comprising Principal Engineers, senior designers, and potentially AI specialists.
-
The reporting structure would likely place this Principal Engineer directly under a Director or VP of Engineering/Technology, with dotted-line reporting or close collaboration with design leadership.
-
Cross-functional collaboration is critical, involving close partnerships with UX designers, product strategists, front-end developers, and client stakeholders. Methodology:
-
Data-driven decision-making is paramount, using analytics to inform design system evolution and AI integration strategies.
-
Agile and iterative development methodologies are likely employed for rapid prototyping and continuous improvement of design systems and AI workflows.
-
A strong emphasis on user-centered design principles, ensuring that both design systems and AI implementations serve end-user needs effectively.
-
Collaboration and knowledge-sharing are key, fostering an environment where best practices and learnings are disseminated across teams.
Company Website: https://careers.teksystems.com/us/en
📝 Enhancement Note: The dual nature of TEKsystems and One North suggests an environment that values both large-scale impact and specialized, agile execution. The Principal role is expected to contribute to the strategic direction of AI and design systems within this framework.
📈 Career & Growth Analysis
Operations Career Level: This is a Principal-level role, signifying a senior individual contributor with significant technical leadership and strategic influence. It's a position that typically requires deep subject matter expertise, the ability to mentor others, and the capacity to drive technical strategy.
Reporting Structure: While likely reporting to a Director or VP of Engineering/Technology, this role will operate with considerable autonomy. It involves close collaboration with design leadership, product management, and client teams, acting as a key technical advisor.
Operations Impact: The impact of this role is substantial, directly influencing how One North and its clients approach digital product development. By integrating AI into design systems and code generation, the Principal Design Engineer can dramatically improve efficiency, accelerate time-to-market, enhance design consistency, and unlock new possibilities in user experience. Their work will set technical standards and drive innovation across multiple client engagements.
Growth Opportunities:
-
Technical Specialization: Deepen expertise in AI for design, advanced Figma architecture, and emerging front-end technologies.
-
Leadership Development: Transition into technical leadership roles, managing engineering teams, or becoming a recognized thought leader within the agency and industry.
-
Client Strategy: Influence client digital transformation strategies by championing innovative AI and design system solutions.
-
Mentorship: Guide and mentor junior engineers and designers, fostering a culture of continuous learning and technical excellence.
-
Innovation: Lead R&D efforts in AI and design systems, potentially contributing to new product or service offerings for TEKsystems/One North.
📝 Enhancement Note: The Principal title and the cutting-edge nature of the role (AI + Design Systems) suggest significant opportunities for both deep technical mastery and strategic influence, paving the way for leadership or advanced individual contributor paths.
🌐 Work Environment
Office Type: The role is described as light hybrid onsite/remote, with the ideal candidate based in the Chicago area. However, remote locations across the U.S. are also considered, indicating a flexible work environment.
Office Location(s): Chicago, Illinois is the primary location, with potential for other TEKsystems/One North offices across the U.S. for remote employees.
Workspace Context:
-
Collaborative Environment: Expect close collaboration with designers, strategists, and other engineers, both within the agency and with client teams. This will likely involve virtual collaboration tools and potentially in-person meetings for hybrid employees.
-
Operations Tools & Technology: Access to industry-standard design and development tools, with a particular emphasis on Figma, AI development platforms, and robust coding environments.
-
Team Interaction: Opportunities to engage with a highly skilled and forward-thinking team, fostering knowledge sharing and innovation in AI and design systems.
Work Schedule: The standard 40-hour work week is expected, with flexibility often afforded to senior roles to manage workloads effectively. The hybrid/remote nature allows for greater autonomy in structuring the workday.
📝 Enhancement Note: The hybrid/remote flexibility is a key aspect of this role, appealing to experienced professionals who value work-life balance and autonomy. Collaboration will be a mix of digital and, for some, in-person interactions.
📄 Application & Portfolio Review Process
Interview Process:
-
Initial Screening: A review of your resume and portfolio to assess alignment with the required skills in AI, Design Systems, and Figma expertise.
-
Technical Interview(s): Deep dives into your experience with AI tooling, prompt engineering, design system architecture, Figma proficiency, and front-end development (HTML, CSS, JavaScript, frameworks). Expect to discuss specific projects and technical challenges.
-
Portfolio Presentation: A dedicated session to walk through your portfolio, showcasing specific examples of AI integration, complex Figma architecture, and production design systems. Be prepared to articulate your process, decisions, and impact.
-
Behavioral & Situational Interviews: Assessment of your collaboration style, problem-solving approach, communication skills (especially translating technical concepts), and cultural fit within the agency.
-
Final Interview: Likely with senior leadership to discuss strategic vision, leadership potential, and overall fit for the Principal role.
Portfolio Review Tips:
-
Highlight AI Impact: Clearly demonstrate how AI tools were used and the measurable benefits (e.g., time savings, improved quality, new capabilities).
-
Showcase Figma Expertise: Provide detailed examples of complex Figma implementations, including variables, tokens, advanced auto layout, and Dev Mode usage. Show how you architected for scalability and maintainability.
-
Detail Design System Architecture: Explain the rationale behind your design system's structure, token strategy, and component patterns. Use diagrams if helpful.
-
Quantify Achievements: Wherever possible, use metrics to illustrate the impact of your work (e.g., "reduced component development time by X%", "increased design consistency across Y projects").
-
Demonstrate Communication Skills: Be ready to explain your technical choices and their implications to both technical and non-technical audiences.
Challenge Preparation:
-
AI Prompting Exercise: Be prepared to discuss or even demonstrate how you would craft prompts for specific design system tasks (e.g., generating component documentation, creating accessibility annotations).
-
Figma Architecture Scenario: You might be given a hypothetical design system problem in Figma and asked to outline your approach to building or optimizing it.
-
Code Snippet Review: Expect to discuss your approach to clean, semantic, accessible HTML/CSS/JavaScript, or a component within a modern JS framework.
-
Design System Strategy Discussion: Be ready to discuss your philosophy on design systems, their evolution, and how to integrate new technologies like AI.
📝 Enhancement Note: The interview process will heavily scrutinize practical experience and the ability to articulate complex technical concepts. A well-curated portfolio that directly addresses AI, Figma, and design systems is paramount.
🛠 Tools & Technology Stack
Primary Tools:
-
Figma: Expert-level command required, including variables, tokens, advanced component architecture, Dev Mode, plugins, and API integrations.
-
AI Development Tools: Practical experience with AI tools for code generation, documentation, design exploration, and system authoring (e.g., Cursor, Claude, Copilot, v0).
-
LLM Integration Tools: Experience with Model Context Protocol (MCP) servers and integrating LLM-powered tooling.
-
Prompt Engineering Platforms: Familiarity with structured prompting techniques and tools for maximizing LLM effectiveness.
Analytics & Reporting:
-
Design System Analytics: Tools for tracking component usage, adoption rates, and performance metrics within design systems.
-
Code Quality Tools: Linters, formatters, and static analysis tools to ensure code quality and consistency.
CRM & Automation:
-
Version Control: Git (GitHub, GitLab, Bitbucket) for code management and collaboration.
-
Build Tools: Webpack, Vite, or similar for JavaScript bundling and asset management.
-
Package Managers: npm, Yarn for managing project dependencies.
-
Automation Frameworks: Tools for automating CI/CD pipelines, testing, and deployment.
Other Relevant Technologies:
-
Design Token Tooling: Style Dictionary, Theo, or similar for managing design tokens.
-
JavaScript Frameworks: React, Vue, Svelte for component development.
-
Headless CMS: Experience integrating design systems with headless CMS platforms.
-
Design System Ecosystem Tools: Storybook, Chromatic, Zeroheight, Supernova are strong pluses.
-
Animation Libraries: GSAP, Framer Motion for system-scale motion.
📝 Enhancement Note: Proficiency in Figma and practical, hands-on experience with AI development tools and LLM integration are non-negotiable. Familiarity with the broader design system ecosystem and modern front-end development stacks is also crucial.
👥 Team Culture & Values
Operations Values:
-
Curiosity & Innovation: A drive to explore new technologies like AI and their application in design and engineering.
-
Collaboration & Partnership: Working effectively with designers, strategists, and clients to achieve shared goals.
-
Excellence & Craftsmanship: Commitment to high-quality engineering, clean code, and well-architected systems.
-
Agility & Adaptability: Ability to navigate evolving technological landscapes and client needs.
-
Impact & Results: Focus on delivering tangible business value and measurable outcomes for clients.
Collaboration Style:
-
Cross-functional Integration: Seamless collaboration between design and engineering, breaking down traditional silos.
-
Open Communication: Transparent sharing of ideas, challenges, and learnings, particularly regarding AI advancements and design system strategies.
-
Mentorship & Knowledge Sharing: A culture where senior members actively mentor junior colleagues and share expertise.
-
Iterative Improvement: Embracing feedback loops to continuously refine processes, tools, and deliverables.
📝 Enhancement Note: The culture emphasizes innovation, collaboration, and a commitment to delivering high-impact digital experiences. The Principal role is expected to embody and promote these values.
⚡ Challenges & Growth Opportunities
Challenges:
-
Pace of AI Innovation: Keeping pace with the rapid advancements in AI and determining practical applications for design systems.
-
Integrating AI into Existing Workflows: Overcoming technical hurdles and cultural resistance to integrate AI tools smoothly into established design and development processes.
-
Balancing Cutting-Edge with Practicality: Applying advanced AI and design system principles in a way that is scalable, maintainable, and meets client business objectives.
-
Figma Ecosystem Evolution: Adapting to frequent updates and new features within Figma and assessing their strategic value.
Learning & Development Opportunities:
-
AI Specialization: Opportunities to become a leading expert in AI applications for design and engineering.
-
Industry Conferences & Training: Access to attend relevant conferences, workshops, and online courses focused on AI, design systems, and front-end technologies.
-
Mentorship Programs: Formal or informal mentorship from senior leaders within TEKsystems and One North.
-
Exposure to Diverse Clients: Working with a variety of clients across different industries, providing broad exposure to unique challenges and solutions.
📝 Enhancement Note: This role offers the chance to be at the forefront of AI integration in design systems, presenting both exciting challenges and significant opportunities for professional growth and skill development.
💡 Interview Preparation
Strategy Questions:
-
"Describe how you would leverage AI to automate the generation of design system documentation for a new component library." (Preparation: Think about prompt engineering, structured data, and potential LLM outputs.)
-
"How would you approach architecting a Figma design system to ensure seamless integration with AI-powered code generation tools?" (Preparation: Focus on Figma's capabilities like tokens, variables, and structured components.)
-
"Walk me through a time you had to translate a complex technical concept (e.g., AI workflow, design token system) to a non-technical audience. What was your approach and the outcome?" (Preparation: Prepare a STAR method example highlighting communication skills.) Company & Culture Questions:
-
"What excites you most about One North's approach to AI in design and engineering?" (Preparation: Research One North's mission and values, and connect them to your passion.)
-
"How do you see AI impacting the future of design systems and front-end development in the next 3-5 years?" (Preparation: Formulate a forward-thinking perspective based on industry trends.)
-
"Describe your preferred method for collaborating with designers and how you ensure their needs are met in an engineering context." (Preparation: Emphasize partnership, communication, and user-centricity.) Portfolio Presentation Strategy:
-
Structure Your Narrative: For each project, clearly state the problem, your role, the solution (especially AI/Figma aspects), and the quantifiable results.
-
Highlight AI & Figma: Explicitly call out where and how you used AI tools and advanced Figma features. Show, don't just tell.
-
Technical Depth: Be prepared to discuss the "how" and "why" behind your technical decisions, including code structure, tooling choices, and architectural patterns.
-
Conciseness: Respect the interviewers' time. Focus on the most impactful aspects of your work and be ready for follow-up questions.
📝 Enhancement Note: Interview preparation should focus on demonstrating practical AI application, deep Figma expertise, strong communication, and a strategic vision for the future of design systems.
📌 Application Steps
To apply for this Principal Design Engineer position:
-
Submit your application through the TEKsystems careers portal.
-
Curate Your Portfolio: Ensure your portfolio prominently features projects demonstrating expert Figma usage, practical AI integration in engineering workflows, and robust design system development. Highlight specific examples of agentic workflows or LLM applications.
-
Optimize Your Resume: Tailor your resume to highlight keywords such as "AI," "Design Systems," "Figma," "Prompt Engineering," "LLM," "JavaScript," "HTML," "CSS," and "React/Vue/Svelte." Quantify achievements where possible.
-
Prepare Your Presentation: Practice walking through your portfolio, focusing on clearly articulating your contributions, technical decisions, and the impact of your AI and design system work. Be ready to discuss your approach to Figma architecture and prompt engineering.
-
Research One North & TEKsystems: Understand the agency's mission, values, and recent work. Familiarize yourself with their approach to digital transformation and how AI fits into their strategy.
⚠️ 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 strong background in production-level design systems and accessible markup.