Product Designer / Design Engineer (w/m/d)

📍 Job Overview

Job Title: Product Designer / Design Engineer (w/m/d)

Company: Clarius Group

Location: Eschborn, Hesse, Germany (On-site/Hybrid) & Remote (Hamburg, Germany)

Job Type: Full-time (Festanstellung)

Category: Product Design / Design Engineering

Date Posted: 2026-09-29

Experience Level: Mid-Level (2-5 years)

Remote Status: Hybrid / Remote OK

🚀 Role Summary

• Drive end-to-end product design for complex B2B SaaS platforms, focusing on intuitive user experiences and efficient workflows.

• Bridge the gap between product design, design systems, and frontend development through component-based UI design and direct technical implementation.

• Build and optimize AI-supported, agentic product development processes, enhancing the entire design-to-code lifecycle.

• Contribute to the development and maintenance of a robust design system, ensuring consistency across product, code, and user interfaces.

• Collaborate closely with product and development teams in an interdisciplinary environment, leveraging modern technologies and agile methodologies.

📝 Enhancement Note: This role emphasizes a unique blend of traditional product design and "design engineering," highlighting the integration of AI and agentic workflows into the development process. The "w/m/d" designation indicates inclusivity for all genders.

📈 Primary Responsibilities

• Develop comprehensive information architectures and user flows for complex B2B SaaS applications.

• Create, explore, and validate UX and UI concepts for intricate business processes, including workflows, forms, tables, dashboards, and configuration interfaces.

• Execute rapid prototyping and validation of diverse solution approaches to ensure user-centricity and feasibility.

• Provide ongoing guidance and review throughout the technical implementation phase, ensuring design fidelity and adherence to best practices.

• Evolve and refine existing interfaces and interaction patterns based on user feedback, performance data, and evolving product strategy.

• Design and implement reusable UI components, variants, states, and interactions within a component-based framework.

• Translate design decisions directly into frontend-ready components through connected design tools and component libraries.

• Develop and maintain design tokens for typography, colors, spacing, and other visual elements to ensure system consistency.

• Contribute to the definition and enforcement of design patterns, interaction principles, and component usage guidelines.

• Actively participate in the development and refinement of AI-native product development processes, from requirement gathering through to design review and implementation.

• Integrate requirements, UX design, prototyping, component mapping, and technical implementation into seamless, agentic workflows.

• Utilize AI tools beyond simple mockups and code snippets to support the broader product development lifecycle.

📝 Enhancement Note: The responsibilities clearly indicate a "design engineering" approach, where the designer is expected to have a strong understanding of frontend development and contribute directly to the codebase or its direct precursors through tools like Storybook. The AI-native aspect suggests a focus on automation and intelligent workflows in the design and development process.

🎓 Skills & Qualifications

Education: While no specific degree is mandated, a strong educational background in Design, Human-Computer Interaction, Computer Science, or a related field, complemented by practical experience, is highly valued.

Experience: Several years of experience in Product Design, UI/UX Design, or Design Engineering, with a proven track record in developing complex B2B SaaS or enterprise-level products.

Required Skills:

• Proven experience in designing complex user flows, information architectures, and interaction concepts for data-intensive interfaces.

• Deep understanding of component-based product design principles, design systems, and the creation/maintenance of component libraries.

• Proficiency in design tools (e.g., Figma) for concept development, prototyping, and UI design.

• Experience at the intersection of design and frontend development, with a strong understanding of HTML/CSS.

• Familiarity with AI-supported development processes, agentic workflows, and structured agent instructions.

• Ability to translate complex requirements into intuitive and user-friendly experiences.

• Independent, structured, and pragmatic work style with a high standard for quality.

• Openness to rapid iterations and adoption of new design, development, and AI tools.

• Fluent German and English language proficiency (written and spoken). Preferred Skills:

• Foundational knowledge of React or similar JavaScript frameworks.

• Experience with Storybook for component development and documentation.

• Familiarity with the shadcn/ui component library.

• Experience with multi-tenant applications, Role-Based Access Control (RBAC), internationalization (i18n), and accessibility standards.

• Experience in Legal & Finance industry applications.

