Pages of “Design Comps” zijn visuele mock-ups van een voorstel voor een nieuw schermontwerp. Hier kan de ontwerper bepalen hoe de website er uiteindelijk uit zal zien – van lettertype en kleur keuzes, achtergrondkleuren en -structuren tot navigatie en button design.

Voor elke template van je schermontwerpen wordt een comp ontwikkeld. Vaak ontwerp je in softwares als Photoshop- of Sketch. In de lagen laat je die verschillende statussen van interactieve componenten tonen.

Bedenk bij het ontwerpen van een comp altijd aan de pijlers van elke template: Wat is het grid dat de pagina gebruikt? Hoe en waar worden verschillende soorten tekstelementen weergegeven? Zijn er uitbreidbare en opvouwbare secties waarvoor u beide weergaven moet tonen? Is er een speciale behandeling of rand voor afbeeldingen of formulieren? Hoe zien de navigatie en buttons eruit?

Kies bij het ontwikkelen van comps een voorbeeldpagina zoals een overzichtspagina of detailpagina van producten die een template gebruikt. Gebruik echte teksten op de buttons en foto’s, of tenminste die in de buurt komen, om de juiste sfeer weer te geven.

Kennis: Grids

Lees meer: Create comps when designing a website