Software Engineer, Design Systems

📍 Job Overview

Job Title: Software Engineer, Design Systems

Company: AbbVie

Location: North Chicago, Illinois, USA

Job Type: Full-time

Category: Software Engineering / Design Systems

Date Posted: 2026-09-02

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

Remote Status: On-site

🚀 Role Summary

• Spearhead the development and evolution of AbbVie's enterprise design system, "Unity," focusing on AI-enabled and agent-ready platform capabilities.

• Design, build, and maintain robust, accessible React/TypeScript components and developer tooling to accelerate compliant digital product delivery at scale.

• Pioneer and implement agentic AI workflows, including Claude Code skills and AI-driven UI delivery, to enhance developer productivity and product quality.

• Serve as the primary developer-facing engineer for the Unity Design System, fostering community engagement and acting as a trusted technical resource.

• Collaborate cross-functionally with design, development, and business technology stakeholders to gather requirements, drive innovation, and ensure successful adoption of design system standards.

📝 Enhancement Note: This role is positioned within a specialized area of software engineering, focusing on the critical intersection of design systems, AI, and developer enablement. The emphasis on "agent-ready" and "AI-driven UI delivery" signifies a forward-thinking approach to software development, requiring candidates to be adept not only in traditional front-end development but also in emerging AI technologies and their application within a design system context.

📈 Primary Responsibilities

• Design, engineer, test, and maintain reusable, accessible React/TypeScript components for the Unity React library, with a strong emphasis on design tokens, scalable theming (light/dark, density modes), composability, and comprehensive Storybook documentation.

• Develop and advance AI-assisted and agentic developer workflows, integrating Claude Code skills, MCP server integrations (Figma, Storybook), and prompt-to-code/design-to-code pipelines to enable efficient, compliant UI delivery by developers and AI agents.

• Build and support full-stack services and automation tooling using Python and Node.js for design operations, compliance checks, and CI/CD pipelines.

• Own end-to-end quality assurance, including writing and maintaining automated tests, performing accessibility (WCAG 2.2 AA) and cross-browser testing, and rigorously QA'ing own work prior to release.

• Act as the primary developer-facing representative of the Unity Design System, providing community support, conducting demos and office hours, fostering relationships, and building credibility as a go-to technical resource.

• Independently gather and translate developer community needs into actionable requirements, maintain technical documentation, and communicate project objectives, progress, and issues to stakeholders via rapid feedback loops.

• Contribute to the data visualization capabilities of Unity and support data-science-driven features, leveraging any data science or data visualization experience.

• Adapt to changing team priorities and context-switch effectively to co-own team responsibilities across requirements, development, QA, deployment, community building, and presentations.

• Actively learn, master, and stay current with evolving AI development tools and productivity enhancements, piloting, evaluating, and contributing to the rollout of new technologies.

• Provide technical guidance and mentorship to colleagues, partner effectively with designers, brand, accessibility, and BTS stakeholders, and adhere to corporate standards including code of conduct, data security, GxP compliance, and the SDLC.

📝 Enhancement Note: The breadth of responsibilities highlights the unique nature of this role, blending core software engineering with specialized design system management and cutting-edge AI integration. The expectation to "wear multiple hats" and "context-switch" suggests a dynamic, agile team environment where individual initiative and adaptability are highly valued.

🎓 Skills & Qualifications

Education:

• Bachelor’s Degree in a relevant field (e.g., Computer Science, Software Engineering, Human-Computer Interaction) with 5 years of experience, OR Master’s Degree in a relevant field with 4 years of experience. Experience:

• Proven track record in front-end engineering with a strong focus on design systems and component library development.

• Experience building and managing developer-facing products and communities.

• Demonstrated experience with AI-assisted development workflows and agentic AI technologies. Required Skills:

• React & TypeScript: Proficient in building complex, scalable user interfaces with React and TypeScript.

• Design Tokens & Theming: Deep understanding of design tokenization principles and their application in scalable, multi-theme systems (e.g., light/dark modes, density adjustments).

