TV App voor Netwerkbeheer

Projectoverzicht

Context

Liberty Global, een grote internetprovider actief in meerdere Europese landen, had nog geen dedicated TV-app, terwijl vergelijkbare functionaliteit al bestond voor web en mobiel. Omdat het bedrijf ook eigen TV-hardware ontwikkelt, was er behoefte aan een TV-native applicatie waarmee gebruikers kernfunctionaliteiten rond internetbeheer direct op het grote scherm kunnen regelen.

Doelgroep

De app is ontworpen voor consumenten en huishoudens, met gedeeld gebruik door mensen met verschillende niveaus van technische vaardigheid.

Rol

Ik was verantwoordelijk voor het bepalen van de core TV-features en het vertalen daarvan naar TV-specifieke interactiepatronen. Ik werkte end-to-end aan dit deelproject als enige designer, in nauwe samenwerking met de Product Owner, Business Analyst en developers.

Scope

Het project omvatte conceptontwikkeling, interaction design, testen en itereren, met veel aandacht voor toegankelijkheid en gebruiksgemak binnen de beperkingen van TV.

Onderzoek

Voordat we konden ontwerpen, hebben we onderzoek gedaan naar TV-apps en typische gebruikspatronen. In deze fase lazen we relevante studies en vroegen we een groep huidige gebruikers van de Connect-app welke features zij graag terug zouden zien op TV.

Interactiepatronen

Een van de grootste uitdagingen bij TV-design zijn de interactiepatronen. Door de afstandsbediening wil je het aantal klikken zo laag mogelijk houden, en mogen belangrijke elementen nooit “ver weg” zitten in de interface.

Terug naar de kernfeatures

De TV-app focust bewust op een compacte set kernfunctionaliteiten, in plaats van de volledige web- en mobiele ervaring één-op-één over te nemen. Dat zorgt voor helderheid, voorspelbaarheid en gebruiksgemak binnen TV-interactie.

Hoofdmenu

Het hoofdmenu navigeert naar de belangrijkste pagina’s van de app, zoals start, apparaten en support. Het menu staat links, zodat je het met één klik naar links kunt openen en daarmee die input optimaal benut.

Navigatie geoptimaliseerd voor afstandsbediening

De navigatie is ontworpen rondom de beperkingen van een TV-remote. De focus start linksboven, zodat gebruikers met één input naar links het menu openen. Daarbij vermijden we ‘omhoog-scrollen’ door lange lijsten, omdat dit in tests sneller tot fouten en frustratie leidde.

Submenu

Wanneer een hoofdpagina verfijning nodig heeft, helpt een submenu. Na het kiezen van een hoofdpagina landt de gebruiker direct op het submenu: naar beneden voor de tiles, en horizontaal scrollen voor alternatieve selecties.

Brede navigatie in plaats van diepe hiërarchieën

De navigatiestructuur is bewust breed gehouden in plaats van diep. Terug navigeren is op TV lastiger dan op touch of desktop, dus belangrijke opties zijn zichtbaar gemaakt in submenus zodat gebruikers snel kunnen schakelen zonder het overzicht te verliezen.

Tiles

De kern van het ontwerp bestaat uit tiles die gebruikers direct de juiste informatie en acties geven. Belangrijk hierbij is consistentie: tiles moeten dezelfde logica en interactie hebben, zodat je zonder nadenken weet wat je kunt doen. Bijvoorbeeld: bij een stabiele verbinding kun je een apparaat met één klik pauzeren. Is de verbinding zwak, dan leidt dezelfde tile naar een detailpagina met extra opties.

Detailpagina’s

Waar nodig zitten er detailpagina’s achter tiles. Nadat ik in kaart had gebracht welke functionaliteiten daarbij horen, ontwierp ik drie templates. Alle detailpagina’s passen binnen één van deze templates, met variaties in bijvoorbeeld achtergrondbeeld en beschikbare acties. Zo blijven pagina’s uniek in functie, terwijl interactiepatronen consistent blijven.

Toegankelijkheid binnen vaste layouts

Contrast en tekstgrootte waren cruciaal, juist omdat TV-interfaces niet responsive zijn. Ontwerpen zijn getest met minder valide gebruikers om leesbaarheid en toegankelijkheid te borgen over verschillende kijkafstanden en lichtomstandigheden.

Resultaat & impact

De TV-app vertaalt complexe internetbeheerfunctionaliteit naar een voorspelbare en toegankelijke TV-native ervaring. Uit usability tests bleek dat de menustructuur goed werkte, terwijl diepere navigatielagen sneller tot verlies van overzicht leidden. Dit bevestigde de keuze om de hiërarchie ondiep te houden.

Dit project laat zien dat ik interactiemodellen kan vertalen naar non-standaard platforms en eigenaarschap kan nemen van concept tot test en iteratie. Als enige designer op dit deelproject werkte ik direct samen met product en engineering, en merkte ik hoe belangrijk het is om ontwerpkeuzes te gronden in platformbeperkingen.

Achtergrond & referenties

Dit project is gemaakt binnen MakerStreet, een collectief van agencies in Amsterdam. Ik was eindverantwoordelijk voor dit deelproject als enige designer, onder een design lead en in directe samenwerking met de Product Owner, Business Analyst en developers. Alle concepten, interactiepatronen en ontwerpen zijn door mij gemaakt. Daarnaast was er een brede stakeholdergroep, met onder andere een head of design, director of connectivity en meerdere business analysts.