diff --git a/.changeset/project-not-product.md b/.changeset/project-not-product.md new file mode 100644 index 0000000..5b30e16 --- /dev/null +++ b/.changeset/project-not-product.md @@ -0,0 +1,5 @@ +--- +"@variablelab/brand": minor +--- + +Rename the term Product to Project. The Project brand chapter moves from `skills/vlab-brand/product-brand.md` to `skills/vlab-brand/project-brand.md`, and the template for a Project's `brand/` folder moves from `templates/product/brand/` to `templates/project/brand/`. diff --git a/.gitattributes b/.gitattributes index 43c970e..6f9ee40 100644 --- a/.gitattributes +++ b/.gitattributes @@ -2,4 +2,4 @@ tokens/tokens.css linguist-generated=true tokens/theme.css linguist-generated=true .github/readme/*.svg linguist-generated=true -templates/product/brand/sign-readme.svg linguist-generated=true +templates/project/brand/sign-readme.svg linguist-generated=true diff --git a/AGENTS.md b/AGENTS.md index 9b5a800..db301ac 100644 --- a/AGENTS.md +++ b/AGENTS.md @@ -6,13 +6,13 @@ Variable Lab's brand guideline, design tokens and shared assets, the package `@v - `skills/vlab-brand/`: the guideline, as an Agent Skill. `SKILL.md` routes each task to one chapter; `glossary.md` holds the terms. - `tokens/tokens.json`: the only source of colors and fonts. -- `assets/`: the Logo and the Class stamps. No Product's Sign lives here. -- `templates/product/brand/`: what a Product copies into its own `brand/` folder. +- `assets/`: the Logo and the Class stamps. No Project's Sign lives here. +- `templates/project/brand/`: what a Project copies into its own `brand/` folder. - `.github/readme/`: the images in the README. Generated. ## Rules -- The guideline states rules for every Product. One Product's specifics, such as its Sign or its copy, belong in that Product's repository or in the site that shows it. +- The guideline states rules for every Project. One Project's specifics, such as its Sign or its copy, belong in that Project's repository or in the site that shows it. - Before changing a chapter, read [principles.md](./skills/vlab-brand/principles.md): every chapter follows it. - The skill folder stands alone. An installed skill carries only `skills/vlab-brand/`, so its chapters link only to each other and state values, such as hex codes, instead of pointing outside the folder. - Everything here is written in English, for any harness: say "agents", not one tool's name, and keep install commands free of agent flags. @@ -23,7 +23,7 @@ Edit the source, then run `pnpm build`. `pnpm check` exits 1 when a generated fi | Source | Generated | | --- | --- | -| `tokens/tokens.json` | `tokens/tokens.css`, `tokens/theme.css`, the tables in `skills/vlab-brand/color.md`, the palette in `README.md` and its swatches in `.github/readme/`, `templates/product/brand/sign-readme.svg` | +| `tokens/tokens.json` | `tokens/tokens.css`, `tokens/theme.css`, the tables in `skills/vlab-brand/color.md`, the palette in `README.md` and its swatches in `.github/readme/`, `templates/project/brand/sign-readme.svg` | | `assets/stamps/*.svg` | The stamp previews in `.github/readme/` | | `assets/logo.svg` | `.github/readme/logo.svg`, the Logo on `ground` for the README | diff --git a/BRAND-USE.md b/BRAND-USE.md index 50959ca..4934bf9 100644 --- a/BRAND-USE.md +++ b/BRAND-USE.md @@ -1,10 +1,10 @@ # Brand use -The Logo, the Class stamps and every Product's Sign are © Variable Land. All rights reserved. +The Logo, the Class stamps and every Project's Sign are © Variable Land. All rights reserved. -- Use them unmodified to refer to Variable Lab or its Products: in an article, a talk, a list of tools or a "built with" link. +- Use them unmodified to refer to Variable Lab or its Projects: in an article, a talk, a list of tools or a "built with" link. - Keep them as they are: no edits, no recoloring, no use as the identity of another project or product, and nothing that suggests Variable Land endorses you. -The code and the tokens in this repository are under the [MIT license](LICENSE); these marks aren't. A Product's Sign sits in that Product's repository, in `brand/`, and the repository's code license doesn't extend to it. +The code and the tokens in this repository are under the [MIT license](LICENSE); these marks aren't. A Project's Sign sits in that Project's repository, in `brand/`, and the repository's code license doesn't extend to it. Questions: ricardo@variable.land. diff --git a/README.md b/README.md index 33cf0c1..726bedc 100644 --- a/README.md +++ b/README.md @@ -9,8 +9,8 @@ ## At a glance - **Dark, warm and flat.** One dark palette, no gradients, no shadows, square corners. -- **One Signature.** The green Logo with "Variable Land" beside it. No Product carries it. -- **A Sign per Product.** A Product starts with its Class stamp and earns a Sign: filled rectangles in one ink. +- **One Signature.** The green Logo with "Variable Land" beside it. No Project carries it. +- **A Sign per Project.** A Project starts with its Class stamp and earns a Sign: filled rectangles in one ink. - **Facts, in English.** Short declarative sentences a reader can check in the code. ## Palette @@ -53,7 +53,7 @@ IBM Plex Sans for text and IBM Plex Mono for code, both in 400 and 500. Two weig The Library Class stamp

-The Class stamps of an App and a Library: a body on a base, and a closed frame. Each Product's Sign is drawn on the same 24×24 grid and lives in that Product's own repository, in `brand/`. +The Class stamps of an App and a Library: a body on a base, and a closed frame. Each Project's Sign is drawn on the same 24×24 grid and lives in that Project's own repository, in `brand/`. ## The guideline @@ -63,9 +63,9 @@ The Class stamps of an App and a Library: a body on a base, and a closed frame. | [Logo](skills/vlab-brand/logo.md) | Color, the Signature, sizes and what to avoid. | | [Color](skills/vlab-brand/color.md) | The palette, soft Vesper and contrast. | | [Typography](skills/vlab-brand/typography.md) | Families, scale and text flow. | -| [Voice](skills/vlab-brand/voice.md) | Tone, names and how to say what a Product is. | +| [Voice](skills/vlab-brand/voice.md) | Tone, names and how to say what a Project is. | | [Iconography](skills/vlab-brand/iconography.md) | UI icons and shapes beside text. | -| [Product brand](skills/vlab-brand/product-brand.md) | Class stamps, how a Sign is drawn and a Product's `brand/` folder. | +| [Project brand](skills/vlab-brand/project-brand.md) | Class stamps, how a Sign is drawn and a Project's `brand/` folder. | The guideline is also an [Agent Skill](https://agentskills.io), `vlab-brand`, so agents read the same text people do. diff --git a/scripts/build.ts b/scripts/build.ts index babb2d3..d582eef 100644 --- a/scripts/build.ts +++ b/scripts/build.ts @@ -2,7 +2,7 @@ // tokens/tokens.json → tokens/tokens.css, tokens/theme.css, // the tables in skills/vlab-brand/color.md (an installed skill can't read tokens.json), // the palette in README.md and its swatches in .github/readme/, -// templates/product/brand/sign-readme.svg +// templates/project/brand/sign-readme.svg // assets/stamps/*.svg → the stamp previews in .github/readme/ // assets/logo.svg → .github/readme/logo.svg // Generated blocks inside Markdown sit between and . @@ -54,7 +54,7 @@ for (const file of stamps) { if (!d) throw new Error(`assets/stamps/${file}: no path d attribute`); outputs[`.github/readme/stamp-${file}`] = onGround(d); } -outputs["templates/product/brand/sign-readme.svg"] = onGround("", ""); +outputs["templates/project/brand/sign-readme.svg"] = onGround("", ""); // The Logo on a ground square with a sixth of its height around it, so it never sits on a light background. const logo = read("assets/logo.svg"); diff --git a/skills/vlab-brand/SKILL.md b/skills/vlab-brand/SKILL.md index fef06bd..0bc88bc 100644 --- a/skills/vlab-brand/SKILL.md +++ b/skills/vlab-brand/SKILL.md @@ -1,11 +1,11 @@ --- name: vlab-brand -description: Variable Lab's brand guideline - principles, Logo, color, type, voice, UI icons and how a Product's Sign is drawn. Use before designing anything public, writing public copy (a README, a page, an image) or giving a Product its Sign. +description: Variable Lab's brand guideline - principles, Logo, color, type, voice, UI icons and how a Project's Sign is drawn. Use before designing anything public, writing public copy (a README, a page, an image) or giving a Project its Sign. --- # Variable Lab brand -Variable Lab is Variable Land's open source arm. This guideline holds its rules for anything public: sites, READMEs, package pages, images and icons. It states rules, never one Product's specifics: a Product's Sign lives in that Product's repository, and a site's page specs live in that site. +Variable Lab is Variable Land's open source arm. This guideline holds its rules for anything public: sites, READMEs, package pages, images and icons. It states rules, never one Project's specifics: a Project's Sign lives in that Project's repository, and a site's page specs live in that site. Terms in capitals are defined in [glossary.md](glossary.md). @@ -19,6 +19,6 @@ Read the chapter the task touches: | Set type, sizes and line breaks | [typography.md](typography.md) | | Write any public text | [voice.md](voice.md) | | Use or draw a UI icon, set a shape beside text | [iconography.md](iconography.md) | -| Give a Product its Sign, set up its `brand/` folder | [product-brand.md](product-brand.md) | +| Give a Project its Sign, set up its `brand/` folder | [project-brand.md](project-brand.md) | -Beyond this folder, the brand repository (`github.com/withvariablelab/brand`, the package `@variablelab/brand`) holds the tokens (`tokens/`), the Logo and the Class stamps (`assets/`), the template for a Product's `brand/` folder (`templates/product/brand/`) and the terms of use for the marks (`BRAND-USE.md`). +Beyond this folder, the brand repository (`github.com/withvariablelab/brand`, the package `@variablelab/brand`) holds the tokens (`tokens/`), the Logo and the Class stamps (`assets/`), the template for a Project's `brand/` folder (`templates/project/brand/`) and the terms of use for the marks (`BRAND-USE.md`). diff --git a/skills/vlab-brand/color.md b/skills/vlab-brand/color.md index 280fbe2..1c88541 100644 --- a/skills/vlab-brand/color.md +++ b/skills/vlab-brand/color.md @@ -17,7 +17,7 @@ A dark, warm palette in flat planes. | logo | `#36d399` | The Logo, and nothing else. | -- Green lives only in the Logo. A Product has no color of its own. +- Green lives only in the Logo. A Project has no color of its own. - Signs and Class stamps are `ink`: one ink. - Contrast on `ground` and `surface`: `ink` 16:1, `ink-muted` 9:1, `dim` 6.5:1. All text stays at 4.5:1 or more. Only decorative marks hidden from assistive technology, such as line numbers and the `$` prompt, sit below that. diff --git a/skills/vlab-brand/glossary.md b/skills/vlab-brand/glossary.md index 63fc9db..e908452 100644 --- a/skills/vlab-brand/glossary.md +++ b/skills/vlab-brand/glossary.md @@ -1,6 +1,6 @@ # Variable Lab brand -The language of Variable Lab's brand guideline: the house, its Products and their shapes. Sites that use the guideline keep their own glossary for their pages and content. +The language of Variable Lab's brand guideline: the house, its Projects and their shapes. Sites that use the guideline keep their own glossary for their pages and content. ## The house and its marks @@ -9,41 +9,41 @@ The parent house. It builds software that is published, through Variable Lab, an _Avoid_: VL **Variable Lab**: -Variable Land's open source arm: its published Products and this guideline. It names the GitHub org and the guideline, never the text beside the Logo. +Variable Land's open source arm: its published Projects and this guideline. It names the GitHub org and the guideline, never the text beside the Logo. _Avoid_: Variable Labs, VL **Logo**: -The hexagon with the V. In green it is Variable Lab's; in black, Variable Land's. No Product uses it. +The hexagon with the V. In green it is Variable Lab's; in black, Variable Land's. No Project uses it. _Avoid_: sign, wordmark, icon **Signature**: The Logo with "Variable Land" set in text beside it: how the house signs what it publishes. _Avoid_: lockup, wordmark, house mark -## Products +## Projects -**Product**: +**Project**: Something Variable Lab publishes and owns. It is an App or a Library. -_Avoid_: project, tool, package, repo +_Avoid_: product, tool, package, repo **Class**: -Whether a Product is run or imported: App or Library. +Whether a Project is run or imported: App or Library. _Avoid_: type, kind, category, badge **App**: -A Product you run from a terminal. +A Project you run from a terminal. _Avoid_: CLI, tool, binary **Library**: -A Product you import from code. +A Project you import from code. _Avoid_: lib, SDK, module, package ## Shapes **Sign**: -A Product's own shape: filled geometry in one ink. It belongs to the Product; this guideline says how a Sign is drawn, not which one a Product has. +A Project's own shape: filled geometry in one ink. It belongs to the Project; this guideline says how a Sign is drawn, not which one a Project has. _Avoid_: logo, icon, mark, glyph **Class stamp**: -The shape of a Class. A Product carries it until it earns a Sign. +The shape of a Class. A Project carries it until it earns a Sign. _Avoid_: badge, pill, tag, class icon diff --git a/skills/vlab-brand/iconography.md b/skills/vlab-brand/iconography.md index aab6c47..d5fbed3 100644 --- a/skills/vlab-brand/iconography.md +++ b/skills/vlab-brand/iconography.md @@ -1,6 +1,6 @@ # Iconography -Two families, and nothing else: filled shapes, which are the Signs and the Class stamps ([product-brand.md](product-brand.md)), and outlined UI icons. No emoji anywhere. +Two families, and nothing else: filled shapes, which are the Signs and the Class stamps ([project-brand.md](project-brand.md)), and outlined UI icons. No emoji anywhere. ## UI icons @@ -14,7 +14,7 @@ Two families, and nothing else: filled shapes, which are the Signs and the Class | Copy | Copies a command. | `` and `` | | Copied | Replaces Copy for a moment after a copy. | `` | -A new icon follows the stroke rules. Before it ships, set it at 14px beside every Product's `brand/sign.svg` and both Class stamps: it must not be mistaken for any of them. +A new icon follows the stroke rules. Before it ships, set it at 14px beside every Project's `brand/sign.svg` and both Class stamps: it must not be mistaken for any of them. ## Shapes beside text diff --git a/skills/vlab-brand/logo.md b/skills/vlab-brand/logo.md index 873272d..1d9897b 100644 --- a/skills/vlab-brand/logo.md +++ b/skills/vlab-brand/logo.md @@ -14,7 +14,7 @@ File: `assets/logo.svg` in the brand repository, `viewBox 0 0 402.02 468.12`. - Another color, an outline, or a background other than `ground`. - "Variable Lab" beside it: the name beside the Logo is Variable Land. -- A Product using it, or the Logo set beside a Sign. +- A Project using it, or the Logo set beside a Sign. - A drawn wordmark or any other variant. ## Linking it diff --git a/skills/vlab-brand/principles.md b/skills/vlab-brand/principles.md index 3584c71..1ecf8c8 100644 --- a/skills/vlab-brand/principles.md +++ b/skills/vlab-brand/principles.md @@ -4,9 +4,9 @@ The rules every other chapter follows. - **Variable Lab's own.** Variable Lab is Variable Land's open source arm, and this guideline is its own. Everything it publishes follows it: sites, READMEs, package pages, images. - **Dark only.** Every Variable Lab surface uses the dark palette in [color.md](color.md). -- **One Signature.** Everything is signed with the Signature: the Logo with "Variable Land" set in text beside it ([logo.md](logo.md)). A Product adds its Sign and nothing else: no Signature, color, wordmark, letter, italic name or small-caps eyebrow of its own. +- **One Signature.** Everything is signed with the Signature: the Logo with "Variable Land" set in text beside it ([logo.md](logo.md)). A Project adds its Sign and nothing else: no Signature, color, wordmark, letter, italic name or small-caps eyebrow of its own. - **One version.** The Logo, each Class stamp and each Sign exist in one version. A shape is never redrawn alone. -- **Two Classes.** An App is run; a Library is imported. Every Product is exactly one. +- **Two Classes.** An App is run; a Library is imported. Every Project is exactly one. - **Open source is the context.** It is what Variable Lab is, so it never appears as a badge or a selling point. - **Flat.** No gradients, no shadows. Square corners on every box, block and panel. Borders and rules are 1px in `rule`. - **Facts.** English, checkable, without clients, case studies or invented numbers ([voice.md](voice.md)). diff --git a/skills/vlab-brand/product-brand.md b/skills/vlab-brand/project-brand.md similarity index 77% rename from skills/vlab-brand/product-brand.md rename to skills/vlab-brand/project-brand.md index e7c12e1..cfb9c55 100644 --- a/skills/vlab-brand/product-brand.md +++ b/skills/vlab-brand/project-brand.md @@ -1,10 +1,10 @@ -# Product brand +# Project brand -A Product's brand is its Sign, and nothing more. This chapter says how a Sign is drawn and where it lives. Which Sign a Product has belongs to the Product. +A Project's brand is its Sign, and nothing more. This chapter says how a Sign is drawn and where it lives. Which Sign a Project has belongs to the Project. ## Class stamp first -A new Product carries its Class stamp until it earns a Sign. It never gets a letter, a color or a second house in the meantime. Both stamps are in the brand repository, in `assets/stamps/`. +A new Project carries its Class stamp until it earns a Sign. It never gets a letter, a color or a second house in the meantime. Both stamps are in the brand repository, in `assets/stamps/`. | Class | File | The shape | | --- | --- | --- | @@ -15,13 +15,13 @@ A new Product carries its Class stamp until it earns a Sign. It never gets a let - `viewBox 0 0 24 24`, filled geometry on a 4px module, in one ink: `ink`, written as `fill="currentColor"`. - Straight rectangles only: no circles, no letters, no rounded corners. -- It draws an idea of what the Product does. It is never a mascot, an animal or a picture of the name. -- **Covered-names test**: at 16px, with the names hidden, every Sign and Class stamp is told apart from every other. A new Sign passes it before it ships, against every other Product's `brand/sign.svg` and both Class stamps. +- It draws an idea of what the Project does. It is never a mascot, an animal or a picture of the name. +- **Covered-names test**: at 16px, with the names hidden, every Sign and Class stamp is told apart from every other. A new Sign passes it before it ships, against every other Project's `brand/sign.svg` and both Class stamps. - If a new Sign can't pass, the family has a problem: review the Signs together. A Sign is never redrawn alone. -## The Product's `brand/` folder +## The Project's `brand/` folder -Once it has a Sign, a Product keeps it in a `brand/` folder next to its `package.json`. Start from `templates/product/brand/` in the brand repository. +Once it has a Sign, a Project keeps it in a `brand/` folder next to its `package.json`. Start from `templates/project/brand/` in the brand repository. | File | What it holds | | --- | --- | diff --git a/skills/vlab-brand/voice.md b/skills/vlab-brand/voice.md index ab7f78b..f78cd62 100644 --- a/skills/vlab-brand/voice.md +++ b/skills/vlab-brand/voice.md @@ -5,12 +5,12 @@ Brief and declarative, in English. Say facts a reader can check in the code or t ## Names - "Variable Land" and "Variable Lab": two words, always. -- A Product's name is lowercase kebab-case (`my-product`), in titles too. -- A Product's name is its title. Its executable and its package are metadata, shown beside the name, never instead of it. +- A Project's name is lowercase kebab-case (`my-project`), in titles too. +- A Project's name is its title. Its executable and its package are metadata, shown beside the name, never instead of it. - In Markdown, a scoped package name goes in backticks (`` `@scope/name` ``). Bare, GitHub links it as a mention of someone else's account. ## Saying what it is -- Name what a Product does or guarantees, in the words its code uses. +- Name what a Project does or guarantees, in the words its code uses. - Say what it leaves out when that is concrete and checkable: a file, a package, a behavior. - Check every claim against the code before it ships, not only against the README. diff --git a/templates/product/brand/README.md b/templates/project/brand/README.md similarity index 71% rename from templates/product/brand/README.md rename to templates/project/brand/README.md index d1cdac5..0a391d8 100644 --- a/templates/product/brand/README.md +++ b/templates/project/brand/README.md @@ -1,12 +1,12 @@ -# brand +# brand -The Sign of : . +The Sign of : . | File | Use | | --- | --- | | `sign.svg` | The Sign, 24×24, in `currentColor`. Sites and images use this file. | | `sign-readme.svg` | The Sign on a `ground` square, for READMEs. | -How a Sign is drawn and used: [vlab-brand › Product brand](https://github.com/withvariablelab/brand/blob/main/skills/vlab-brand/product-brand.md). +How a Sign is drawn and used: [vlab-brand › Project brand](https://github.com/withvariablelab/brand/blob/main/skills/vlab-brand/project-brand.md). These files aren't covered by this repository's license. Their use is set by [BRAND-USE.md](https://github.com/withvariablelab/brand/blob/main/BRAND-USE.md). diff --git a/templates/product/brand/sign-readme.svg b/templates/project/brand/sign-readme.svg similarity index 100% rename from templates/product/brand/sign-readme.svg rename to templates/project/brand/sign-readme.svg diff --git a/templates/product/brand/sign.svg b/templates/project/brand/sign.svg similarity index 100% rename from templates/product/brand/sign.svg rename to templates/project/brand/sign.svg