• Agentic AI & Workflows: Hands-on experience developing and integrating agentic AI, including Claude Code skills, prompt engineering, and AI-assisted developer tooling.

• Python & Node.js: Backend and full-stack development capabilities for building supporting services, automation, and tooling.

• Storybook: Extensive experience using Storybook for component development, documentation, and testing.

• Accessibility & WCAG: Strong knowledge of web accessibility standards (WCAG 2.2 AA) and practical experience implementing and testing for compliance.

• Testing & QA Discipline: A rigorous approach to quality assurance, including unit, integration, and end-to-end testing, with a habit of thoroughly testing one's own work.

• Developer Community Engagement: Experience building relationships, providing support, and communicating technical concepts effectively to a developer audience.

• Independent Work & Collaboration: Ability to work autonomously, generate requirements, document technical efforts, and collaborate effectively within a team and across departments.

• Communication: Excellent written and oral English communication skills.

Preferred Skills:

• Additional Front-end Frameworks: Experience with other frameworks like Angular.

• Data Science & Visualization: A background in data science and experience with data visualization libraries and techniques.

• Front-end Automation: Experience with front-end automation tools and frameworks for testing and deployment.

• Figma MCP & Code Connect: Familiarity with Figma's Machine Component Protocol (MCP) and Code Connect for bridging design and development.

• Developer Relations (DevRel): Experience in developer relations, community management, and advocacy.

• Mobile Development: Experience in mobile application development (iOS/Android).

• OutSystems: Familiarity with the OutSystems low-code development platform.

📝 Enhancement Note: The "Required Skills" section emphasizes a blend of established front-end best practices (React, TypeScript, Accessibility) with emerging technologies (Agentic AI, Claude Code). The "Preferred Skills" suggest areas where additional expertise could be highly beneficial, particularly in bridging design tools (Figma MCP) and understanding broader development ecosystems (mobile, low-code).

📊 Process & Systems Portfolio Requirements

Portfolio Essentials:

• Component Library Showcase: Demonstrations of well-documented, reusable UI components, ideally built with React and adhering to design system principles. Highlight composability, theming, and accessibility features.

• Design System Implementation: Examples of how design tokens and theming were applied to create consistent and adaptable user interfaces across multiple applications or contexts.

• AI Workflow Integration: Proof of concept or implemented examples of AI-assisted workflows in software development, such as prompt-to-code generation, AI-driven documentation, or agentic task execution.

• Developer Tooling & Automation: Projects showcasing the development of tools or scripts that improve developer efficiency, streamline workflows (e.g., CI/CD pipelines, design-ops scripts), or automate repetitive tasks.

• Code Quality & Testing: Evidence of strong testing practices, including unit tests, integration tests, and accessibility checks (e.g., screenshots of Storybook with Axe results, GitHub commit history showing test coverage).

Process Documentation:

• Workflow Design & Optimization: Examples of how you've documented and optimized development workflows, particularly those involving design systems, component development, or AI integration. This could include process diagrams or case studies.

• System Implementation & Automation: Documentation or case studies detailing the implementation of new systems or automation solutions, emphasizing the problem solved, the solution designed, and the outcomes achieved.

• Measurement & Performance Analysis: Demonstrations of how you measure the impact of your work, such as metrics on developer efficiency, adoption rates of design system components, or improvements in product quality/compliance.

📝 Enhancement Note: For this role, a portfolio is crucial for demonstrating practical application of skills. Applicants should focus on showcasing not just code, but the impact of their work, particularly in areas like developer enablement, AI integration, and scalable component development. Quantifiable results and clear process documentation will be highly valued.

💵 Compensation & Benefits

Salary Range: $84,500 - $162,000 USD per year.

Benefits:

• Paid Time Off: Includes vacation, holidays, and sick leave.

• Health Insurance: Comprehensive medical, dental, and vision insurance plans.

• Retirement Savings: 401(k) plan for eligible employees.

