GFX-301h · Module 3
Prototype Testing
3 min read
A prototype that looks right but behaves wrong teaches the wrong lessons. Prototype testing validates three dimensions: visual fidelity (does it look like the mockup?), interaction correctness (do the interactions behave as specified?), and user comprehension (does the target user understand the interface without instruction?).
Visual fidelity testing: overlay the prototype screenshot on the approved mockup at the same viewport size. Measure deviations in spacing, alignment, color, and typography. Acceptable deviation: under 4px on spacing, under 2 degrees on color hue, exact match on font family and weight. This is automated using the brand critic — the same tool that evaluates generated images evaluates prototype screenshots.
Interaction testing: walk through every interaction pattern in the prototype. Does the stagger reveal trigger at the correct scroll position? Does the glass panel hover show the correct border brightness? Does the tab switch cross-fade at the specified 300ms? Each interaction is tested against its specification in the pattern library.
User comprehension testing: show the prototype to someone unfamiliar with the design. Can they identify the primary action? Can they navigate to the key information? Do they understand the data being presented? If the interface requires explanation, the design needs revision — not the user.