01 / 활용
하나의 신호. 다양한 활용.
// 분석
클릭이 아닌 의도
행동뿐 아니라 포기한 접근과 망설임도 기록합니다.
// 노출
점진적 노출
사용자가 향하는 즉시 미리보기나 툴팁을 엽니다.
// 성능
링크 미리 가져오기
사용자가 클릭하기 전에 탐색 링크를 미리 가져옵니다.
// 적응형 UI
보조 조준
사용자가 다가갈수록 대상을 확대하거나 더 가까이 가져옵니다.
01
01
측정
잡음이 섞인 궤적을
02
02
추정
유력한 목적지를
03
03
준비
도착하기 전에
02 / 라이브 데모
카드 쪽으로 움직여 보세요 — 어떻게 미리 가져오는지 확인하세요.
importance
cost
onIntent 스트림0회 실행
// 카드 쪽으로 움직여 신호를 실행하세요…
product shot
여성
product shot
남성
product shot
키즈
product shot
신발
product shot
가방
product shot
액세서리
product shot
스포츠
product shot
데님
product shot
아우터
product shot
뷰티
product shot
홈
product shot
세일
product shot
전자제품
product shot
시계
product shot
주얼리
product shot
가구
product shot
선물
product shot
여행
03 / 차이를 느껴 보세요
같은 클릭. 기다림은 건너뛰세요.
한 페이지는 네트워크 요청을 기다리고, 다른 페이지는 사용자의 이동 궤적 중에 가져옵니다.
이번 세션에서 절약한 시간
0 ms
/product/quilted-jacket
/product/quilted-jacket
04 / 무엇이 다른가
가시성도, 호버도 아닌 의도입니다.
다른 모든 방식은 너무 늦거나 리소스를 낭비합니다.
1.37
Fetch:Click 비율
useIntentTarget
사용자 정의 컴포넌트를 만듭니다
React · Next
가장 인기 있는 프레임워크용
MIT
오픈 소스, 데이터 수집 없음
| 방식 | intent-link | ForesightJS | instant.page | Next.js prefetch | Guess.js |
|---|---|---|---|---|---|
| 시점 | 도착하기 전 | 궤적을 따라 | 마우스를 올릴 때 | 화면에 들어올 때 | 사전 계산 |
| 선택성 | 그 목적지 | 그 목적지 | 하나 | 보이는 모든 것 | 최선의 추측 |