FIBO BRIDGE

• 

  FIBO BRIDGE

Inspiration

I have always been fascinated by the art of cinematography and the curved interactive LED backdrops used in shows like The Mandalorian. My goal was to create a digital bridge that connects the precision of 3D previsualization with the artistic power of high-fidelity AI image generation to empower storytellers.

What it does

Fibo Bridge acts as a virtual film set where users can manually position lights, choose specific camera lenses, and adjust angles in a real time 3D environment. It takes these precise technical coordinates and translates them into descriptive natural language prompts which are then sent to Generative AI models to create photorealistic storyboards that perfectly match the user's lighting setup.

How I built it

I engineered the core application using Vanilla JavaScript and TypeScript combined with Three.js to ensure a lightweight and responsive 3D viewport without the overhead of heavy frameworks. I integrated Google Gemini to translate spatial data into detailed lighting descriptions and utilised the FAL AI API to generate the final high-resolution images using the BRIA 2.3 model.

Challenges I ran into

One significant hurdle was accurately converting raw 3D vector coordinates from the virtual stage into natural language descriptions that the AI models could interpret correctly as specific lighting styles like Rembrandt or Butterfly lighting.

Accomplishments that I'm proud of

I am particularly proud of the real time lighting engine that accurately mimics color temperature and gel blending directly within the browser using specific Kelvin algorithms. Successfully creating a seamless feedback loop where physical 3D manipulation directly controls the aesthetic of a generative AI output feels like a major achievement in user interface design.

What I learned

I gained a deeper understanding of digital lighting physics and how Kelvin color temperatures mathematically translate into RGB values for web rendering. This project also taught me advanced prompt engineering techniques to force AI models to adhere to strict cinematic camera parameters rather than just generating random artistic interpretations.

What's next for FIBO BRIDGE

I plan to introduce multi subject support to allow for more complex scene blocking and interaction between characters. I also aim to implement a community feature where users can upload and share their unique lighting setups and generated gallery shots with other virtual cinematographers.

Built With

• bria-fibo
• css3
• fal.ai
• gemini
• glb
• html5
• javascript
• lucide
• react
• tailwind-css
• three.js
• webgl