Skip to content

feat: intro overlay — analytics, auto-enter, word lift, light mode#61

Open
joyehuang wants to merge 1 commit into
mainfrom
feat/intro-polish
Open

feat: intro overlay — analytics, auto-enter, word lift, light mode#61
joyehuang wants to merge 1 commit into
mainfrom
feat/intro-polish

Conversation

@joyehuang

Copy link
Copy Markdown
Owner

What

Four fixes to the home intro animation (follow-up to #52):

  1. Analytics — new home_intro_action event (documented in ANALYTICS.md): target = skip / enter / avatar / auto_enter / replay. Every playthrough ends in exactly one exit event, so skip rate is directly measurable.
  2. No forced click — the landing card auto-enters the homepage after a 3s hold. The 进入 / avatar / 跳过 buttons still work for entering sooner; nothing is gated on a click anymore.
  3. Avatar occlusion fixed — when the landing card appears, the JOYE particle word lifts to the top (~17.5% height) and scales down (0.44×), so the avatar no longer covers the O/Y. Verified on desktop and short/narrow viewports.
  4. Light mode — the overlay now follows the site theme (.dark on <html>): dark = existing cyan glow field; light = ink-blue particles on paper-white, with matching HUD/card/buttons via CSS variables. Canvas switches sprite, trail-fade color, blend mode (lightersource-over), and mesh color.

Also keeps aria-hidden in sync so screen readers can't tab into a hidden overlay.

Verified

  • bun run check clean (0 errors)
  • Dev-preview walkthrough of both themes: noise → sample/refine/decode → resolve → word lift + card → auto-enter reveal
  • home_intro_action events observed in Vercel Analytics debug logs
  • No console errors

🤖 Generated with Claude Code

- track home_intro_action (skip/enter/avatar/auto_enter/replay) via window.va
- auto-enter homepage 3s after the landing card shows; buttons now only
  let the visitor enter or skip sooner (no forced click gate)
- lift + shrink the JOYE particle word on landing so the avatar card no
  longer occludes it
- theme the overlay from .dark on <html>: dark glow field or light ink
  field (canvas sprite, trail fade, mesh + CSS variables)
- keep aria-hidden in sync with overlay/card visibility

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
@vercel

vercel Bot commented Jul 2, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
blog Ready Ready Preview, Comment Jul 2, 2026 6:14am

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant