openvibers/openvibe.design Commits

Rules 142-148: app icons fill their square, names in the brand face, one segmented control, the + holds every tool, round icon actions, an agent shows what it does, a time without a zone is UTC (#296)

OP OpenVibers committed 22 h ago · 355644d06c · 1 file, +28 −0

The decisions of the 11-12 You, menu and composer pass (openvibe-shared 4.223.0), each with
the owner's words that made it.

Changes

ddiff --git a/server/rules/register.js b/server/rules/register.js
iindex 3288bf4..952be26 100644
---- a/server/rules/register.js
++++ b/server/rules/register.js
@@@ -521,6 +521,34 @@ const RULES = Object.freeze([
"When a section has nothing yet (no store items, no activity, nothing collected), it shows its mark, one line saying what will appear, and one quieter line saying how; never a bare heading over a grey sentence, and never an empty box.",
'2026-11-12', 'The wallet\'s Store showed a heading and "New items will appear here after review." in grey, marked "UGLY" by the owner.',
[], ['openvibe-shared test: wallet-chrome']),
++ R("app-icon-fills-its-square", "look", "An app or site icon is its own hue on a rounded square, with the glyph at 58% of it, centred.",
++ "Every place an app or a site is drawn (the menu, You, the site list, search rows, the feed, a card) uses the same app icon: the site's steady hue (from its id) as a soft gradient on a square with 29% corners and a hairline in that hue, and the glyph drawn at 58% of the square, placed absolutely so no hover or animation can move it off centre. A folder shows its first four apps in an even 2×2 at two thirds of their cell. A press sinks an icon; a mouse lifts it and lights it in its hue. Never a small glyph inside a ring, and never one sized by guesswork per page.",
++ '2026-11-12', "The owner, 11-12, circling the menu's folders and app tiles: \"these icons are offset and kind of broken … they don't take the full space\"; \"make the icons bigger so they actually take up more of the square … fix the alignment\"; and \"they're so small everywhere across the board\".",
++ [{ label: 'The menu', href: '/components/menu' }], ['openvibe-shared test: menu-home-screen-chrome', 'openvibe-shared test: kit-layout-chrome']),
++ R("names-in-the-brand-face", "words", "Names are set in the brand face; the words you read are in the UI face.",
++ "The name of an app, a site, a tab, a section or a person in a list is set in OV Brand (Nunito 800, which the navbar loads on every site); times, notes, messages and every sentence stay in the UI face. A name wraps to two balanced lines and never ends in \"…\"; a section head is a name in sentence case, not small capitals.",
++ '2026-11-12', "The owner, 11-12, on the menu's app names: \"improve the fonts … it looks kind of unplanned … the text could be improved\"; and \"try and prevent labels that end with dot dot dot … align them better\".",
++ [], ['openvibe-shared test: menu-home-screen-chrome']),
++ R("one-segmented-control", "motion", "Tabs and switches are one segmented control whose ink slides to the chosen one.",
++ "A set of tabs or a switch (You's Apps · Notifications · Recent, Vibe's Chat · Code · Agents) is one rounded track; the chosen one sits on an ink that slides there from the last one, and the content slides in from that side. Calm fades instead; only Off removes the movement. Arrow keys move along it. On a phone only the chosen tab says its name when the others would not fit; each keeps its glyph and count.",
++ '2026-11-12', "The owner, 11-12, on Vibe's Chat · Code · Agents row: \"these can be aligned more perfectly … bigger font size and better icon size … animations, effects to the tabs that look nice, both on mobile and desktop\".",
++ [], ['openvibe-shared test: menu-places-chrome', 'openvibe-shared test: menu-home-screen-chrome']),
++ R("the-plus-holds-every-tool", "building", "In every composer the mic comes first, and the + opens every tool of that box.",
++ "A box to write in (a post, a chat, Vibe, a comment, an agent's task) is the one shared composer. Its row starts with the mic, then the +; the + opens all of the box's tools as big named tiles: its own (pictures, camera, files, emoji), its site's and its mods', and the extras every box has (Timer). On a phone the row keeps the mic, the + and the first tool; a wide box shows more. While empty, the box shows what people do with it, one example at a time. A tool is a module any site or mod adds once for every box.",
++ '2026-11-12', "The owner, 11-12, on Vibe's box: \"the mic … it's not even on the right spot. Fix it to the left and redo the composer … the same shared harmony, unified composer across sites … the timer should be in the plus thing … usable on all composers across all sites\"; and \"it should show different things people do\".",
++ [{ label: 'The composer', href: '/components/thread-composer' }], ['openvibe-shared test: composer-v2-chrome', 'openvibe-shared test: dock-chrome']),
++ R("actions-are-round-icons", "look", "Close, Open and Back are round icon buttons; words are for the one main action.",
++ "A control that every person knows by its shape (close, open, back, more, edit) is a round icon button with its name for readers and as a tooltip, sized to a finger. Words are kept for the one main action of a place (Post, Set it up, Answer). Edges are hairlines in a soft tint; a thick bright ring or a wide bordered pill around an icon is never used.",
++ '2026-11-12', "The owner, 11-12, marking the menu: \"Close … ICON\", \"Open … ICON\"; and on the phone's close button: \"these buttons and borders … get extra wide, are kind of ugly … make that more sleek and modern\".",
++ [], ['openvibe-shared test: menu-close-chrome']),
++ R("an-agent-shows-what-it-does", "agents", "An agent's face shows what it is doing now.",
++ "Wherever an agent appears (You, Vibe, a run card, a notice), its face carries a glyph for what it is doing: reading, searching, writing, coding, streaming, shopping, thinking, waiting for you, paused. An agent may name its own glyph from the registry; otherwise its current step's words choose one. A working agent breathes softly (Calm slower, Off still); one waiting for you turns amber. Where the registry has no fitting glyph, the design system makes one (openvibe.design's icon maker through Exchange) and adds it for everyone.",
++ '2026-11-12', "The owner, 11-12, on the AI strip under You: \"put an icon depending on the agent status … custom for the agent … it can generate its own status icons if they don't exist already\".",
++ [], ['openvibe-shared test: menu-home-screen-chrome']),
++ R("a-time-without-a-zone-is-utc", "data", "APIs send times with their zone; a time without one is read as UTC.",
++ "Every API returns times as ISO 8601 with a zone (2026-11-12T05:01:02Z). A client that meets \"2026-11-12 05:01:02\" reads it as UTC, never as the reader's local time, and every relative time (\"3 h ago\") stays current while it is on screen.",
++ '2026-11-12', "The owner, 11-12: \"how come everything in the history is just now? … the time doesn't update\". Network's history sent zone-less UTC times, which browsers read as local time, so every visit west of UTC was hours ahead.",
++ [], ['openvibe-shared test: menu-home-screen-chrome']),
]);
// The register's order is the rule's number: a person can cite "rule 7" and a link can carry it.