Viewer Cards

Gives each viewer a score card: their own scores — messages this stream and all time, Bits, redemptions… — in sections of one or two columns, their chat badges and sub tier, and the badges of the achievements they unlocked. A card shows when a viewer asks for it (a command…), every active viewer's card plays in turn, or they all scroll past, each display mode on its own triggers, in one browser source.

The Viewer Cards are part of the Stream Scores widgets, with the Scoreboard. They work for free in one overlay, with one display mode, 5 scores per platform and 5 achievements per list; Stream Scores Licence lifts these limits → Stream Scores Licence.

Platforms: Twitch, YouTube, Kick, and integrations by name

Action pack: needed — Stream UI - Backend writes the viewers' variables, adds them to achievement groups and saves the screenshots. See Who needs what.

How it works

• Scores live in Streamer.Bot, as each viewer's user variables, on the platform they came from — temp_messages, messages… Your own actions can read and change them.
• Only what a viewer does counts. The trigger pickers offer only triggers a viewer sets off: platform events, Core › Commands, integration events naming a person, and User Global Variable Updated (a viewer's variable another tool writes, such as Chat First's firstInChat).
• Integrations are matched by name. A Ko-fi tip only carries a name: it counts for the viewer of the same name on each platform where Streamer.Bot knows them (they hold a user variable there). Which field holds the name is on the Connection page, under the integration's row.
• Achievements are user groups. When a viewer sets off an achievement's trigger, they join its Streamer.bot group, the New Achievement Unlocked custom trigger fires (if switched on) and its Chat message is posted in their chat — once: a viewer already in the group gets nothing.
• Pictures and badges come from chat. At each viewer's first words, their profile picture and chat badges are saved in their profilePic and userBadges variables, for their card.
• Counted by the overlay that runs the actions, while counting is on. Start counting and Stop counting, by hand or by trigger, switch it (streamUi.off.viewercards in Streamer.Bot). By default it starts with your Twitch stream and stops with it. Pictures are saved either way.
• Everyone counts, except your ignored users: they get no score, no achievement and no card.

The page

• Settings, Style and Controls, the tabs over the editor.
• On the Settings tab, the Settings column lists Display modes, Card options, Card sections, Scores and Achievements. Display modes opens its three modes in a column of their own; the last three open their platforms in a column of their own, then the platform's list beside it.
• Widget preview against the window's right edge: the preview (the demo viewer's card), the test buttons and the widget's own URL. Drag its left edge to widen it, up to half the window; it keeps its width. Widget shows the widget in its position, cut from the canvas as your browser source draws it; On canvas, the whole canvas.

How to set it up

Settings

Display modes

Three ways to show the cards, each switched on by the switch on its row, with its own Show trigger list and Show button on the Controls tab. They all show in the widget's one place, so a single browser source does it all: a new Show replaces the cards on screen, and Hide cards hides whatever shows. Only Single card is on by default. Without Stream Scores Licence, one mode at a time: switch it off before switching on another.

Loop off: hidden after one pass.

Card settings

Whose cards show, then the card's three parts, top to bottom. Every switch but the first is on by default.

• Viewers: Subscribers and members only (off): only subscribers' and members' cards.
• Header: Show platform icon, Show sub tier (Twitch tiers I, II, III) and Show chat badges.
• Body: Sections layout, a card's sections Horizontal (side by side, the default) or Vertical (one under the other).
• Footer: Show achievement badges, Show channel name (your channel's name and picture, the words Viewer card) and Show date.

Card sections

One row per platform, its Section list: the blocks of its cards, in order.

Scores

One row per platform, its Score list. The picked score:

Counted triggers, beside the score, each with its Score increment: Add 1, Add the value from a variable or Set the value from a variable (with Only replace if the new value is higher than the current value to keep the highest). With Two independent values, a switch under Add trigger picks Variable 1 or Variable 2. A User Global Variable Updated trigger watching the score's own variable is ignored, and the page says so.

The menu of a score also has Copy to YouTube (or another platform).

Achievements

One row per platform, each with its Achievement list. An achievement earned with a command or an integration goes in the list of each platform it counts on.

Unlocked by, beside it: its triggers, with an optional condition — a resub of 12 months, global.newValue ≥ 10… → Triggers and conditions.

New Achievement Unlocked

Each time a viewer unlocks an achievement whose Custom trigger on unlock is on, the widget also sets off a custom trigger in Streamer.Bot, at the same moment as the achievement's chat message. Use it to celebrate your own way: play a sound, show an alert, give channel points…

The trigger is sent by the overlay that runs the actions, while counting is on. It is added by the Stream UI - Backend action: after importing the actions again, restart Streamer.Bot so the trigger appears.

Actions bound to it under the former Stream Scores website keep working: the trigger and its variables keep their names.

Style

Each element follows the overlay style field by field: a field you change is the widget's own, with a reset arrow beside it. Style for restyles one platform on its own. See Appearance.

Default position

Centre, automatic width. → Overlay builder's Layout tab

Streamer.Bot events it listens to

Controls

• The Controls column: one Show per display mode switched on (Show single card, Show all cards in turn, Show all cards scrolling), then Hide cards, Start counting and Stop counting, each with its Trigger list.
• The main area, and the controls window: Start counting / Stop counting (Viewer Cards: Counting or Stopped), the same Show buttons (Show single card shows your own channel's card) and Hide cards.

Your own Streamer.Bot actions can show and hide the cards too. The trigger lists are the simplest way: add a !card command to Show single card and it shows the card of whoever typed it. The two commands below do the same from inside any action, and let it pick the display mode and whose card shows. They need no action from the pack.

viewerCardsShow

Shows the cards. Single card: the card of the viewer the command names, or your channel's own card when it names nobody. All cards in turn or Grouped: every active viewer's card, whoever it names. A mode that is switched off (or not usable without the licence) shows nothing.

using System;
using Newtonsoft.Json;

public class CPHInline
{
    public bool Execute()
    {
        // The viewer who set the action off: their login, id and platform
        CPH.TryGetArg("userName", out string login);
        CPH.TryGetArg("userId", out string userId);
        CPH.TryGetArg("userType", out string platform);
        var command = new { @event = "viewerCardsShow", display = "single", user = login, userId, platform = platform?.ToLower() };
        CPH.WebsocketBroadcastJson(JsonConvert.SerializeObject(command));
        return true;
    }
}

To show your channel's own card instead, replace the lines inside Execute() above return true; with the command alone: CPH.WebsocketBroadcastJson("{\"event\":\"viewerCardsShow\",\"display\":\"single\"}"); — or separate / grouped there for every viewer's card.

viewerCardsHide

Hides the cards. The same steps, with this code:

using System;

public class CPHInline
{
    public bool Execute()
    {
        CPH.WebsocketBroadcastJson("{\"event\":\"viewerCardsHide\"}");
        return true;
    }
}

Stream Scores Licence

Without the licence: one overlay shows the Viewer Cards, one display mode is switched on at a time, and the first 5 scores of each platform and the first 5 achievements of each platform's list count and show — in your list's order, so reordering picks them. The ones past the limit stay editable, marked Not used without Stream Scores Licence (display modes switched on while you had the licence too: only the first one shows); nothing is ever deleted, and they all come back with the licence. Stream Scores Licence (€4.99 a month or €99.99 once, before VAT) lifts every limit and removes the ads → The Licence tab. The browser source checks the key itself, from its URL.