Make Dense Interfaces Easier to Scan

One of the most interesting videos I have seen about UI design is Kole Jain’s “The secret behind weirdly perfect UI designs”. It gave me a language for something I have felt in good interfaces but never quite named: the interface does not always make information easier by removing it. Sometimes it makes the same information easier by making it faster to scan.

Jain begins with a Walmart receipt. The text is aligned hard left, the prices are aligned hard right, and the only centered text is the part you are not really meant to read. The two edges hold everything together. He applies the same idea to cards: instead of filling empty space or hiding controls, move things until they create edges for the other elements to sit against.

Before                         After

[avatar] [name] [button]      [avatar] [name]        [button]
                 [button]      -----------------------------
                               [content sits below the edge]

The shapes do not necessarily add information. They give the information somewhere to live.

The strongest example is a huge to-do list. At first, a long unbroken list can feel like one enormous obligation. But add avatars wherever a person is mentioned, then group the tasks by date, and the same amount of text becomes much easier to navigate.

Before                         After

Alice   Send invoice           TOMORROW
Alice   Review contract         ● Alice   Send invoice
Marcus  Fix onboarding          ● Alice   Review contract
Priya   Draft launch email
                               NEXT WEEK
                               ● Marcus  Fix onboarding
                               ● Priya   Draft launch email

They’re not making it prettier, they’re making it faster to scan.

That is what I found so fascinating about the video. UI design can change the experience of information without changing the information itself. A box, an avatar, or a section heading can make a dense screen legible. The goal is not less information. It is less searching.

The to-do list is one specific example of how a dense interface can become easier to scan without losing any of its information. A Long List Is Easier to Scan in Pieces focuses on that transformation. I carry the same instinct into prose in Give the Reader Places to Pause.