US Open Live Tennis App

A 3D real-time environment designed to display players' live skeletal data, ensuring the most natural movements and used by over 300,000 users. I contributed to the development of the 3D scene for mobile and XR devices, creating an immersive tennis viewing experience that enables fans to observe the match from any perspective. Technical Art played a crucial role in enhancing visual output and streamlining the developers' workflow.

You can swipe the gallery
Development Environment
META
Mobile
Web GL Unity C# PBR Real-time Rendering
Key Responsibilities
    • Refined and optimized the players avatar models, including geometry, materials, blend shapes, and rig naming
    • Designed and integrated world space UI animations and 3D stats
Procedural court shader
  • Editing cout dimensions and look
    • image
    • Created using ShaderGraph, this shader simplifies the integration of sports tracking data from skeleton data providers. The process of editing and reimporting a 3D asset along with its textures was challenging and prone to errors, particularly regarding court dimensions that occasionally required adjustments to align with backend tracking data corrections.
    • In line with the client's requirements, I designed and implemented visual effects using custom shaders, Unity's keyframe animator, and particle systems. This includes animations for the court, player card effects, 3D UI elements, visual statistics, custom skyboxes, and more. To accommodate the use of generic 3D characters for all players, I developed a straightforward method to adjust their skin tones on the court, ensuring they align with the live broadcast.
  • Animating the court with shader parameters
    • US Open 3D Viewer - Mobile/Web/AR screenshot 1
    • It offers precise control over real meter-sized lines and terrain dimensions applied to a basic cube, making it independent of specific assets. Additionally, it includes all necessary logic for visual variations, animations, and custom branding.
    • The player card animation features a custom shader that emphasizes the game winner through a border effect, along with an alpha cut reveal and branding elements that pan in the background. The prefab also considers technical constraints, such as text elements and photos that will be updated using tracking data.
    • With the official player photos received from the tournament organizers, we implemented a streamlined workflow for dynamically adapting the players' skin tones.
  • An additional step involves assigning the extracted hexadecimal values to a curated list of premade colors that represent various human skin tones, ensuring that we avoid unnatural colors caused by photo imperfections such as lighting and angles.
  • Editable curved canvas text
    • US Open 3D Viewer - Mobile/Web/AR screenshot 1
    • I have designed and implemented a curved editable canvas text effect surrounding the court. This was achieved by utilizing an additional camera to output to a render texture, which is then processed through a custom shader applied to a cube encasing the court. Prior to implementation, I mapped the cube's UVs to ensure seamless panning when managed within the custom shader.
TA
xl-tech.art

3D/AR/VR Technical Artist

Paris, FRANCE
contact@xl-tech.art
LinkedIn
TA
Xavier Laborie - Technical Artist
Project Gallery
Key Responsibilities
    • Refined and optimized the players avatar models, including geometry, materials, blend shapes, and rig naming
    • Designed and integrated world space UI animations and 3D stats
Development Environment
META
Mobile
Web GL Unity C# PBR Real-time Rendering
Procedural court shader
  • Editing cout dimensions and look
    • US Open 3D Viewer - Mobile/Web/AR screenshot 1
    • Created using ShaderGraph, this shader simplifies the integration of sports tracking data from skeleton data providers. The process of editing and reimporting a 3D asset along with its textures was challenging and prone to errors, particularly regarding court dimensions that occasionally required adjustments to align with backend tracking data corrections.
    • In line with the client's requirements, I designed and implemented visual effects using custom shaders, Unity's keyframe animator, and particle systems. This includes animations for the court, player card effects, 3D UI elements, visual statistics, custom skyboxes, and more. To accommodate the use of generic 3D characters for all players, I developed a straightforward method to adjust their skin tones on the court, ensuring they align with the live broadcast.
  • Animating the court with shader parameters
    • US Open 3D Viewer - Mobile/Web/AR screenshot 1
    • It offers precise control over real meter-sized lines and terrain dimensions applied to a basic cube, making it independent of specific assets. Additionally, it includes all necessary logic for visual variations, animations, and custom branding.
    • The player card animation features a custom shader that emphasizes the game winner through a border effect, along with an alpha cut reveal and branding elements that pan in the background. The prefab also considers technical constraints, such as text elements and photos that will be updated using tracking data.
    • With the official player photos received from the tournament organizers, we implemented a streamlined workflow for dynamically adapting the players' skin tones.
  • An additional step involves assigning the extracted hexadecimal values to a curated list of premade colors that represent various human skin tones, ensuring that we avoid unnatural colors caused by photo imperfections such as lighting and angles.
  • Editable curved canvas text
    • US Open 3D Viewer - Mobile/Web/AR screenshot 1
    • I have designed and implemented a curved editable canvas text effect surrounding the court. This was achieved by utilizing an additional camera to output to a render texture, which is then processed through a custom shader applied to a cube encasing the court. Prior to implementation, I mapped the cube's UVs to ensure seamless panning when managed within the custom shader.
TA
Xavier Laborie

3D/AR/VR Technical Artist

Paris, FRANCE
contact@xl-tech.art
LinkedIn

Home
Spotlight Project
Spatial Rifts - VisionPro FPS Game
LinkedIN
Image
Image
Image
Image