Design Engineer

Job Description

Design Engineers at FlowFuse bridge the gap between product design and front-end engineering, combining UX with technical expertise to deliver better holistically considered user experiences faster.

This is a true hybrid role requiring equal mastery of both product design and technical aptness in code—you'll design high-level concepts in Figma AND you will move quickly to try out ideas in code with the potential to implement or aid in implementing them into production. You should be as comfortable in design tooling as you are on the command line and in an IDE.

As a Design Engineer, you'll own user journeys end-to-end, from initial concept through final implementation. You'll work with your team to develop quick iterations on ideas, shifting between responsibilities for UX, Product, and Development—filling gaps where necessary by conducting user research, journey mapping, UI and systems design, prototyping, roadmapping, and development while staying the main advocate for the user's perspective.

You'll leverage AI tools strategically to explore design directions, generate functional prototypes or implementations, and iterate rapidly. This accelerates the team's velocity without compromising quality or implementation.

You value craft and attention to detail. You collaborate naturally across disciplines. You're comfortable leading product design work while having the technical skills to prototype and implement when the situation demands it. You can advocate passionately for users while understanding the technical realities of building great products.

Design Engineers at FlowFuse set the standard and vision for user-centered design while thinking and working cross-functionally. You'll influence how the organization balances user needs, design excellence, and engineering constraints—ensuring we build products that users love and that teams can actually ship.

Responsibilities

• User advocacy: Champion the user's perspective across all product decisions, ensuring user needs drive design and implementation choices
• User research and validation: Conduct user interviews, usability testing, and synthesize findings to inform design decisions
• User journey mapping: Create, manage, and advocate for defining and maintaining quality of user journeys across the application.
• Visual and interaction design: Create interfaces in Figma that solve real user problems while maintaining visual excellence
• Design system development: Build and maintain design system components with meticulous attention to detail, polish, and interaction design
• AI-accelerated prototyping: Leverage AI tools for design exploration, code generation, and rapid prototyping to increase team velocity
• Front-end implementation support: Build prototypes with AI-assisted tools AND step in to implement features when front-end engineering capacity is needed
• Performance, accessibility and interaction design: Advocate for and define accessibility improvements including interactions and performance related
• Product strategy contribution: Participate in scoping, roadmapping, feature prioritization, and product planning discussions in line with business needs
• Cross-functional gap filling: Step in where needed across UX, Product, and Engineering to keep projects moving forward
• Technical-design translation: Bridge design and engineering teams, ensuring designs are both beautiful and implementable

Skills

Required - Design Focus (Primary, ~70%):

• UI design fundamentals: Strong understanding of layout, typography, color theory, visual hierarchy, and composition
• Figma proficiency: Expert-level ability to design production-ready interfaces, components, and design systems in Figma
• AI proficiency: Continuously improving ability to work with AI technology to increase velocity across all your responsibilities
• Interaction design: Deep knowledge of interaction patterns, state transitions, user flows, and UX principles
• Accessibility expertise: Deep knowledge of WCAG standards, screen readers, and inclusive design practices
• User research fundamentals: Ability to conduct user interviews, usability testing, and synthesize findings to inform design
• Product thinking: Understanding of product strategy, roadmapping, feature prioritization, and user-centered decision making
• Design systems thinking: Understanding of component-driven design, design tokens, style guides, and scalable architecture
• Cross-functional communication: Ability to articulate design decisions and technical trade-offs to diverse stakeholders
• Collaboration and gap-filling mindset: Comfort working across UX, Product, and Engineering, stepping in where needed

Required - Technical Capability (Secondary, ~30%):

• HTML & CSS proficiency: Strong knowledge of modern HTML5, CSS3, responsive design, CSS Grid, Flexbox, and CSS animations—capable of implementing production features
• JavaScript/TypeScript skills: Solid proficiency in modern JavaScript (ES6+) for functional prototyping and feature implementation, including familiarity with frameworks like Vue.
• Git version control: Solid understanding of Git workflows, branching, pull requests, and code review processes
• Browser DevTools: Proficiency using Chrome DevTools or equivalent for debugging, performance analysis, and responsive testing
• Performance awareness: Knowledge of web performance best practices, Core Web Vitals, and optimization techniques

Nice to Have

• Backend awareness: Understanding of APIs, databases, and server-side concepts to enable better collaboration
• Component documentation: Experience with Storybook, Chromatic, or similar documentation tools
• Testing practices: Knowledge of unit testing, integration testing, and test-driven development
• Build tools and bundlers: Experience with Webpack, Vite, esbuild, or similar tools