• Performance Incentives: Eligible to participate in short-term incentive programs.

Working Hours:

• Standard full-time work week, assumed to be 40 hours per week. The on-site nature suggests adherence to typical business hours, though flexibility may be available based on team needs and project demands.

📝 Enhancement Note: The salary range provided is a strong indicator for a mid-to-senior level Software Engineer role with specialized design systems and AI focus in the US. The benefits package is standard for a large pharmaceutical company like AbbVie, offering a solid foundation for employee well-being and financial security. The "short-term incentive programs" suggest potential for performance-based bonuses.

🎯 Team & Company Context

🏢 Company Culture

Industry: Pharmaceutical & Biotechnology. AbbVie is a global biopharmaceutical company focused on discovering and delivering innovative medicines and solutions to address serious health issues.

Company Size: Large enterprise (likely thousands of employees globally). This implies established processes, significant resources, and a structured work environment.

Founded: 2013 (as a spin-off from Abbott Laboratories). This relatively young company history means it has a modern approach to technology and innovation while benefiting from the stability and resources of a larger parent organization.

Team Structure:

• The Unity Design System team is a specialized group within AbbVie's broader technology organization.

• It likely operates with a mix of dedicated design system engineers, front-end developers, and potentially product managers or designers focused on the system itself.

• Collaboration will be essential with various Business Technology Solutions (BTS) teams, product development teams (both design and engineering), and potentially brand/compliance stakeholders.

• The role reports into a lead or manager within the Design Systems or a related engineering function. Methodology:

• Data-Driven Development: Emphasis on using data to inform decisions, measure impact, and iterate on components and workflows.

• Agile & Iterative Processes: Expectation of working in sprints, with rapid feedback loops and continuous integration/deployment (CI/CD).

• Collaborative Design & Engineering: A strong partnership between designers and engineers to ensure fidelity and technical feasibility of the design system.

• AI Integration: A forward-thinking approach to leveraging AI for productivity gains and innovation in UI delivery.

Company Website: www.abbvie.com

📝 Enhancement Note: AbbVie's industry context as a major pharmaceutical company means that compliance, accessibility (GxP, WCAG), and scalability are paramount. The "Unity" design system is a strategic initiative to ensure consistency and efficiency across a vast portfolio of digital products. The role's focus on AI integration positions AbbVie at the forefront of applying new technologies to enterprise software development.

📈 Career & Growth Analysis

Operations Career Level: This role is classified as a Software Engineer with a specialization in Design Systems and AI. It sits at a mid-to-senior level, requiring significant hands-on technical expertise and the ability to operate independently. It's a technical contributor role, not management, focused on deep engineering craft.

Reporting Structure: The role reports to a lead or manager within the Design Systems team, which is part of AbbVie's broader engineering or Business Technology Solutions (BTS) organization. The engineer will work closely with designers, product managers, and other engineers on the Unity team, as well as stakeholders across various product development teams.

Operations Impact: The impact of this role is significant and far-reaching. By developing and maintaining the Unity Design System and its AI-enabled workflows, this engineer directly influences:

• Development Velocity: Enabling hundreds of developers to build digital products faster and more efficiently.

• Product Quality & Consistency: Ensuring a unified, high-quality, and compliant user experience across AbbVie's digital touchpoints.

• Innovation: Pioneering new methods of UI delivery through AI, setting future standards for digital product development at AbbVie.

• Compliance & Accessibility: Upholding critical standards like WCAG 2.2 AA and GxP compliance, which are vital in the pharmaceutical industry.

Growth Opportunities:

• Technical Specialization: Deepen expertise in design systems, front-end architecture, AI development, and accessibility.

• Leadership in Technical Domains: Evolve into a senior technical lead or architect for the design system, guiding technical strategy and mentoring junior engineers.

• Cross-Functional Influence: Expand influence across product teams, driving adoption of the design system and new development methodologies.

