openvibers/openvibe.design Commits

Rules for 11-11: tabs on a phone, labels on the picture, names never cut, PiP anywhere, controls per person, AI text like a person (#270)

OP OpenVibers committed 2 days ago · b6c513359c · 1 file, +36 −8

* Rules for 11-11: tabs on a phone, labels on the picture, names never cut, PiP anywhere, controls per person, AI text that sounds like a person

The decisions behind today's Live, Network, Bot and AI changes (asks 362–368), in the register:
- never-hide-content and tabs-for-settings (revised, same numbers): a phone shows a page of sections as tabs with
  counts; every section stays in the HTML; nothing is cut.
- chat-reaches-the-player (revised): open, the sheet is the whole screen under the player; two heights (up, or just
  under the channel line); folding folds the robot's controls; compact view.
- New, appended so every earlier number holds: labels-ride-the-picture, names-are-never-cut, a-number-fits-its-tile,
  every-live-slot-is-listed, pip-goes-anywhere, controls-one-family, ai-text-sounds-like-a-person.

* Rules 118-119: a long list of work folds by its state; an AI task shows which model did what

Changes

ddiff --git a/server/rules/register.js b/server/rules/register.js
iindex 592870d..354ca78 100644
---- a/server/rules/register.js
++++ b/server/rules/register.js
@@@ -111,13 +111,13 @@ const RULES = Object.freeze([
'2026-11-09', 'A rank order implied differences the votes could not support.'),
// ── Length without hiding ──
-- R('never-hide-content', 'length', 'Shorten a page by arranging it, never by hiding or removing content.',
-- 'No display:none on content for phones, no "newest only" cuts, no content behind tabs. Use sideways rails, "More (N)" pagers and folds that show their count.',
-- '2026-10-31', 'Pages made shorter lost their videos and clips; every cut had to be put back.',
++ R('never-hide-content', 'length', 'Shorten a page by arranging it, never by removing content.',
++ 'No "newest only" cuts and nothing left out of the page\'s HTML. Use sideways rails, "More (N)" pagers, folds that show their count, and on a phone sections as tabs (next rule): every section stays in the HTML, each tab says its count.',
++ '2026-11-11', 'Pages made shorter lost their videos and clips; every cut had to be put back (10-31). The owner, 11-11: "consolidate these into tabs, self-contained tabs, so the page isn\'t so freaking huge … at least on mobile", with the HTML kept whole for search and AI crawlers.',
[{ label: 'One card that is also a row', href: '/patterns/card-or-row' }]),
-- R('tabs-for-settings', 'length', 'Tabs are for settings and explainers; content is never split into tabs.',
-- 'A settings page may use server-rendered tabs (each with its own address). Lists, rails and sections of content stay on the page.',
-- '2026-10-31', 'Content in tabs was content people never found.',
++ R('tabs-for-settings', 'length', 'On a phone, a page of sections is tabs; a wide screen shows them all.',
++ 'At 900 px or narrower (600 on a front page) a page of sections shows one at a time: the tab strip names each with its count, the tab says what the section is so its own heading steps aside, a section loads the first time it is opened, and the choice works with no script where it can (radios). Every section is in the page\'s HTML. Settings pages keep server-rendered tabs, each with its own address.',
++ '2026-11-11', 'Content in tabs was content people never found (10-31), so the tabs now carry counts and the HTML carries everything; the owner, 11-11, on a channel\'s page of sections: "self-contained tabs".',
[{ label: 'Tabs, not folds', href: '/patterns/tabs-not-folds' }]),
R('taste-and-door', 'length', 'A front page is a taste and a door: about six phone screens.',
'Two hero actions, figures as one strip, cards as sideways rows, explainers in one fold, and no closing call that repeats the hero.',
@@@ -418,11 +418,39 @@ const RULES = Object.freeze([
'A robot\'s (or any device\'s) controls on a stream page have one switch of places: on the video, a row under it, the full panel, in a window you move and size, hidden; the choice is kept per channel and device. Hidden keeps the switch in view, so nothing is lost. A locked control takes the controls when pressed (it asks, as Drive does). On a phone the full panel shares the chat\'s sheet as a Robot tab.',
'2026-11-11', 'Maticus: "i clicked hide on the controls … i don\'t see how to unhide them"; and the controls "don\'t seem to work" (they were waiting for Drive).'),
R('chat-reaches-the-player', 'look', 'On a phone the stream\'s chat reaches the player.',
-- 'Upright, while live, the chat is one sheet right under the player with one header row (Chat, Robot when there is one, its tools, the fold). A grip on its top edge (or the arrow keys on it) sets its height and the channel line shows in the room it leaves; most of the way down folds it to a round chat button in the corner.',
-- '2026-11-11', 'The owner: "the chat should actually go all the way up to the video … then it can be collapsed … a little circle in the corner … resize how tall the chat is."'),
++ 'Upright, while live, the chat is one sheet right under the player with one header row (Chat, Robot when there is one, its tools, the fold) and the grip lying over its top edge. Open, it is the whole screen under the player: nothing peeks under it and the page does not scroll away. It has two heights: all the way up, or just under the channel line (measured, never a line cut in half); most of the way down folds it to a round chat button, and folding it folds the robot\'s controls with it. Compact view (chat settings) slims its header, goal bar and composer.',
++ '2026-11-11', 'The owner: "the chat should actually go all the way up to the video … resize how tall the chat is"; then "a gap in between the top of the chat and the top of the player … if you collapse the chat … collapse the controls … the same button."'),
R('cascade-in-order', 'building', 'Check a style in the order the page loads it.',
'A preview that appends a rule last proves nothing about a rule that loads first; measure on the real page.',
'2026-10-25', 'A phone rule looked right in a preview and lost to a later file in production.'),
++ // ── 2026-11-11, asks 362–368 (appended, so every earlier rule keeps its number) ──
++ R("labels-ride-the-picture", "look", "A featured stream’s labels ride on its picture.",
++ "LIVE, the watching count and frames sit on the picture’s top edge; its title, who and how long on a shade at its foot; hide and sound are round buttons on it. No \"Featured live\" row of its own. A wide screen repeats the title beside the picture, where the panel has room.",
++ '2026-11-11', "The owner, on the home page: \"you don’t need the featured live text on that area … have it floating on top of it.\""),
++ R("names-are-never-cut", "look", "A name wraps before it is ever cut.",
++ "A person’s or a channel’s name has a line of its own and wraps (overflow-wrap: anywhere); a status chip (\"Live now\", \"3 h ago\") goes on the line under it, never beside it in a narrow card. Titles under a picture take two lines before an ellipsis.",
++ '2026-11-11', "The owner, on Recently Online: \"@Matic…\" beside a Live now chip — \"labels and text … don’t get cut off so easily, especially usernames.\""),
++ R("a-number-fits-its-tile", "look", "A number holds its tile at a phone’s width.",
++ "Round before it overflows (15 h, not 15.3 h), and the icon steps aside first (a container query on the card). Counts that belong together are one strip of cells, a number over what it counts with its change beside it (green up, red down), never four boxes of empty space.",
++ '2026-11-11', "The owner: \"15.3 h\" ran out of its tile, and the visit digest’s four big tiles were \"all that wasted space for those metrics.\""),
++ R("every-live-slot-is-listed", "products", "Every live slot is a stream, and every one is listed.",
++ "Live now lists each live slot, one that is also its streamer’s picture-in-picture included; the featured stream stays in the list when another is live. A person live on two slots is one row in a digest that says so (\"Live now on 2 streams\").",
++ '2026-11-11', "The owner: \"Maticus is live on 2 accounts, but under live now it only shows 1 … those are 2 different streams.\""),
++ R("pip-goes-anywhere", "motion", "A picture-in-picture goes anywhere, tucks aside and waits with the mark.",
++ "It follows the finger or the mouse each frame and lands with a spring; dropped over the player it sits in the player, anywhere else it floats over the page and stays on screen while it scrolls; a flick carries on; near an edge it snaps. Thrown past a side it tucks into it, a tab with its picture still going. While it connects or its picture stops it shows the mark at work over its last frame (never a black box) and tries again by itself. Its place is kept per slot, in the browser and in the account (newest wins).",
++ '2026-11-11', "The owner: \"move it anywhere … on mobile and desktop … more solid feeling … that black thing that’s just stuck there … use the OV animations … saved and synced to the OpenVibe account.\""),
++ R("controls-one-family", "products", "A device’s controls are one family, arranged per person.",
++ "The stick has its four marks and lights when it drives; Stop is a red-ringed disc beside it; a slider says its value with − and + to step it; battery and latency are slim readout rows. Each person arranges the pad (the Stop’s hand, the pad’s size, the readouts shown or folded) and the arrangement works while the device is offline. A device that is offline says so in a sentence.",
++ '2026-11-11', "The owner, circling the pad, the Stop, the head slider and the readouts: \"redesign … polish … more consistent … on a per user basis.\""),
++ R("ai-text-sounds-like-a-person", "agents", "AI text about a person reads as a person wrote it.",
++ "A card line is what a friend who watches would say in one breath: one sentence, specific to this channel, starting with the thing itself (not \"Streams\", \"A channel\", \"Join\"), without the name the card already shows. The stock words that make every channel sound the same stay out: focus, content, engaging, various, a mix of, dive into, showcasing, vibrant, dynamic, journey, immersive, a blend of. A line that fails falls back to the overview reshaped.",
++ '2026-11-11', "The owner: \"improve the AI description so they’re not all so generic sounding, make it a little more human feeling and nice\" (the cards read \"Streams a multi-camera, tech-robot focus …\")."),
++ R("lists-fold-by-state", "length", "A long list of work folds by its state, with counts.",
++ "A dashboard of jobs, tasks or runs groups them by state (running, queued, needs attention, today, earlier), each group a fold with its count: what is happening and what needs you open, the rest folded, the choice kept. A long group shows ten and a \"Show N more\"; what is running always shows whole. A search or a filter opens every group. Rows are one line of what and one of where it is.",
++ '2026-11-11', "The owner, on the agent portal: the page was long; \"collapsible elements … improve openvibe.design as well.\""),
++ R("ai-shows-who-did-what", "agents", "An AI task shows which model did what, and the person can change it.",
++ "A task that uses several models says so on its record: each role (plan, build, review, verify) with its model, its reasoning level, its time and its cost, as steps in the one step view. The plan behind it is a setting a person can read, copy and edit (presets first, then every role), the same plan through the page, the API and the SDK.",
++ '2026-11-11', "The owner: \"a really sophisticated multi-model system with enhanced reasoning … modular configuration … SDK API … OpenVibe.design connected.\""),
]);
// The register's order is the rule's number: a person can cite "rule 7" and a link can carry it.