Senior Design Engineer, Design Systems

📍 Job Overview

Job Title: Senior Design Engineer, Design Systems

Company: Clipboard

Location: San Francisco, California, United States (Remote OK)

Job Type: FULL_TIME

Category: Design Systems Engineering / Product Engineering

Date Posted: 2026-09-19

Experience Level: 6+ Years

🚀 Role Summary

• Drive the foundational architecture and development of Clipboard's design system, bridging the gap between design (Figma) and engineering (production code).

• Develop and maintain a robust library of reusable UI components, ensuring consistency, accessibility, and high-quality user experiences across all products.

• Spearhead the creation of AI tooling and skills to empower the Engineering, Product, and Design (EPD) team in prototyping and building system-led experiences.

• Establish and enforce design system standards, documentation, and best practices to ensure seamless adoption and high-quality output from all teams.

• Collaborate closely with Product, Design, and Engineering stakeholders to integrate the design system effectively into complex workflows and edge cases.

📝 Enhancement Note: This role is explicitly for a Senior Design Engineer focused on building a design system from scratch, emphasizing the critical intersection of design and engineering. The focus on AI tooling for prototyping and building system-led experiences is a significant differentiator and requires candidates with experience in this emerging area. The role is heavily weighted towards engineering with a strong understanding of design principles and system architecture.

📈 Primary Responsibilities

• Architect and establish the foundational structure of the design system, encompassing primitives, tokens, components, and patterns for both Figma and code.

• Build and maintain production-ready, reusable components with comprehensive states, interactions, motion, and accessibility features.

• Ensure continuous synchronization between Figma, code, and Storybook to maintain system integrity as it evolves.

• Define and uphold high standards for UI/UX craft, ensuring consistency, accessibility, and maintainability across all product surfaces.

• Develop and implement AI tooling and skills to enable rapid prototyping and efficient building using the design system and best practices.

• Create comprehensive documentation, usage guidelines, and component rules for effective system utilization by both humans and AI.

• Partner with designers, product managers, and engineers to address complex workflow challenges and edge cases, incorporating feedback into system enhancements.

• Conduct rigorous testing for visual regression and ensure strong accessibility fundamentals across web and mobile platforms.

• Drive the adoption and best practices of the design system across the EPD organization, acting as a subject matter expert.

📝 Enhancement Note: The responsibilities highlight a full lifecycle ownership of the design system, from initial architecture and component development to ongoing maintenance, documentation, and the innovative integration of AI. The emphasis on "closing the gap" and ensuring "design and code in sync" points to a need for strong process and communication skills alongside technical prowess.

🎓 Skills & Qualifications

Education: While no specific degree is mandated, a strong educational foundation in Computer Science, Human-Computer Interaction, Design, or a related field is implied by the experience requirements.

Experience: 6+ years of experience building and scaling production-ready design systems for multiple product surfaces across web and mobile.

Required Skills:

• Extensive experience in frontend engineering with modern web technologies and component-based architecture.

• Deep expertise in building and maintaining component libraries, design tokens, Storybook, and Figma workflows/plugins.

• Proven ability to establish and consolidate design systems, aligning Figma libraries with production code.

• Strong understanding of UI/UX craft, product taste, and principles of polished, usable, accessible, flexible, and maintainable interfaces.

• Solid grasp of accessibility fundamentals across both mobile and web platforms.

• Practical experience leveraging AI for faster prototyping, component development, and system work.

• Experience building resources (skills, documentation, rules) that enable AI to build correctly against a design system.

• Excellent communication skills, capable of clearly explaining technical decisions to both technical and non-technical audiences.

• A strong bias for action and building, with a proven track record of making ideas real in code and iterating based on feedback.

• Senior-level judgment to navigate ambiguity, prioritize high-leverage work, and manage change effectively for adoption. Preferred Skills:

• Experience with two-sided marketplaces or platforms where transaction participants are interdependent.

• Experience designing for healthcare, operations-heavy domains, or other high-stakes real-world industries.

📝 Enhancement Note: The required skills emphasize a blend of deep technical frontend engineering expertise with a strong design sensibility and system-level thinking. The explicit mention of AI tooling experience is a critical and differentiating requirement for this senior-level role. The preferred skills indicate a potential advantage for candidates with domain experience in complex, regulated, or marketplace environments.

📊 Process & Systems Portfolio Requirements

Portfolio Essentials:

• Demonstrable examples of production-ready design systems built from the ground up or significantly contributed to.

• Case studies showcasing the architecture and foundational elements (tokens, primitives, components) of a design system.

• Evidence of aligning design tools (e.g., Figma) with engineering codebases, illustrating the "design-to-code" process.

• Examples of reusable component libraries, including their states, interactions, and accessibility features.

