Journal on A Short Journey

When Motion Guides Attention

Sun, 05 Apr 2026 00:00:00 +0000

Attention on a web page is not a single thing. It is a sequence of decisions - where to look first, where to look next, how long to stay, when to leave. Every visual element on the page competes for that sequence. Typography, colour, size, position, and contrast all influence where the eye goes. But motion is different. Motion does not just influence attention. It commands it.

The human visual system is wired to detect movement in the peripheral field. This is an evolutionary inheritance - moving objects might be predators, prey, or social signals - and it operates below conscious control. A moving element on a web page captures the eye whether the reader wants it to or not.

Keeping Immersive Pages Light

Wed, 25 Mar 2026 00:00:00 +0000

There is a persistent assumption in interactive web design that immersion requires weight. Rich experiences need big images. Atmospheric scenes need complex JavaScript. Engaging motion needs heavy animation libraries. The assumption is wrong, and it produces slow, fragile pages that exclude a significant portion of their potential audience.

The reality is that the lightest pages are often the most immersive, because speed itself is a quality that creates trust and engagement. A page that loads instantly and responds without delay feels confident. A page that takes four seconds to render and stutters during scroll feels broken, regardless of how striking the visuals are once they finally appear.

Designing Browser Scenes with Restraint

Sun, 15 Mar 2026 00:00:00 +0000

Restraint is the hardest skill in interactive design. The tools are powerful. The browser can animate hundreds of elements, render complex visual effects, respond to dozens of input types, and process audio in real time. The temptation is to use all of this capability, because the capability exists and because using it feels like craft.

It is not. Craft is knowing what to leave out. A browser scene that uses every available tool is not a demonstration of skill. It is a demonstration of enthusiasm, which is a different thing entirely. Skill shows in what is absent - the animation that was considered and rejected, the interaction that was prototyped and removed, the visual effect that was technically possible but editorially unnecessary.

Reduced Motion for Rich Experiences

Thu, 05 Mar 2026 00:00:00 +0000

The prefers-reduced-motion media query is one of the most important additions to CSS in recent years. It gives users who experience motion sensitivity - from vestibular disorders to migraines to simple preference - a way to tell the browser that they need less movement. The browser passes that preference to the page, and the page adapts.

Most pages handle this badly. They either ignore the preference entirely, continuing to animate regardless, or they strip all visual dynamism from the page, leaving a static, lifeless version that feels like a punishment for having a medical condition. Neither approach is acceptable.

Why Scene Transitions Matter

Wed, 25 Feb 2026 00:00:00 +0000

Transitions are the most overlooked element of browser-native design. Teams spend weeks on hero sections, days on typography, hours on animation easing curves, and minutes on the boundary between one section and the next. The result is pages that feel like collections of well-designed fragments rather than coherent experiences.

This neglect is understandable. Transitions are not glamorous. They do not appear in design system documentation. They are not easy to showcase in a portfolio piece. Nobody screenshots a section boundary and shares it as inspiration. But transitions are the connective tissue that determines whether a page feels unified or stitched together, and their quality has a measurable effect on how readers engage with the content.

How Layout Rhythm Changes Reading Speed

Sun, 15 Feb 2026 00:00:00 +0000

Reading speed on a web page is not constant. It varies from section to section, paragraph to paragraph, element to element. Some of this variation is content-driven - complex ideas take longer to process than simple ones. But a significant portion is layout-driven. The visual arrangement of content on the page directly affects how quickly the reader moves through it, independent of the content’s complexity.

This is a measurable phenomenon, not an aesthetic opinion. Eye-tracking studies consistently show that layout density, line length, typographic scale, image placement, and whitespace distribution all affect fixation duration and saccade length - the technical measures of how long the eye rests on each point and how far it jumps between points.