Senior Product Designer & Front End Engineer

📍 Job Overview

Job Title: Senior Product Designer & Front End Engineer

Company: KCRW Inc

Location: Santa Monica, CA, US

Job Type: Temporary

Category: Digital Product Development / Design & Engineering

Date Posted: 2026-06-26

Experience Level: 5-10 years

Remote Status: Hybrid

🚀 Role Summary

• Lead the end-to-end design and development of engaging, accessible, and scalable digital experiences across KCRW's web and mobile platforms, focusing on modern front-end engineering and UI/UX design.

• Drive the evolution of KCRW’s digital design system and reusable component library, ensuring consistency and efficiency across all digital touchpoints.

• Implement performant and maintainable front-end applications using React, Next.js, and TypeScript, integrating with headless CMS and various APIs.

• Champion accessibility standards (WCAG) and user-centered design principles throughout the product development lifecycle, from ideation to launch.

📝 Enhancement Note: This role is a unique hybrid that blends strategic product design with hands-on front-end development. It requires a candidate who can not only conceptualize user journeys and visual interfaces but also translate those designs into functional, high-quality code. The emphasis on "next generation of KCRW's digital experiences" and "modernizing and evolving our digital ecosystem" suggests a focus on innovation and strategic impact within a public media context. The "Temporary" employment type indicates a project-based need, likely for a significant digital transformation or platform enhancement initiative.

📈 Primary Responsibilities

• Design intuitive, accessible, and visually compelling digital experiences for web and mobile platforms, creating wireframes, high-fidelity UI designs, interactive prototypes, user flows, and comprehensive design documentation using Figma.

• Develop and maintain modern web applications utilizing React, Next.js, TypeScript, and a component-based architecture, ensuring performance, scalability, and maintainability.

• Integrate front-end applications with APIs (REST and GraphQL), headless CMS platforms (specifically Contentful), and other third-party services to power dynamic content and user interactions.

• Optimize applications for performance, Search Engine Optimization (SEO), accessibility (WCAG), and cross-browser compatibility, ensuring a robust and inclusive user experience.

• Collaborate closely with the Project Manager, editorial, marketing, membership, events, and engineering stakeholders to translate diverse needs into effective digital solutions.

• Evolve and maintain KCRW’s digital design system and reusable UI component library, promoting consistency and development efficiency.

• Conduct UX research, usability testing, and iterative design improvements based on audience insights, analytics, and stakeholder feedback.

• Work within Contentful and other headless CMS environments to enable dynamic content delivery and personalized user experiences.

• Support and contribute to integrations with customer relationship management (CRM) systems like Salesforce, marketing automation platforms like HubSpot, customer support tools like Zendesk, analytics platforms (e.g., GA4), and audience data tools.

• Contribute to CI/CD workflows, establish testing strategies, and uphold front-end development standards.

📝 Enhancement Note: The responsibilities highlight a strong emphasis on both the "design thinking" and "implementation" phases. The integration of various third-party systems (Salesforce, HubSpot, Zendesk) suggests a need for understanding how digital products connect with broader MarTech and CRM stacks, which is crucial for revenue operations and audience engagement initiatives in a media context. The mention of "middleware and API integration workflows" points to the need for a technically adept designer/developer who can navigate complex system architectures.

🎓 Skills & Qualifications

