EnergyView: eenvoudiger vergelijken

Nulmeting (1 november 2026, bron v276)

• npm test: 192/192; perf:golden: acht scenario's groen, referentie ongewijzigd.
• 7 navigatieknoppen in de bron; 34 vaste uitklapblokken; 15 getalvelden zonder inputmode.
• CSS: 249/441 expliciete px-lettergroottes kleiner dan 14 px (56,5%). Dit telt declaraties, geen pixels op het scherm.
• 12 afzonderlijke media-querygrenzen inclusief minimumgrenzen; de eerder gemelde negen telden alleen een deel van de max-width-grenzen.
• Echte Chromium-browser, lege start, iframe-viewport 1280 px: 3 zichtbare hoofdknoppen plus het hulpmenu, 9 zichtbare uitklapblokken, 0 invoervelden zolang invoerstappen dichtstaan. Axe wcag2a/aa: één overtredingstype, color-contrast, 9 elementen. 10/23 zichtbare tekststeekproeven kleiner dan 14 px.
• De statische telling en de zichtbare telling zijn verschillende maten. Invoer die een klik verder verschijnt, is niet nul invoer in de hele flow.

Stap 1 — Leesbaarheid en bediening

• Donkerder secundaire tekst; bestaande px-lettergroottes minimaal 14 px, lopende tekst 16 px. Tikdoelen voor knoppen en invoer minimaal 44 px.
• Drie responsive grenzen: 600, 900 en 1200 px. Print en reduced-motion blijven bestaan.
• Decimaal toetsenbord; tekstinvoer accepteert komma en punt en normaliseert vóór bestaande change-handlers. Geen tarief- of rekenmodule gewijzigd.
• Pijltjes/Home/End voor bestaande ARIA-tabs.
• npm test: 193/193; golden-master groen. Lint en checkJs: geen nieuwe diagnostiek; bestaande baseline niet aangepast.
• Echte Chromium, lege start op 360 en 1280 px: axe wcag2a/aa inclusief contrast 0 overtredingen; 0 tekststeekproeven onder 14 px; geen horizontale pagina-overloop.
• Geen iOS Safari, Chrome Android of Firefox beschikbaar. Een smalle Chromium-viewport is geen bewijs voor die platformen. Lighthouse/throttling nog niet gemeten.

Herhalen

npm run ux:audit maakt een lokale, genegeerde auditpagina onder src/.qa/ux-audit.html. Start de bestaande preview en open die pagina. Kies 360 of 1280 px en klik Meet. Axe is een ontwikkelafhankelijkheid en wordt niet gepubliceerd. Kies Begin lege test uitsluitend op een test-preview: dit wist de preview-opslag.

Oud scherm → nieuwe plek

Het verplaatsen van DOM-elementen behoudt hun ID, listeners en gekozen waarden. Het kopieert geen contracten of berekeningen. De gasindicatie maakt geen uurprofiel aan en kan dus geen metingen voor een warmtepompanalyse vervangen.

Korte gebruikstest voor vijf nieuwe gebruikers

Gebruik vijf mensen die EnergyView niet kennen. Gebruik dezelfde synthetische factuur, dezelfde postcode en een geschikt testbestand. Vraag geen privébestand. Laat ze hardop denken; help niet tijdens een taak. Wissel bij deelnemers de oude en nieuwe versie af om het leereffect te beperken.

1. Goedkoopste contract: “Je woont in Gent, gebruikt 3.500 kWh/jaar en hebt dit contract. Zoek het goedkoopste aanbod en vertel wat je denkt dat je bespaart.” Stop de klok wanneer de deelnemer een contract en periode aanwijst. Noteer of korting en geschatte bedragen juist worden begrepen. 2. Zonder bestand: “Je hebt alleen je jaarafrekening. Krijg een indicatie zonder iets te downloaden.” Stop bij het eerste correct herkende resultaat. Noteer of de deelnemer begrijpt dat batterij- en laadadvies metingen nodig hebben. 3. Fout herstellen: “Je kreeg dit ongeschikte dagbestand. Probeer verder te gaan.” Stop wanneer de deelnemer de juiste vervolgstap vindt: kwartierbestand downloaden of jaarverbruik kiezen. Niet eisen dat de deelnemer ter plaatse inlogt bij Fluvius.

Noteer per taak: seconden tot eerste resultaat, totaal aantal klikken (ook openen van selecties en bestandsdialoog), fouten, terugstappen, hulpvragen, plaats van afhaken en een begripsvraag achteraf. Maximaal 5 minuten per taak; daarna als niet voltooid noteren. Rapporteer alle vijf ruwe tijden, de mediaan en het aantal geslaagde taken, niet alleen een gemiddelde.

Dit protocol is opgeleverd; er zijn geen fictieve deelnemers of gebruikerstijden ingevuld.

Stap 2 — Eén korte flow, bestaande bediening behouden

