Senior Associate, Senior Creative Technologist - Frontend UI Engineer - Design Systems

New York Life
Full-timeβ€’$100k-143k/year (USD)β€’New York, United States
Apply Now

πŸ“ Job Overview

Job Title: Senior Creative Technologist - Frontend UI Engineer - Design Systems (PF4)

Company: New York Life

Location: New York, NY, United States

Job Type: FULL_TIME

Category: Technology / Engineering / Design Systems

Date Posted: 2026-09-22T19:36:45

Experience Level: 6-10+ years

Remote Status: Hybrid - 2 days per week in office

πŸš€ Role Summary

  • Develop and maintain a robust, production-ready React component library, ensuring strict alignment with the Figma design system.

  • Optimize the complete design-to-code workflow, enhancing collaboration, handoff efficiency, and overall system adoption across enterprise digital platforms.

  • Integrate cutting-edge AI technologies responsibly into design and development lifecycles to boost scalability and engineering efficiency.

  • Collaborate closely with design, product, and engineering stakeholders to ensure seamless integration and consistent application of the design system across various digital experiences.

  • Contribute to the strategic direction and governance of enterprise-wide design system adoption.

πŸ“ Enhancement Note: This role is positioned as a Senior Associate/Senior Creative Technologist, indicating a need for significant technical expertise, strategic thinking, and the ability to influence technical direction within the design systems domain. The emphasis on AI and innovation suggests a forward-thinking team looking to leverage emerging technologies for process improvement and product development.

πŸ“ˆ Primary Responsibilities

  • Design System Engineering:

    • Construct and maintain a scalable, production-ready React component library that mirrors the Figma design system.
    • Define and enforce best practices for component architecture, promoting reusability and optimal performance.
    • Ensure precise synchronization between design tokens, UI components, and their coded implementations.
    • Develop comprehensive documentation, usage guidelines, and onboarding materials for developers.
  • Design-to-Code Workflow Optimization:

    • Streamline the end-to-end design and engineering workflow to improve handoff, collaboration, and system adoption rates.
    • Evaluate, select, and implement tools and processes that enhance design-to-development alignment, including token management and CI/CD integration.
    • Proactively identify and address friction points to increase development velocity for product teams.
  • Collaboration & Enablement:

    • Partner with designers, engineers, and product managers to embed the design system into product development cycles.
    • Serve as a primary technical liaison between the design system team and broader engineering organizations.
    • Provide technical consultation, code reviews, and guidance to support design system adoption.
  • AI & Innovation:

    • Research and assess emerging technologies, particularly AI-assisted design and development workflows.
    • Implement and validate AI-driven solutions to enhance design system scalability and engineering efficiency.
    • Establish standards and guardrails for the responsible integration of AI within the design system ecosystem.
  • Enterprise Scale & Platform Integration:

    • Support multi-platform environments, ensuring compatibility across various CMS platforms and applications.

    • Guarantee consistency and compatibility across web applications utilizing React as a core framework.

    • Contribute to robust governance models to facilitate enterprise-wide design system adoption.

πŸ“ Enhancement Note: The responsibilities highlight a blend of hands-on development, process improvement, and strategic contribution. The emphasis on "production-ready," "scalable," and "enterprise-scale" indicates a need for robust, well-tested solutions that can support a large organization. The inclusion of AI points to a proactive approach to innovation.

πŸŽ“ Skills & Qualifications

Education:

  • Bachelor’s degree in Computer Science, Engineering, or a related field, or equivalent practical experience. Experience:

  • 6–10+ years of dedicated frontend engineering experience, with a significant focus on UI development.

  • Demonstrated experience in building, contributing to, or maintaining enterprise-scale design systems.

  • Proven track record of developing and supporting React component libraries within production environments.

  • Experience working within complex organizational structures that support multiple platforms, products, and CMS ecosystems. Required Skills:

  • Expert-level proficiency in React.

  • Deep expertise in JavaScript (ES6+) and TypeScript.

  • Advanced knowledge of HTML5 and CSS3, including preprocessors (e.g., Sass, Less) and methodologies (e.g., BEM).

  • Strong understanding of design token principles, theming strategies, and scalable component architecture patterns.

  • Proven experience integrating design systems with Figma or similar design tools, and familiarity with modern design handoff workflows.

  • Solid understanding of web accessibility standards, including WCAG 2.1 (AA/AAA) and ADA compliance.

  • Proficiency with modern version control systems, particularly Git.

  • Experience with CI/CD pipelines for automated testing and deployment.

  • Familiarity with component development and documentation tools such as Storybook. Preferred Skills:

  • Experience with state management libraries (e.g., Redux, Zustand, Context API).

  • Knowledge of performance optimization techniques for frontend applications.

  • Experience with cross-browser compatibility testing and debugging.

  • Familiarity with backend technologies or API integrations to understand full-stack implications.

  • Exposure to AI/ML concepts and their application in software development or design workflows.

