YouTube, maar dan op onze manier

Vibe coding · 2 min leestijd
YouTube, maar dan op onze manier

Chrome-extensie die YouTube compleet anders laat voelen.

YouTube, maar dan op onze manier

Vandaag hebben we iets gebouwd waar we zelf meteen blij van werden:
een Chrome-extensie die YouTube compleet anders laat voelen.

Niet méér functies.
Juist minder ruis.

Waarom?

YouTube is inhoudelijk fantastisch. Maar de interface…
druk, schreeuwerig, continu afleiding. Shorts die je aandacht kapen, thumbnails die om je aandacht vechten, en weinig rust om gewoon te kijken wat je wílt kijken.

We merkten dat we YouTube steeds vaker moe openden.
Dat voelde als een ontwerpfout.

Dus dachten we: wat als we YouTube behandelen zoals we alles bij PB benaderen?
Rust, focus, esthetiek. De inhoud laten spreken.

Wat we hebben gemaakt

YouTube Restyled is een Chrome-extensie die YouTube visueel en functioneel terugbrengt naar de kern.

Geen franje. Geen afleiding.

Visueel:

  • Donkere, rustige basis met een subtiele tech-achtige grid
    Thumbnails eerst in zwart-wit, kleur pas bij hover
    Strakke, hoekige accenten (geen afgeronde hoeken)
    Monospace typografie voor metadata en tijd
    Alles voelt meer “terminal” dan “televisie”

Functioneel:

  • Kanaalnamen direct zichtbaar op thumbnails
    Shorts volledig verwijderd
    Compactere, logischere sidebar
    Subtiele PB.NL-branding in de header

Je ziet in één oogopslag wat iets is — en of je het wilt kijken.

Hoe we het bouwden

Het hele project is in één sessie ontstaan, samen met Claude als pair-programming partner.
Van idee tot Chrome Web Store-klaar in een paar uur.

Stap voor stap:

  • Basis dark theme
    Channel labels op thumbnails
    Filter-pills laten aansluiten op die labels (dit was priegelen)
    Sidebar-headers stylen
    Mini-player visueel afbakenen
    PB.NL-logo integreren

Snel itereren, direct zien, aanpassen, doorgaan.

Wat tegenzat

YouTube’s CSS is… stevig.
Zeer specifieke selectors, veel !important, weinig medewerking.

Onze oplossing: nóg specifieker zijn.
En waar nodig via JavaScript setProperty() gebruiken met important. Niet elegant, wel effectief.

De filter-pills waren het meest koppig: geneste elementen met allemaal hun eigen minimale hoogtes. Uiteindelijk hebben we elk child-element afzonderlijk moeten targeten om het netjes te krijgen.

Het resultaat

YouTube, maar dan rustig.
Gefocust. En visueel in lijn met hoe wij naar interfaces kijken.

Alsof het uit een sci-fi film komt, maar dan functioneel.

De extensie ligt klaar voor publicatie in de Chrome Web Store (zodra Google ons heeft geverifieerd 😅).

Wil je ’m testen?
Laat het weten — of houd de Chrome Web Store even in de gaten.

Tags: Chrome-extensie, YouTube, interface-ontwerp, CSS, JavaScript, PB-stijl