@nadicodeai/design-system 12.1.199 → 12.1.201
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/DESIGN.md +2 -2
- package/package.json +1 -1
package/DESIGN.md
CHANGED
|
@@ -554,7 +554,7 @@ The neutral spine carries grounds, chrome, text and every control: `{colors.ink}
|
|
|
554
554
|
|
|
555
555
|
The identity palette is the brand's colour: cobalto `{colors.identity-cobalto}`, verde `{colors.identity-verde}`, arancio `{colors.identity-arancio}`, giallo `{colors.identity-giallo}` and rosso `{colors.identity-rosso}`, with `{colors.identity-ink}` and `{colors.identity-white}` as the poles type sits on. Azzurro `{colors.identity-azzurro}` has three jobs: the first stripe of Nadia's ribbon, the last cell of Alveare's mark and the last band of Alveare Server's ("Brand media authority"), and a band of a company's card foil (`CompanyCard`).
|
|
556
556
|
|
|
557
|
-
The hues appear at full strength and flat, with no tints, steps, gradients or hover variants, in these places.
|
|
557
|
+
The hues appear at full strength and flat, with no tints, steps, gradients or hover variants, in these places. Two exceptions: a pressable `AgentCard`, whose corner glows on hover in a blur of the app mark in it or of her orb's colour (ruled by the owner: "that effect is something that i want"); and the website's shader objects, each the material of one object and never a section's ground: the threads she holds, a fan of lines in her stripes from her orb to her colleagues, on black; Alveare's hive, cells that light in its hues as the work passes; and the company card's holographic foil (`CompanyCard`). Stripes and cells stay pure bands of their hues, never a colour between two of them. Ruled by the founder: "shaders are not backgrounds all over the place".
|
|
558
558
|
|
|
559
559
|
- **Section grounds on the website.** A section's ground is white, soft or black, or a band in cobalto or giallo at full strength where the page gives one section its moment, its type in the hue's pole (ruled by the founder: "how stripe and others introduce the solid filled sections, like in brand colours. I want that visual style"). Two neighbouring sections never share a ground and two bands never touch; otherwise colour lives in the pictures, the objects, the Agents and the shader objects.
|
|
560
560
|
- **Glass.** The colour a glass surface shows through ("Elevation & Depth").
|
|
@@ -760,7 +760,7 @@ A corner follows what the thing is, on one scale: buttons, inputs, badges, tabs
|
|
|
760
760
|
|
|
761
761
|
UI text stays static: no shimmer, typing, scrambling, pulsing or animated dots. Status labels use sentence case without trailing ellipses; complete instructional sentences keep their punctuation.
|
|
762
762
|
|
|
763
|
-
Only Agents move on their own, with one exception: the company's card (`CompanyCard`) turns in the light for 2.2 s when it is first seen and again when it is issued, then stays still, and under reduced motion it does not turn. The interface answers a person's action, briefly, and stops: motion follows the action, grows from the element that was pressed, and settles, within 300 ms; sheets and drawers that follow the pointer take their own durations. Keyboard actions and anything used a hundred times a day are instant. While a person waits for something they asked for, one waiting line moves and nothing else ([system waits](../../skills/design/product-design/references/living-elements.md#system-waits)). On the website three things move: Agents, the product at work, and the shader objects; a film of ours plays only when the visitor presses play. A product scene runs the real components through their states in beats while it is half in view, rests on the finished work, loops, stops off-screen, and holds the finished work under reduced motion; a part of a scene arrives with `.nc-arrive`: it holds its place from the start and comes into focus there on the message-arrival timing, so a playing scene never shifts the page. The threads, the hive and the card's foil move at their own slow pace; each stops off-screen and holds one frame under reduced motion. Words never move, and there is no parallax, scroll reveal of text, marquee or shimmer. Ruled by the founder: a Stripe-grade product site, with shaders adjusted to the art direction and the products shown working.
|
|
763
|
+
Only Agents move on their own, with one exception: the company's card (`CompanyCard`) turns in the light for 2.2 s when it is first seen and again when it is issued, then stays still, and under reduced motion it does not turn. The interface answers a person's action, briefly, and stops: motion follows the action, grows from the element that was pressed, and settles, within 300 ms; sheets and drawers that follow the pointer take their own durations, and a pressable `AgentCard`'s hover glow takes 500 ms. Keyboard actions and anything used a hundred times a day are instant. While a person waits for something they asked for, one waiting line moves and nothing else ([system waits](../../skills/design/product-design/references/living-elements.md#system-waits)). On the website three things move: Agents, the product at work, and the shader objects; a film of ours plays only when the visitor presses play. A product scene runs the real components through their states in beats while it is half in view, rests on the finished work, loops, stops off-screen, and holds the finished work under reduced motion; a part of a scene arrives with `.nc-arrive`: it holds its place from the start and comes into focus there on the message-arrival timing, so a playing scene never shifts the page. The threads, the hive and the card's foil move at their own slow pace; each stops off-screen and holds one frame under reduced motion. Words never move, and there is no parallax, scroll reveal of text, marquee or shimmer. Ruled by the founder: a Stripe-grade product site, with shaders adjusted to the art direction and the products shown working.
|
|
764
764
|
|
|
765
765
|
The homepage figures have one owner-requested exception: a slight lean in response to a fine pointer, with no autonomous loop and no movement under reduced motion. Architecture and words stay still.
|
|
766
766
|
|