A design concept  ·  for Rain

Stream Context

A real-time presentation engine for his Counter-Strike stream. A viewer who drops in cold understands the session in three seconds — and the stream itself reacts to what actually happens in the game.
The first impression

Three seconds

That’s how long a new viewer gives you. Here is everything the stream tells them.
What rank?—
Premier or FACEIT?—
Is tonight going well?—
Who is in the party?—
How many hours in?—
One element answers all five
The context capsule

One bar. Two states.

It shuts the moment a round goes live, and opens in freeze time, on death, at halftime and in queue.
What rank19,842
Premier or FACEITPremier live
Is tonight going well4–2 +312
Who is in the partyweazy · john
How many hours in8,214 hours
Collapsed · live round
Premier
19,842
312
4–2
Behind the other tabs
MatchLive score, map, your K/D
TeamThe lobby and their ranks
CareerHours, both peaks, what it’s worth
SkinsEverything the account holds
Expanded · freeze time, death, queue
Premier
19,842
312
4–2
SessionMatchTeamCareerSkins
Next tier158 away
Tonight6 games · +312
+148+112-96+134-88+102
FACEIT2,847
Partyweazy · john
Updated 2s agoRAIN
A map under every game — and every one of them opens
Session  ·  one level in

One level in, game four

Clicking a column pushes a page. The map it was played on, your line for that game, and the clips that came out of it. One tap back and the night is where you left it.
The map, at size
Your numbers for that game
Most-watched clips first
Premier
19,842
312
4–2
SessionMatchTeamCareerSkins
←  TonightGame 4 of 6
MirageWon 13–9 · 41 min
+134
ScoreboardFrom the client
24/14K / D
4MVPs
58Score
Out of that game2 clips
01
0:28
the 1v3 on A site4,102 views · round 17
02
0:19
whiffed the whole mag2,880 views · round 8
Game ended 22 min agoRAIN
Where it comes from
StatsThe game client, as it is played
TimesEach game is stamped as it starts
ClipsTwitch, filtered to that window
OrderMost watched first
A game nobody clipped just shows the numbers — no empty shelf.
Match  ·  Team  ·  Career

Three more tabs

Match · while you are dead
Premier
19,842
312
4–2
SessionMatchTeamCareerSkins
Live · round 17CT side
Mirage 9–7
Scoreboard
24/14K / D
4MVPs
58Score
StatusDead
Money$4,750
Updated 2s agoRAIN
Team · when the lobby loads
Premier
19,842
312
4–2
SessionMatchTeamCareerSkins
LobbyParty of 3
19,842
rain24–14
18,410
weazy19–16
17,955
john15–18
swiftz21–13
16,780
kmz11–19
Lobby average18,619
Duo record · weazy31–19
Updated 2s agoRAIN
Career · in queue, or when chat asks
Premier
19,842
312
4–2
SessionMatchTeamCareerSkins
8,214Hours
6,902Matches
58%Win rate
PeakBoth ladders
Premier · Feb 2026
2,983
FACEIT · Nov 2025
Inventory $23,880 · 412 items
Main roleEntry · AWP second
Updated 2s agoRAIN
And a fifth tab, for the thing chat asks about every night
Match  ·  one level in

Round 17, three clips

The same push, one level down. On the match tab a dot marks every round somebody put on tape. Opening one hands back the three most-watched, with what you did that round sitting above them.
A dot means there is tape
Three clips, most watched first
Someone who just arrived catches up
Premier
19,842
312
4–2
SessionMatchTeamCareerSkins
←  Mirage · live9–7 · CT side
Round 17Won · 1 v 3
3Kills
2Headshots
287Damage
On tape3 clips
01
0:28
the 1v3 on A site4,102 views · clipped by mxwl
02
0:14
the reaction after1,640 views · clipped by dev1n
03
0:31
same round, chat cam903 views · clipped by hexi
Round ended 4 min agoRAIN
How it lines up
RoundStarts and ends stamped by the game
StreamThe same instant, in stream time
ClipSits at a known second of the VOD
MatchWhichever round it overlaps
Rounds nobody clipped stay unmarked. The system can also clip your own aces and clutches, so the good ones are never missing.
The fifth tab  ·  Skins

A fifth tab

Chat asks what the AWP is worth every night. The tab answers it once — what the account holds, and the three that carry it.
The whole inventory, priced
The top three, ranked
Whatever is in your hands now
Every row opens — next page
Premier
19,842
312
4–2
SessionMatchTeamCareerSkins
Inventory412 items
$23,880— three items are two thirds of it
Top threeMarket value
01
AWP | Dragon LoreField-Tested
$12,400
02
★ Karambit | DopplerFactory New · Phase 2
$2,180
03
AK-47 | Fire SerpentMinimal Wear
$1,640
In handAWP | Printstream · $184
Priced 40s agoRAIN
What opens it
ChatSomeone types !skins
InspectYou look at the weapon
DropA new item lands
Skins  ·  one level in