πŸ“ Enhancement Note: The experience requirements are substantial, pointing to a senior individual contributor role. The emphasis on "expert-level proficiency" and "deep expertise" signals that candidates will be rigorously assessed on their technical command. The inclusion of AI and emerging technologies as preferred skills suggests a desire for candidates who can not only execute but also innovate and guide future technical directions.

πŸ“Š Process & Systems Portfolio Requirements

Portfolio Essentials:

  • Showcase of production-ready React component libraries developed or significantly contributed to, demonstrating scalability and maintainability.

  • Examples of design system implementation, highlighting the connection between design specifications (e.g., Figma) and coded components.

  • Case studies detailing the optimization of design-to-code workflows, illustrating improvements in efficiency, collaboration, or adoption.

  • Demonstrations of component architecture, theming capabilities, and adherence to accessibility standards (WCAG).

  • Evidence of contributions to documentation, developer onboarding, or enablement materials for a design system. Process Documentation:

  • Documented workflows for the design system development lifecycle, from initial design handoff to component implementation and maintenance.

  • Examples of process improvements implemented to streamline design-to-development handoffs, including the use of automation or tooling.

  • Records of collaboration processes with design and engineering teams, demonstrating effective communication and feedback loops.

  • Demonstrations of how accessibility and performance considerations are integrated into the design system development process.

πŸ“ Enhancement Note: A strong portfolio is critical for this role, as it will serve as tangible proof of the candidate's ability to build and manage complex design systems and optimize workflows. The emphasis is on demonstrating practical application, scalability, and process improvement, not just theoretical knowledge.

πŸ’΅ Compensation & Benefits

Salary Range: $100,000 - $143,000 per year.

Overtime Eligibility: Exempt

Discretionary Bonus Eligibility: Yes

Sales Bonus Eligibility: No

Explanation of Salary Range: This range is provided based on the explicit information in the job description. The actual base salary will be determined by factors including individual experience, skills, qualifications, and the specific job location.

Benefits:

  • Comprehensive Health & Wellness: A full package of benefits designed for a modern workforce, including leave programs.

  • Family Support: Specialized offerings such as adoption assistance and student loan repayment programs.

  • Financial Incentives: Eligibility for an annual discretionary bonus, reflecting company performance and individual contribution.

  • Professional Development: Opportunities to enhance skills and career growth, supported by company resources.

  • Modern Workforce Offerings: Benefits are continuously refined based on employee feedback to support flourishing both inside and outside of work.

Working Hours: Standard full-time hours (approximately 40 hours per week), with a hybrid arrangement requiring 2 days per week in the New York office.

πŸ“ Enhancement Note: The salary range is clearly stated. The benefits package is described as comprehensive and modern, with specific examples like adoption assistance and student loan repayment programs, which are attractive to a wide range of professionals. The hybrid work model is also explicitly defined.

🎯 Team & Company Context

🏒 Company Culture

Industry: Financial Services / Insurance. New York Life is a Fortune 100 company and the largest mutual life insurance company in the U.S. This industry context implies a focus on stability, long-term planning, and customer trust, which translates to a need for robust, reliable, and secure digital experiences.

Company Size: Large enterprise (Fortune 100 implies thousands of employees globally). This scale suggests complex systems, established processes, and numerous cross-functional teams, requiring strong communication and integration skills.

Founded: Established company with a long history, indicating a strong foundation and a culture that likely balances tradition with innovation.

Team Structure:

  • The role is within the "Marketing - Digital & Performance Marketing" department, specifically on the "MADI Design System team."

  • This team is likely composed of specialized engineers and designers focused on creating and maintaining the company's design system.

  • The role requires close collaboration with design, product management, and broader engineering teams across the enterprise. Methodology:

  • Data-Driven Design: Emphasis on using data and metrics to inform design system evolution and adoption.

  • Agile Development: Likely follows agile methodologies for iterative development and continuous improvement of the component library and workflows.

  • Cross-Functional Collaboration: A strong emphasis on working effectively across diverse teams to ensure alignment and successful implementation of design system principles.

  • Innovation Focus: Encouragement to explore and implement new technologies, including AI, to enhance efficiency and scalability.

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