• Documentation samples for design system components, usage guidelines, and best practices.

• Prototypes or case studies demonstrating the use of AI in design system workflows or component development. Process Documentation:

• Workflow designs and optimizations for managing design system updates and version control.

• Implementation strategies for integrating design system components into various product surfaces.

• Measurement and performance analysis of design system adoption and its impact on development efficiency and UI consistency.

• Processes for ensuring accessibility standards are met and maintained within the design system.

📝 Enhancement Note: A strong portfolio is crucial for this role, as it will be the primary means of demonstrating the candidate's ability to build and scale a design system. The emphasis should be on tangible, production-level work that showcases both engineering excellence and a deep understanding of design system principles, including the emerging area of AI integration.

💵 Compensation & Benefits

Salary Range: $180,000 - $250,000 USD per year.

Benefits:

• Comprehensive health, dental, and vision insurance.

• Stock options or equity grants.

• Generous paid time off (PTO) and holidays.

• 401(k) or similar retirement savings plan.

• Professional development and learning opportunities.

• Remote work stipend or home office setup budget.

Working Hours: 40 hours per week, with flexibility expected to accommodate cross-functional collaboration and project needs.

📝 Enhancement Note: The provided salary range is competitive for a Senior Design Engineer role in San Francisco and for remote US-based positions with this level of experience and specialization. The inclusion of equity and a focus on professional development are common and attractive benefits for senior technical roles. The "Remote OK" status with a preferred San Francisco location suggests a hybrid approach or strong preference for candidates within commuting distance, while remaining open to fully remote US-based talent.

🎯 Team & Company Context

🏢 Company Culture

Industry: Technology, Healthcare Staffing Marketplace (specifically connecting healthcare professionals with workplaces).

Company Size: Over 1,000 employees.

Founded: 2016. Clipboard is a remote-first, profitable Y-Combinator top company.

Team Structure:

• The role sits within the Engineering, Product, and Design (EPD) organization, likely reporting to an Engineering Manager or Director of Engineering.

• The design system team will likely be a small, specialized group working closely with product designers and frontend engineers across various product pods.

• Collaboration is expected across Product Management, Design, and Engineering teams, requiring strong cross-functional communication. Methodology:

• Data-driven decision-making, with a focus on user needs and business impact.

• Agile development methodologies, emphasizing rapid iteration and continuous improvement.

• A culture of building and shipping, with an emphasis on learning from production code and user feedback.

• Embraces emerging technologies, as evidenced by the focus on AI tooling within the design system.

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

📝 Enhancement Note: Clipboard operates in the dynamic healthcare technology sector, focusing on a marketplace model. As a large, remote-first, and profitable company, it offers stability and significant growth opportunities. The emphasis on building and shipping, coupled with a focus on AI, suggests a forward-thinking and execution-oriented culture.

📈 Career & Growth Analysis

Operations Career Level: This is a Senior individual contributor role, focusing on a critical infrastructure area (Design Systems). It represents a significant step up from a mid-level engineer, requiring architectural vision, leadership in influencing technical direction, and the ability to mentor others.

Reporting Structure: The role will likely report to an Engineering Manager or Director of Engineering within the EPD organization. The Senior Design Engineer will act as a technical lead for the design system, influencing product and engineering roadmaps.

Operations Impact: The design system is foundational to the entire product experience. This role has a direct impact on:

• Development Velocity: By providing reusable components and clear guidelines, it speeds up the development process.

• Product Consistency & Quality: Ensures a cohesive and high-quality user experience across all Clipboard products.

• Scalability: Enables the organization to scale its product offerings efficiently.

• Innovation: By developing AI tooling, it can unlock new levels of productivity and creativity for the EPD team.

Growth Opportunities:

• Technical Leadership: Grow into a Principal or Staff Engineer role, owning broader architectural domains or leading larger engineering initiatives.

• Specialization: Deepen expertise in design systems, frontend architecture, AI/ML for developer tools, or accessibility.

• Management Track: Transition into Engineering Management if interested in leading teams directly.

• Cross-functional Influence: Become a key influencer in product strategy and technical decision-making across EPD.

📝 Enhancement Note: This Senior Design Engineer position offers a clear path for technical leadership and impact within a growing organization. The focus on design systems and AI tooling positions the candidate at the forefront of modern product development practices, providing ample opportunities for skill enhancement and career advancement.

🌐 Work Environment

Office Type: Remote-first, with a preferred location in San Francisco, CA/Bay Area. This suggests that while fully remote US-based candidates are considered, there's a strong preference for candidates who can potentially engage with a local hub or team members.

Office Location(s): Primarily remote within the United States, with a preference for the San Francisco Bay Area.

Workspace Context:

• A fully remote work environment, requiring self-discipline and strong asynchronous communication skills.