Education: [While not explicitly stated, a Bachelor's degree in Computer Science, Design, Human-Computer Interaction, or a related field, or equivalent practical experience, is typically expected for a Senior role.]

Experience: 5+ years of combined experience in product design, UI/UX, and front-end development.

Required Skills:

• Expert proficiency with Figma for interface design, wireframing, prototyping, and user flow creation.

• Strong experience building and maintaining modern web applications using React, Next.js, and TypeScript.

• Deep understanding of HTML5, CSS3, and SCSS, with a focus on responsive and component-based design systems.

• Proven experience working with headless CMS platforms, with specific experience with Contentful being highly valued.

• Experience building applications against REST and/or GraphQL APIs.

• Thorough understanding of accessibility standards (WCAG) and inclusive design principles.

• Familiarity with Git, CI/CD workflows, testing frameworks, and modern development tooling.

• Strong understanding of performance optimization techniques, SEO best practices, and web analytics implementation.

• Excellent communication, collaboration, and problem-solving skills, with the ability to effectively work with cross-functional teams.

• A strong portfolio demonstrating both design thinking and successfully shipped front-end work. Preferred Skills:

• Experience with middleware, API orchestration, or integration platforms.

• Familiarity with customer data platforms (e.g., Segment), analytics tools (e.g., GA4), CRMs (e.g., Salesforce), marketing automation (e.g., HubSpot), and customer support tools (e.g., Zendesk).

• Experience with Node.js or server-side JavaScript frameworks.

• Experience with cloud hosting environments such as Vercel, AWS, or similar.

• Background in media, publishing, streaming, membership, or content-driven organizations.

• Familiarity with AI-assisted design/development workflows and automation tools.

• Motion design, animation, or interactive storytelling experience.

📝 Enhancement Note: The "5+ years of experience" combined with the "Senior" title suggests a need for demonstrable leadership in design and development. The emphasis on a strong portfolio is critical for this hybrid role, as it needs to showcase both visual design acumen and technical implementation capabilities. The preferred skills strongly align with modern digital product development stacks and indicate a desire for someone who can hit the ground running with complex integrations.

📊 Process & Systems Portfolio Requirements

Portfolio Essentials:

• A comprehensive portfolio showcasing a minimum of 5 years of professional experience, with a strong emphasis on projects that demonstrate both sophisticated UI/UX design and well-executed front-end development.

• Projects should highlight your ability to translate user needs and business requirements into intuitive, accessible, and visually appealing digital products.

• Include case studies that detail your design process, from initial research and ideation through to wireframing, prototyping, and final implementation.

• For front-end work, showcase examples of clean, maintainable, and performant code, ideally demonstrating experience with React, Next.js, and TypeScript.

• Demonstrate experience with responsive design principles and how you ensure a consistent experience across various devices and screen sizes.

• Clearly articulate your role and contributions within each project, especially in collaborative team environments. Process Documentation:

• Showcase examples of your workflow for designing and developing digital products, from user research and requirements gathering to iterative design and development cycles.

• Provide evidence of your process for creating and utilizing design systems, including component libraries and style guides.

• Detail your approach to accessibility (WCAG compliance) and performance optimization within your design and development processes.

• Illustrate your methods for integrating front-end applications with APIs, headless CMS (like Contentful), and other backend systems.

• Include examples of how you conduct user testing and incorporate feedback into design and development iterations.

📝 Enhancement Note: For a hybrid role like this, the portfolio is paramount. It needs to serve as a tangible representation of the candidate's dual expertise. The emphasis on "shipped front-end work" means that simply having design mockups won't suffice; evidence of implemented projects is crucial. The reference to "middleware and integration workflows" implies that projects demonstrating complex system integrations would be highly advantageous.

💵 Compensation & Benefits

Salary Range: $90,000 - $110,000 per year.

This range is based on the provided salary data and reflects a senior-level position in the Santa Monica, CA area, considering the specialized hybrid skill set required.

Benefits:

• Health insurance (including medical, dental, vision)

• Flexible Spending Account (FSA) eligibility

• Life and Accidental Death & Dismemberment (AD&D) insurance

• 403(b) retirement plan with company match

• Paid sick leave

• Vacation leave accrual

• Paid holidays

• Eligible for overtime pay

• Eligible for premium working holiday pay rate

• KCRW is a qualifying employer under the Public Service Loan Forgiveness (PSLF) program.

Working Hours: 40 hours per week. This is a full-time temporary employee position.

📝 Enhancement Note: The salary range is competitive for a Senior Product Designer & Front End Engineer in the Los Angeles metropolitan area. The inclusion of benefits typical for full-time employees, even for a temporary role, is a positive indicator. The PSLF eligibility is a significant perk for those in public service and should be highlighted. The "Temporary" status means that some benefits like long-term health insurance or retirement contributions might have specific eligibility periods or limitations, though the listed benefits suggest a comprehensive package.

🎯 Team & Company Context

🏢 Company Culture

Industry: Public Media / Non-profit Broadcasting. KCRW operates as NPR's flagship member station in Southern California, focusing on a mix of music, news, and culture. This industry demands a strong commitment to public service, community engagement, and high-quality content delivery.

Company Size: [While not explicitly stated, KCRW is a well-established public radio station with a significant operational footprint, likely falling into the 200-500 employee range based on typical public media organizations.]

Founded: KCRW has been serving Southern California for over 30 years, evolving into a next-generation public media organization.

Team Structure:

• The role reports to the Director of Project Management, indicating a structured project-driven environment.

• This position will involve close collaboration with product, engineering, marketing, content, and audience teams, suggesting a highly cross-functional and collaborative team dynamic.

• The digital product team is likely comprised of individuals focused on content management, user experience, and technical development to support KCRW's mission. Methodology:

• Focus on audience-centered design and development, driven by insights from audience engagement and analytics.

• Emphasis on creating accessible, performant, and scalable digital experiences that align with KCRW's brand and mission.

• A blend of creative innovation and pragmatic execution to modernize and evolve the digital ecosystem.

• Collaborative approach to problem-solving, integrating feedback from diverse stakeholders.

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

📝 Enhancement Note: The non-profit, public service nature of KCRW means the culture likely prioritizes mission-driven work, community impact, and creative excellence over pure profit motives. This environment can be very rewarding for individuals who are passionate about media, culture, and public engagement. The "Temporary" nature of the role might mean it's focused on a specific, high-impact project within this broader mission.

📈 Career & Growth Analysis

Operations Career Level: This role is positioned as a "Senior" individual contributor, signifying a high level of expertise and autonomy. It bridges the gap between design and development, offering a unique opportunity to influence both the aesthetic and functional aspects of digital products.

Reporting Structure: The role reports to the Director of Project Management. This suggests that project timelines, scope, and deliverables will be a primary focus, with the Director overseeing the strategic direction and execution of KCRW's digital initiatives.

Operations Impact: The impact of this role is directly tied to enhancing KCRW's digital presence. Success will be measured by improvements in usability, accessibility, audience engagement, and retention across digital platforms. By modernizing the digital ecosystem, this role contributes to KCRW's ability to reach and connect with its audience, thereby supporting its mission and membership growth.

Growth Opportunities:

• Skill Specialization: While this role is a hybrid, there's potential to deepen expertise in either advanced UI/UX design, complex front-end architecture, or the integration of digital platforms with CRM/MarTech stacks.

• Technical Leadership: As a Senior role, there's an opportunity to mentor junior team members, establish best practices, and influence technical and design decisions for future projects.

• Project Impact: Successfully delivering on key digital enhancements can lead to further project opportunities or a potential for longer-term engagement if the organizational needs evolve.

• Cross-Functional Experience: Gaining experience working with diverse teams (editorial, marketing, membership, engineering) within a public media context provides valuable transferable skills.

📝 Enhancement Note: The "Senior" title and the hybrid nature of the role suggest significant responsibility and the potential for high visibility. For candidates looking to advance their careers in digital product development, this position offers a chance to hone both design strategy and technical implementation skills within a mission-driven organization. The temporary nature, however, means growth would likely be measured by project success and skill development rather than immediate long-term career pathing within KCRW.

🌐 Work Environment

Office Type: KCRW likely operates from a professional office environment, supporting a hybrid work model. This suggests a balance between in-office collaboration and remote flexibility.

Office Location(s): The role is based in Santa Monica, CA. This location offers a vibrant work environment and access to a strong tech and media talent pool. Specific details about office amenities or accessibility would need to be confirmed directly.

Workspace Context:

• Collaborative Environment: The hybrid model and emphasis on cross-functional collaboration suggest an environment where teamwork and communication are highly valued. Expect regular interaction with designers, engineers, product managers, and content creators.

• Technology & Tools: Access to modern design and development tools, including Figma, and potentially a well-equipped tech stack for front-end development. The company's investment in modernizing its digital ecosystem implies a commitment to providing necessary resources.

• Team Interaction: Opportunities to engage with a passionate team dedicated to KCRW's mission, fostering a culture of creativity and innovation.

Work Schedule: Standard 40-hour work week, with a hybrid arrangement allowing for flexibility. This schedule is conducive to focused work, whether in the office or remotely, and accommodates the demands of project-based work.

📝 Enhancement Note: The hybrid work arrangement is a key aspect of the work environment, offering flexibility. For a role that requires deep focus in both design and coding, this balance is often beneficial. The emphasis on collaboration within a hybrid setup implies a need for strong asynchronous and synchronous communication skills.

📄 Application & Portfolio Review Process

Interview Process:

• Initial Screening: A review of your resume and portfolio to assess qualifications and alignment with the role's hybrid requirements.

• Design/Technical Assessment: This may involve a portfolio review session where you walk through your projects, explaining your design process, technical choices, and the impact of your work. It could also include a practical design or coding challenge, either take-home or live, to evaluate your skills in Figma and front-end development (e.g., React, TypeScript).

• Cross-Functional Interviews: Discussions with key stakeholders from product, engineering, and content teams to assess your collaboration style, problem-solving approach, and understanding of the media/non-profit landscape.

• Final Interview: Likely with the Director of Project Management or a senior leader to discuss overall fit, strategic thinking, and long-term potential impact.

Portfolio Review Tips:

• Curate Strategically: Select 3-5 of your strongest projects that best demonstrate your hybrid skills in product design and front-end engineering. Prioritize projects that showcase complex problem-solving, user-centered design, and successful implementation.

• Highlight Your Process: For each project, clearly articulate your design thinking, user research, wireframing, prototyping (using Figma), and front-end development process. Explain the "why" behind your decisions.

• Showcase Code Quality: If possible, include links to live projects or GitHub repositories that demonstrate your front-end development skills (React, Next.js, TypeScript). Be prepared to discuss your code architecture, performance optimizations, and accessibility considerations.

• Quantify Impact: Whenever possible, quantify the outcomes of your work. Did your design improve user engagement? Did your code enhance performance? Did your accessibility efforts reach a broader audience?

• Tailor to KCRW: Research KCRW's current digital platforms and mission. Be prepared to discuss how your skills and experience can contribute to their goals, particularly in modernizing their digital ecosystem.

Challenge Preparation:

• Design Challenge: Be ready to tackle a design problem that might involve improving an existing feature or designing a new one for a media/content platform. Focus on user empathy, clear user flows, and accessible UI.

• Coding Challenge: Expect a challenge that tests your proficiency in React, Next.js, and TypeScript. This could involve building a component, integrating with mock APIs, or solving a performance-related issue. Practice common patterns and data structures.

• Integration Scenarios: Given the emphasis on integrations, be prepared to discuss how you would approach connecting different systems or consuming data from APIs.

📝 Enhancement Note: The hybrid nature of this role means the interview process will likely assess both design creativity and technical execution rigorously. Candidates should prepare to articulate their thought process for both design decisions and coding solutions. The portfolio is the primary tool for demonstrating this dual capability.

🛠 Tools & Technology Stack

Primary Tools:

• Figma: Expert proficiency required for UI/UX design, wireframing, prototyping, and design system development.

• React: Strong experience developing web applications with this JavaScript library.

• Next.js: Experience building performant, server-rendered applications.

• TypeScript: Proficiency in using this strongly typed superset of JavaScript for robust application development.

• HTML5 & CSS3/SCSS: Core web technologies for structuring and styling interfaces.

• Git: Essential for version control and collaborative development workflows.

Analytics & Reporting:

• Google Analytics (GA4): Familiarity with web analytics for tracking user behavior and performance.

• Other Analytics Platforms: Experience with various analytics tools to measure audience engagement and content consumption.

CRM & Automation:

• Contentful: Specific experience with this headless CMS is highly valued for content management and delivery.

• Salesforce, HubSpot, Zendesk: Familiarity with these platforms is preferred for understanding integrations with CRM, marketing automation, and customer support systems.

• APIs (REST & GraphQL): Experience integrating with and consuming data from various APIs.

Integration & Cloud:

• Middleware/Integration Platforms: Preferred experience in connecting disparate systems.

• Vercel, AWS: Experience with cloud hosting environments is a plus for deployment and scaling.

📝 Enhancement Note: The technology stack is modern and leans heavily towards a component-based, API-driven architecture common in today's digital product development. The emphasis on specific tools like Figma and React/Next.js/TypeScript, along with the mention of Contentful, indicates a clear expectation of proficiency in these areas. Understanding how these tools integrate with CRM and marketing platforms is also a key requirement.

👥 Team Culture & Values

Operations Values:

• Mission-Driven: A strong commitment to KCRW's public service mission, focusing on delivering high-quality, accessible content to the community.

• Collaboration: A culture that emphasizes teamwork, open communication, and mutual support across diverse departments (editorial, marketing, engineering, etc.).

• Creativity & Innovation: Encouraging innovative approaches to digital experiences and content delivery to engage audiences in new ways.

• Excellence & Quality: A dedication to producing polished, performant, and accessible digital products that reflect KCRW's reputation for excellence.

• Audience Focus: Prioritizing the needs and experiences of KCRW's diverse audience in all design and development decisions.

Collaboration Style:

• Cross-Functional Integration: Expect a highly collaborative environment where designers, engineers, content creators, and marketing professionals work closely together to achieve common goals.

• Agile & Iterative: Likely an agile or iterative approach to product development, involving regular feedback loops and continuous improvement.

• Knowledge Sharing: A culture that encourages sharing best practices, technical insights, and design principles to foster collective growth and efficiency.

📝 Enhancement Note: The culture at KCRW is likely to be a blend of creative energy from a media organization and the structured, mission-oriented approach of a non-profit. Candidates who are passionate about media and community impact, and who thrive in collaborative, iterative environments, will find this culture appealing.

⚡ Challenges & Growth Opportunities

Challenges:

• Hybrid Skill Demands: The primary challenge is the need to excel in two distinct, highly skilled areas: product design and front-end engineering. Balancing these demands effectively requires strong time management and multitasking abilities.

• Legacy System Integration: Integrating modern front-end applications and design systems with existing or legacy backend systems and third-party platforms can present technical complexities.

• Balancing Creative Vision with Pragmatic Delivery: As a temporary role focused on specific project goals, there will be a need to balance innovative design and development with project timelines, budget constraints, and organizational priorities.

• Evolving Digital Landscape: Staying current with rapidly evolving design tools, front-end technologies, and audience engagement trends in the digital media space.

Learning & Development Opportunities:

• Deepen Hybrid Expertise: Opportunity to hone skills in both advanced UI/UX design techniques and modern front-end development practices, potentially leading to a more specialized hybrid role in the future.

• Mastery of Modern Stacks: Gaining hands-on experience with React, Next.js, TypeScript, and headless CMS like Contentful in a real-world, high-impact environment.

• Cross-Functional Project Experience: Working on diverse projects involving content, membership, and events will broaden understanding of digital product strategy in a media context.

• Contribution to Design Systems: Opportunity to significantly contribute to or even lead the evolution of a digital design system, a valuable skill for any product designer/engineer.

📝 Enhancement Note: The challenges are inherent to the hybrid nature of the role and the dynamic digital media industry. The growth opportunities are substantial, offering a chance to become a highly versatile and sought-after professional in the digital product space.

💡 Interview Preparation

Strategy Questions:

• "Describe a project where you had to balance user experience goals with technical constraints. How did you navigate that trade-off?" (Focus on demonstrating your problem-solving approach in both design and engineering).

• "How would you approach designing and implementing a new feature for a public media website, considering accessibility, performance, and audience engagement?" (Prepare a brief, high-level case study outlining your process).

• "Walk me through your process for creating or contributing to a design system. What are the key components, and how do you ensure its adoption and maintenance?" (Highlight your understanding of reusability and consistency).

• "How do you stay updated on emerging trends in UI/UX design and front-end development, and how do you decide which to adopt?" (Show your commitment to continuous learning and strategic adoption). Company & Culture Questions:

• "What interests you about KCRW's mission and its role in the Southern California community?" (Research KCRW's content, audience, and impact).

• "How do you see your hybrid design and engineering skills contributing to KCRW's goal of modernizing its digital ecosystem?" (Connect your skills directly to their stated objectives).

• "Describe your experience working in a collaborative, cross-functional team environment. How do you handle differing opinions or priorities?" (Demonstrate your teamwork and communication skills). Portfolio Presentation Strategy:

• Narrative Arc: For each project, structure your presentation with a clear beginning (problem/goal), middle (your process, design decisions, technical implementation), and end (outcome, impact, lessons learned).

• Show, Don't Just Tell: Use visual aids extensively. For design projects, show wireframes, mockups, and interactive prototypes. For engineering projects, show live demos, code snippets, or performance metrics.

• Emphasize the Hybrid: Explicitly call out where your design thinking informed your engineering choices, and vice-versa. Highlight how you bridged the gap between the two disciplines.

• Quantify Impact: Be ready to discuss metrics, user feedback, or any measurable results that demonstrate the success of your work.

• Be Prepared for Deep Dives: Have detailed answers ready for questions about specific design choices, coding patterns, accessibility considerations, and integration strategies.

📝 Enhancement Note: The interview preparation should focus on demonstrating a strong understanding of both design principles and technical implementation, and how these two areas intersect. Candidates should be ready to articulate their process, justify their decisions, and showcase tangible results from their work.

📌 Application Steps

To apply for this Senior Product Designer & Front End Engineer position:

• Submit your application through the provided ADP link.

• Portfolio Customization: Tailor your portfolio to highlight projects that best showcase your hybrid design and front-end engineering skills, with a focus on user experience, accessibility, and modern web technologies (React, Next.js, TypeScript). Include specific examples of Figma work and implemented front-end code.

• Resume Optimization: Ensure your resume clearly articulates your 5+ years of experience in both design and development. Use keywords from the job description such as "Product Design," "UI/UX," "Front End Engineering," "React," "TypeScript," "Figma," "WCAG," and "Headless CMS." Quantify achievements where possible.

• Prepare Your Narrative: Practice walking through your key portfolio projects, explaining your role, design process, technical implementation, and the impact of your work. Be ready to discuss your approach to accessibility and performance.

• Company Research: Familiarize yourself with KCRW's mission, content, digital platforms, and audience. Understand their current digital challenges and how your skills can contribute to their modernization efforts.

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