πŸ“ Enhancement Note: New York Life's status as a Fortune 100 mutual insurance company suggests a culture that values stability, long-term relationships, and a commitment to its policyholders. The "Marketing - Digital & Performance Marketing" department indicates a strategic focus on customer engagement and digital transformation. The MADI Design System team's role is crucial for ensuring a consistent and modern digital presence.

πŸ“ˆ Career & Growth Analysis

Operations Career Level: This role is classified as "LEVELPF4," typically indicating a senior individual contributor or a lead position within a specific technical domain (Design Systems Engineering). It requires a high degree of autonomy, technical leadership, and the ability to mentor others.

Reporting Structure: The role reports into the Marketing - Digital & Performance Marketing division, likely within a Digital Experience or Engineering leadership structure that oversees design systems. The direct reporting line is not explicitly stated but implies interaction with management focused on digital product development and marketing technology.

Operations Impact: The impact is significant, as the design system directly influences the user experience, brand consistency, development efficiency, and scalability of all digital products and platforms across the enterprise. A well-maintained design system reduces development costs, speeds up time-to-market, and enhances customer trust through consistent interfaces.

Growth Opportunities:

  • Technical Specialization: Deepen expertise in frontend technologies, design systems, and emerging areas like AI in development.

  • Leadership Development: Opportunity to lead technical initiatives, mentor junior engineers, and influence architectural decisions within the design system domain.

  • Cross-Functional Exposure: Gain broader understanding of product development, marketing strategies, and enterprise technology landscapes through collaboration.

  • Innovation Leadership: Drive the adoption of new technologies and methodologies, contributing to the company's digital transformation journey.

πŸ“ Enhancement Note: The "PF4" designation suggests a level that is beyond a standard senior engineer, implying expectations for strategic contribution, mentorship, and potentially influencing broader technical strategy. Growth opportunities are geared towards deepening technical mastery and leadership within the design systems and frontend development space.

🌐 Work Environment

Office Type: Hybrid work environment, with employees expected to be in the office 2 days per week. This suggests a blend of focused remote work and in-person collaboration.

Office Location(s): New York, NY. This places the role in a major metropolitan hub, offering access to a large talent pool and a vibrant professional community.

Workspace Context:

  • Collaborative Spaces: The 2-day in-office requirement indicates opportunities for face-to-face collaboration with colleagues on the Design System team and other marketing/engineering departments.

  • Technology & Tools: Access to modern development tools, potentially including dedicated workstations and enterprise-level software licenses necessary for frontend development and design system management.

  • Team Interaction: Regular opportunities for team meetings, brainstorming sessions, and code reviews with fellow engineers and designers, fostering a shared sense of purpose and continuous learning.

Work Schedule: Standard full-time work schedule, likely around 40 hours per week, with the flexibility afforded by the hybrid model for focused individual work.

πŸ“ Enhancement Note: The hybrid model is a key aspect, balancing the need for in-person collaboration and team cohesion with the benefits of remote work for deep concentration. Being in New York City provides significant advantages in terms of networking and access to resources.

πŸ“„ Application & Portfolio Review Process

Interview Process:

  • Initial Screening: A review of your resume and portfolio, focusing on relevant experience with React, design systems, and enterprise-scale projects.

  • Technical Assessment: Likely involves a coding challenge or a deep-dive technical interview to evaluate expertise in React, JavaScript/TypeScript, CSS, and component architecture. This may include live coding or problem-solving scenarios.

  • Design System Deep Dive: A session focused on your experience with design systems, including how you've built, maintained, and scaled them, your approach to design-to-code workflows, and your understanding of Figma integration.

  • Behavioral & Situational Interviews: Questions assessing collaboration skills, problem-solving abilities, strategic thinking, and how you handle ambiguity or drive initiatives. Expect questions about your experience with AI in development.

  • Stakeholder/Team Fit: Interviews with potential team members and design/product leads to assess cultural fit and ability to collaborate effectively.

  • Final Round: May involve a presentation of your portfolio or a specific case study, followed by a final discussion with leadership.