📝 Enhancement Note: The emphasis on "design engineering" and the mention of Storybook, HTML/CSS, and React suggest that candidates with a hybrid skillset are highly sought after. The preference for specific technologies like shadcn/ui indicates a modern frontend stack.

📊 Process & Systems Portfolio Requirements

Portfolio Essentials:

• Showcase end-to-end product design projects, demonstrating the full lifecycle from initial concept to final implementation.

• Highlight complex B2B SaaS or enterprise product designs, emphasizing user flows, information architecture, and data-intensive interfaces.

• Include examples of component-based design, design system contributions, and the creation/maintenance of component libraries.

• Present case studies that illustrate the transition from design to technical implementation, ideally showcasing collaboration with frontend developers or the use of tools like Storybook.

• Demonstrate experience with AI-native design workflows or agentic development processes, detailing how AI was integrated to enhance efficiency or outcomes.

• Quantify the impact of your design solutions where possible, using metrics related to user adoption, task completion rates, or efficiency gains. Process Documentation:

• Document workflows for how you approach problem-solving, from understanding requirements to delivering a final design solution.

• Detail your process for building and maintaining design systems, including component creation, token management, and documentation.

• Explain your methods for collaborating with development teams, ensuring seamless handoffs and ongoing design support.

• Illustrate your approach to integrating AI tools into the design and development process, outlining the steps and expected benefits.

📝 Enhancement Note: A strong portfolio is crucial for this role, demonstrating not just visual design skills but also a deep understanding of system thinking, component architecture, and the practicalities of implementation, especially in a B2B SaaS context. The AI-native aspect requires showcasing how technology is leveraged to improve design processes.

💵 Compensation & Benefits

Salary Range: Based on typical compensation for experienced Product Designers/Design Engineers in Germany (specifically in major tech hubs like Frankfurt/Main area and Hamburg), a salary range of €60,000 - €85,000 per year is estimated. This range is influenced by the candidate's specific years of experience, depth of expertise in B2B SaaS and AI-native workflows, and negotiation skills.

Benefits:

• Flexible working hours to support work-life balance.

• Provision of modern work equipment to facilitate efficient and effective work.

• Attractive opportunities for professional development and continuous learning.

• Opportunity to work within a motivated, interdisciplinary team fostering collaboration and knowledge sharing.

• Regular team events to build camaraderie and foster a positive work environment.

• Health offers to support employee well-being.

Working Hours: The standard working hours are approximately 40 hours per week, with flexibility offered to accommodate individual needs and team collaboration.

📝 Enhancement Note: The salary estimate is based on industry benchmarks for similar roles in Germany, considering the mid-level experience requirement and the specialized nature of design engineering with AI integration. The provided benefits are standard for tech companies in Germany and align with the company's stated culture of employee well-being and development.

🎯 Team & Company Context

🏢 Company Culture

Industry: Managed Services Provider (MSP) within the Technology sector, specifically focusing on B2B SaaS platforms for complex and regulated business processes.

Company Size: Clarius Group is part of a growing enterprise, indicating a stable yet dynamic environment. The specific team size for product design is likely small and agile, fostering close collaboration.

Founded: Clarius Group has a history as a leading MSP in Germany, with CLAIR representing a newer, innovative B2B-SaaS platform development. This suggests a blend of established stability with a forward-thinking, tech-driven innovation culture.

Team Structure:

• The Product Design/Design Engineering role will be part of a dedicated product development team, working closely with Product Managers and Frontend Developers.

• Reporting structure likely involves a Lead Product Designer, Design Manager, or Head of Product, with direct collaboration across engineering squads.

• Cross-functional collaboration is a core aspect, emphasizing seamless integration between design, product, and development teams. Methodology:

• Data-driven design decisions, informed by user research, analytics, and performance metrics.

• Agile and iterative development processes, embracing rapid prototyping and continuous feedback loops.

• Focus on building and maintaining robust design systems and component libraries for scalability and consistency.

• Exploration and implementation of AI-native workflows and agentic development to optimize the product development lifecycle.

Company Website: https://clarius-group.com/

📝 Enhancement Note: The company culture emphasizes innovation, collaboration, and the integration of cutting-edge technologies like AI into product development. The dual nature of Clarius Group (established MSP and innovative SaaS platform) suggests a supportive environment with opportunities for growth and impact.