• Emerging Technology Exploration: Continue to lead the charge in exploring and implementing cutting-edge AI and developer productivity tools within a large enterprise.

• Potential for DevRel: Transition into a developer relations role if community engagement and advocacy become a primary focus.

📝 Enhancement Note: This role offers a unique blend of deep technical contribution and strategic impact. The growth path is clearly defined towards technical leadership and specialization in high-demand areas like AI and scalable design systems, aligning well with career aspirations for senior individual contributors.

🌐 Work Environment

Office Type: Primarily on-site in North Chicago, Illinois. This suggests a traditional office setting with opportunities for in-person collaboration.

Office Location(s): AbbVie's headquarters in North Chicago, Illinois, provides access to a dedicated campus environment with amenities typical of large corporate headquarters.

Workspace Context:

• Collaborative Environment: The on-site nature encourages spontaneous interactions, whiteboarding sessions, and direct problem-solving with colleagues.

• Tools & Technology: Access to AbbVie's standard IT infrastructure, development tools, and potentially specialized hardware or software required for AI development and testing.

• Team Interaction: Regular team meetings, stand-ups, and opportunities to connect with designers, fellow engineers, and product stakeholders in person.

Work Schedule:

• Standard business hours are expected for an on-site role, likely around 40 hours per week.

• While core hours will be maintained, flexibility for focused work and potential for occasional overtime during critical project phases may exist, especially given the dynamic nature of AI development and design system evolution.

📝 Enhancement Note: The on-site requirement suggests a company culture that values in-person collaboration and team cohesion. For operations roles, this can translate into more direct access to stakeholders and a more integrated team dynamic.

📄 Application & Portfolio Review Process

Interview Process:

• Initial Screening: HR or recruiter screen to assess basic qualifications, experience alignment, and interest.

• Technical Interview(s): Multiple rounds focusing on:

  • React/TypeScript Fundamentals: Deep dives into component design, state management, hooks, performance optimization.
  • Design System Concepts: Questions on tokens, theming, accessibility, composability, and Storybook usage.
  • AI/Agentic Workflow Knowledge: Discussion of experience with AI tools, prompt engineering, and integrating AI into development pipelines.
  • Backend/Full-Stack Skills: Scenarios involving Python/Node.js for services and automation.
  • Problem-Solving & Architecture: Case studies or hypothetical scenarios requiring design system solutions, AI integration strategies, or workflow optimization.

• Portfolio Review: A dedicated session where candidates present their portfolio, detailing specific projects, their role, technical challenges, and outcomes. Expect detailed questions about design choices, implementation details, and impact.

• Behavioral & Cultural Fit Interview: Assessing collaboration style, communication skills, problem-solving approach, and alignment with AbbVie's values and the team's dynamic.

• Hiring Manager Interview: Final discussion with the hiring manager to assess overall fit, career aspirations, and confirm understanding of the role and team.

Portfolio Review Tips:

• Structure Your Narrative: For each project, clearly articulate the problem, your specific contribution, the technical solution (highlighting React, TypeScript, AI, design tokens), challenges faced, and quantifiable results (e.g., % improvement in dev speed, adoption metrics, accessibility score improvements).

• Showcase AI Integration: If possible, include a demonstration or detailed walkthrough of an AI-assisted workflow you've built or contributed to. Explain the prompt engineering, the agent's role, and the output.

• Highlight Design System Principles: Explicitly call out how your work adheres to design system best practices: token usage, theming capabilities, accessibility compliance (show WCAG checks), and component composability.

• Code Samples: Be prepared to walk through relevant code snippets, explaining complex logic, architectural decisions, and testing strategies. Ensure GitHub repositories are clean and well-documented.

• Focus on Impact: Emphasize the value your work brought to developers, designers, or the end-users. Use metrics whenever possible.

Challenge Preparation:

• Design System Challenge: You might be asked to design a component or a set of components for a specific use case, considering accessibility, theming, and reusability.

• AI Workflow Design: A prompt might be given to outline how you would use AI to solve a specific development problem (e.g., generating documentation from code, creating test cases).

