Live GitHub Pulse — Broadcast Ticker for the Rive Broadcast ...

Live GitHub Pulse — Broadcast Ticker for the Rive Broadcast & Livestream UI Challenge

I work as a data analyst and dashboard specialist, so when I saw this challenge, I didn't want to just animate something pretty — I wanted to see if I could bring actual live-data thinking into Rive, the same way I'd build a real-time analytics panel in my day job.

The concept: A broadcast-style lower-third ticker, similar to what you'd see on a live sports or esports stream — except instead of scores, it surfaces trending GitHub repositories in real time. Repo name, star count, and primary language, updating continuously like a stat panel during a live broadcast.

How it's built:

Data Binding — I set up a View Model (VMTicker) with three properties (repoName, starCount, language) and bound them directly to text layers on the canvas. Star count uses a Number-to-String converter so it renders cleanly as text.

Rive Scripting (Luau) — This is the part I'm most proud of. I wrote a custom script that runs inside the artboard and cycles through a set of trending repos every few seconds, pushing fresh values into the View Model through context:rootViewModel(). It's a small simulation of what a live API feed would do, built entirely with Rive's native scripting layer — no external app or backend needed.

State Machine animation — A looped timeline animates the accent bar's opacity in a subtle pulse, so the UI feels "alive" even during the seconds between data updates — like a live broadcast indicator light.

Why this approach: Most broadcast UI concepts lean heavily on motion and character work. I leaned into what I actually know — data pipelines and dashboards — and used Rive's newer Scripting and Data Binding features to bring that thinking into a motion-design tool for the first time. It was also my first time using Rive Scripting, so a good chunk of the build was debugging Luau type errors and figuring out the runtime API through trial and error. https://editor.rive.app/file/live-github-pulse/2466722 https://www.linkedin.com/posts/abuaasif_rive-uidesign-datavisualization-ugcPost-7490354984044154881-mIL_/?utm_source=share&utm_medium=member_desktop&rcm=ACoAACRm5rcB0nVG0_HUX6-IXfuWqNGquZ-jMQU