Portfolio Review Tips:

  • Showcase Impact: Clearly articulate the problems you solved, the solutions you implemented (especially for design systems), and the measurable impact (e.g., improved efficiency, consistency, adoption rates).

  • Highlight Design System Work: Dedicate specific sections to your design system contributions, showing component examples, Figma integration, documentation, and workflow optimization efforts.

  • Code Quality: Ensure any code samples are well-structured, commented, and demonstrate best practices. Storybook examples are highly valuable.

  • Process & Collaboration: Describe your role in team processes, how you collaborated with designers and engineers, and your approach to documentation and knowledge sharing.

  • AI Integration: If you have experience with AI in design or development, clearly present case studies or examples of its application, including how you ensured quality and maintainability.

Challenge Preparation:

  • React & TypeScript Mastery: Brush up on advanced React concepts, hooks, performance optimization, and TypeScript best practices.

  • Design System Principles: Revisit core concepts of component architecture, design tokens, theming, accessibility (WCAG), and responsive design.

  • Figma & Handoff: Understand common design handoff tools and workflows that connect Figma designs to code.

  • AI in Development: Prepare to discuss how AI tools can be used responsibly in frontend development and design systems, including potential benefits, risks, and validation strategies.

  • Problem-Solving Scenarios: Practice breaking down complex problems related to UI engineering, system integration, or workflow optimization.

πŸ“ Enhancement Note: The interview process is likely comprehensive, covering technical depth, system-level thinking, collaboration, and strategic contributions, especially concerning AI. A well-curated portfolio is essential for demonstrating practical skills and impact.

πŸ›  Tools & Technology Stack

Primary Tools:

  • Frontend Framework: React (expert-level proficiency required).

  • Languages: JavaScript (ES6+), TypeScript (expert-level proficiency required).

  • Styling: HTML5, CSS3, CSS Preprocessors (Sass/Less), CSS-in-JS or similar styling methodologies.

  • Component Development & Documentation: Storybook (strong familiarity expected).

  • Version Control: Git (advanced proficiency).

  • CI/CD: Familiarity with Continuous Integration/Continuous Deployment pipelines for automated builds, tests, and deployments.

Analytics & Reporting:

  • Tools for monitoring component performance and adoption metrics.

  • Potential integration with broader analytics platforms for tracking UI feature usage. Design System Integration:

  • Design Tools: Figma (experience integrating with design systems).

  • Design Tokens: Understanding and implementation of design token systems for theming and consistency.

AI & Emerging Technology:

  • Exploration and potential integration of AI tools for code generation, design system element creation, or workflow automation.

πŸ“ Enhancement Note: The technology stack is heavily focused on modern frontend development, with a strong emphasis on React and TypeScript. Proficiency with design system tooling like Storybook and deep integration with design platforms like Figma are critical. The mention of AI suggests an openness to exploring and adopting new technologies within this stack.

πŸ‘₯ Team Culture & Values

Operations Values:

  • Humanity & Integrity: Rooted in the company's core values, these translate to ethical development practices, transparency in communication, and a commitment to building reliable systems.

  • Collaboration: A strong emphasis on working together across diverse teams, valuing input from design, product, and engineering to achieve shared goals.

  • Innovation: Encouragement to explore new ideas, technologies (like AI), and methodologies to drive digital transformation and improve processes.

  • Efficiency & Scalability: A drive to build robust, performant, and scalable solutions that can support the enterprise effectively and reduce long-term maintenance costs.

  • Customer Focus: Ultimately, all efforts contribute to delivering excellent digital experiences for New York Life's customers, ensuring financial security and peace of mind.

Collaboration Style:

  • Cross-Functional Partnership: The role is inherently collaborative, requiring close working relationships with designers, product managers, and other engineers.

  • Knowledge Sharing: A culture that encourages sharing best practices, code reviews, and technical insights to elevate the entire team and organization.

  • Feedback-Driven Improvement: An environment where constructive feedback is welcomed and utilized to refine processes, components, and workflows.

  • Proactive Communication: Expectation of clear and timely communication regarding progress, challenges, and proposed solutions, especially when influencing technical direction.

πŸ“ Enhancement Note: The company's core values of "humanity and integrity" suggest a culture that is ethical, customer-centric, and values long-term relationships. The emphasis on collaboration and innovation aligns well with the nature of a design systems role, which bridges design and engineering.

⚑ Challenges & Growth Opportunities

Challenges:

  • Balancing Innovation with Stability: Integrating new technologies like AI while maintaining the reliability and security required by a large financial institution.

  • Driving Enterprise Adoption: Encouraging and supporting widespread adoption of the design system across diverse product teams with varying technical maturity.

  • Maintaining Synchronization: Ensuring continuous and accurate alignment between the evolving Figma design and the live React component library.

  • Scalability Across Platforms: Developing and maintaining components that are robust, performant, and consistent across multiple web applications and CMS platforms.

