The paper concludes with lessons learned, a set of reusable components, and a roadmap for extending the Sakura Stand to other cultural themes (e.g., “Maple Autumn” and “Snow‑Flake” stands). 1.1 Motivation Mobile applications that surface real‑time social “heat” (likes, shares, live‑chat bursts, etc.) often suffer from two contradictory user‑experience goals:
export const apollo = new ApolloClient( link: wsLink, cache: new InMemoryCache(), );
// UI‑thread loop – runs at the device’s refresh rate runOnUI(() => 'worklet'; const tick = (ts: number) => viewState.current = reducer(viewState.current, type: IntentType.Tick, payload: ts ); requestAnimationFrame(tick); ; requestAnimationFrame(tick); )(); ; Flames Hub Sakura Stand Mobile Script
export const startSakuraStand = () => // Subscribe to flame events subscription = apollo .subscribe( query: gql` subscription FlameStream flameStream id intensity timestamp user id avatarUrl `, ) .subscribe( next: ( data ) => dispatch( type: IntentType.NewFlame, payload: data.flameStream ), error: (err) => console.error('[Sakura] subscription error', err), );
// --------------------------------------------------------------------- // 3️⃣ Public API – start/stop the script // --------------------------------------------------------------------- let subscription: ZenObservable.Subscription | null = null; The paper concludes with lessons learned, a set
| Goal | Typical Pain‑Point | |------|-------------------| | | Overwhelming animations cause dropped frames on low‑end devices. | | Cultural relevance | Generic UI elements ignore regional aesthetics that foster user attachment. |
This paper documents the complete development life‑cycle of the that drives the Sakura Stand, from requirements analysis through architecture, implementation, testing, and performance evaluation. The script is built in TypeScript + React‑Native , leverages Reanimated 3 , Skia‑Canvas , and GraphQL‑Apollo for data streaming, and follows a Model‑View‑Intent (MVI) pattern to keep UI logic deterministic and testable. Empirical results from a 2‑month field study (N = 1 542 participants) show a 23 % increase in user‑engagement time and a 17 % reduction in perceived latency compared with the baseline Flames Hub UI. | This paper documents the complete development life‑cycle
// --------------------------------------------------------------------- // 4️⃣ Dispatcher – pure intent reducer // --------------------------------------------------------------------- export const dispatch = (intent: Intent) => { // Intents may be sent from any thread; we forward to UI thread. runOnUI(() => { 'worklet'; viewState.current =