• Access to modern collaboration tools and platforms (e.g., Slack, Zoom, Figma, Storybook).

• Potential for virtual team-building activities and in-person meetups if based in or near San Francisco.

• An environment that values autonomy, ownership, and proactive problem-solving.

Work Schedule: Standard full-time hours (approx. 40 hours/week) with flexibility. Given the remote nature and potential for collaboration across different time zones within the US, occasional flexibility for meetings might be required.

📝 Enhancement Note: The remote-first nature of Clipboard means candidates must be comfortable with asynchronous communication and self-management. The preference for San Francisco suggests opportunities for in-person collaboration or networking if the candidate is local. The work environment is likely to be fast-paced and innovative, aligning with a growing tech company.

📄 Application & Portfolio Review Process

Interview Process:

• Initial Screening: A recruiter or hiring manager will review applications and conduct a brief introductory call to assess basic qualifications and cultural fit.

• Technical Interview (Design Systems Focus): This will likely involve in-depth discussions about past design system projects, architecture decisions, component development, and handling of states, interactions, and accessibility. Expect questions about Figma and Storybook workflows.

• Coding Challenge/System Design: A practical exercise focusing on frontend engineering skills, potentially involving building a component or designing a system architecture. This might be a take-home assignment or a live coding session.

• Cross-functional Interviews: Meetings with Product Managers, Designers, and other Engineers to assess collaboration skills, communication, and ability to understand diverse perspectives. Discussions around how the design system supports product goals will be key.

• Hiring Manager/Final Round: A discussion with the hiring manager to delve deeper into leadership potential, strategic thinking, problem-solving approach, and alignment with company values.

Portfolio Review Tips:

• Highlight Impact: Clearly articulate the impact of your design system work on development velocity, product consistency, and user experience. Use metrics where possible.

• Showcase Process: Detail your process for building components, managing tokens, aligning Figma and code, and ensuring accessibility.

• Demonstrate Architecture: Explain the architectural decisions behind your design systems, including the rationale for choices made.

• Detail AI Integration: If you have experience with AI tooling for design systems, dedicate specific examples to showcase this unique skill.

• Organize Clearly: Ensure your portfolio is well-organized and easy to navigate, with clear descriptions for each project.

Challenge Preparation:

