중지는 속도를 늦추는 일이 아니다

움직임 제어 버튼을 눌렀을 때 캔버스는 실제로 새 프레임을 요청하지 않는다. CSS 애니메이션도 같은 상태를 읽어 멈춘다. 화면만 정지한 것처럼 보이게 두고 계산을 계속하는 방식은 사용자의 의도와 배터리 모두를 무시한다.

운영체제의 움직임 축소 설정도 처음부터 같은 신호로 취급한다. 다만 사이트 안의 버튼으로 다시 선택할 수 있고, 그 선택은 다음 페이지에서도 유지된다.

정지 화면에 무엇이 남는가

애니메이션을 없앴을 때 빈 검은 상자만 남는다면 정보 구조가 움직임에 종속된 것이다. 캔버스 아래에는 실험 이름과 조작법이 HTML로 남고, 자바스크립트를 사용할 수 없는 경우에는 자체 제작한 정적 포스터가 보인다. 링크와 글은 항상 문서 흐름 안에 있다.

파동 간섭도 마찬가지다. 움직임은 패턴을 이해하는 한 방법일 뿐, 유일한 설명이 아니다. 파원이 겹치며 밝고 어두운 띠가 생긴다는 문장이 함께 있어 정지 상태에서도 관찰의 방향을 잃지 않는다.

보이지 않으면 쉬어 간다

브라우저 탭이 백그라운드로 가거나 실험이 화면 밖으로 밀려나면 루프를 중단한다. 다시 보일 때만 이어서 그린다. 이 동작은 성능 최적화이면서 동시에 움직임의 범위를 실제 관심 영역으로 제한하는 일이다.

키보드 포커스, 명확한 라벨, 큰 조작 영역도 같은 원칙에서 나왔다. 멋진 장면보다 누가 어떻게 멈추고 다시 시작할 수 있는지가 먼저다.

출처와 더 읽을 거리