Learning & Development Opportunities:

  • Advanced Frontend & Design Systems: Opportunities to deepen expertise in React, TypeScript, component architecture, and advanced design system strategies.

  • AI Integration Expertise: Gain hands-on experience and develop best practices for leveraging AI in design and development workflows within an enterprise context.

  • Cross-Functional Leadership: Develop skills in stakeholder management, technical influence, and strategic planning through close collaboration with various departments.

  • Industry Exposure: Potential to attend conferences, workshops, and pursue certifications relevant to frontend development, design systems, and emerging technologies.

πŸ“ Enhancement Note: The challenges are typical for a senior role in a large enterprise, focusing on scale, adoption, and technological evolution. The growth opportunities are well-defined and align with the role's responsibilities, offering clear paths for both technical and leadership development.

πŸ’‘ Interview Preparation

Strategy Questions:

  • "Describe a time you significantly contributed to or built an enterprise-scale design system. What were the key challenges, and how did you overcome them?" (Focus on process, collaboration, and impact).

  • "How do you ensure tight synchronization between a design system in Figma and its corresponding code implementation in React? What tools or processes do you use?" (Demonstrate understanding of design-to-code workflows).

  • "Discuss your experience with AI tools in the design or development lifecycle. How would you approach integrating AI-generated code or assets into a production React component library, ensuring quality and maintainability?" (Highlight critical thinking, risk assessment, and validation strategies).

  • "How would you approach educating and enabling other engineering teams to adopt and effectively use a new design system?" (Focus on communication, documentation, and support strategies). Company & Culture Questions:

  • "Based on what you know about New York Life, why do you believe a strong design system is important for a financial services company?" (Connect role to company mission and industry needs).

  • "How do you approach collaboration with designers who have a different vision or approach than yours?" (Assess conflict resolution and partnership skills).

  • "Describe a situation where you had to influence a team or stakeholder to adopt a new technology or process. What was your approach?" (Demonstrate influence and change management capabilities). Portfolio Presentation Strategy:

  • Structure: Organize your portfolio to clearly showcase your design system contributions first, followed by other relevant frontend engineering projects. Use a clear narrative for each project.

  • Highlight Impact: For each project, articulate the problem, your specific role and contributions, the technologies used, and the quantifiable results or benefits achieved (e.g., efficiency gains, consistency improvements, adoption metrics).

  • Code Walkthrough: Be prepared to walk through specific code examples from your React component library, explaining architectural decisions, reusability patterns, and how you addressed accessibility.

  • Figma Integration: Show how your coded components align with Figma designs, potentially using screenshots of both or live examples if possible.

  • AI Experience: If showcasing AI work, clearly explain the problem AI solved, the tools used, the output, and your validation process.

πŸ“ Enhancement Note: Interview preparation should focus on demonstrating not only technical proficiency but also strategic thinking, process optimization skills, and a deep understanding of design systems' value in an enterprise context, especially within financial services. The ability to articulate the responsible use of AI is a key differentiator.

πŸ“Œ Application Steps

To apply for this Senior Creative Technologist - Frontend UI Engineer - Design Systems position:

  • Submit Your Application: Complete and submit your application through the provided link on the New York Life careers portal.

  • Curate Your Portfolio: Tailor your portfolio to prominently feature your most impactful work related to React component libraries, enterprise-scale design systems, and design-to-code workflow optimization. Include specific examples of how you have integrated Figma designs with code and any experience with AI in development.

  • Optimize Your Resume: Ensure your resume clearly highlights your 6-10+ years of frontend engineering experience, expert-level proficiency in React, JavaScript, TypeScript, and your experience with design systems, accessibility, and modern tooling. Quantify your achievements wherever possible.

  • Prepare Your Presentation: Practice walking through your portfolio with a focus on explaining your process, technical decisions, collaborative approach, and the business impact of your work. Be ready to discuss your experience with AI and how you would approach challenges specific to this role.

  • Research New York Life: Understand the company's mission, values, and its digital transformation initiatives. Consider how your role as a Senior Creative Technologist contributes to the company's goals in marketing, customer experience, and technological innovation.

⚠️ 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 6–10+ years of frontend engineering experience with a strong focus on UI development and React component libraries. Candidates must possess expert-level proficiency in JavaScript, TypeScript, and modern design system tooling.