Training your eye

A component can render correctly and still be hard to read or use: a heading that barely stands out from the body below it passes every check a compiler runs and still fails the reader. You met the five domains in the last lesson. Naming them is not the same as seeing them.

The takeaway: judgement is trained by deliberate comparison, in three moves.

1. Compare two versions and choose the stronger one.
2. Name the reason it works.
3. Test that principle somewhere else.

A worked example

Run the three moves once, slowly, on a single pair.

Compare. Here is StrataSync’s tagline set two ways: "Sync everything." and “Sync everything.” Read both. The first looks like it came out of a code editor. The second looks typeset.

Name. The second uses curly quotation marks (“ ”), the marks a typesetter reaches for. The first leaves the straight ASCII marks a keyboard produces (" "). Now the difference has a name: smart quotes. A named difference is one you can look for on purpose.

Test. Take the principle somewhere else. Open any page you shipped and find an apostrophe. If it is straight (') where it should be curly (’), the principle applies there too. You have learned a rule, not a single case.

That is the loop. Compare to feel the difference, name it to make it repeatable, test it to prove you learned the principle.

Train your eye across the domains

Six comparisons follow, spanning the surface domains. You have not been taught these terms yet, and that is deliberate. React first: hover, click, and pick the option that feels stronger. Then read the explanation, which names what you saw. Wrong answers are the point. A wrong pick you then understand trains the eye faster than a right pick you cannot explain.

Practice: the 5-second scan

Open a page, start a five-second timer, then look away. Write down the task, the primary action, and anything unclear, then reopen and verify each observation. Run it weekly and compare what you notice over time. The gap between what you catch in five seconds now and in a month is the eye training itself.

The progression

First you can explain a problem once someone points it out. Then you notice it yourself, unprompted. With practice, you make the stronger choice while you build, before the weak version ever ships. Intuition starts the inspection; a checklist, a measurement, or a user test confirms it.

Recap

• Trained judgement is deliberate comparison: compare, name, test.
• Naming a difference turns it from a lucky catch into something you can look for on purpose.
• The six comparisons trained the eye across type, motion, craft, and copy. React first, then let the explanation name what you saw.

From memory: name the three moves, and say what naming a difference buys you.

Next, Your first fix: you have spotted and named weak decisions, so now you repair one. One card, four passes, the whole loop end to end.