Job Application for Principal Product Design Engineer at Shift4

New

Overview

Shift4 (NYSE: FOUR) is boldly redefining commerce by simplifying complex payments ecosystems across the world. As the leader in commerce-enabling technology, Shift4 powers billions of transactions annually for hundreds of thousands of businesses in virtually every industry. For more information, visit www.shift4.com.

We’re looking for a Product Design Engineer to be the connective tissue between Product Design and Engineering. This role sits at the intersection of UX, front‑end implementation, and systems thinking: you turn Figma into robust, reusable code, shape our design system in production, and lay the technical foundations that allow the Design organization to scale.

You’ll build interactive, high‑fidelity prototypes and production‑ready UI components, using AI‑assisted tools to accelerate exploration, prototyping, and iteration. You’ll partner closely with product designers, engineers, and product managers to bring ideas to life quickly, test them with users, and translate strong design intent into scalable implementation and a reliable design‑to‑code pipeline.

Responsibilities

Bridge design and engineering

Translate design specs, components, and interaction patterns into high‑quality front‑end implementations that can be adopted by engineering teams.
Work closely with designers to refine interaction details, states, and edge cases, then express them as code, stories, and clear usage guidelines.
Collaborate with engineers to ensure prototypes align with technical constraints and can transition smoothly toward production.

Prototyping and AI‑assisted workflows

Build high‑fidelity, interactive prototypes using a mix of design tools, AI prototyping tools (e.g., Claude‑style assistants, Replit, Figma AI), and code.
Use AI‑assisted tools to rapidly explore ideas, generate UI logic, scaffold components, and iterate faster while maintaining implementation quality and consistency.
Support UX research by preparing realistic prototypes for testing and iterating quickly based on user feedback and data.

Design System in Code

Build and maintain the coded design system (components, tokens, utilities) in partnership with design system owners and front‑end leads.
Ensure a tight mapping between Figma and code so components, variants, and tokens in Figma have clear, predictable equivalents in React/Vue and CSS/Tailwind.
Establish standards for accessibility, performance, and theming within the component library, and ensure these standards are upheld across teams.

Foundations, tools, and workflows

Set up and evolve tools, workflows, and repository structures that designers rely on for design‑to‑code (e.g., Storybook, design system sites, sandboxes, playgrounds).
Define foundational conventions (naming, file structure, contribution guidelines, review processes) that make it easy for designers and engineers to extend the system.
Partner with platform and DevEx teams to integrate design system components into product repos and CI/CD workflows.

Collaboration and enablement

Pair with designers to upskill them on implementation realities and with engineers to deepen their understanding of design intent and UX quality.
Support the adoption of AI prototyping tools and AI‑driven workflows within the design team, helping designers build confidence and fluency with new technologies.
Create documentation, examples, and “how‑to” guides that help product teams use and extend the design system correctly.

Qualifications

8+ years of experience in product design engineering, UX engineering, design technology, UI engineering, or a similar hybrid role.
Strong understanding of product design principles, UX patterns, and interaction design, with examples of complex product workflows.
Strong proficiency in modern front‑end technologies: HTML, CSS, JavaScript/TypeScript, and a component framework such as React.
Demonstrated experience implementing and maintaining a component library or design system in production.
Comfortable working in Figma (or equivalent) and mapping design structures (components, variants, tokens) to code architectures.
Experience building prototypes that go beyond click‑throughs (real data, logic, interactions, and edge cases).
Experience collaborating closely with product designers, engineers, and product managers to ship user‑facing features in cross‑functional, Agile teams.
Strong communication skills in English both written and verbal an with the ability to explain both design and technical decisions clearly to diverse stakeholders.
Experience with design systems and component libraries, including contribution and governance.
Strong knowledge of AI tools to accelerate design and development workflows, and interest in shaping how they’re used in design‑to‑code.

Nice‑to‑have

Experience in a SaaS or payments/fintech environment with complex, data‑heavy interfaces.
Familiarity with mobile platforms (Android; Kotlin a plus).
Experience with documentation tools (Storybook, MDX, internal component galleries) and design system governance.
Comfort with basic backend concepts and APIs sufficient to wire up realistic data into prototypes and component examples.
Experience exploring and prototyping new interaction models, including AI‑assisted user flows, automated tasks, agent‑based experiences, voice interactions, or hardware‑connected interfaces.

#LI-BN1

We are an Equal Opportunity Employer and do not discriminate against any employee or applicant for employment because of race, color, sex, age, national origin, religion, sexual orientation, gender identity and/or expression, status as a veteran, and basis of disability or any other federal, state or local protected class.

Create a Job Alert

Interested in building your career at Shift4? Get future opportunities sent straight to your email.

First Name

Last Name

Country

Phone

Resume/CV*

Accepted file types: pdf, doc, docx, txt, rtf

Are you legally authorized to work in the country you're applying to?

Select...

Do you now, or will you in the future, require sponsorship for work authorization (e.g., H- 1B)? (if hired, verification will be required consistent with federal law.)

Select...

Have you worked for Shift4, or an affiliate of Shift4 before?

Select...

This includes any companies that have been acquired by Shift4.

This role is direct full-time and not contract or corp to corp. Do you satisfy this requirement?

Select...

This role is onsite based at Shift4's Tampa, FL location. Are you able to work onsite at this location?

Select...

Do you possess 6+ years of experience in product design engineering, UX engineering, design technology, UI engineering, or a similar hybrid role?

Select...

