31 werkvormen · 2 indexpagina's

Werkvormen om
uit te proberen.

Interactieve voorbeelden voor volwassenen die aan digitale producten werken. Vergelijk ontwerpen, bekijk codewijzigingen of probeer een planning uit.

Bekijk de werkvormenOpen de volledige galerij
31
interactieve oefeningen
10
categorieën
HTML
direct in je browser

Over deze verzameling

De voorbeelden komen uit het open source-project HTML Effectiveness.

Bekijk de broncode (Apache 2.0)

Alle werkvormen

Kies het werk dat je wilt doen.

31 werkvormen zichtbaar

01

Verkennen & plannen

Vergelijk verschillende aanpakken voordat je kiest.

3
Vergelijken

Drie code-aanpakken

Drie aanpakken voor hetzelfde probleem, met afwegingen en een aanbeveling.

Open werkvorm Richting kiezen

Visuele richtingen

Bekijk en vergelijk vier ontwerpvoorstellen.

Open werkvorm Plannen

Implementatieplan

Een plan met mijlpalen, datastromen, risico’s en schetsen van de interface.

Open werkvorm
02

Code begrijpen

Bekijk wat er in de code verandert en waarom.

3
Review

Geannoteerde pull request

Een diff met opmerkingen, prioriteiten en links naar de besproken code.

Open werkvorm Overdracht

PR-uitleg voor reviewers

Uitleg over de wijziging, de betrokken bestanden en aandachtspunten voor de review.

Open werkvorm Systeemkaart

Modulekaart

Een diagram van een pakket, met de onderdelen en het meest gebruikte codepad.

Open werkvorm
03

Ontwerp zichtbaar maken

Bekijk kleuren en componenten en probeer hun gedrag uit.

2
Designsystemen

Ontwerpsysteem

Een overzicht van kleuren, lettertypes, afstanden en componenten.

Open werkvorm Componenten

Componentvarianten

Vergelijk de maten, toestanden en toepassingen van een component.

Open werkvorm
04

Interactie testen

Probeer animaties en klikbare prototypes uit.

2
Beweging

Animatieproef

Pas het verloop van een animatie aan en vergelijk het resultaat.

Open werkvorm Interactie

Klikbaar prototype

Een prototype waarin je de navigatie kunt uitproberen en onderdelen kunt verslepen.

Open werkvorm
05

Tekenen & verklaren

Bekijk illustraties en interactieve diagrammen in de browser.

2
Illustreren

SVG-illustratieblad

Drie vectorfiguren die afzonderlijk bekeken en gedownload kunnen worden.

Open werkvorm Diagram

Interactief stroomdiagram

Klik door een deploypipeline en zie per stap timing, uitleg en foutpaden.

Open werkvorm
06

Vertellen

Een korte presentatie zonder exportstap, bestuurbaar met het toetsenbord.

1
Presenteren

Presentatie met pijltjestoetsen

Zes slides in één HTML-bestand, klaar voor een korte teamupdate.

Open werkvorm
07

Onderzoeken & leren

Verken uitleg met codevoorbeelden en interactieve diagrammen.

2
Uitleg

Zo werkt deze feature

Een navigeerbare uitleg met uitklappers, code-tabs, configuratie en FAQ.

Open werkvorm Leren

Conceptuitleg

Uitleg van consistent hashing. Voeg nodes toe of haal ze weg en bekijk het effect.

Open werkvorm
08

Rapporteren

Deel voortgang, resultaten en vervolgacties.

2
Status

Weekstatus

Een weekoverzicht met kerncijfers, afgerond werk en openstaande taken.

Open werkvorm Incident

Incidenttijdlijn

Een post-mortem met minuut-tot-minuuttijdlijn, logs en opvolgacties.

Open werkvorm
09

Samen beslissen

Orden tickets, pas instellingen aan of bewerk een prompt.

3
Prioriteren

Ticketbord

Sleep dertig tickets naar Nu, Straks, Later of Stop en kopieer de uitkomst.

Open werkvorm Configureren

Featureflag-editor

Schakelaars, afhankelijkheidswaarschuwingen en een kopieerbare configuratiediff.

Open werkvorm Schrijven

Prompttuner

Bewerk een prompttemplate en zie drie voorbeelduitkomsten direct opnieuw renderen.

Open werkvorm
10

Open vragen onderzoeken

Elf werkvormen om blinde vlekken vóór, tijdens en na implementatie te vinden.

11
Vooraf

Blinde-vlekkenronde

Bekijk een prompt vanuit zeven invalshoeken en vul ontbrekende informatie aan.

Open werkvorm Vooraf

Kleurcorrectie uitgelegd

Uitleg van kleurcorrectie met een vergelijkingsschuif en instelbare kleuren.

Open werkvorm Vooraf

Ontwerprichtingen

Vier wachtrijontwerpen met kiezen, lenen, overslaan en een samengestelde reactie.

Open werkvorm Vooraf

Toolbar-mock

Probeer de knoppen van een werkbalk voor annotaties uit.

Open werkvorm Vooraf

Churn-brainstorm

Vergelijk tien voorstellen om klantverloop te verminderen op inspanning en termijn. Kopieer je selectie.

Open werkvorm Vooraf

Feature-interview

Eén vraag tegelijk, uitmondend in besluiten en een uitvoerbare implementatieprompt.

Open werkvorm Vooraf

Referentie-overdracht

Vergelijk Rust- en TypeScript-code met links tussen bijbehorende passages en uitleg van valkuilen.

Open werkvorm Vooraf

Plan met keuzeruimte

Een aanpasbaar implementatieplan met alternatieven voor het schema.

Open werkvorm Tijdens

Implementatienotities

Leg vast wat tijdens de implementatie veranderde en wat je daarvan leerde.

Open werkvorm Achteraf

Pitchdocument

Een voorstel met onderbouwing, mogelijke bezwaren en een overzicht van betrokken beslissers.

Open werkvorm Achteraf

Begripstoets

Lees de uitleg van een wijziging en test je begrip met zes vragen.

Open werkvorm

Verder kijken

Bekijk alle voorbeelden
in de galerij.

Naar de hoofdgalerij