The price is the boring part

What chat is really asking is where the knife came from. So the row opens: your own words on how you got it, and the clip of the night it happened, pinned to the item.
You write the note once
You pin one of your own clips
It answers the question every night after
Premier
19,842
312
4–2
SessionMatchTeamCareerSkins
←  Top three01 of 412
AWP | Dragon LoreField-Tested · 0.21
$12,400
The storySept 2019
“Third case of the night and chat was already telling me to stop opening. It has not left my loadout since.”
Written by Rain
The clipRain’s own
0:41
the unbox, live on stream14 Sep 2019 · 1.2M views
Pinned by RainRAIN
Where it comes from
NoteTyped once in your dashboard
ClipPicked from your own clips
ChatSomeone types !story awp
InspectYou pull the item out mid-game
Items without a story stay as they are — priced, ranked, and quiet.
twitch.tv/fazerain
FollowingBrowse
Get Bits
Premier
19,842
312
4–2
SessionMatchTeamCareerSkins
Next tier158 away
Tonight6 games · +312
FACEIT2,847
Partyweazy · john
LIVE
Rain
road to 20k — premier grind w/ the boys
Counter-Strike 2EnglishFPS
4,182
Follow
Subscribe
Stream Chat

bl4nkzy: what rank is this

tobzz: +312 today lets goo

ripgg: 158 off 20k omg

nordan_: awp is unfair

kev1n: who is the duo

saraaa: that clutch tho

jonty: !session

mxrt: 8k hours is insane

Send a message
Option 1  —  Twitch extension

Put it over the video

Twitch draws it on top of your player. You install it on the channel once and every viewer gets it.
Costs zero screen space
Each viewer opens and closes it
Not on console. Never in clips.
Or bake it into the video
Option 2  —  Broadcast overlay

Put it in the video

Built as a scorebug: one row, two cells, labels underneath.
Everyone sees it
Lives in every clip and VOD
Always in step with the video
Yours to design
Costs pixels. Can’t expand, can’t hide.
19,842
312
Premier Live
4–2
Tonight
Detail  ·  2×
19,842
312
Premier Live
4–2
Tonight
Sample data — the bar carries whichever ladder is live, Premier or FACEIT
The pulse  ·  game state

One bar. A pulse.

CalmRound 12
Premier
19,842
312
4–2
5v5, full buy. No pulse — there is nothing to say yet.
Pressure2 v 3
Premier
19,842
312
4–2
Down a man, 61 HP. It appears, and it is slow.
Clutch1 v 3
Premier
19,842
312
4–2
Last man alive, 34 HP. The rate climbs with every teammate down.
Bomb down0:09
Premier
19,842
312
4–2
Nine seconds on the timer. The bar is shut and it still reads.
The beat is driven by alive-count, HP and the bomb timer — the same feed as the score
The pulse  ·  on the stream

Round intensity

Premier
19,842
312
4–2
Round 12 · 5v5 — nothing to say
Premier
19,842
312
4–2
Round 24 · 1v3, 34 HP
Two places to put all of it
The mascot  ·  the character

Avatar

Idle  ·  six frames, 8fps
Actual size  ·  on a 1080p stream
200 pxbody height in the source art
90 pxon a 1080p stream — 8.33% of frame height, bottom-left
8colours in the whole character. No anti-aliasing, anywhere
7animations, each generated from this one locked sprite
He is small on purpose — the corner the eye already goes to, not a mascot taking the frame
The mascot  ·  the views

Every state, and what sets it

Driven by unique chatters — a rolling twenty seconds
Idle
0 chatters
Drizzle → Steady
low level of chatter
Pulls it out
medium level of chatters
Umbrella
25–39 chatters
Strike
high level of chatter held for x seconds
Driven by an event — suppressed while a state above owns him
Laugh
Chat or game event
Angry
Chat or game event
Tomato
Chat or game event
The state machine arbitrates — a reaction can never interrupt the umbrella or the strike
The mascot  ·  the art

The weather is pixels too

Drops, bolts and splashes are generated against the character himself as the style reference, then quantised to his palette. Nothing in the weather is drawn with a vector stroke.
Rain  ·  ten drops, one pixel wide
Lightning  ·  three forks, one per strike
Splash  ·  three frames, on landing
The character’s eight colours
Generated art — quantised to the locked palette, no colour invented