Frontend & 3D Visualization Engineer

Who we are

Técnicas Reunidas (TR) is a leading international engineering and construction company in the energy sector, with more than 65 years of experience and over 13,000 professionals worldwide. We have our headquarters in Madrid, offices in Bilbao and Cartagena, and engineering centers in India, Abu Dhabi, Saudi Arabia, Turkey, and Chile, among others, offering career opportunities in an international environment. Our commitment to people has been recognized with the Top Employer certification in Spain and India.

Global projects and the energy of the future

At TR, we develop projects in Oil & Gas and Power, and we are advancing toward the energy of the future through hydrogen, clean fuels, and carbon capture projects, integrating digitalization, AI, and robotics. Our high level of professionalism and commitment drives continuous research to improve efficiency and sustainability, always in strict compliance with the law and aligned with the highest ethical standards.

Responsibilities

• Design and develop responsive, real-time Situational Awareness user interfaces using React and TypeScript for operational dashboards, alarms, events, assets, workflows, trends and contextual information.
• Develop interactive industrial 3D visualization using Three.js and/or React Three Fiber for plant, equipment and asset-level Situational Awareness.
• Integrate live operational data, asset status, alarms, AI detections and contextual information as dynamic overlays on 2D dashboards and 3D plant models.
• Implement asset selection, search, highlighting, drill-down, contextual panels, tooltips, camera navigation and interactive plant navigation within the 3D environment.
• Optimize large industrial 3D models using model segmentation, lazy loading, Level of Detail, frustum culling, instancing, geometry/material optimization and selective loading techniques.
• Integrate REST APIs and WebSocket channels with the Java/Spring Boot SA Core to provide real-time dashboard and 3D updates without requiring manual refresh.
• Design frontend event-handling mechanisms for high-frequency Kafka-derived operational updates delivered through backend WebSocket/API interfaces.
• Develop real-time alarm and event visualization including severity, priority, acknowledgement status, asset association and visual indication within dashboards and 3D scenes.
• Develop contextual CCTV/VMS viewing components that allow authorized users to open relevant live camera streams from dashboards or corresponding camera locations within the 3D plant model.
• Integrate AI-generated detections such as PPE violations, fire/leak detections, anomalies and confidence information into operational dashboards and 3D context.
• Implement role-aware frontend functionality so that screens, actions, assets and information are displayed according to authorization provided by SA Core services.
• Design reusable frontend components, application state-management patterns and UI architecture suitable for a large, maintainable industrial application.
• Optimize browser performance for concurrent WebSocket updates, complex dashboards, large datasets and large 3D plant scenes.
• Implement connection-loss, reconnect, loading, stale-data and error states so that operators clearly understand when information is current or temporarily unavailable.
• Develop frontend automated tests and participate in integration, usability, performance and browser-compatibility testing.
• Collaborate with Java backend, Data & Event Streaming, AI/ML and DevOps engineers to define API contracts, real-time interfaces, asset mapping and deployment requirements.

Key Skills

• Education: Bachelor’s or Master’s degree in Computer Science, Software Engineering, Information Technology, Computer Graphics or related discipline.

• Experience: 5+ years of hands-on frontend/web-application development experience, with strong recent experience building complex production applications using React and TypeScript.

• React: Strong expertise in React including functional components, hooks, reusable component architecture, routing, error boundaries and application lifecycle management.

• TypeScript: Strong TypeScript and modern JavaScript knowledge including asynchronous programming, promises, modules, typed interfaces and frontend architecture.

• 3D Visualization: Strong hands-on experience with Three.js and/or React Three Fiber for browser-based interactive 3D applications.

• 3D Model Formats: Experience working with GLTF/GLB and understanding geometry, meshes, materials, textures, scene graphs, cameras and lighting.

• 3D Interaction: Experience implementing raycasting/object selection, asset highlighting, camera controls, navigation, contextual overlays, labels and interaction with individual 3D objects.

• Large 3D Model Optimization: Strong understanding of model segmentation, lazy/progressive loading, Level of Detail, instancing, geometry/material optimization, frustum culling, texture optimization and GPU/browser memory management.

• WebGL: Strong understanding of WebGL/browser rendering concepts sufficient to troubleshoot Three.js performance and rendering issues.

• Real-Time UI: Hands-on experience with WebSockets or equivalent real-time communication mechanisms for live operational dashboards.

• REST APIs: Strong experience consuming REST APIs, handling authentication, errors, pagination, retries and asynchronous requests.

• State Management: Strong understanding of frontend state-management patterns and experience with Redux Toolkit, Zustand or equivalent approaches for complex applications.

• Data Visualization: Experience developing charts, trends, alarm panels, status indicators and operational dashboards using suitable visualization libraries.

• Performance: Strong knowledge of React rendering optimization, memoization, virtualization, code splitting, lazy loading, browser profiling and memory/performance troubleshooting.

• Video Integration: Familiarity with browser-based video playback technologies and integration of VMS/live-stream gateways is preferred.

Important: the requirement should say video integration, not that the browser must directly play raw RTSP. The VMS/streaming layer may convert/provide an appropriate browser-consumable stream.

• Security: Understanding of JWT/OAuth2/OIDC-based frontend authentication, role-based UI authorization and secure token/session handling.

• Testing: Experience with Vitest/Jest, React Testing Library and frontend integration/end-to-end testing tools such as Playwright or Cypress.

• HTML/CSS: Strong HTML5, CSS3, responsive-design and modern layout skills.

• UI/UX: Ability to build information-dense operational/control-room interfaces where alarms and critical states remain immediately understandable.

• Git: Strong experience with Git, pull requests, code review and collaborative software-development practices.

• Docker: Working knowledge of Docker and containerized frontend deployment is expected.

• Industrial Applications: Experience with digital twins, industrial dashboards, GIS, BIM, plant visualization, SCADA/HMI-style systems or other real-time operational applications is strongly preferred.

• Domain: Oil & Gas experience is preferred but should not be mandatory if the candidate has strong real-time visualization and 3D engineering capability.

What we offer

• Health and well-being programs (physical and emotional)
• Health insurance discounts and access to Wellhub
• Study grants, continuous training, and professional development
• Workplace adaptation for individuals with a Disability Certificate ≥ 33%
• Shuttle bus service(Chennai Office)

Diversity and equality

At Tecnicas Reunidas, we have a strong commitment to equal opportunities for women and men, as well as to diversity. To this end, we carry out rigorous recruitment processes that ensure these principles.