📈 Career & Growth Analysis

Operations Career Level: This role is positioned as a Mid-Level Product Designer / Design Engineer, requiring 2-5 years of experience. It offers significant autonomy and the opportunity to shape product direction and development processes.

Reporting Structure: The role reports into a product leadership structure, likely a Head of Product or Design Lead, with close daily collaboration with Product Managers and Frontend Engineers. This structure facilitates direct influence on product strategy and execution.

Operations Impact: The Product Designer/Design Engineer directly impacts the usability, efficiency, and adoption of the CLAIR B2B SaaS platform. By translating complex requirements into intuitive experiences and bridging design with development, they enhance user satisfaction, reduce development cycles, and contribute to the platform's overall success and market competitiveness. The focus on AI-native workflows also positions them at the forefront of modern development methodologies.

Growth Opportunities:

• Specialization: Deepen expertise in AI-native design workflows, agentic development, or specific areas of B2B SaaS design (e.g., complex data visualization, regulatory compliance interfaces).

• Leadership: Progress to Senior Product Designer, Lead Design Engineer, or Design Manager roles, taking on more strategic responsibilities and mentoring junior team members.

• Skill Development: Enhance frontend development skills (React, Next.js), gain deeper insights into AI technologies, and become a subject matter expert in design systems and component libraries.

• Cross-functional Leadership: Lead design initiatives across multiple product teams or contribute to strategic product roadmap planning.

📝 Enhancement Note: This role offers a unique growth path for designers interested in the intersection of design, development, and AI. The emphasis on "design engineering" and AI-native workflows provides a distinct advantage for career advancement in a rapidly evolving tech landscape.

🌐 Work Environment

Office Type: The company offers a hybrid work model, with options for on-site work in Eschborn, Germany, and the possibility of full remote work, particularly for those based in or near Hamburg. This suggests a modern, flexible office setup designed for collaboration and individual focus.

Office Location(s):

• Eschborn, Hesse, Germany (Frankfurter Straße 2, 65760)

• Remote option, with a focus on locations like Hamburg, Germany. Workspace Context:

• Collaborative Environment: The emphasis on interdisciplinary teams and close collaboration with Product and Development suggests an open and communicative workspace, whether in-office or virtual.

• Tools & Technology: Access to modern work equipment and cutting-edge design and development tools (Figma, Storybook, AI tools) is a given.

• Team Interaction: Opportunities for regular interaction with colleagues through team meetings, design reviews, and informal communication channels are integral to the workflow.

Work Schedule: The standard work schedule is approximately 40 hours per week, with flexible working hours available. This allows for better integration of personal life with professional responsibilities, especially important for remote or hybrid arrangements.

📝 Enhancement Note: The hybrid and remote options provide significant flexibility, catering to modern work preferences. The Eschborn office likely serves as a central hub for collaboration and team building, while remote work is fully supported.

📄 Application & Portfolio Review Process

Interview Process:

• Initial Screening: A review of your application, resume, and portfolio to assess alignment with the role's requirements and core responsibilities.

• Portfolio Presentation & Technical Discussion: An in-depth discussion of your portfolio, focusing on specific projects that demonstrate your experience in B2B SaaS design, component-based design, and any AI-related workflows. Expect to discuss your design process, decision-making, and technical understanding.

• Design Challenge/Case Study: You may be asked to complete a design exercise or present a case study that tackles a complex design problem relevant to B2B SaaS, potentially involving AI-native concepts.

• Team & Cultural Fit Interview: An opportunity to meet with potential team members (Product Managers, Developers) to assess collaboration style, cultural alignment, and communication skills.

• Final Interview: A discussion with leadership to finalize the offer, covering strategic alignment and long-term vision.

Portfolio Review Tips:

• Curate Strategically: Select 3-4 of your strongest projects that best showcase your experience in complex B2B SaaS, component design, and ideally, any AI-integrated workflows.

• Focus on Process: Clearly articulate your design process for each project, from initial problem definition and user research to concept development, iteration, and final implementation.