• Code Review Exercise: You may be asked to review a piece of code and provide feedback on quality, performance, accessibility, and adherence to design system standards.

• System Design: A broader challenge might involve designing a system for managing design tokens or automating a part of the design-to-code process.

📝 Enhancement Note: The interview process is rigorous, reflecting the specialized nature of the role. A strong portfolio showcasing practical application of React, design systems, and AI integration is paramount. Candidates should prepare to discuss their contributions in detail and articulate the impact of their work.

🛠 Tools & Technology Stack

Primary Tools:

• React & TypeScript: Core for building the component library.

• Storybook: Essential for component development, documentation, and visual testing.

• Python & Node.js: For backend services, build scripts, automation, and CI/CD.

• GitHub: For version control, collaboration, and CI/CD integration.

Analytics & Reporting:

• Accessibility Testing Tools: e.g., Axe, Lighthouse, browser developer tools for WCAG compliance checks.

• CI/CD Platforms: e.g., Jenkins, GitHub Actions, GitLab CI for automated builds, tests, and deployments.

• Internal Dashboards: Likely used for tracking design system adoption, component usage, and performance metrics.

CRM & Automation:

• Figma / Code Connect / MCP Servers: Tools for bridging design and code, essential for AI integration and design-to-code pipelines.

• Potentially OutSystems: If involved in broader enterprise application development initiatives.

• General Automation Tools: Scripting tools and frameworks for automating design operations, build processes, and validation checks.

📝 Enhancement Note: The technology stack is a blend of standard front-end development tools and emerging AI-related technologies. Proficiency in the core tools is expected, while experience with AI integration and design-to-code pipelines will be a significant differentiator.

👥 Team Culture & Values

Operations Values:

• Innovation: A drive to explore and implement new technologies, particularly AI, to push the boundaries of software development.

• Collaboration: Strong emphasis on teamwork, cross-functional partnerships, and open communication between design, development, and business stakeholders.

• Quality & Craftsmanship: Commitment to building high-quality, accessible, and maintainable software components and systems.

• Efficiency: A focus on optimizing development processes, reducing time-to-market, and enabling developers to work more effectively.

• User-Centricity (Developer Experience): Prioritizing the needs and experience of the developer community who will consume the design system.

Collaboration Style:

• Cross-Functional Integration: The team works closely with UI/UX designers, product managers, and various engineering teams across AbbVie.

• Open Feedback Loops: Encourages constructive feedback on components, tools, and processes to foster continuous improvement.

• Knowledge Sharing: Emphasis on sharing best practices, learnings from AI experiments, and technical insights through demos, documentation, and informal discussions.

• Proactive Engagement: Expected to actively engage with the developer community, solicit feedback, and proactively address their needs.

📝 Enhancement Note: AbbVie's culture, particularly within its technology divisions, is likely to emphasize data-driven decision-making, adherence to rigorous standards (especially in pharma), and a commitment to innovation. The design system team itself will embody a collaborative spirit, bridging the gap between design and development while embracing new technologies like AI.

⚡ Challenges & Growth Opportunities

Challenges:

• Scaling AI Integration: Successfully integrating agentic AI and AI-driven workflows into enterprise-level development processes while maintaining control, quality, and security.

• Adoption & Buy-in: Encouraging widespread adoption of the Unity Design System and new AI-powered tools across a large organization with diverse development teams.

• Balancing Innovation & Compliance: Innovating with AI while strictly adhering to GxP, accessibility, and data security regulations inherent in the pharmaceutical industry.

• Keeping Pace with AI Evolution: The rapid advancement of AI technologies requires continuous learning and adaptation to ensure the design system remains state-of-the-art.

• Developer Experience Optimization: Continuously improving the developer experience through intuitive components, robust tooling, and effective community support.

Learning & Development Opportunities:

• AI & Machine Learning Specialization: Deepen expertise in AI development, prompt engineering, and large language models (LLMs) like Claude.

