Improve an artifact~30 min

Improve an Artifact: Hierarchy Without Color

Early preview draft — not yet practitioner or accessibility reviewed.
Goal
Practice building visual hierarchy with the quiet tools — size, weight, and spacing — so emphasis survives color-blindness, dark mode, and bad monitors.
Scenario
Pick a real, dense screen you use (a settings page, a dashboard card, a checkout summary). Screenshot it, then rebuild or heavily mark it up so its three most important elements read first, second, third — without changing a single color.
Audience
A reviewer who will squint-test your version cold and say what they noticed first, second, third — and whether that matches what should matter.
Constraints
Size, weight, and spacing only. Existing colors stay exactly as they are — the constraint is the exercise.
Deliverable
Before/after images (or a marked-up before + rebuilt after), plus three sentences: what should read first/second/third and which specific size/weight/spacing change carries each.
Counts on your evidence profile as
A completed Skill Lab with its rubric and your deliverable
Accessibility requirement
Your after version's text sizes must not fall below readable minimums to create contrast — shrinking secondary text into illegibility is a hierarchy cheat this lab rejects.
AI policy
AI use is allowed for this lab. AI critique of your after version is a fine second opinion; the changes themselves are two minutes of tool work either way.
Rubric
  • The squint test passes: Blurred or squinted at, the after version's reading order matches the stated first/second/third — verifiable by anyone in ten seconds.
  • The constraint held: Pixel-compare confirms no color changed; every gain came from size, weight, or spacing.
  • Rationale names the mechanism: Each sentence ties an element to the specific change that promotes or demotes it — not "made it cleaner."
Resources

Skills: Layout, Visual Hierarchy

Relevant to: Product Designer, UI Designer, Visual Designer

Your work

Sign in to start this lab.