• Highlight Impact: Quantify the results of your work whenever possible. Use metrics to demonstrate how your designs improved user experience, efficiency, or business outcomes.

• Showcase Design Engineering: If applicable, include examples of how you've bridged design and development, such as contributions to component libraries, use of Storybook, or direct frontend code.

• Address AI Integration: If you have experience with AI-native workflows, clearly explain your role, the tools used, and the outcomes achieved.

Challenge Preparation:

• Understand B2B SaaS: Familiarize yourself with common challenges and user needs in complex business software environments.

• Component Thinking: Be prepared to discuss how you would design reusable components and contribute to a design system.

• AI Workflow Integration: Consider how AI tools could be applied to streamline design processes, from ideation to implementation.

• Communication: Practice articulating your design rationale clearly and concisely, anticipating questions about trade-offs, constraints, and technical feasibility.

📝 Enhancement Note: The interview process heavily emphasizes practical application and a deep understanding of the design-to-development pipeline, especially with the integration of AI. A well-prepared portfolio that showcases these specific skills is paramount.

🛠 Tools & Technology Stack

Primary Tools:

• Design & Prototyping: Figma (or similar industry-standard tools) for creating wireframes, mockups, and interactive prototypes.

• Component & Design System Management: Storybook (strongly preferred) for developing, documenting, and testing UI components.

• AI & Automation Tools: Various AI platforms and agentic development harnesses for building AI-native workflows. Specific tools will depend on the team's current stack and ongoing development.

• Collaboration & Project Management: Tools like Jira, Confluence, or similar platforms for task tracking, documentation, and team communication.

Analytics & Reporting:

• Tools for user behavior analytics and performance tracking (e.g., Google Analytics, Mixpanel, or platform-specific analytics) to inform design decisions.

• Reporting dashboards for visualizing key metrics and product performance. CRM & Automation:

• While not a primary focus for this role, familiarity with CRM systems (e.g., Salesforce) might be beneficial for understanding the broader business context of B2B SaaS products.

• Automation tools within the design and development workflow will be key, particularly those related to AI agentic processes.

📝 Enhancement Note: Proficiency in Figma and a strong understanding of component-based design managed via tools like Storybook are critical. The role also necessitates an openness and ability to learn and integrate new AI and automation technologies into the design workflow.

👥 Team Culture & Values

Operations Values:

• Innovation & Forward-Thinking: Embracing new technologies like AI and agentic workflows to push the boundaries of product development.

• Collaboration & Transparency: Fostering an open environment where ideas are shared freely, and cross-functional teams work cohesively.

• Quality & Craftsmanship: A commitment to high-quality design and development, ensuring robust, intuitive, and well-engineered products.

• Efficiency & Optimization: Continuously seeking ways to streamline processes, reduce complexity, and improve overall productivity through smart design and technology.

• User-Centricity: Placing the user at the heart of all design decisions, ensuring that complex requirements translate into simple, effective solutions.

Collaboration Style:

• Integrated Teams: Design is not a silo; it's deeply embedded within product and development teams, fostering a shared sense of ownership and responsibility.

• Feedback-Driven: An environment where constructive feedback is regularly exchanged and valued, leading to continuous improvement of both products and processes.

• Knowledge Sharing: Encouraging the sharing of best practices, learnings, and new discoveries, particularly around AI, design systems, and frontend development.

📝 Enhancement Note: The company culture values proactive individuals who are not afraid to experiment with new technologies and methodologies, particularly in the realm of AI-driven product development. A collaborative spirit and a focus on delivering high-quality, efficient solutions are paramount.

⚡ Challenges & Growth Opportunities

Challenges:

• Integrating AI Seamlessly: The primary challenge will be to effectively integrate AI-native workflows and agentic development into established product design and development processes, ensuring practical application and tangible benefits.

• Bridging Design & Development Gaps: Continuously ensuring a smooth and efficient handoff and collaboration between design and frontend development, especially when working with complex components and AI-generated outputs.

• Designing for Complexity: Translating highly complex, often regulated, business processes into intuitive and user-friendly interfaces that cater to enterprise users.

• Keeping Pace with Technology: The rapidly evolving landscape of AI and design tools requires continuous learning and adaptation to leverage the latest advancements effectively.

