OnisepTV

Publier et diffuser les vidéos de l'orientation

Tout le cycle de vie des vidéos métiers et formations, d'un seul back-office : upload, encodage, métadonnées, droits et diffusion.

Entité publique·Éducation

À quoi ça ressemble

OnisepTV centralise les vidéos métiers et formations que l'ONISEP diffuse sur onisep.fr et auprès de ses partenaires. Le back-office couvre tout le cycle : upload, encodage multi-résolutions, sous-titres, 27 champs de métadonnées et droits de diffusion. Une API REST publique et un lecteur embarquable distribuent ensuite chaque vidéo sur les sites du réseau.

Une identité visuelle unique

Couleurs

Typographie

Aa

ABCDEFGHIJKLMNOPQRSTUVWXYZ

abcdefghijklmnopqrstuvwxyz

0 1 2 3 4 5 6 7 8 9 & @ # %

RegularMediumSemiboldBoldExtrabold

Titres qui portent le message

Sous-titres qui structurent

Un texte courant lisible sur tous les écrans, avec des interlignes généreux.

Construit avec des technologies qui durent

Les technos les plus utilisées au monde, qui font tourner Airbnb et Netflix.

Next.jsReactTypeScriptTailwind CSSFramer MotionSQLiteDrizzleNode.js

Le projet écran par écran

Tableau de bord : 34 vidéos, 26 publiées
Catalogue filtrable par statut de publication
Fiche vidéo et métadonnées éditoriales
Encodages H264 en 4 résolutions
Lien direct et code d'intégration iframe
Schéma des 27 métadonnées, configurable
API REST publique et gestion des clés
Utilisateurs et rôles (ONISEP, externes)
1 / 8

Des enjeux concrets, des réponses concrètes

Les enjeux

Diffuser les vidéos d'orientation sur tout le réseau Onisep

Les défis initiaux

Fichiers lourds et formats hétérogènes à publier

Nos solutions

Encodage multi-résolutions et lecteur embarquable

Les enjeux

Décrire chaque vidéo et cadrer ses droits de diffusion

Les défis initiaux

Métadonnées saisies au cas par cas, sans cadre commun

Nos solutions

Schéma de 27 champs typés, groupés et obligatoires

Les enjeux

Ouvrir le catalogue aux sites et partenaires du réseau

Les défis initiaux

Accès direct à la base impossible à sécuriser

Nos solutions

API REST publique à clés scopées read/write

Les choix qui comptent

Trois décisions de conception prises sur ce projet, et pourquoi.

UX

Métadonnées structurées

Chaque vidéo est décrite par 27 champs typés (texte, date, sélection, booléen) regroupés par catégorie : identification, droits, diffusion, indexation.

Les champs obligatoires et les valeurs autorisées sont définis dans un schéma configurable, sans toucher au code.

Les vidéos se relient aux fiches métiers et formations IDEO de l'Onisep.

Sécurité

API à clés scopées

Le catalogue s'ouvre via une API REST publique plutôt qu'un accès direct à la base.

Chaque clé est hachée et porte ses propres permissions : lecture seule ou lecture-écriture, révocables à tout moment.

Les endpoints ne renvoient que les vidéos publiées.

Performance

Encodage multi-résolutions

À la publication, chaque vidéo est encodée en 4 résolutions H264 (1080p à 360p), stockées et exposées via l'API.

Le site intégrateur sert alors la déclinaison adaptée au débit et à l'écran de l'internaute.

De ~11 Mo en 360p à ~95 Mo en 1080p par vidéo.

Rapide, mesuré, prouvé

La vitesse n’est pas une promesse : elle se mesure.

Performances : 96 sur 100
Performances
Accessibilité : 93 sur 100
Accessibilité
Bonnes pratiques : 100 sur 100
Bonnes pratiques
SEO : 100 sur 100
SEO

Chargement immédiat

Le contenu essentiel s’affiche en une fraction de seconde : rendu côté serveur, HTML léger, JavaScript réduit au strict nécessaire.

Images optimisées

Formats modernes (WebP/AVIF), dimensions adaptées à l’écran et chargement différé hors de l’écran : aucun octet gaspillé.

Stabilité visuelle

Pas de saut de mise en page pendant le chargement : les tailles sont réservées à l’avance, l’interface reste calme sous les yeux.

Une sécurité qui ne dort jamais

Ce qui tourne en arrière-plan pour que votre projet reste debout, quoi qu’il arrive.

Sauvegardes quotidiennes sur serveur distant

Procédure de reprise testée mensuellement

Monitoring automatique toutes les 5 min du service, alerte auto si service down

Chiffrement SSL

Isolation des environnements de développement

Étape 1 sur 5 : Cadrage

5 étapes pour concrétiser votre projet

Cadrage

Client
PDFcahier-des-charges.pdfPDF · 14 pages
ou

On tient un cabinet d’ostéopathie. L’idée : que nos patients réservent en ligne, sans appeler.

CyberScale

Reçu ! On vous prépare un prototype sous 3j

Vous décrivez votre projet

Un cahier des charges si vous en avez un, quelques paragraphes libres sinon.

0 €libre, le prototype reste à vous

Vous avez lu jusqu’ici ? Continuons ensemble.

Avant de signer, on vous offre sous 3j un prototype de votre projet.

Ajustements illimités, sans surcoûtLivraison et rapport hebdomadaireSatisfait ou remboursé, contractuel

Sans engagement

Questions fréquentes

Parce que nous limitons volontairement notre charge à 3 projets simultanés.

Résultat : des maquettes en 72 heures, 90% des messages répondus dans l'heure, une livraison chaque semaine et des délais garantis contractuellement.

Si nous sommes en retard, vous recevez gratuitement 2 mois de maintenance, d'hébergement, d'articles de blog et de social media.