Do you possess a strong understanding of product design principles, UX patterns, and interaction design, with examples of complex product workflows?

Select...

Please include a link to your design portfolio.

Do you possess a strong proficiency in modern front‑end technologies: HTML, CSS, JavaScript/TypeScript, and a component framework such as React?

Select...

Do you possess demonstrated experience implementing and maintaining a component library or design system in production?

Select...

Are you comfortable working in Figma (or equivalent) and mapping design structures (components, variants, tokens) to code architectures?

Select...

Do you possess experience building prototypes that go beyond click‑throughs (real data, logic, interactions, and edge cases)?

Select...

Do you have solid communication skills in English, both written and verbal, with the ability to explain both design and technical decisions clearly to diverse stakeholders?

Select...

Do you possess strong knowledge of AI tools to accelerate design and development workflows, and interest in shaping how they’re used in design‑to‑code?

Select...

What is your targeted annual base salary range?

Do you have a LinkedIn Profile you would like to share? If yes, please include link below. If no, please list N/A.

Voluntary Self-Identification

For government reporting purposes, we ask candidates to respond to the below self-identification survey. Completion of the form is entirely voluntary. Whatever your decision, it will not be considered in the hiring process or thereafter. Any information that you do provide will be recorded and maintained in a confidential file.

As set forth in Shift4’s Equal Employment Opportunity policy, we do not discriminate on the basis of any protected group status under any applicable law.

Gender

Select...

Are you Hispanic/Latino?

Select...

Race & Ethnicity Definitions

If you believe you belong to any of the categories of protected veterans listed below, please indicate by making the appropriate selection. As a government contractor subject to the Vietnam Era Veterans Readjustment Assistance Act (VEVRAA), we request this information in order to measure the effectiveness of the outreach and positive recruitment efforts we undertake pursuant to VEVRAA. Classification of protected categories is as follows:

A "disabled veteran" is one of the following: a veteran of the U.S. military, ground, naval or air service who is entitled to compensation (or who but for the receipt of military retired pay would be entitled to compensation) under laws administered by the Secretary of Veterans Affairs; or a person who was discharged or released from active duty because of a service-connected disability.

A "recently separated veteran" means any veteran during the three-year period beginning on the date of such veteran's discharge or release from active duty in the U.S. military, ground, naval, or air service.

An "active duty wartime or campaign badge veteran" means a veteran who served on active duty in the U.S. military, ground, naval or air service during a war, or in a campaign or expedition for which a campaign badge has been authorized under the laws administered by the Department of Defense.

An "Armed forces service medal veteran" means a veteran who, while serving on active duty in the U.S. military, ground, naval or air service, participated in a United States military operation for which an Armed Forces service medal was awarded pursuant to Executive Order 12985.

Veteran Status

Select...

Voluntary Self-Identification of Disability

Form CC-305

Page 1 of 1

OMB Control Number 1250-0005

Expires 04/30/2026

Why are you being asked to complete this form?

We are a federal contractor or subcontractor. The law requires us to provide equal employment opportunity to qualified people with disabilities. We have a goal of having at least 7% of our workers as people with disabilities. The law says we must measure our progress towards this goal. To do this, we must ask applicants and employees if they have a disability or have ever had one. People can become disabled, so we need to ask this question at least every five years.

Completing this form is voluntary, and we hope that you will choose to do so. Your answer is confidential. No one who makes hiring decisions will see it. Your decision to complete the form and your answer will not harm you in any way. If you want to learn more about the law or this form, visit the U.S. Department of Labor’s Office of Federal Contract Compliance Programs (OFCCP) website at www.dol.gov/ofccp.

How do you know if you have a disability?

A disability is a condition that substantially limits one or more of your “major life activities.” If you have or have ever had such a condition, you are a person with a disability. Disabilities include, but are not limited to:

Alcohol or other substance use disorder (not currently using drugs illegally)
Autoimmune disorder, for example, lupus, fibromyalgia, rheumatoid arthritis, HIV/AIDS
Blind or low vision
Cancer (past or present)
Cardiovascular or heart disease
Celiac disease
Cerebral palsy
Deaf or serious difficulty hearing
Diabetes
Disfigurement, for example, disfigurement caused by burns, wounds, accidents, or congenital disorders
Epilepsy or other seizure disorder
Gastrointestinal disorders, for example, Crohn's Disease, irritable bowel syndrome
Intellectual or developmental disability
Mental health conditions, for example, depression, bipolar disorder, anxiety disorder, schizophrenia, PTSD
Missing limbs or partially missing limbs
Mobility impairment, benefiting from the use of a wheelchair, scooter, walker, leg brace(s) and/or other supports
Nervous system condition, for example, migraine headaches, Parkinson’s disease, multiple sclerosis (MS)
Neurodivergence, for example, attention-deficit/hyperactivity disorder (ADHD), autism spectrum disorder, dyslexia, dyspraxia, other learning disabilities
Partial or complete paralysis (any cause)
Pulmonary or respiratory conditions, for example, tuberculosis, asthma, emphysema
Short stature (dwarfism)
Traumatic brain injury

Disability Status

Select...

PUBLIC BURDEN STATEMENT: According to the Paperwork Reduction Act of 1995 no persons are required to respond to a collection of information unless such collection displays a valid OMB control number. This survey should take about 5 minutes to complete.

Principal Product Design Engineer

Overview

Responsibilities

Apply for this job

Voluntary Self-Identification

Voluntary Self-Identification of Disability