SGAG Media, HEPMIL Media Group · 2018–2019
Panik! by SGAG
A live trivia game show app that turned Singapore's love of local trivia into a weekly cash-prize event.
Shipped on iOS & AndroidThe problem
A live, hosted trivia show in an app: the whole audience arrives at once on Sunday 9:30pm, plays for real cash, and has no patience for an interface.
What I did
Designed the UI/UX and built it in React Native — onboarding against a start time, the referral growth loop, live gameplay states, and the money surfaces.
Where it landed
2,500+ concurrent players on launch night, a 10-episode weekly series, shipped on both app stores.
Overview
Panik was HEPMIL Media Group's first move beyond social content into a product of its own: a livestreamed trivia game show, hosted by SGAG's own on-screen talent, built into a mobile app. Players tuned in live, answered ten questions on local Singapore trivia and pop culture, and split a real cash pot with the other top scorers. On launch night — 21 April 2019 — over 2,500 people played live, and that night's top scorer walked away with $729.02.
My role
I designed and built the app's interface alongside SGAG's Project Manager and in-house engineering team. That meant owning the UI and interaction design for the screens below — onboarding, the referral loop, the live trivia gameplay and the account surfaces — and then implementing them in React Native, so the design was tested against the real thing rather than a prototype. I also built internal tools for the Creative and Production team and ran the competitive analysis behind the go-to-market plan.
How Panik worked
Live, hosted trivia — the show aired weekly on Sunday nights at 9:30pm, hosted by SGAG cast members Fauzi and Nadia, mixing livestream video with real-time gameplay.
Ten questions, real cash — players answered ten questions on Singapore trivia and pop culture, earning points for each correct answer, with no elimination for wrong answers.
A pot that rolled and grew — the top scorers split a cash pot that started at $1,000, with a bonus all-or-nothing PANIK round letting the fastest correct answer take the entire pot.
Low barrier to cash out — winners could cash out via GIRO transfer with a minimum of just $10.
What I designed and built
- Designed the UI and interaction model for the live trivia format — question card, answer states, timing feedback — then built those screens in React Native.
- Designed the onboarding and referral flow end to end, from entry point to code redemption, as the app's primary growth loop.
- Designed the account and rewards surfaces where real money is displayed, converted and cashed out.
- Ran competitive analysis to inform positioning, and worked cross-functionally with SGAG's Creative and Production team on internal tooling and production formats.
The design decisions behind it
Panik had a start time. Everything below follows from a product where the audience arrives all at once, at 9:30pm on a Sunday, and has no patience for an interface.
Onboarding against a clock
The show started whether or not you were ready, so signup had to fit between hearing about it and the first question. Minimum fields, referral code optional rather than blocking, and a tutorial that could be skipped by anyone who just wanted to play.
A referral loop inside the product
Growth was the referral mechanic, so it got designed as a real flow rather than a settings item: find it under Account, share a code, redeem it at signup. Three steps, each one legible on its own, because the person sharing has to be able to explain it in a text message.
Real money, unambiguous states
Balance, PANIK points, the conversion between them, and a $10 minimum cash-out all live on one screen. When a number is actual money, every state it can be in — pending, converted, withdrawable — has to be readable without a support article.
One language with the broadcast
The app sat next to SGAG's on-air look and their existing audience's expectations. The interface had to feel like the same property as the show without borrowing so much of it that gameplay controls stopped reading as controls.
What a live game show asks of an interface
The clock is the interface
Ten seconds a question, thousands of people answering at once. Everything on screen has to be read at a glance and hit without looking — type large enough to parse in peripheral vision, targets big enough for a thumb that's already moving.
Two layers, one screen
A live host feed and an interactive game surface share the same phone. The gameplay layer has to sit over live video without burying the hosts, which sets hard limits on fill, contrast and how much chrome the UI is allowed.
State has to land instantly
Locked in, correct, wrong, eliminated, still alive — each state needs its own unmistakable read, because a player gets one glance before the next question starts and there's no time to explain.
The pot is the emotional anchor
A live cash prize is what people are actually there for. Keeping the pot visible and legible through every round is what turns a quiz into a show worth tuning in for.
Panik was my first product, and the first time I owned interface design and implementation on the same thing. The constraints above are the ones the live format imposed — they're the reason I still reach for real-time, high-pressure product work.
Screens I designed
Click any screen to view it full size.
Outcome
Panik launched on 21 April 2019 with over 2,500 concurrent live players in its first episode, and shipped on both the App Store and Google Play. It ran as a 10-episode weekly series — HEPMIL Media Group's first product beyond its social media and meme content business.
“With PANIK, it's a step towards building something of our own, and gathering people on the digital space. It's once a week, come play with us, and have fun.”
Karl Mak, Co-founder, SGAG & HEPMIL Media Group
Product details verified against contemporary press coverage: Vulcan Post — “Keep Calm And Play PANIK” (29 Apr 2019)
Next case study: Carb Kun Carb