• Advanced Front-End Architecture: Further develop skills in complex component architecture, performance optimization, and scalable design systems.

• DevRel & Community Management: Gain experience in building and nurturing a large developer community.

• Industry Conferences & Certifications: Opportunities to attend relevant conferences (e.g., AI, front-end development, design systems) and pursue certifications.

• Mentorship Programs: Access to mentorship from senior engineers and leaders within AbbVie to guide career growth.

📝 Enhancement Note: This role is at the cutting edge of software development, offering significant opportunities to tackle complex challenges related to AI integration and enterprise-scale design systems. The company's commitment to innovation, coupled with the inherent complexities of the pharmaceutical industry, provides a rich environment for professional growth.

💡 Interview Preparation

Strategy Questions:

• "Describe a complex component you built for a design system. What were the key technical challenges, how did you address them, and what was the outcome?" (Focus on React, TypeScript, design tokens, accessibility.)

• "How would you approach integrating an AI agent to assist developers in generating React components from design specifications? What are the potential pitfalls, and how would you mitigate them?" (Focus on AI workflows, prompt engineering, Claude Code, MCP.)

• "Walk us through your process for ensuring WCAG 2.2 AA compliance in a React component library. What tools do you use, and how do you embed accessibility into the development lifecycle?" (Focus on accessibility, QA, testing tools.)

• "Imagine a scenario where a product team is resistant to adopting the Unity Design System. How would you engage them, understand their concerns, and persuade them of the benefits?" (Focus on community engagement, stakeholder management, developer relations.) Company & Culture Questions:

• "What interests you specifically about AbbVie and its mission?" (Research AbbVie's therapeutic areas, recent news, and values.)

• "How do you see AI transforming the role of a software engineer in a large enterprise like AbbVie?" (Connect your AI experience to AbbVie's context.)

• "Describe your experience working in a cross-functional team. How do you handle disagreements or differing priorities between design and engineering?" (Highlight collaboration and communication skills.)

• "What are your thoughts on GxP compliance and its impact on software development in the pharmaceutical industry?" (Show awareness of industry-specific requirements.) Portfolio Presentation Strategy:

• Storytelling for Impact: For each project, frame it as a narrative: the problem, your solution, your specific role, the technologies used (highlighting React, TypeScript, AI, design tokens), and the measurable impact or outcome.

• Live Demo or Walkthrough: If possible, provide a live demo of a component or an AI workflow. Otherwise, use well-annotated screenshots or recordings.

• Code Snippet Focus: Be ready to deep-dive into specific code sections that demonstrate complex logic, best practices, or innovative solutions. Explain your choices clearly.

• Quantify Success: Use numbers whenever possible: adoption rates, performance improvements, time savings, accessibility scores.

• Connect to AbbVie: Briefly explain how your experience and projects align with the responsibilities and goals of the Software Engineer, Design Systems role at AbbVie.

📝 Enhancement Note: Candidates should prepare to discuss their technical contributions with depth, especially regarding AI integration and design system best practices. Demonstrating an understanding of AbbVie's industry and values will be crucial for cultural fit.

📌 Application Steps

To apply for this Software Engineer, Design Systems position:

• Submit your application through the AbbVie careers portal via the provided link.

• Portfolio Customization: Tailor your resume and cover letter to highlight specific experience in React, TypeScript, design systems, AI development, and accessibility, using keywords from the job description.

• Portfolio Preparation: Curate your portfolio to prominently feature projects demonstrating your skills in component development, design token implementation, AI workflow integration, and robust testing practices. Be ready to present and discuss these projects in detail.

• Company Research: Thoroughly research AbbVie's mission, therapeutic areas, and recent innovations. Understand the importance of design systems and AI in a pharmaceutical context.

• Interview Practice: Prepare for technical interviews by reviewing core React concepts, design system principles, and AI/agentic workflow applications. Practice articulating your experience and problem-solving approaches using the STAR method.

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