Member-only story
How having the wrong level of zoom can distort design feedback
The way art-boards look doesn’t necessarily match reality
I notice that many people (myself included) tend to create, observe, present, and critique designs in a zoomed out state. This can be the case when looking at work-in-progress designs in an application like Sketch or Figma — or even when looking at a mock-up that’s been printed out.
With a zoomed-out view, you can easily end up seeing twice the screen real estate or more compared to what users would typically see when using the product for real. This provides a better overview of the page, but can also skew perceptions of how well the design is working in a few subtle ways. Once you become consciously aware of these effects you may find that they actually come into play a surprising amount.
Here are a few problems you’ll come across when looking at a zoomed-out view:
1. Individual elements stand out less
Because you can see more at once, individual elements will have to compete more fiercely to stand out among the other elements on the page. Consider the example in the image below. A stakeholder looking at the view on the left may think that the yellow button in the top right doesn’t stand out enough — even though it’s clearly the most prominent element when the view-port is seen at a more realistic size.
2. Your perception of scale becomes distorted
This is something that I’ve noticed can be a particular issue for junior designers working outside of an established design system. They might set text or graphics at a size that looks good in the application, but when it comes time to implement, everything ends up looking far too large.
The following image is a recreation of a design where the body text was originally set at 26px. This looked OK within the design application, but when viewed at the actual size the text seemed enormous — especially compared to text throughout the rest of the site which was mostly set at 16px.
