Accueil / Développement / Universal Video PiP

Universal Video PiP

Bienvenue sur « Universal Video PiP » – Universal Video PiP est une extension Chrome innovante permettant de transformer n’importe quelle vidéo du web en une fenêtre flottante Picture-in-Picture (PiP). Elle détecte automatiquement les vidéos verticales (comme TikTok ou YouTube Shorts) et propose une rotation en temps réel pour un affichage horizontal fluide et ergonomique.

Site : Universal Video PiP

Présentation de l’application « Universal Video PiP » :

Universal Video PiP offre une expérience vidéo universelle et intelligente directement dans votre navigateur. Elle vous permet de détacher et de visionner n’importe quelle vidéo sur tous les sites compatibles (YouTube, TikTok, Netflix, Twitch, Vimeo, etc.) dans une petite fenêtre toujours visible, même lorsque vous changez d’onglet.
Grâce à la détection automatique des vidéos verticales, l’extension ajuste le format et propose une option de rotation instantanée, idéale pour les contenus mobiles. Les raccourcis clavier personnalisables rendent son utilisation rapide et intuitive.

Presentation
Presentation1
Presentation 2

Les technologies derrière « Universal Video PiP » :

Le projet est développé à partir de Manifest V3, la dernière version du framework d’extensions Chrome, garantissant sécurité, efficacité et compatibilité avec les navigateurs Chromium modernes.

La logique principale repose sur :

  • content.js : gère la détection des vidéos sur les pages web et contrôle le passage en mode PiP ou Canvas.

  • popup.js / popup.html : fournit une interface utilisateur simple pour activer le PiP, gérer la rotation et accéder aux paramètres.

  • options.js / options.html : permet la personnalisation des raccourcis et la sauvegarde des préférences.

  • background service worker : orchestre les interactions entre les scripts et Chrome Storage.

Les technologies clés incluent :

  • IntersectionObserver API : pour détecter les changements de vidéos dans les flux continus (TikTok, YouTube Shorts).

  • Canvas API + MediaStream API : pour capturer, transformer et retransmettre en temps réel les vidéos verticales en mode horizontal.

  • Chrome Storage API : pour synchroniser les préférences utilisateur entre appareils.

  • Native Picture-in-Picture API : pour les vidéos classiques, offrant des performances optimales avec contrôle natif du player.

L’ensemble du projet est écrit en JavaScript moderne (ES6), structuré de façon modulaire, et respecte les bonnes pratiques de performance et d’accessibilité des extensions Chrome.

Côté design, l’interface adopte une approche minimaliste et fonctionnelle, avec des icônes vectorielles optimisées et une hiérarchie claire des actions.

Universal Video PiP incarne une vision : rendre le multitâche vidéo accessible à tous, sans contrainte de plateforme ni de format.