• De drie hoofdschermen en het centrale instellingenvenster verplaatsen bestaande DOM-controls met hun listeners. De rekenkern is niet herschreven.
• Gas en stroom delen de postcode en de flow. Een nieuw handmatig gasjaar wordt alleen als jaarinvoer door de bestaande gasprijsfunctie gerekend; er ontstaan geen verzonnen uurmetingen. Een regressiecontrole vergelijkt de volledige offertes en volgorde exact met dezelfde gemeten jaarhoeveelheid.
• Beste drie is een presentatielimiet; alle aanbiedingen en de sortering blijven beschikbaar. De bestaande gasrenderer houdt zijn vijf-regelsstandaard voor bestaande afnemers/tests; alleen deze flow vraagt drie.
• Uitgebreide berekeningen blijven in hun bestaande analyseroot. Die wordt voor de instellingen tijdelijk in hetzelfde dialoogvenster gezet, zonder events of invoer te kopiëren.
• Echte Chromium op 360 px: handmatige stroomstart 3 velden / 0 uitklapblokken; contract 2 / 1; stroomresultaat 0 / 2. Beide energievormen: resultaat 2 velden / 3 uitklapblokken. Hoofdnavigatie 4. Axe wcag2a/aa inclusief contrast: 0 overtredingen in deze gecontroleerde toestanden; geen pagina-overloop. Dit is geen bewijs voor alle combinaties van alle gevorderde instellingen.
• npm test: 194/194. Golden-master: acht scenario's groen; bedragen/ranglijsten/identifiers en referentie ongewijzigd. Lint en typecheck hebben geen nieuwe diagnostiek; formatcontrole groen.
• Tijdens implementatie ving de suite één harde vijf-regelsverwachting en één geïsoleerde navigatie-VM op; opgelost met expliciete presentatielimiet en een optionele presentatiehook. De bestaande tests zijn niet aangepast. Een tussentijdse metadata-test faalde toen tijdens de meting bronbestanden wijzigden; de volledige controle op stabiele bron is daarna groen.
• Werkelijk uitgevoerd: handmatig stroom/gas, komma-invoer in beide verbruiksvelden, volledig synthetisch elektriciteitsjaar (35.040 kwartieren), centrale instellingen en verplaatsen/terugzetten van de analyseroot. Geen privéprofiel in deze controles gebruikt.

Definitieve meetstand en beperkingen

De volledige bron bevat nog steeds geavanceerde uitklapblokken. Die tellen niet als gewone invoer. De investeringsformulieren blijven na het resultaat beschikbaar en zijn niet onder het tandwiel verstopt.

Zonder bestand zijn drie primaire knopacties nodig: jaarverbruik kiezen, Verder, resultaat of Weet ik niet. Typen, focusklikken, productselectie en de bestandsdialoog zijn niet in dit aantal inbegrepen. Met bestand zijn kiezen van invoerwijze en openen van de bestandskiezer nodig; een herkend bestand kan direct naar het bestaande resultaat gaan. Een volledige voor/na-klikmeting inclusief besturingssysteem is niet uitgevoerd; daarvoor dient de gebruikstest hierboven.

Lighthouse en tijd tot eerste resultaat onder 4× CPU/Fast 3G zijn niet gemeten. De beschikbare externe Chromium-browser is voor scherm- en axe-controles gebruikt. De lokale performance-harness kon geen Chromium starten: de Playwright-executable ontbrak. Er worden daarom geen snelheidsclaims of Lighthouse-scores afgeleid uit Node-tijden. iOS Safari, Chrome Android, Firefox, een echt HA-dashboard en vijf proefpersonen waren niet beschikbaar. De drie deployment-builds worden wel gecontroleerd.

De screenshots tonen synthetische gegevens en een appviewport van 360 respectievelijk 1280 px in de testbrowser. De browser kon uitsneden niet betrouwbaar opslaan; de afbeeldingen bevatten daarom ook de omliggende browserviewport. Ze zijn geen bewijs voor native mobiele browsers.

Open rekenvraag, bewust buiten deze wijziging

De officiële wet van 25 oktober 2026, gepubliceerd op 30 oktober, vermeldt een gewijzigd elektriciteitsaccijnstarief vanaf 1 november. De toepassing van alle actuele heffingen is hiermee niet volledig geverifieerd. De melding bij Bronnen blijft daarom behouden in eenvoudiger taal. Tarieven, heffingen en golden-referenties zijn in deze UX-opdracht niet aangepast. Moeten de novemberheffingen in een afzonderlijke, inhoudelijke tariefrelease worden geactualiseerd?

Officiële bron: https://www.ejustice.just.fgov.be/cgi/article_body.pl?caller=summary&language=nl&numac=2026007970&pub_date=26-10-30

Stap 3 — Teksten, herstel en oplevering

• Gewone importfouten verschijnen bij de bestandskeuze met een herstelactie. Verkeerde kolommen blijven handmatig koppelbaar. Keuze voor energie en invoer wordt lokaal bewaard; de stappen ondersteunen terugnavigatie.
• Een onbekend gascontract wist geen elektriciteitscontract. Geen-gasweergave wist de verplaatste gasresultaten; bestaande automatische promotieverversing actualiseert ook de gedeelde weergave.
• Installatie en HA hebben een eigen documentatiepagina. De bron-README is kort gehouden. Geen nieuwe externe scripts, analytics of dataverzending; axe blijft uitsluitend ontwikkelgereedschap.
• Definitieve releasepoort: 194/194 tests, ongewijzigde golden-master, lint, typecheck, format en builds voor HA, Pages en Worker. De publicatie wordt alleen na een geslaagde releasepoort uitgevoerd.
• Screenshots staan in screenshots/; gebruik uitsluitend de beschreven gecontroleerde toestanden als bewijs. Native mobiele browsers, volledige scenariopermutaties, daadwerkelijke overstappen en een echt Home Assistant-dashboard zijn niet in een browser geverifieerd.