Learning & Development Opportunities:

• AI & Agentic Development: Extensive opportunities to learn and apply cutting-edge AI technologies and agent-based development methodologies within a real-world product context.

• Advanced Design Systems: Deepen expertise in building, scaling, and maintaining sophisticated design systems and component libraries.

• Frontend Development Skills: Enhance proficiency in modern frontend frameworks (React, Next.js) and related tooling.

• Industry-Specific Design: Gain specialized knowledge in designing for regulated industries (Legal & Finance) and complex B2B SaaS environments.

• Mentorship: Access to experienced professionals within Clarius Group and the broader Clarius ecosystem for guidance and career development.

📝 Enhancement Note: This role offers a unique opportunity to be at the forefront of AI-driven product development. The challenges are significant but directly tied to exciting growth and learning opportunities in a rapidly advancing field.

💡 Interview Preparation

Strategy Questions:

• "Describe a time you had to translate a highly complex business requirement into a simple, intuitive user interface. What was your process, and what were the key challenges?" (Focus on your problem-solving methodology, user-centric approach, and ability to simplify complexity.)

• "How do you approach building and maintaining a design system, especially when collaborating closely with frontend developers? Can you share an example of how you've connected design tokens or components to code?" (Prepare to discuss your understanding of component-based design, tokenization, and the design-to-code handover.)

• "Imagine we are implementing AI agents to assist in product development. How would you envision integrating these agents into your design workflow, and what benefits do you foresee?" (Think about specific tasks AI could assist with, potential challenges, and how you'd manage the output.) Company & Culture Questions:

• "What interests you about Clarius Group and our approach to AI-native product development?" (Research the company's mission, values, and the CLAIR platform. Highlight aspects that resonate with your career goals.)

• "Describe your ideal collaboration style within a product and development team. How do you handle disagreements or differing opinions?" (Emphasize your teamwork, communication skills, and ability to find common ground.)

• "How do you measure the success of your design work? Can you give an example of a project where you used data to validate or improve your design decisions?" (Prepare to discuss key metrics relevant to B2B SaaS and how you use data to drive impact.) Portfolio Presentation Strategy:

• Storytelling: Frame your portfolio projects as narratives, highlighting the problem, your unique approach, the solution, and the measurable impact.

• Focus on Process & Rationale: Don't just show screens; explain why you made certain design decisions, referencing user needs, business goals, and technical constraints.

• Demonstrate Technical Acumen: Be ready to discuss your understanding of HTML, CSS, React, and how your designs translate into functional code. Highlight any direct contributions or collaboration with development.

• Showcase AI Integration: If you have relevant projects, clearly articulate your role in implementing AI-driven workflows and the outcomes.

• Engage and Discuss: Be prepared for interactive questions and to discuss trade-offs, alternative solutions, and your thought process in real-time.

📝 Enhancement Note: The interview process is designed to assess not only your design skills but also your technical understanding, problem-solving abilities, and fit within a forward-thinking, AI-centric development environment. A strong portfolio that demonstrates these aspects is key.

📌 Application Steps

To apply for this Product Designer / Design Engineer position:

• Submit your comprehensive application, including your resume, cover letter, and salary expectations, via the provided online application link or email.

• Curate Your Portfolio: Select your most relevant projects that showcase your experience in B2B SaaS, complex workflows, component-based design, and ideally, any AI-integrated design processes. Ensure your portfolio clearly articulates your process and impact.

• Tailor Your Resume: Highlight keywords and experiences directly matching the job description, such as "Product Design," "Design Engineering," "B2B SaaS," "Design Systems," "Storybook," "AI-native workflows," and relevant technical skills (HTML, CSS, React).

• Prepare for Technical Discussions: Be ready to discuss your design decisions, technical understanding, and how you bridge the gap between design and development. Practice articulating your thoughts on AI integration into design workflows.

• Research Clarius Group: Understand the company's mission, the CLAIR platform, and its position as a Managed Service Provider. This will help you tailor your application and articulate your interest effectively.

⚠️ Important Notice: This enhanced job description includes AI-generated insights and industry-standard assumptions. All details should be verified directly with the hiring organization before making application decisions.