시작하기 / 작동 원리

작동 원리

intent-link는 페이지에서 사용자의 움직임을 관찰하고 어떤 보이는 대상에 가까워지는지 추정합니다. 신호가 충분히 강해지면 해당 대상의 onIntent 함수를 호출합니다.

1 · 움직임 관찰

데스크톱에서는 포인터 움직임을, 터치 기기에서는 스크롤을 읽습니다. 사용자가 상호작용할 때만 깨어나며 움직임이 멈추면 다시 쉽니다.

2 · 대상 판단

엔진은 사용자의 움직임과 현재 보이는 의도 대상을 비교합니다. 뷰포트 밖의 대상은 계산에 포함되지 않습니다.

3 · 작업 실행

어떤 대상이 충분히 유력해지면 그 대상의 onIntent 콜백이 한 번 실행됩니다. 사용자가 멀어졌다가 나중에 다시 접근하면 다시 실행될 수 있습니다.

데스크톱과 모바일

  • 데스크톱에서는 포인터의 2차원 움직임을 추적합니다.
  • 모바일에서는 세로 스크롤을 추적하며 첫 스크롤에서 활성화됩니다.
  • 반응형 CSS로 숨겨진 요소를 포함해 숨겨졌거나 화면 밖에 있는 대상은 무시됩니다.

물리학 아이디어

각 대상을 작은 중력 우물이라고 생각해 보세요. 움직임은 운동 에너지를 만들고 대상까지의 거리는 위치 에너지를 만듭니다. 빠른 포인터나 스크롤에는 아직 이동할 힘이 있지만, 대상 근처의 느린 움직임은 그곳에 머무는 모습에 가깝습니다. 엔진은 열역학과 비슷한 규칙을 사용해 이런 낮은 에너지의 도착점을 더 가능성 높은 선택으로 봅니다.

브라우저의 움직임 데이터에는 작은 튐과 오차가 있습니다. 칼만 필터는 물리 계산 전에 이 잡음을 부드럽게 합니다. 쉽게 말하면 의도한 움직임과 불안정한 측정값을 구분하도록 돕습니다. 이 과정은 모두 라이브러리 안에서 일어나며 앱에는 onIntent만 노출됩니다.

연구 논문 보기. ACM에 정식 게시되기 전까지는 임시 링크입니다.