@pheem49/mint 1.9.0 → 1.10.0
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/Cargo.lock +55 -3
- package/Cargo.toml +2 -1
- package/Release_Note.md +285 -140
- package/bin/mint +0 -0
- package/crates/mint-cli/Cargo.toml +1 -0
- package/crates/mint-cli/src/actions.rs +233 -0
- package/crates/mint-cli/src/agent.rs +287 -43
- package/crates/mint-cli/src/gmail.rs +22 -2
- package/crates/mint-cli/src/interactive.rs +2888 -0
- package/crates/mint-cli/src/main.rs +336 -2854
- package/crates/mint-cli/src/markdown.rs +294 -0
- package/crates/mint-cli/src/onboard.rs +44 -1
- package/crates/mint-cli/src/updater.rs +48 -6
- package/crates/mint-core/Cargo.toml +1 -0
- package/crates/mint-core/src/agent_loop.rs +1 -0
- package/crates/mint-core/src/api_server.rs +376 -13
- package/crates/mint-core/src/browser.rs +629 -101
- package/crates/mint-core/src/channels.rs +105 -6
- package/crates/mint-core/src/chat.rs +52 -4
- package/crates/mint-core/src/code_tools.rs +29 -11
- package/crates/mint-core/src/config.rs +118 -0
- package/crates/mint-core/src/image_gen.rs +294 -33
- package/crates/mint-core/src/lib.rs +5 -2
- package/crates/mint-core/src/mcp.rs +119 -6
- package/crates/mint-core/src/orchestration.rs +133 -11
- package/crates/mint-core/src/pictures.rs +64 -1
- package/crates/mint-core/src/skills.rs +82 -6
- package/crates/mint-core/src/video_gen.rs +235 -0
- package/package.json +8 -2
- package/shared-modules/luajit/luajit.json +2 -2
- package/skills-lock.json +41 -0
- package/src/renderer/index-web.html +1 -1
- package/src/renderer/index.html +1 -1
- package/src/renderer/shared/constants/slashCommands.ts +27 -0
- package/src/renderer/shared/platform.ts +3 -0
- package/src/renderer/shared/types.ts +4 -0
- package/src/renderer/shared/utils/approval.tsx +86 -7
- package/src/renderer/shared/utils/markdown.tsx +217 -88
- package/src/renderer/shared/utils/slashCommandProcessor.ts +239 -0
- package/src/renderer/src/components/ChatPanel.tsx +461 -64
- package/src/renderer/src/components/DashboardSidebar.tsx +11 -2
- package/src/renderer/src/components/ImageStudioPanel.tsx +87 -4
- package/src/renderer/src/components/MintDashboard.tsx +150 -5
- package/src/renderer/src/components/PicturesLibrary.tsx +156 -15
- package/src/renderer/src/components/Settings/AutomationTab.tsx +316 -18
- package/src/renderer/src/components/Settings/GeneralTab.tsx +762 -634
- package/src/renderer/src/components/Settings/PluginsTab.tsx +304 -70
- package/src/renderer/src/components/Settings/ThemeTab.tsx +6 -1
- package/src/renderer/src/components/SettingsWindow.tsx +38 -2
- package/src/renderer/src/components/VeoStudioPanel.tsx +549 -0
- package/src/renderer/src/css/image-studio.css +106 -0
- package/src/renderer/src/css/settings.css +158 -0
- package/src/renderer/src/css/styles.css +352 -1
- package/src/renderer/src/css/veo-studio.css +626 -0
- package/src/renderer/src/index.css +1 -0
- package/src/renderer/src/tauri.ts +144 -17
- package/src/renderer/src-web/components/ChatPanel.tsx +360 -88
- package/src/renderer/src-web/components/DashboardSidebar.tsx +16 -1
- package/src/renderer/src-web/components/ImageStudioPanel.tsx +87 -4
- package/src/renderer/src-web/components/MintDashboard.tsx +137 -4
- package/src/renderer/src-web/components/PicturesLibrary.tsx +155 -15
- package/src/renderer/src-web/components/Settings/AutomationTab.tsx +316 -18
- package/src/renderer/src-web/components/Settings/GeneralTab.tsx +762 -629
- package/src/renderer/src-web/components/Settings/PluginsTab.tsx +304 -70
- package/src/renderer/src-web/components/Settings/ThemeTab.tsx +6 -1
- package/src/renderer/src-web/components/SettingsWindow.tsx +35 -2
- package/src/renderer/src-web/components/VeoStudioPanel.tsx +549 -0
- package/src/renderer/src-web/css/image-studio.css +106 -0
- package/src/renderer/src-web/css/settings.css +158 -0
- package/src/renderer/src-web/css/styles.css +353 -1
- package/src/renderer/src-web/css/veo-studio.css +650 -0
- package/src/renderer/src-web/index.css +1 -0
- package/src/renderer/src-web/tauri.ts +135 -16
- package/src-tauri/src/lib.rs +114 -8
- package/src-tauri/src/webhooks.rs +45 -31
- package/src-tauri/src/workflows.rs +1 -0
- package/src-tauri/tauri.conf.json +1 -1
- package/temp_gridgeist/AGENTS.md +8 -0
- package/temp_gridgeist/CHANGELOG.md +130 -0
- package/temp_gridgeist/LICENSE +21 -0
- package/temp_gridgeist/README.md +323 -0
- package/temp_gridgeist/README.th.md +325 -0
- package/temp_gridgeist/skills/gridgeist/SKILL.md +88 -0
- package/temp_gridgeist/skills/gridgeist/agents/openai.yaml +9 -0
- package/temp_gridgeist/skills/gridgeist/assets/gridgeist-small.svg +10 -0
- package/temp_gridgeist/skills/gridgeist/assets/gridgeist.png +0 -0
- package/temp_gridgeist/skills/gridgeist/assets/gridgeist.svg +18 -0
- package/temp_gridgeist/skills/gridgeist/references/design-language.md +88 -0
- package/temp_gridgeist/skills/gridgeist/references/review-checklist.md +128 -0
- package/temp_gridgeist/skills/gridgeist/references/system-contract.md +109 -0
|
@@ -0,0 +1,130 @@
|
|
|
1
|
+
# Changelog
|
|
2
|
+
|
|
3
|
+
All notable changes to Gridgeist are documented here. This project follows
|
|
4
|
+
[Semantic Versioning](https://semver.org/).
|
|
5
|
+
|
|
6
|
+
## [Unreleased]
|
|
7
|
+
|
|
8
|
+
## [1.2.0] - 2026-07-20
|
|
9
|
+
|
|
10
|
+
### Added
|
|
11
|
+
|
|
12
|
+
- Added a conditional system-contract reference covering semantic color,
|
|
13
|
+
typography, layout, spacing, component grammar, states, media, motion, and
|
|
14
|
+
proportional DESIGN.md interoperability.
|
|
15
|
+
- Added paired English and Thai behavioral evaluation coverage for design-system
|
|
16
|
+
coherence and persistent-artifact boundaries.
|
|
17
|
+
|
|
18
|
+
### Changed
|
|
19
|
+
|
|
20
|
+
- Strengthened the core workflow and review checklist to reconcile existing
|
|
21
|
+
design-system sources, define reusable component rules, and review color/theming
|
|
22
|
+
and component coherence separately.
|
|
23
|
+
- Clarified that product content alone cannot make an underspecified broad redesign
|
|
24
|
+
brand-derived, and prohibited system definition or implementation edits while its
|
|
25
|
+
direction remains provisional.
|
|
26
|
+
- Made overlapping broad visual-skill ownership an explicit pre-thesis gate instead
|
|
27
|
+
of allowing the companion to be silently ignored or blended.
|
|
28
|
+
- Documented optional DESIGN.md intake and output in the English and Thai usage
|
|
29
|
+
guidance without making it a dependency.
|
|
30
|
+
|
|
31
|
+
## [1.1.2] - 2026-07-18
|
|
32
|
+
|
|
33
|
+
### Added
|
|
34
|
+
|
|
35
|
+
- Added compact companion coordination so Gridgeist remains the default owner of
|
|
36
|
+
product and visual direction without requiring optional context, asset, audit, or
|
|
37
|
+
verification capabilities.
|
|
38
|
+
- Added paired English and Thai evaluation scenarios for overlapping art-direction
|
|
39
|
+
skills, internationalization and user preferences, interaction alternatives, and
|
|
40
|
+
bounded performance evidence.
|
|
41
|
+
|
|
42
|
+
### Changed
|
|
43
|
+
|
|
44
|
+
- Strengthened the review checklist for container resilience, language direction,
|
|
45
|
+
forced colors, unobscured focus, non-drag alternatives, media stability, and
|
|
46
|
+
evidence-bounded performance review.
|
|
47
|
+
- Documented optional companion workflows and role boundaries in the English and
|
|
48
|
+
Thai READMEs without making them installation dependencies.
|
|
49
|
+
|
|
50
|
+
## [1.1.1] - 2026-07-18
|
|
51
|
+
|
|
52
|
+
### Added
|
|
53
|
+
|
|
54
|
+
- Added isolated live smoke tests for Codex plugin clean installation, marketplace
|
|
55
|
+
refresh, reinstall, and universal installer updates on release tags and manual CI
|
|
56
|
+
runs.
|
|
57
|
+
- Added a bilingual direction-decision fixture, paired ambiguous/explicit scenarios,
|
|
58
|
+
and preserved raw regression outputs for the new collaboration boundary.
|
|
59
|
+
|
|
60
|
+
### Changed
|
|
61
|
+
|
|
62
|
+
- Reordered the English and Thai Quickstarts so the Codex plugin and universal
|
|
63
|
+
installer lead, with repository cloning and manual copying kept as fallback.
|
|
64
|
+
- Added a conditional direction-alignment gate for broad, underspecified Create and
|
|
65
|
+
Redesign work without slowing explicit directions, Reviews, or narrow repairs.
|
|
66
|
+
|
|
67
|
+
## [1.1.0] - 2026-07-16
|
|
68
|
+
|
|
69
|
+
### Added
|
|
70
|
+
|
|
71
|
+
- Added explicit update instructions for Codex plugins, `npx skills`, Git clones,
|
|
72
|
+
and manual installations in English and Thai documentation.
|
|
73
|
+
- Added dependency-free release validation and GitHub Actions checks for skill,
|
|
74
|
+
plugin, marketplace, documentation, and bilingual evaluation alignment.
|
|
75
|
+
|
|
76
|
+
### Changed
|
|
77
|
+
|
|
78
|
+
- Reframed Gridgeist around product-native structure so grids may be visible,
|
|
79
|
+
quiet, or invisible according to the established brand.
|
|
80
|
+
- Added explicit adaptation guidance for image-led, playful, technical,
|
|
81
|
+
content-heavy, and transactional interfaces.
|
|
82
|
+
- Added interaction-state inventory, verification evidence, and claim-integrity
|
|
83
|
+
requirements to the core workflow and review checklist.
|
|
84
|
+
- Strengthened behavioral evaluation guidance with repeat runs,
|
|
85
|
+
scenario-level evidence, implementation checks, and trigger boundaries.
|
|
86
|
+
- Made the documented Windows validation command explicitly use UTF-8.
|
|
87
|
+
- Pinned the public marketplace entry to the v1.1.0 release tag.
|
|
88
|
+
|
|
89
|
+
## [1.0.1] - 2026-07-14
|
|
90
|
+
|
|
91
|
+
### Fixed
|
|
92
|
+
|
|
93
|
+
- Added a Git-backed Codex marketplace catalog for two-command installation.
|
|
94
|
+
- Moved the installable skill to the standard `skills/gridgeist/` plugin path
|
|
95
|
+
so Codex plugin validation and marketplace installation use the same source.
|
|
96
|
+
|
|
97
|
+
## [1.0.0] - 2026-07-13
|
|
98
|
+
|
|
99
|
+
Gridgeist's first stable release.
|
|
100
|
+
|
|
101
|
+
### Added
|
|
102
|
+
|
|
103
|
+
- A reproducible Tracefield case study with the original baseline, exact prompt,
|
|
104
|
+
six-part rubric, verification evidence, and stated limitations.
|
|
105
|
+
- A dedicated case-study page and a field-proof section on the project website.
|
|
106
|
+
- Direct links from the English and Thai documentation to the live Tracefield
|
|
107
|
+
interface and its source repository.
|
|
108
|
+
|
|
109
|
+
### Changed
|
|
110
|
+
|
|
111
|
+
- Promoted the Codex plugin manifest from `0.1.0` to `1.0.0` to mark the public
|
|
112
|
+
skill interface and its Create, Redesign, and Review workflows as stable.
|
|
113
|
+
|
|
114
|
+
## [0.1.0] - 2026-07-13
|
|
115
|
+
|
|
116
|
+
### Added
|
|
117
|
+
|
|
118
|
+
- Initial Gridgeist agent skill with Create, Redesign, and Review workflows.
|
|
119
|
+
- Codex plugin manifest and agent-facing interface metadata.
|
|
120
|
+
- English and Thai documentation and evaluation prompts.
|
|
121
|
+
- Interactive examples and a responsive GitHub Pages website.
|
|
122
|
+
|
|
123
|
+
[Unreleased]: https://github.com/ohmiler/gridgeist/compare/v1.2.0...HEAD
|
|
124
|
+
[1.2.0]: https://github.com/ohmiler/gridgeist/compare/v1.1.2...v1.2.0
|
|
125
|
+
[1.1.2]: https://github.com/ohmiler/gridgeist/compare/v1.1.1...v1.1.2
|
|
126
|
+
[1.1.1]: https://github.com/ohmiler/gridgeist/compare/v1.1.0...v1.1.1
|
|
127
|
+
[1.1.0]: https://github.com/ohmiler/gridgeist/compare/v1.0.1...v1.1.0
|
|
128
|
+
[1.0.1]: https://github.com/ohmiler/gridgeist/compare/v1.0.0...v1.0.1
|
|
129
|
+
[1.0.0]: https://github.com/ohmiler/gridgeist/compare/v0.1.0...v1.0.0
|
|
130
|
+
[0.1.0]: https://github.com/ohmiler/gridgeist/releases/tag/v0.1.0
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 Miler
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
|
@@ -0,0 +1,323 @@
|
|
|
1
|
+
<p align="center">
|
|
2
|
+
<img src="skills/gridgeist/assets/gridgeist.svg" alt="Gridgeist agent skill for web interface direction" width="240" />
|
|
3
|
+
</p>
|
|
4
|
+
|
|
5
|
+
# Gridgeist
|
|
6
|
+
|
|
7
|
+
**English** · [ภาษาไทย](README.th.md) · [Website](https://ohmiler.github.io/gridgeist/) · [Examples](https://ohmiler.github.io/gridgeist/examples/)
|
|
8
|
+
|
|
9
|
+
Gridgeist is an agent skill for creating, redesigning, and reviewing product-native web interfaces. It adapts structure, typography, imagery, interaction, and product evidence to the established brand, using grids as visible, quiet, or invisible logic. It helps agents move beyond generic AI-generated SaaS patterns while preserving product intent, behavior, responsiveness, and accessibility.
|
|
10
|
+
|
|
11
|
+
## See the difference
|
|
12
|
+
|
|
13
|
+
This illustrative Northline logistics comparison is rendered from two full HTML/CSS pages with the same product, copy, sample operating data, and viewport. The After page and screenshot were rebuilt with the **Gridgeist v1.2.0** system workflow; Northline and all displayed data are fictional.
|
|
14
|
+
|
|
15
|
+
<table>
|
|
16
|
+
<tr>
|
|
17
|
+
<th width='50%'>Without Gridgeist - generic SaaS</th>
|
|
18
|
+
<th width='50%'>With Gridgeist v1.2.0 - product-native system</th>
|
|
19
|
+
</tr>
|
|
20
|
+
<tr>
|
|
21
|
+
<td><img src='docs/assets/northline-before.png' alt='Generic Northline logistics landing page with centered marketing copy, rounded controls, a chart, and interchangeable metric cards' width='100%' /></td>
|
|
22
|
+
<td><img src='docs/assets/northline-after.png' alt='Gridgeist v1.2.0 Northline concept organized as one operational system with live freight topology, semantic lane states, arrival times, and an explicit priority exception' width='100%' /></td>
|
|
23
|
+
</tr>
|
|
24
|
+
</table>
|
|
25
|
+
|
|
26
|
+
Same content and sample operating data; a different design system. Gridgeist turns the topology, route table, exception, actions, and metrics into one connected operational surface built from product evidence, while labeling the concept honestly. Both README images are browser captures of the working pages. [Open the Before page](https://ohmiler.github.io/gridgeist/readme-showcase/?view=before) or [open the v1.2.0 After page](https://ohmiler.github.io/gridgeist/readme-showcase/?view=after&rev=ab77ceb6).
|
|
27
|
+
|
|
28
|
+
## What v1.2.0 changes
|
|
29
|
+
|
|
30
|
+
Gridgeist now treats visual decisions as one system, not a sequence of isolated styling choices.
|
|
31
|
+
|
|
32
|
+
| Area | v1.2.0 behavior |
|
|
33
|
+
| --- | --- |
|
|
34
|
+
| System contract | Defines color, typography, layout, spacing, shape, components, states, media, and motion as one compact direction before implementation. |
|
|
35
|
+
| Semantic roles | Connects foundation tokens to semantic roles and component decisions, so contrast and state relationships remain intentional. |
|
|
36
|
+
| Component grammar | Gives related controls and content shared anatomy, variants, density, states, and content-stress rules instead of styling each instance separately. |
|
|
37
|
+
| Direction safety | When the visual thesis is still broad, offers distinct directions and waits for alignment before committing tokens or editing the interface. |
|
|
38
|
+
| Skill coordination | Names one direction owner when multiple UI skills are active, preventing competing visual systems. |
|
|
39
|
+
| Verification | Checks representative widths, overflow, focus, interaction states, themes, and reduced motion—and limits claims to observed evidence. |
|
|
40
|
+
|
|
41
|
+
In practice, the result is more coherent, less generic, and easier to extend without losing the product's identity. The v1.2.0 release was exercised through three English and three Thai system-contract scenarios, independent responsive browser checks, and repaired guardrail tests.
|
|
42
|
+
|
|
43
|
+
## 60-second Quickstart
|
|
44
|
+
|
|
45
|
+
1. Install Gridgeist through the primary channel for your agent.
|
|
46
|
+
|
|
47
|
+
For Codex, add the Git marketplace and install the plugin:
|
|
48
|
+
|
|
49
|
+
```powershell
|
|
50
|
+
codex plugin marketplace add ohmiler/gridgeist
|
|
51
|
+
codex plugin add gridgeist@gridgeist
|
|
52
|
+
```
|
|
53
|
+
|
|
54
|
+
For Claude Code, Cursor, Gemini CLI, GitHub Copilot, OpenCode, and other compatible agents, use the universal installer:
|
|
55
|
+
|
|
56
|
+
```powershell
|
|
57
|
+
npx skills add ohmiler/gridgeist -g
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
**Manual fallback:** If neither installer is available, continue to [Manual installation](#manual-installation).
|
|
61
|
+
2. Start a new agent session in your web project and paste:
|
|
62
|
+
|
|
63
|
+
```text
|
|
64
|
+
Use the Gridgeist skill to review this interface without editing it yet. Give me a one-line verdict, prioritized findings with evidence, and one coherent redesign direction. Preserve the product's behavior and brand.
|
|
65
|
+
```
|
|
66
|
+
|
|
67
|
+
Agents that support explicit skill invocation can use `$gridgeist` in the prompt. Continue to [Installation](#installation) for product-specific details and more examples.
|
|
68
|
+
|
|
69
|
+
## Use cases
|
|
70
|
+
|
|
71
|
+
- Create a distinctive landing page, dashboard, documentation site, portfolio, or learning platform.
|
|
72
|
+
- Redesign an existing interface without breaking its behavior or brand.
|
|
73
|
+
- Review a draft and prioritize hierarchy, composition, responsiveness, accessibility, and implementation quality.
|
|
74
|
+
- Adapt technical, editorial, image-led, playful, utilitarian, or visible-grid direction without erasing the brand.
|
|
75
|
+
|
|
76
|
+
## Installation
|
|
77
|
+
|
|
78
|
+
### Codex plugin
|
|
79
|
+
|
|
80
|
+
This repository is packaged as a Codex plugin through [`.codex-plugin/plugin.json`](.codex-plugin/plugin.json). The plugin points to the same `skills/gridgeist/` directory used by the other channels, so all installations share one source of truth.
|
|
81
|
+
|
|
82
|
+
Add the Gridgeist marketplace, then install the plugin:
|
|
83
|
+
|
|
84
|
+
```powershell
|
|
85
|
+
codex plugin marketplace add ohmiler/gridgeist
|
|
86
|
+
codex plugin add gridgeist@gridgeist
|
|
87
|
+
```
|
|
88
|
+
|
|
89
|
+
Start a new Codex session after installation so the bundled skill is discovered.
|
|
90
|
+
|
|
91
|
+
### Universal installer
|
|
92
|
+
|
|
93
|
+
For Claude Code, Cursor, Gemini CLI, GitHub Copilot, OpenCode, and other compatible agents, install Gridgeist with the [open agent skills CLI](https://github.com/vercel-labs/skills):
|
|
94
|
+
|
|
95
|
+
```powershell
|
|
96
|
+
npx skills add ohmiler/gridgeist -g
|
|
97
|
+
```
|
|
98
|
+
|
|
99
|
+
The installer discovers `skills/gridgeist/` and prompts you to choose the target agents. To select one directly, pass its agent name; for example:
|
|
100
|
+
|
|
101
|
+
```powershell
|
|
102
|
+
npx skills add ohmiler/gridgeist -g -a claude-code
|
|
103
|
+
```
|
|
104
|
+
|
|
105
|
+
### Manual installation
|
|
106
|
+
|
|
107
|
+
Use manual copying only when the plugin and universal installer are unavailable:
|
|
108
|
+
|
|
109
|
+
```powershell
|
|
110
|
+
git clone https://github.com/ohmiler/gridgeist.git
|
|
111
|
+
Copy-Item -Recurse .\gridgeist\skills\gridgeist "$HOME\.agents\skills\gridgeist"
|
|
112
|
+
```
|
|
113
|
+
|
|
114
|
+
For a different agent, copy `skills/gridgeist/` to that product's skills directory. The agent must support the Agent Skills `SKILL.md` convention. Discovery and invocation behavior can differ between products. Start a new agent session after copying the directory.
|
|
115
|
+
|
|
116
|
+
## Updating
|
|
117
|
+
|
|
118
|
+
Gridgeist releases do not update silently. Use the command for the channel that installed the skill, then start a new agent session.
|
|
119
|
+
|
|
120
|
+
### Codex plugin
|
|
121
|
+
|
|
122
|
+
Refresh the Git-backed marketplace snapshot, then reinstall the plugin version exposed by that release:
|
|
123
|
+
|
|
124
|
+
```powershell
|
|
125
|
+
codex plugin marketplace upgrade gridgeist
|
|
126
|
+
codex plugin add gridgeist@gridgeist
|
|
127
|
+
```
|
|
128
|
+
|
|
129
|
+
Confirm the installed version with `codex plugin list`. If the current session still uses older instructions, start a new thread or restart the Codex app.
|
|
130
|
+
|
|
131
|
+
### Universal installer
|
|
132
|
+
|
|
133
|
+
Update a global Gridgeist installation:
|
|
134
|
+
|
|
135
|
+
```powershell
|
|
136
|
+
npx skills update gridgeist -g -y
|
|
137
|
+
```
|
|
138
|
+
|
|
139
|
+
For a project-scoped installation, use `npx skills update gridgeist -p -y` instead.
|
|
140
|
+
|
|
141
|
+
### Git clone or manual copy
|
|
142
|
+
|
|
143
|
+
Run `git pull --ff-only` in an existing clone, then reinstall from `skills/gridgeist/`. Manual copies do not retain source or version metadata, so replace the complete skill directory from a tagged release. Prefer the Codex plugin or universal installer when future updates matter.
|
|
144
|
+
|
|
145
|
+
## Example prompts
|
|
146
|
+
|
|
147
|
+
Invoke Gridgeist directly with `$gridgeist` and include four essentials:
|
|
148
|
+
|
|
149
|
+
1. The product and its audience.
|
|
150
|
+
2. The mode: create, redesign, or review.
|
|
151
|
+
3. What must be preserved, such as behavior, brand color, or content.
|
|
152
|
+
4. What must be verified, such as desktop, mobile, keyboard, and accessibility.
|
|
153
|
+
|
|
154
|
+
```text
|
|
155
|
+
Use $gridgeist to redesign this Next.js course landing page. Preserve all behavior and the blue brand color, but replace the generic SaaS cards with an editorial grid and verify desktop and mobile layouts.
|
|
156
|
+
```
|
|
157
|
+
|
|
158
|
+
```text
|
|
159
|
+
Review this dashboard with $gridgeist. Give me a one-line verdict, prioritized findings with evidence, and a coherent replacement direction before editing.
|
|
160
|
+
```
|
|
161
|
+
|
|
162
|
+
```text
|
|
163
|
+
Use $gridgeist to create a technical documentation homepage where real API examples and navigation structure carry the visual identity.
|
|
164
|
+
```
|
|
165
|
+
|
|
166
|
+
### Brief for a closer match
|
|
167
|
+
|
|
168
|
+
For a more precise result, provide these details when they are relevant:
|
|
169
|
+
|
|
170
|
+
- **Product and audience** — what the product does and who uses it.
|
|
171
|
+
- **Primary task** — the most important thing the user must accomplish.
|
|
172
|
+
- **Direction** — the intended character, such as warm editorial, precise
|
|
173
|
+
technical, or playful tactile.
|
|
174
|
+
- **Authentic material** — product UI, data, prose, imagery, artwork, code, or a
|
|
175
|
+
workflow that should carry visual weight.
|
|
176
|
+
- **Preserved constraints** — brand signals, content, routes, behavior, components,
|
|
177
|
+
privacy, or platform requirements that must not change.
|
|
178
|
+
- **Exclusions** — visual language or behavior that would be wrong for the product.
|
|
179
|
+
- **Flows and states** — the important default, loading, empty, error, success,
|
|
180
|
+
disabled, and destructive paths.
|
|
181
|
+
- **Verification** — representative viewports, keyboard, touch, focus, overflow,
|
|
182
|
+
reduced motion, and primary flows to exercise.
|
|
183
|
+
|
|
184
|
+
When the direction is already clear, state it and let Gridgeist proceed without
|
|
185
|
+
another aesthetic questionnaire. When several materially different directions are
|
|
186
|
+
still credible, ask Gridgeist to inspect first, offer two or three grounded options
|
|
187
|
+
with trade-offs and a recommendation, and wait for alignment before editing.
|
|
188
|
+
|
|
189
|
+
Copy and adapt this template:
|
|
190
|
+
|
|
191
|
+
```text
|
|
192
|
+
Use $gridgeist to [create / redesign / review] [page or product surface].
|
|
193
|
+
|
|
194
|
+
Product and audience:
|
|
195
|
+
[What it does and who uses it]
|
|
196
|
+
|
|
197
|
+
Primary task:
|
|
198
|
+
[The most important user outcome]
|
|
199
|
+
|
|
200
|
+
Direction:
|
|
201
|
+
[A confirmed direction, or: Inspect first, propose two or three grounded
|
|
202
|
+
directions with trade-offs and a recommendation, and do not edit until I choose.]
|
|
203
|
+
|
|
204
|
+
Authentic material that should lead:
|
|
205
|
+
[Product UI / data / prose / imagery / artwork / code / workflow]
|
|
206
|
+
|
|
207
|
+
Preserve:
|
|
208
|
+
[Brand, content, routes, behavior, components, and constraints]
|
|
209
|
+
|
|
210
|
+
Avoid:
|
|
211
|
+
[Visual language or behavior that would be wrong]
|
|
212
|
+
|
|
213
|
+
Important flows and states:
|
|
214
|
+
[Primary flow and applicable default/loading/empty/error/success/disabled states]
|
|
215
|
+
|
|
216
|
+
Verify:
|
|
217
|
+
[Viewports, keyboard, touch, focus, overflow, reduced motion, and primary flow]
|
|
218
|
+
|
|
219
|
+
Inspect the repository and rendered interface before taking action.
|
|
220
|
+
```
|
|
221
|
+
|
|
222
|
+
Describe outcomes and genuine constraints rather than prescribing a CSS recipe.
|
|
223
|
+
Unless they are established brand requirements, leave font sizes, spacing, radii,
|
|
224
|
+
shadows, and column counts for Gridgeist to derive as one coherent system.
|
|
225
|
+
|
|
226
|
+
If a project already contains a `DESIGN.md`, theme, token set, or component
|
|
227
|
+
library, Gridgeist inspects it alongside the implementation and rendered interface
|
|
228
|
+
instead of assuming the sources agree. `DESIGN.md` is optional interoperability,
|
|
229
|
+
not a dependency: Gridgeist should not create or update one unless you request a
|
|
230
|
+
portable design-system artifact or explicitly include durable system documentation
|
|
231
|
+
in the work.
|
|
232
|
+
|
|
233
|
+
Gridgeist also allows implicit invocation when the agent recognizes a matching web-interface task.
|
|
234
|
+
|
|
235
|
+
## Working with companion skills
|
|
236
|
+
|
|
237
|
+
Gridgeist works best as the sole owner of product and visual direction, with optional companion skills supplying context, technical review, or rendered evidence. The lightest recommended workflow for most projects is:
|
|
238
|
+
|
|
239
|
+
```text
|
|
240
|
+
Gridgeist -> Playwright
|
|
241
|
+
```
|
|
242
|
+
|
|
243
|
+
Gridgeist defines the interface thesis, hierarchy, system, and implementation direction. Playwright then checks the rendered result across representative viewports and interactions; it can also provide repeatable [visual comparisons](https://playwright.dev/docs/test-snapshots).
|
|
244
|
+
|
|
245
|
+
| Situation | Recommended workflow | Division of responsibility |
|
|
246
|
+
| --- | --- | --- |
|
|
247
|
+
| Most web projects | `Gridgeist -> Playwright` | Design and implementation, then rendered verification |
|
|
248
|
+
| Figma is the source of truth | `Figma -> Gridgeist -> Playwright` | Extract components, variables, and layout context; adapt them to the product and codebase; verify the result. See the [Figma MCP server](https://developers.figma.com/docs/figma-mcp-server/). |
|
|
249
|
+
| React or Next.js | `Gridgeist -> Vercel React Best Practices -> Playwright` | Own the interface direction; review framework performance; verify behavior. See [Vercel Agent Skills](https://github.com/vercel-labs/agent-skills). |
|
|
250
|
+
| Pre-release quality audit | `Gridgeist -> Web Quality Audit -> Playwright` | Review hierarchy and brand fit; audit accessibility, performance, SEO, and web quality; confirm the live result. See [Web Quality Skills](https://github.com/addyosmani/web-quality-skills). |
|
|
251
|
+
| Original imagery is required | `Gridgeist -> image generation -> Gridgeist -> Playwright` | Establish the thesis before generating assets, compose with the selected assets, then verify the interface. |
|
|
252
|
+
|
|
253
|
+
Treat these as optional workflows, not dependencies. Add only the companion that answers a real need, and keep another broad frontend-design or art-direction skill out of the same design phase; competing visual priors can weaken a coherent result. Companion skill names and availability vary between agents.
|
|
254
|
+
|
|
255
|
+
Example:
|
|
256
|
+
|
|
257
|
+
```text
|
|
258
|
+
Use $gridgeist to redesign this interface while preserving its behavior and brand.
|
|
259
|
+
After implementation, use Playwright to verify representative desktop and mobile
|
|
260
|
+
viewports, keyboard interaction, overflow, and the primary user flow.
|
|
261
|
+
```
|
|
262
|
+
|
|
263
|
+
## Repository layout
|
|
264
|
+
|
|
265
|
+
```text
|
|
266
|
+
.codex-plugin/
|
|
267
|
+
plugin.json Codex plugin manifest
|
|
268
|
+
skills/gridgeist/ Installable skill
|
|
269
|
+
SKILL.md Trigger conditions and core workflow
|
|
270
|
+
agents/openai.yaml Agent-facing interface metadata
|
|
271
|
+
references/ Design language and review checklist
|
|
272
|
+
evals/prompts.md Repeatable manual behavior checks
|
|
273
|
+
docs/ Design and implementation records
|
|
274
|
+
```
|
|
275
|
+
|
|
276
|
+
## Case studies
|
|
277
|
+
|
|
278
|
+
[Tracefield](https://ohmiler.github.io/tracefield/) applies Gridgeist to a working developer-observability dashboard. Its [repository](https://github.com/ohmiler/tracefield) preserves the generic baseline, exact prompt, evaluation rubric, tested trace domain, and responsive final interface.
|
|
279
|
+
|
|
280
|
+
[Ledgerline](https://ohmiler.github.io/ledgerline/) tests the same skill on dense payment API documentation. Its [repository](https://github.com/ohmiler/ledgerline) preserves a conventional baseline, exact prompt, six-part rubric, deterministic API content, four viewport checks, and the responsive final interface.
|
|
281
|
+
|
|
282
|
+
[Morrow](https://ohmiler.github.io/morrow-portfolio/) stress-tests brand adaptation with a fictional image-led creative portfolio. Its [repository](https://github.com/ohmiler/morrow-portfolio) preserves shared AI-generated artwork, a conventional baseline, exact prompts, a six-part rubric, four viewport checks, and a final interface deliberately unlike the technical case studies.
|
|
283
|
+
|
|
284
|
+
[Doodlewood](https://ohmiler.github.io/doodlewood/) tests playful interaction design with a fictional, privacy-preserving children's drawing studio. Its [repository](https://github.com/ohmiler/doodlewood) preserves the generic baseline, exact prompt, six-part rubric, local drawing engine, four viewport checks, and explicit limits around child safety and real-user evidence.
|
|
285
|
+
|
|
286
|
+
Together, the four self-produced case studies cover data-heavy, content-heavy, image-led, and playful interactive surfaces. Further validation should now prioritize independent users, agents, and projects rather than adding another first-party visual category.
|
|
287
|
+
|
|
288
|
+
## Limitations
|
|
289
|
+
|
|
290
|
+
- Output quality depends on the agent inspecting the actual repository and rendered interface.
|
|
291
|
+
- Automated checks do not replace visual inspection at representative viewport sizes.
|
|
292
|
+
- The suggested defaults are starting points, not a mandatory preset for every brand.
|
|
293
|
+
- Model outputs are not deterministic. Re-run evaluations when the skill or target agent changes.
|
|
294
|
+
|
|
295
|
+
## Validation
|
|
296
|
+
|
|
297
|
+
Validate the installable skill structure:
|
|
298
|
+
|
|
299
|
+
```powershell
|
|
300
|
+
python -X utf8 "$HOME\.codex\skills\.system\skill-creator\scripts\quick_validate.py" .\skills\gridgeist
|
|
301
|
+
```
|
|
302
|
+
|
|
303
|
+
Check release metadata and bilingual documentation without external dependencies:
|
|
304
|
+
|
|
305
|
+
```powershell
|
|
306
|
+
python -X utf8 .\scripts\validate_release.py
|
|
307
|
+
```
|
|
308
|
+
|
|
309
|
+
Exercise clean installation and updates through the live Codex marketplace and universal installer. This check requires Codex, Node.js, npm, Git, and network access; it uses temporary homes and does not modify your existing installations.
|
|
310
|
+
|
|
311
|
+
```powershell
|
|
312
|
+
python -X utf8 .\scripts\smoke_test_install.py
|
|
313
|
+
```
|
|
314
|
+
|
|
315
|
+
Behavioral evaluation prompts are in [`evals/prompts.md`](evals/prompts.md).
|
|
316
|
+
|
|
317
|
+
## Contributing
|
|
318
|
+
|
|
319
|
+
Keep `SKILL.md` concise and place detailed, conditionally loaded guidance in `references/`. For behavior changes, update an evaluation scenario and record what failed before changing the skill. Open an issue or pull request with the motivating prompt and observed output.
|
|
320
|
+
|
|
321
|
+
## License
|
|
322
|
+
|
|
323
|
+
[MIT](LICENSE)
|