2. Ontwerpen
Mobile Laptop
Mobile
Laptop
- Entree scherm: Als je op de menu button klikt komt het menu te voorschijn met een animatie. Het menu neemt het hele scherm op en heeft een andere achtergrondkleur. Het logo veranderd van kleur. En de menu button veranderd naar een close button.
- Menu popup: Als je op de close button klikt dan verdwijnt het menu met een animatie. Ook wordt de close button weer een menu button. Het logo veranderd weer terug van kleur. Als je op een kink in het menu klikt ga je naar die webpagina.
- Webpagina: Dit is de webpagina waar je op hebt geklikt. Op deze pagina kun je weer op de menu button klikken en dan gebeurt er hetzelfde als bij punt 1.
Feedforward
Je kunt zien dat je op 'contact' en 'menu' kan klikken en dat er dan iets moet gaan gebeuren. Bij menu zal het 'menu' openen en met 'contact' zal je naar de contactpagina gaan.
Als het menu open is zie je dat er een 'close' button is, wat het menu zal sluiten. En je ziet linkjes waar je op kunt klikken die je naar die pagina sturen. Als je over de linkjes hovered komt er een pijltje ervoor te staan.
Feedback
De 'menu' button veranderd naar een 'close' button als je erop klikt. Ook wordt de hele pagina overgenomen door het menu, die een andere achtergrondkleur heeft.
Progresive Disclosure
Als het menu geopend is kun je alleen maar op de linkjes klikken om naar een andere pagina te gaan, of het menu sluiten.