90-Day Plan

• Week 1-4: Foundation and First Contribution

  • Deep Product Immersion: Become an expert user of FlowFuse and Node-RED, understanding target audience, and all user journeys, features, limitations, and architectural decisions.
  • Internal Alignment: Meet with product, engineering, and market teams to understand business objectives, technical constraints, release cadence, and go-to-market strategies. Ensure you know where to get what information and who to loop in where, and you are part of engineering meetings, and product-planning meetings.
  • Community Assessment: Audit existing community channels across Node-RED and FlowFuse, user feedback, and contribution patterns.
  • Design and user research alignment: Study the existing design artifacts and design system, and contribute your first improvements. Participate in and review user-research, inteview or monitoring sessions, and partake in experimentation initiatives.
  • Code familiarity: Set up comprehensive development environment and contribute your first improvements to the application and website.
  • Initial journey development: Participate in designing and delivering on improving user journeys with your team.
  • Backlog familiarity: Develop an understanding of the backlog and how it pertains to the various user journeys

• Week 5-8: Integration and Ownership

  • Success Metrics: Establish and begin tracking key performance indicators for product growth, product adoption, and developer engagement.
  • Contributions: Ship your first major improvements to FlowFuse and Node-RED, demonstrating journey ownership from concept, to design, prototyping, implementation, and finished delivery.
  • Dedicated research: Conduct dedicated user research to aid in vision setting and/or improving product areas.
  • Vision development: Make significant pro-active contributions to the product strategy through defining vision designs in collaboration with your team.
  • Product development: Lead design and solution validation through prototyping for an epic, collaborating cross-functionally with potential of implementing the front-end code yourself.
  • AI acceleration: Demonstrate AI-accelerated iterative workflow to reach your team's goals.
  • Cross-functional review: Participate in design critiques, product planning, and code reviews.
  • Journey Architecture: Start participating in creating and maintaining the user journey architecture of the application and how it relates to the backlog and product vision. This will be a vital framework and tool to use to push forward the product and bring together the cross-functional disciplines.

• Week 9-13: Impact and Strategic Influence

  • Design leadership: Lead design and user advocacy for experiences, rapidly iterating with AI tools and implementing when needed.
  • Team efficiency: Propose and implement improvements to team processes or tooling to continuously improve the quality and efficiency mindset and implementation.
  • Measurability: Contribute and demonstrate measurable impact towards business KPIs regarding initiatives you are part of.
  • Product ownership: Take ownership of specific areas of the product, including tools such as the design system to increase efficiency across the organisation.
  • Strategic contribution: Actively contribute to strategic product maturity initiatives in alignment with business needs.
  • Product evangelization: Begin contributing to evangelization of Node-RED's and FlowFuse's product design, roadmap, and vision internally and externally.
  • Continuous external input: Participate and define workflows to incorporate user feedback, community input, and market analysis on a continuous basis aiding the product roadmap.

Beyond 90 Days

• Hiring and mentoring: Lead efforts to recommend and hire new team members. Mentor existing team members on design-engineering collaboration, user advocacy, and best practices.
• Product evangelization leadership: Deliver blog posts, presentations, and external speaking engagements to evangelize Node-RED's and FlowFuse's product design, roadmap, and vision.
• Strategic initiative ownership: Launch and own strategic product maturity initiatives that mature the product holistically in alignment with business needs.
• Design system leadership: Establish and evolve the design system as a critical organizational efficiency tool, driving adoption and standards.

Hiring Plan

1. Initial Screening: Review resumes, cover letters and Design Portfolio to assess candidate qualifications and experience.
2. First/peer interview: Conduct a video interview to assess past experience, portfolio, and abilities related to the Design Engineer role, and evaluate communication skills and cultural fit. Past hands-on experience with start-to-finish shipping experiences, user research experience, and ability to articulate design decisions is essential for credibility and decision-making.
3. Manager/team interview: Meet with leadership/team to discuss career goals, alignment with company values, and team fit, direct upcoming responsibilities and projected timeline if hired.
4. Design/Technical Assessment: Live design/prototyping/coding session designing and building an experience improvement. Assess design and coding proficiency, AI tool usage, and ability to chime in for product and/or development when needed.
5. STAR Interview (Behavioral Alignment): A behavioral interview to understand past experiences and assess alignment with FlowFuse's values, initiative, and collaboration style. Conducted by the CEO.
6. Offer: Extend offer to selected candidate.