• Brush up on Frontend Fundamentals: Review core JavaScript, HTML, CSS, and modern framework concepts (e.g., React, Vue, or Angular, depending on Clipboard's stack).

• Design System Patterns: Be ready to discuss common design system patterns, token strategies, and best practices for component development.

• Accessibility Standards: Prepare to discuss WCAG guidelines and how to implement accessible components.

• AI Tooling Concepts: Understand how AI can be applied to design systems, from component generation to documentation assistance.

• Problem-Solving Scenarios: Think through how you would approach common design system challenges, such as adoption issues, inconsistency, or scaling.

📝 Enhancement Note: The interview process will heavily scrutinize technical depth in design systems and frontend engineering, with a particular emphasis on practical application and the ability to bridge design and code. The portfolio is a critical component, and candidates should prepare to walk through their projects in detail, highlighting strategic thinking and measurable impact.

🛠 Tools & Technology Stack

Primary Tools:

• Design: Figma (primary tool for design, prototyping, and library management).

• Component Development: Storybook (for developing, documenting, and testing UI components in isolation).

• Frontend Framework: Likely a modern JavaScript framework such as React, Vue, or Angular (specifics would need to be confirmed).

• Version Control: Git (e.g., GitHub, GitLab, Bitbucket).

Analytics & Reporting:

• Tools for tracking design system adoption and impact (e.g., internal metrics, usage analytics).

• Possibly tools for visual regression testing (e.g., Percy, Chromatic). CRM & Automation:

• While not directly CRM-focused, understanding how the design system integrates with product development workflows and potentially automation tools for code generation or testing is key.

• AI Tooling: Experience with AI/ML tools or frameworks relevant to code generation, component creation, or documentation assistance.

📝 Enhancement Note: Proficiency in Figma and Storybook is explicitly mentioned or strongly implied. A strong understanding of modern frontend frameworks and component-based architecture is essential. The role also requires an openness and likely experience with emerging AI tooling that can enhance the design system lifecycle.

👥 Team Culture & Values

Operations Values:

• Building & Shipping: A bias for action, making ideas real in code, and iterating based on feedback.

• High Craftsmanship: A high bar for UI/UX quality, polish, usability, and accessibility.

• Collaboration & Communication: Explaining decisions clearly, raising the work around them, and making the right path easy for others.

• System Thinking: Architecting foundational systems that enable scalability and efficiency.

• Innovation: Embracing new technologies like AI to improve processes and outcomes.

Collaboration Style:

• Cross-functional Integration: Works closely with Product, Design, and Engineering to ensure the design system meets diverse needs.

• Partnership: Collaborates on complex workflows and edge cases, taking user and stakeholder feedback into account.

• Mentorship & Guidance: Sets standards and provides documentation to help others build correctly with the system, including through AI.

• Feedback-Driven: Actively seeks and incorporates feedback to iterate on the design system.

📝 Enhancement Note: Clipboard's culture appears to value execution, quality, and innovation. The emphasis on collaboration and clear communication is vital for a role that bridges multiple disciplines. Candidates should demonstrate an ability to not only build but also to influence and guide others through clear communication and well-defined processes.

⚡ Challenges & Growth Opportunities

Challenges:

• Building from Scratch: Establishing a design system architecture and initial component library requires significant upfront effort and strategic planning.

• Adoption & Buy-in: Convincing multiple teams to adopt a new system and maintain consistency requires strong influence and clear value proposition.

• Keeping Pace: Ensuring the design system remains synchronized with evolving product needs, design trends, and technological advancements (especially AI).

• Balancing Needs: Catering to the diverse requirements of web, mobile, and potentially future platforms while maintaining a cohesive system.

• AI Integration Complexity: Developing effective and reliable AI tooling for design systems that genuinely adds value and doesn't create new problems.

Learning & Development Opportunities:

• Deepen Design System Expertise: Become a leading expert in design system architecture, implementation, and governance.

• Master AI for Developer Tools: Gain hands-on experience with AI/ML applications in software development, specifically for design systems.

• Frontend Architecture Leadership: Develop skills in designing scalable and maintainable frontend architectures.

• Cross-functional Influence: Enhance skills in stakeholder management, technical evangelism, and driving strategic initiatives across product, design, and engineering.

• Industry Best Practices: Stay at the cutting edge of design systems, accessibility, and AI in product development through conferences, workshops, and research.

📝 Enhancement Note: This role presents a significant opportunity to shape a critical piece of infrastructure and tackle cutting-edge challenges in AI-driven development. The growth opportunities are geared towards deep technical specialization and leadership within the product development lifecycle.

💡 Interview Preparation

Strategy Questions:

• How would you approach architecting a design system from the ground up for a company of Clipboard's size and scope?

• Describe your process for ensuring design and code remain in sync as a design system evolves. What tools and strategies would you employ?

• How would you prioritize the development of components and features within the design system roadmap?

• What is your strategy for driving adoption of a design system across multiple engineering and design teams?

• How do you envision AI impacting the future of design systems, and what specific AI tooling would you aim to build at Clipboard? Company & Culture Questions:

• Based on your research, what do you see as Clipboard's biggest opportunities or challenges in its product development?

• How do you align your work with company values like "Building & Shipping" and "High Craftsmanship"?

• How would you contribute to Clipboard's remote-first culture and foster collaboration?

• What excites you most about Clipboard's mission and its position in the healthcare marketplace? Portfolio Presentation Strategy:

• Start with Impact: Begin by outlining the primary goals and impact of your most significant design system project.

• Walk Through Architecture: Clearly explain the foundational elements (tokens, primitives, components) and the rationale behind your architectural choices.

• Demonstrate Process: Show how you bridge design and code, using examples from Figma, Storybook, and production code.

• Highlight AI Contributions: If applicable, dedicate a section to showcase your experience with AI tooling and its impact on design system workflows.

• Address Challenges: Be prepared to discuss challenges faced during the project and how you overcame them, demonstrating problem-solving skills.

• Quantify Results: Use metrics to demonstrate the success of your design system, such as improvements in development speed, consistency, or accessibility.

📝 Enhancement Note: Interview preparation should focus on articulating strategic thinking, technical depth, and a clear understanding of how design systems contribute to business objectives. Candidates should be ready to defend their technical decisions and demonstrate their ability to influence and lead through technical expertise.

📌 Application Steps

To apply for this Senior Design Engineer, Design Systems position:

• Submit your application through the provided link on Ashby.

• Curate Your Portfolio: Select 2-3 key projects that best showcase your design system experience, focusing on architecture, component development, Figma-to-code alignment, and any AI tooling contributions. Ensure each project has a clear narrative of problem, solution, and impact.

• Tailor Your Resume: Highlight your 6+ years of experience in building production frontend design systems, specific skills in Figma, Storybook, accessibility, and any AI-related work. Use keywords from the job description.

• Prepare Your Presentation: Practice walking through your portfolio projects, focusing on articulating your strategic decisions, technical approach, and measurable impact. Be ready to discuss your process and rationale in detail.

• Research Clipboard: Understand their mission, product offerings (healthcare marketplace), company size, and remote-first culture. Think about how your role as a Design Systems Engineer contributes to their specific business goals.

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