Designing a Flutter Tracking Framework for High Accuracy

What Is User Behavior Tracking

  • Entered page A: The first frame of page A is rendered and a focus was obtained.
  • Exposed placement X: Button X is displayed on the mobile screen for a period of time so that the user can see and tap the button.
  • Clicked placement X: The user is interested in the content of button X and clicked button X. Button X responds to the click and a new page is opened.
  • Exited page A: Page A losses the user’s focus.
  • Entered page B: The first frame of page B is rendered and a focus is obtained.

Implementation Solution

Entering and Exiting a Page

  • Assume that pages A and B enter the page stack in a sequence (A enter > A leave > B enter). Then, page B exits (B leave) and page A is visible again. In this case, no push event for page A (A enter) is received.
  • Assume that Dialog or BottomSheet pops up on page A. Although both the two operations trigger the push method to Navigator, page A does not exit in the sense of users.

Placement Exposure

  • The visible area of the placement on the screen is equal to or greater than half of the overall area.
  • The placement stays within the visible area of the screen for more than 500 milliseconds.
  • Placement A is outside of the visible area on the screen, and is therefore invisible;
  • Placement B is about to leave the visible area on the screen, and therefore will switch from visible to invisible;
  • Placement C is in the middle of the visible area on the screen, and is therefore visible;
  • Placement D is about to enter the visible area on the screen, and therefore will switch from invisible to visible.
  • Offset of the container from the screen
  • Offset of the placement from the container
  • Location, width, and height of the placement
  • Location, width, and height of the container
//监听容器滚动,得到容器的偏移量
double _scrollContainerOffset = scrollNotification.metrics.pixels;
//曝光坑位Widget的context
final RenderObject childRenderObject = context.findRenderObject();
final RenderAbstractViewport viewport = RenderAbstractViewport.of(childRenderObject);
if (viewport == null) {
return;
}
if (!childRenderObject.attached) {
return;
}
//曝光坑位在容器内的偏移量
final RevealedOffset offsetToRevealTop = viewport.getOffsetToReveal(childRenderObject, 0.0);
if (当前坑位是invisible && 曝光比例 >= 0.5) {
记录当前坑位是visible状态
记录出现时间
} else if (当前坑位是visible && 曝光比例 < 0.5) {
记录当前坑位是invisible状态
if (当前时间-出现时间 > 500ms) {
调用曝光埋点接口
}
}

Placement Clicks

Results

Outlook

Original Source:

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Alibaba Cloud

Alibaba Cloud

Follow me to keep abreast with the latest technology news, industry insights, and developer trends. Alibaba Cloud website:https://www.alibabacloud.com