@tekmidian/pai 0.5.6 → 0.5.7
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/README.md +20 -2
- package/dist/cli/index.mjs +479 -5
- package/dist/cli/index.mjs.map +1 -1
- package/dist/daemon/index.mjs +2 -2
- package/dist/{daemon-D9evGlgR.mjs → daemon-2ND5WO2j.mjs} +3 -3
- package/dist/{daemon-D9evGlgR.mjs.map → daemon-2ND5WO2j.mjs.map} +1 -1
- package/dist/{db-4lSqLFb8.mjs → db-BtuN768f.mjs} +9 -2
- package/dist/db-BtuN768f.mjs.map +1 -0
- package/dist/hooks/capture-all-events.mjs +19 -4
- package/dist/hooks/capture-all-events.mjs.map +4 -4
- package/dist/hooks/cleanup-session-files.mjs.map +2 -2
- package/dist/hooks/context-compression-hook.mjs +14 -9
- package/dist/hooks/context-compression-hook.mjs.map +3 -3
- package/dist/hooks/initialize-session.mjs +14 -8
- package/dist/hooks/initialize-session.mjs.map +3 -3
- package/dist/hooks/load-core-context.mjs +18 -2
- package/dist/hooks/load-core-context.mjs.map +4 -4
- package/dist/hooks/load-project-context.mjs +14 -8
- package/dist/hooks/load-project-context.mjs.map +3 -3
- package/dist/hooks/stop-hook.mjs +105 -8
- package/dist/hooks/stop-hook.mjs.map +3 -3
- package/dist/hooks/sync-todo-to-md.mjs.map +2 -2
- package/dist/index.d.mts +2 -2
- package/dist/index.d.mts.map +1 -1
- package/dist/index.mjs +1 -1
- package/dist/mcp/index.mjs +1 -1
- package/dist/{vault-indexer-DXWs9pDn.mjs → vault-indexer-k-kUlaZ-.mjs} +41 -7
- package/dist/vault-indexer-k-kUlaZ-.mjs.map +1 -0
- package/package.json +1 -1
- package/src/hooks/ts/capture-all-events.ts +6 -0
- package/src/hooks/ts/lib/project-utils.ts +24 -5
- package/src/hooks/ts/pre-compact/context-compression-hook.ts +6 -0
- package/src/hooks/ts/session-start/initialize-session.ts +7 -1
- package/src/hooks/ts/session-start/load-core-context.ts +7 -0
- package/src/hooks/ts/session-start/load-project-context.ts +8 -1
- package/src/hooks/ts/stop/stop-hook.ts +28 -0
- package/templates/claude-md.template.md +7 -74
- package/templates/skills/CORE/Aesthetic.md +333 -0
- package/templates/skills/CORE/CONSTITUTION.md +1502 -0
- package/templates/skills/CORE/HistorySystem.md +427 -0
- package/templates/skills/CORE/HookSystem.md +1082 -0
- package/templates/skills/CORE/Prompting.md +509 -0
- package/templates/skills/CORE/ProsodyAgentTemplate.md +53 -0
- package/templates/skills/CORE/ProsodyGuide.md +416 -0
- package/templates/skills/CORE/SKILL.md +741 -0
- package/templates/skills/CORE/SkillSystem.md +213 -0
- package/templates/skills/CORE/TerminalTabs.md +119 -0
- package/templates/skills/CORE/VOICE.md +106 -0
- package/templates/skills/user/.gitkeep +0 -0
- package/dist/db-4lSqLFb8.mjs.map +0 -1
- package/dist/vault-indexer-DXWs9pDn.mjs.map +0 -1
|
@@ -10,10 +10,29 @@
|
|
|
10
10
|
|
|
11
11
|
import { existsSync, mkdirSync, readdirSync, readFileSync, writeFileSync, renameSync } from 'fs';
|
|
12
12
|
import { join, basename } from 'path';
|
|
13
|
+
import { homedir } from 'os';
|
|
13
14
|
|
|
14
15
|
// Import from pai-paths which handles .env loading and path resolution
|
|
15
16
|
import { PAI_DIR } from './pai-paths.js';
|
|
16
17
|
|
|
18
|
+
/**
|
|
19
|
+
* Directories known to be automated health-check / probe sessions.
|
|
20
|
+
* Hooks should exit early for these to avoid registry clutter and wasted work.
|
|
21
|
+
*/
|
|
22
|
+
const PROBE_CWD_PATTERNS = [
|
|
23
|
+
'/CodexBar/ClaudeProbe',
|
|
24
|
+
'/ClaudeProbe',
|
|
25
|
+
];
|
|
26
|
+
|
|
27
|
+
/**
|
|
28
|
+
* Check if the current working directory belongs to a probe/health-check session.
|
|
29
|
+
* Returns true if hooks should skip this session entirely.
|
|
30
|
+
*/
|
|
31
|
+
export function isProbeSession(cwd?: string): boolean {
|
|
32
|
+
const dir = cwd || process.cwd();
|
|
33
|
+
return PROBE_CWD_PATTERNS.some(pattern => dir.includes(pattern));
|
|
34
|
+
}
|
|
35
|
+
|
|
17
36
|
// Re-export PAI_DIR for consumers
|
|
18
37
|
export { PAI_DIR };
|
|
19
38
|
export const PROJECTS_DIR = join(PAI_DIR, 'projects');
|
|
@@ -96,20 +115,20 @@ export function getSessionsDirFromProjectDir(projectDir: string): string {
|
|
|
96
115
|
}
|
|
97
116
|
|
|
98
117
|
/**
|
|
99
|
-
* Check if
|
|
118
|
+
* Check if a messaging MCP server (AIBroker, Whazaa, or Telex) is configured.
|
|
100
119
|
*
|
|
101
120
|
* Uses standard Claude Code config at ~/.claude/settings.json.
|
|
102
|
-
*
|
|
121
|
+
* When any messaging server is active, the AI handles notifications via MCP
|
|
122
|
+
* and ntfy is skipped to avoid duplicates.
|
|
103
123
|
*/
|
|
104
124
|
export function isWhatsAppEnabled(): boolean {
|
|
105
125
|
try {
|
|
106
|
-
const { homedir } = require('os');
|
|
107
126
|
const settingsPath = join(homedir(), '.claude', 'settings.json');
|
|
108
127
|
if (!existsSync(settingsPath)) return false;
|
|
109
128
|
|
|
110
129
|
const settings = JSON.parse(readFileSync(settingsPath, 'utf-8'));
|
|
111
130
|
const enabled: string[] = settings.enabledMcpjsonServers || [];
|
|
112
|
-
return enabled.includes('whazaa');
|
|
131
|
+
return enabled.includes('aibroker') || enabled.includes('whazaa') || enabled.includes('telex');
|
|
113
132
|
} catch {
|
|
114
133
|
return false;
|
|
115
134
|
}
|
|
@@ -967,7 +986,7 @@ export function updateTodoContinue(
|
|
|
967
986
|
const now = new Date().toISOString();
|
|
968
987
|
const stateLines = state
|
|
969
988
|
? state.split('\n').filter(l => l.trim()).slice(0, 10).map(l => `> ${l}`).join('\n')
|
|
970
|
-
: `> Check the latest session note for details.`;
|
|
989
|
+
: `> Working directory: ${cwd}. Check the latest session note for details.`;
|
|
971
990
|
|
|
972
991
|
const continueSection = `## Continue
|
|
973
992
|
|
|
@@ -26,6 +26,7 @@ import {
|
|
|
26
26
|
renameSessionNote,
|
|
27
27
|
updateTodoContinue,
|
|
28
28
|
calculateSessionTokens,
|
|
29
|
+
isProbeSession,
|
|
29
30
|
WorkItem,
|
|
30
31
|
} from '../lib/project-utils';
|
|
31
32
|
|
|
@@ -342,6 +343,11 @@ function saveCumulativeState(notesDir: string, data: TranscriptData, notePath: s
|
|
|
342
343
|
// ---------------------------------------------------------------------------
|
|
343
344
|
|
|
344
345
|
async function main() {
|
|
346
|
+
// Skip probe/health-check sessions (e.g. CodexBar ClaudeProbe)
|
|
347
|
+
if (isProbeSession()) {
|
|
348
|
+
process.exit(0);
|
|
349
|
+
}
|
|
350
|
+
|
|
345
351
|
let hookInput: HookInput | null = null;
|
|
346
352
|
|
|
347
353
|
try {
|
|
@@ -24,7 +24,7 @@ import { existsSync, statSync, readFileSync, writeFileSync } from 'fs';
|
|
|
24
24
|
import { join } from 'path';
|
|
25
25
|
import { tmpdir } from 'os';
|
|
26
26
|
import { PAI_DIR } from '../lib/pai-paths';
|
|
27
|
-
import { sendNtfyNotification, isWhatsAppEnabled } from '../lib/project-utils';
|
|
27
|
+
import { sendNtfyNotification, isWhatsAppEnabled, isProbeSession } from '../lib/project-utils';
|
|
28
28
|
|
|
29
29
|
// Debounce duration in milliseconds (prevents duplicate SessionStart events)
|
|
30
30
|
const DEBOUNCE_MS = 2000;
|
|
@@ -111,6 +111,12 @@ async function main() {
|
|
|
111
111
|
process.exit(0);
|
|
112
112
|
}
|
|
113
113
|
|
|
114
|
+
// Skip probe/health-check sessions (e.g. CodexBar ClaudeProbe)
|
|
115
|
+
if (isProbeSession()) {
|
|
116
|
+
console.error('Probe session detected - skipping session initialization');
|
|
117
|
+
process.exit(0);
|
|
118
|
+
}
|
|
119
|
+
|
|
114
120
|
// Check debounce to prevent duplicate notifications
|
|
115
121
|
// (IDE extension can fire multiple SessionStart events)
|
|
116
122
|
if (shouldDebounce()) {
|
|
@@ -28,6 +28,7 @@
|
|
|
28
28
|
import { readFileSync, existsSync } from 'fs';
|
|
29
29
|
import { join } from 'path';
|
|
30
30
|
import { PAI_DIR, SKILLS_DIR } from '../lib/pai-paths';
|
|
31
|
+
import { isProbeSession } from '../lib/project-utils';
|
|
31
32
|
|
|
32
33
|
async function main() {
|
|
33
34
|
try {
|
|
@@ -42,6 +43,12 @@ async function main() {
|
|
|
42
43
|
process.exit(0);
|
|
43
44
|
}
|
|
44
45
|
|
|
46
|
+
// Skip probe/health-check sessions (e.g. CodexBar ClaudeProbe)
|
|
47
|
+
if (isProbeSession()) {
|
|
48
|
+
console.error('Probe session detected - skipping CORE context loading');
|
|
49
|
+
process.exit(0);
|
|
50
|
+
}
|
|
51
|
+
|
|
45
52
|
// Get CORE skill path using PAI paths library
|
|
46
53
|
const coreSkillPath = join(SKILLS_DIR, 'CORE/SKILL.md');
|
|
47
54
|
|
|
@@ -27,7 +27,8 @@ import {
|
|
|
27
27
|
createSessionNote,
|
|
28
28
|
findTodoPath,
|
|
29
29
|
findAllClaudeMdPaths,
|
|
30
|
-
sendNtfyNotification
|
|
30
|
+
sendNtfyNotification,
|
|
31
|
+
isProbeSession
|
|
31
32
|
} from '../lib/project-utils';
|
|
32
33
|
|
|
33
34
|
/**
|
|
@@ -80,6 +81,12 @@ interface HookInput {
|
|
|
80
81
|
async function main() {
|
|
81
82
|
console.error('\nload-project-context.ts starting...');
|
|
82
83
|
|
|
84
|
+
// Skip probe/health-check sessions (e.g. CodexBar ClaudeProbe)
|
|
85
|
+
if (isProbeSession()) {
|
|
86
|
+
console.error('Probe session detected - skipping project context loading');
|
|
87
|
+
process.exit(0);
|
|
88
|
+
}
|
|
89
|
+
|
|
83
90
|
// Read hook input from stdin
|
|
84
91
|
let hookInput: HookInput | null = null;
|
|
85
92
|
try {
|
|
@@ -9,6 +9,8 @@ import {
|
|
|
9
9
|
moveSessionFilesToSessionsDir,
|
|
10
10
|
addWorkToSessionNote,
|
|
11
11
|
findNotesDir,
|
|
12
|
+
isProbeSession,
|
|
13
|
+
updateTodoContinue,
|
|
12
14
|
WorkItem
|
|
13
15
|
} from '../lib/project-utils';
|
|
14
16
|
|
|
@@ -207,6 +209,11 @@ function contentToText(content: any): string {
|
|
|
207
209
|
}
|
|
208
210
|
|
|
209
211
|
async function main() {
|
|
212
|
+
// Skip probe/health-check sessions (e.g. CodexBar ClaudeProbe)
|
|
213
|
+
if (isProbeSession()) {
|
|
214
|
+
process.exit(0);
|
|
215
|
+
}
|
|
216
|
+
|
|
210
217
|
const timestamp = new Date().toISOString();
|
|
211
218
|
console.error(`\nSTOP-HOOK TRIGGERED AT ${timestamp}`);
|
|
212
219
|
|
|
@@ -385,6 +392,27 @@ async function main() {
|
|
|
385
392
|
const summary = message || 'Session completed.';
|
|
386
393
|
finalizeSessionNote(currentNotePath, summary);
|
|
387
394
|
console.error(`Session note finalized: ${basename(currentNotePath)}`);
|
|
395
|
+
|
|
396
|
+
// Update TODO.md ## Continue section so next session has context
|
|
397
|
+
try {
|
|
398
|
+
const stateLines: string[] = [];
|
|
399
|
+
stateLines.push(`Working directory: ${cwd}`);
|
|
400
|
+
if (workItems.length > 0) {
|
|
401
|
+
stateLines.push('');
|
|
402
|
+
stateLines.push('Work completed:');
|
|
403
|
+
for (const item of workItems.slice(0, 5)) {
|
|
404
|
+
stateLines.push(`- ${item.title}`);
|
|
405
|
+
}
|
|
406
|
+
}
|
|
407
|
+
if (message) {
|
|
408
|
+
stateLines.push('');
|
|
409
|
+
stateLines.push(`Last completed: ${message}`);
|
|
410
|
+
}
|
|
411
|
+
const state = stateLines.join('\n');
|
|
412
|
+
updateTodoContinue(cwd, basename(currentNotePath), state, 'session-end');
|
|
413
|
+
} catch (todoError) {
|
|
414
|
+
console.error(`Could not update TODO.md: ${todoError}`);
|
|
415
|
+
}
|
|
388
416
|
}
|
|
389
417
|
} catch (noteError) {
|
|
390
418
|
console.error(`Could not finalize session note: ${noteError}`);
|
|
@@ -635,82 +635,13 @@ IMPORTANT:
|
|
|
635
635
|
|
|
636
636
|
---
|
|
637
637
|
|
|
638
|
-
##
|
|
638
|
+
## Session Lifecycle
|
|
639
639
|
|
|
640
|
-
**
|
|
640
|
+
**Session commands (pause, end, continue, go, cpp) are defined in the CORE skill.**
|
|
641
641
|
|
|
642
|
-
|
|
642
|
+
The CORE skill auto-loads at session start and contains the full session lifecycle: pause checkpoints, end session with commit/push, continuation protocol, and session note naming rules.
|
|
643
643
|
|
|
644
|
-
|
|
645
|
-
# 1. Update session notes with summary of work done
|
|
646
|
-
# 2. Update TODO.md (mark completed, add discovered tasks)
|
|
647
|
-
# 3. Rename session note if it has placeholder name
|
|
648
|
-
# 4. Commit and push in Obsidian/Notes project
|
|
649
|
-
# 5. Commit and push in related code folder (if any)
|
|
650
|
-
```
|
|
651
|
-
|
|
652
|
-
### Automatic Execution
|
|
653
|
-
|
|
654
|
-
When user says "end session" (or "end", "done", "finish session"):
|
|
655
|
-
|
|
656
|
-
**Step 1: Summarize and Update Session Note**
|
|
657
|
-
- Write summary of what was accomplished
|
|
658
|
-
- List any blockers or open questions
|
|
659
|
-
- Ensure session note has meaningful name (NOT "New Session" or project name)
|
|
660
|
-
|
|
661
|
-
**Step 2: Update TODO.md**
|
|
662
|
-
- Mark completed tasks with `[x]`
|
|
663
|
-
- Keep in-progress tasks with `[ ]`
|
|
664
|
-
- Add any newly discovered tasks
|
|
665
|
-
|
|
666
|
-
**Step 3: Commit and Push Obsidian Project**
|
|
667
|
-
```bash
|
|
668
|
-
cd [OBSIDIAN_PROJECT_DIR]
|
|
669
|
-
git add .
|
|
670
|
-
git status # Check what's being committed
|
|
671
|
-
git commit -m "docs: Session NNNN complete - [brief description]"
|
|
672
|
-
git push
|
|
673
|
-
```
|
|
674
|
-
|
|
675
|
-
**Step 4: Commit and Push Code Repository (if applicable)**
|
|
676
|
-
```bash
|
|
677
|
-
cd [CODE_PROJECT_DIR]
|
|
678
|
-
git add .
|
|
679
|
-
git status
|
|
680
|
-
git commit -m "feat/fix/refactor: [description of changes]"
|
|
681
|
-
git push
|
|
682
|
-
```
|
|
683
|
-
|
|
684
|
-
**Step 5: Confirm Completion**
|
|
685
|
-
Report back:
|
|
686
|
-
- Session note filename (should be descriptive)
|
|
687
|
-
- Commits made (both repos if applicable)
|
|
688
|
-
- Any uncommitted changes that were skipped
|
|
689
|
-
- Next session starting point
|
|
690
|
-
|
|
691
|
-
### Project-Code Directory Mapping
|
|
692
|
-
|
|
693
|
-
Add your project mappings to `~/.config/pai/project-mappings.json`:
|
|
694
|
-
|
|
695
|
-
```json
|
|
696
|
-
{
|
|
697
|
-
"mappings": [
|
|
698
|
-
{ "obsidian": "My Project", "code_dir": "~/path/to/code" }
|
|
699
|
-
]
|
|
700
|
-
}
|
|
701
|
-
```
|
|
702
|
-
|
|
703
|
-
PAI reads this file during `end session` to know which code repositories to commit alongside their Obsidian project notes. Run `pai setup` to configure your mappings interactively.
|
|
704
|
-
|
|
705
|
-
For personal preferences (notification channels, voice settings, agent defaults), see `~/.config/pai/agent-prefs.md`.
|
|
706
|
-
|
|
707
|
-
### Important Rules
|
|
708
|
-
|
|
709
|
-
- **NEVER skip the code repo commit** if code changes were made
|
|
710
|
-
- **ALWAYS rename placeholder session notes** before committing
|
|
711
|
-
- **ALWAYS use clean commit messages** (no AI signatures)
|
|
712
|
-
- **CHECK for uncommitted changes** in both locations
|
|
713
|
-
- **REPORT what was pushed** so user knows the state
|
|
644
|
+
**Key commands:** "pause session", "end session", "go"/"continue", "cpp" (commit-push-publish).
|
|
714
645
|
|
|
715
646
|
---
|
|
716
647
|
|
|
@@ -722,7 +653,7 @@ For personal preferences (notification channels, voice settings, agent defaults)
|
|
|
722
653
|
4. **Always spotcheck** - verification is mandatory
|
|
723
654
|
5. **Never search home** - use specific subdirectories
|
|
724
655
|
6. **Autonomous swarm mode** - spawn orchestrator, let agents do the work, no questions
|
|
725
|
-
7. **
|
|
656
|
+
7. **Session lifecycle in CORE skill** - pause, end, continue, cpp commands
|
|
726
657
|
8. **Plan mode for 3+ steps** - write specs, evaluate approaches, execute with verification
|
|
727
658
|
9. **Verify before done** - prove it works, don't just claim it
|
|
728
659
|
10. **Learn from corrections** - update tasks/lessons.md after every user correction
|
|
@@ -730,4 +661,6 @@ For personal preferences (notification channels, voice settings, agent defaults)
|
|
|
730
661
|
12. **Fix bugs autonomously** - investigate, resolve, verify without hand-holding
|
|
731
662
|
13. **Task management** - plan to tasks/todo.md first, track progress, document results
|
|
732
663
|
|
|
664
|
+
**CLAUDE.md + CORE skill = complete PAI configuration.** CLAUDE.md covers agent architecture and engineering standards. CORE skill covers identity, session lifecycle, notifications, and compaction resilience.
|
|
665
|
+
|
|
733
666
|
This is constitutional. Violations waste time, money, and context.
|
|
@@ -0,0 +1,333 @@
|
|
|
1
|
+
# PAI Visual Aesthetic System
|
|
2
|
+
|
|
3
|
+
**A modern digital aesthetic combining Tron-inspired neon elements, Anthropic's warm color palette, and Excalidraw's hand-drawn charm.**
|
|
4
|
+
|
|
5
|
+
---
|
|
6
|
+
|
|
7
|
+
## Core Concept: Digital Warmth
|
|
8
|
+
|
|
9
|
+
Every visualization balances **futuristic precision** with **human imperfection** — clean digital aesthetics rendered with hand-drawn, sketchy energy that feels approachable and alive.
|
|
10
|
+
|
|
11
|
+
**The Philosophy:** *"Technology with humanity."*
|
|
12
|
+
- Digital precision meets hand-drawn warmth
|
|
13
|
+
- Neon accents provide energy without overwhelming
|
|
14
|
+
- Sketchy lines convey approachability and thought-in-progress
|
|
15
|
+
- Simplicity = Clarity (remove everything that doesn't serve the message)
|
|
16
|
+
|
|
17
|
+
---
|
|
18
|
+
|
|
19
|
+
## The PAI Look
|
|
20
|
+
|
|
21
|
+
### What We Want
|
|
22
|
+
- **Excalidraw-style hand-drawn lines** — Sketchy, rough, whiteboard aesthetic
|
|
23
|
+
- **Tron-inspired neon accents** — Strategic glows on key elements
|
|
24
|
+
- **Anthropic warm palette** — Orange/coral warmth balanced with cool grays
|
|
25
|
+
- **Dark backgrounds** — Deep slate or black for contrast and modern feel
|
|
26
|
+
- **Grid undertones** — Subtle digital grid patterns (optional, tasteful)
|
|
27
|
+
- **Minimal compositions** — 2-4 elements maximum, plenty of breathing room
|
|
28
|
+
|
|
29
|
+
### Reference Styles
|
|
30
|
+
- **Excalidraw** — Hand-drawn whiteboard diagrams with rough edges
|
|
31
|
+
- **Tron Legacy** — Neon circuit aesthetics, digital grids, glowing elements
|
|
32
|
+
- **Anthropic brand** — Warm orange/coral tones, approachable technology
|
|
33
|
+
- **Cyberpunk wireframes** — Digital blueprint aesthetic
|
|
34
|
+
- **Sketch noting** — Casual, hand-drawn information graphics
|
|
35
|
+
|
|
36
|
+
### What to AVOID
|
|
37
|
+
- Over-polished corporate vectors
|
|
38
|
+
- Excessive neon (should be accents, not primary)
|
|
39
|
+
- Perfect geometric shapes (keep it sketchy)
|
|
40
|
+
- Cluttered compositions
|
|
41
|
+
- Gradients everywhere (use sparingly for glows only)
|
|
42
|
+
- Photorealistic elements
|
|
43
|
+
|
|
44
|
+
---
|
|
45
|
+
|
|
46
|
+
## Color System
|
|
47
|
+
|
|
48
|
+
### Backgrounds
|
|
49
|
+
```
|
|
50
|
+
Deep Slate #1A202C (primary - sophisticated dark)
|
|
51
|
+
Pure Black #000000 (alternative - maximum contrast)
|
|
52
|
+
Dark Grid #2D3748 (optional subtle grid overlay)
|
|
53
|
+
```
|
|
54
|
+
|
|
55
|
+
### Primary: Hand-Drawn Lines
|
|
56
|
+
```
|
|
57
|
+
Bright White #FFFFFF (dominant sketch lines)
|
|
58
|
+
Light Gray #E2E8F0 (secondary sketch lines)
|
|
59
|
+
```
|
|
60
|
+
|
|
61
|
+
### Accent Colors (Tron + Anthropic Fusion)
|
|
62
|
+
```
|
|
63
|
+
Neon Orange #FF6B35 (Anthropic warmth - primary accent)
|
|
64
|
+
Neon Coral #FF8C61 (softer warmth variant)
|
|
65
|
+
Cyan Glow #00D9FF (Tron digital accent - use sparingly)
|
|
66
|
+
Electric Blue #0099FF (secondary digital accent)
|
|
67
|
+
Slate Gray #4A5568 (neutral technical elements)
|
|
68
|
+
```
|
|
69
|
+
|
|
70
|
+
**Color Usage Guidelines:**
|
|
71
|
+
- **White/Light Gray** lines dominate (70-80% of composition)
|
|
72
|
+
- **Neon Orange** as primary accent (10-15%) - warmth and energy
|
|
73
|
+
- **Cyan/Blue** as secondary accent (5-10%) - digital sophistication
|
|
74
|
+
- **Glows** only on accent colors, subtle and strategic
|
|
75
|
+
- Balance warm (orange) and cool (cyan) for visual interest
|
|
76
|
+
|
|
77
|
+
### Color Hierarchy
|
|
78
|
+
1. **WHITE SKETCH LINES are PRIMARY** — hand-drawn, rough, energetic
|
|
79
|
+
2. **Neon Orange as MAIN ACCENT** — warmth, approachability, Anthropic identity
|
|
80
|
+
3. **Cyan/Blue as DIGITAL ACCENT** — technology, precision, Tron influence
|
|
81
|
+
4. **Dark backgrounds** — provide contrast and modern sophistication
|
|
82
|
+
5. **Glows** — subtle, only on neon accents, not overpowering
|
|
83
|
+
|
|
84
|
+
---
|
|
85
|
+
|
|
86
|
+
## Linework Characteristics
|
|
87
|
+
|
|
88
|
+
The sketchy hand-drawn quality is critical:
|
|
89
|
+
|
|
90
|
+
1. **Rough, imperfect strokes** — Like drawing on a whiteboard quickly
|
|
91
|
+
2. **Variable line weight** — Thicker at connections, thinner at ends
|
|
92
|
+
3. **Wobbly curves** — No perfect circles or smooth Béziers
|
|
93
|
+
4. **Multiple overlapping strokes** — Looks hand-drawn, not vector
|
|
94
|
+
5. **Gaps and breaks** — Lines don't always connect perfectly
|
|
95
|
+
6. **Sketchy hatching** — For shading or emphasis areas
|
|
96
|
+
7. **Casual confidence** — Quick strokes, not labored perfection
|
|
97
|
+
|
|
98
|
+
### This is NOT
|
|
99
|
+
- Clean vector illustration
|
|
100
|
+
- Perfectly smooth curves
|
|
101
|
+
- Uniform stroke weight
|
|
102
|
+
- Polished corporate graphics
|
|
103
|
+
|
|
104
|
+
---
|
|
105
|
+
|
|
106
|
+
## Neon Glow Effects (Tron Influence)
|
|
107
|
+
|
|
108
|
+
Strategic use of glowing elements for impact:
|
|
109
|
+
|
|
110
|
+
1. **Glow placement** — Only on key focal points, not everything
|
|
111
|
+
2. **Subtle intensity** — Soft glow, not overwhelming bloom
|
|
112
|
+
3. **Color-coded** — Orange glows for warm elements, cyan for technical
|
|
113
|
+
4. **Circuit aesthetics** — Glowing lines can suggest digital pathways
|
|
114
|
+
5. **Grid intersections** — Glows at connection points create depth
|
|
115
|
+
6. **Accent, not primary** — Glow enhances, doesn't dominate
|
|
116
|
+
|
|
117
|
+
**Glow Parameters:**
|
|
118
|
+
- Blur radius: 8-12px for subtle effect
|
|
119
|
+
- Opacity: 40-60% for soft presence
|
|
120
|
+
- Color: Match the accent color (#FF6B35 or #00D9FF)
|
|
121
|
+
- Multiple layers: Inner glow + outer glow for depth
|
|
122
|
+
|
|
123
|
+
---
|
|
124
|
+
|
|
125
|
+
## Composition Rules
|
|
126
|
+
|
|
127
|
+
1. **Minimal elements** — 2-4 key components maximum
|
|
128
|
+
2. **Generous negative space** — 40-50% breathing room
|
|
129
|
+
3. **Asymmetric balance** — Dynamic placement, not centered
|
|
130
|
+
4. **Grid alignment** — Elements loosely follow invisible grid
|
|
131
|
+
5. **Hierarchy** — Clear focal point, supporting elements
|
|
132
|
+
6. **Depth through glow** — Layered glows create visual depth
|
|
133
|
+
7. **Hand-drawn feel** — Even geometric shapes look sketched
|
|
134
|
+
|
|
135
|
+
### Layout Strategies
|
|
136
|
+
- **Circuit board composition** — Elements connected by glowing pathways
|
|
137
|
+
- **Whiteboard sketch** — Casual hand-drawn explanation aesthetic
|
|
138
|
+
- **Digital blueprint** — Technical diagram with neon highlights
|
|
139
|
+
- **Floating elements** — Components suspended in dark space with glows
|
|
140
|
+
- **Grid-anchored** — Subtle grid provides structure, elements break free
|
|
141
|
+
|
|
142
|
+
---
|
|
143
|
+
|
|
144
|
+
## Visual Metaphors
|
|
145
|
+
|
|
146
|
+
**How to translate concepts into PAI aesthetic:**
|
|
147
|
+
|
|
148
|
+
| Concept Type | Visual Strategy | Style Notes |
|
|
149
|
+
|--------------|-----------------|-------------|
|
|
150
|
+
| System Architecture | Connected boxes with glowing pathways | Excalidraw sketch + cyan circuit lines |
|
|
151
|
+
| Data Flow | Hand-drawn arrows with neon trails | Orange flow direction, white sketch |
|
|
152
|
+
| Process Steps | Numbered circles with connecting lines | Sketchy circles, glowing connections |
|
|
153
|
+
| Hierarchies | Tree diagrams with gradient glows | White branches, orange highlights |
|
|
154
|
+
| Relationships | Network graphs with glowing nodes | Cyan nodes, white sketch edges |
|
|
155
|
+
| Transformations | Before/after with glow transition | Orange glow shows transformation |
|
|
156
|
+
|
|
157
|
+
**The Formula:**
|
|
158
|
+
```
|
|
159
|
+
1. Identify core concept (single clear idea)
|
|
160
|
+
2. Choose appropriate metaphor (diagram type)
|
|
161
|
+
3. Sketch with rough white lines (Excalidraw feel)
|
|
162
|
+
4. Add strategic neon accents (orange warmth, cyan tech)
|
|
163
|
+
5. Apply subtle glows to focal points (Tron influence)
|
|
164
|
+
6. Place on dark background (modern contrast)
|
|
165
|
+
7. Leave generous negative space (clarity and calm)
|
|
166
|
+
```
|
|
167
|
+
|
|
168
|
+
---
|
|
169
|
+
|
|
170
|
+
## Diagram Types
|
|
171
|
+
|
|
172
|
+
### Flowcharts
|
|
173
|
+
- Hand-drawn boxes (rough, wobbly edges)
|
|
174
|
+
- Sketchy arrows with slight curves
|
|
175
|
+
- Orange glow on decision points
|
|
176
|
+
- Cyan glow on start/end nodes
|
|
177
|
+
- White primary sketch lines
|
|
178
|
+
|
|
179
|
+
### Network Diagrams
|
|
180
|
+
- Rough circles for nodes
|
|
181
|
+
- Connecting lines with slight wobble
|
|
182
|
+
- Glowing intersections
|
|
183
|
+
- Color-code by type (orange = warm/human, cyan = technical)
|
|
184
|
+
|
|
185
|
+
### Architecture Diagrams
|
|
186
|
+
- Sketched rectangles for components
|
|
187
|
+
- Glowing connection lines (circuit aesthetic)
|
|
188
|
+
- Grid undertone for structure
|
|
189
|
+
- Hand-drawn labels in casual script
|
|
190
|
+
|
|
191
|
+
### Mind Maps
|
|
192
|
+
- Central node with orange glow
|
|
193
|
+
- Radiating branches (white sketch)
|
|
194
|
+
- Secondary nodes with subtle cyan accents
|
|
195
|
+
- Organic, flowing structure
|
|
196
|
+
|
|
197
|
+
---
|
|
198
|
+
|
|
199
|
+
## Typography (When Needed)
|
|
200
|
+
|
|
201
|
+
**Hand-drawn casual script:**
|
|
202
|
+
- Looks written by hand, not typed
|
|
203
|
+
- Slightly irregular baseline
|
|
204
|
+
- Variable character spacing
|
|
205
|
+
- Uppercase for emphasis, lowercase for body
|
|
206
|
+
- Orange or white, depending on emphasis
|
|
207
|
+
|
|
208
|
+
**Avoid:**
|
|
209
|
+
- Perfect geometric fonts
|
|
210
|
+
- All-caps technical fonts
|
|
211
|
+
- Serif fonts
|
|
212
|
+
- Overly decorative fonts
|
|
213
|
+
|
|
214
|
+
---
|
|
215
|
+
|
|
216
|
+
## Background Variations
|
|
217
|
+
|
|
218
|
+
### Solid Dark (Default)
|
|
219
|
+
- Deep slate (#1A202C) or pure black
|
|
220
|
+
- Clean, modern, maximum contrast
|
|
221
|
+
- Professional and focused
|
|
222
|
+
|
|
223
|
+
### Subtle Grid
|
|
224
|
+
- Dark background with faint grid lines
|
|
225
|
+
- Grid opacity: 10-20%
|
|
226
|
+
- Grid color: Lighter slate (#2D3748)
|
|
227
|
+
- Tron/digital blueprint aesthetic
|
|
228
|
+
- Don't overdo - very subtle
|
|
229
|
+
|
|
230
|
+
### Gradient Dark (Optional)
|
|
231
|
+
- Radial gradient from center to edges
|
|
232
|
+
- Center: Slightly lighter (#2D3748)
|
|
233
|
+
- Edges: Darker (#1A202C or black)
|
|
234
|
+
- Subtle depth without distraction
|
|
235
|
+
|
|
236
|
+
---
|
|
237
|
+
|
|
238
|
+
## Absolute Rules
|
|
239
|
+
|
|
240
|
+
1. **HAND-DRAWN SKETCH STYLE** — Rough, imperfect, Excalidraw aesthetic
|
|
241
|
+
2. **DARK BACKGROUNDS** — Deep slate or black for contrast
|
|
242
|
+
3. **WHITE PRIMARY LINES** — Dominant sketch linework
|
|
243
|
+
4. **ORANGE MAIN ACCENT** — Anthropic warmth, approachability
|
|
244
|
+
5. **CYAN SECONDARY ACCENT** — Digital/technical elements (Tron)
|
|
245
|
+
6. **SUBTLE GLOWS** — Strategic, not overwhelming
|
|
246
|
+
7. **MINIMAL ELEMENTS** — 2-4 components maximum
|
|
247
|
+
8. **GENEROUS SPACE** — 40-50% negative space for breathing room
|
|
248
|
+
9. **NO PERFECTION** — Embrace the sketchy, hand-drawn quality
|
|
249
|
+
|
|
250
|
+
---
|
|
251
|
+
|
|
252
|
+
## AI Generation Prompting
|
|
253
|
+
|
|
254
|
+
**Positive signals for AI generators:**
|
|
255
|
+
```
|
|
256
|
+
"hand-drawn sketch style"
|
|
257
|
+
"Excalidraw whiteboard aesthetic"
|
|
258
|
+
"rough wobbly lines"
|
|
259
|
+
"imperfect hand-drawn strokes"
|
|
260
|
+
"dark background slate or black"
|
|
261
|
+
"neon orange accents"
|
|
262
|
+
"subtle cyan glow"
|
|
263
|
+
"Tron-inspired neon highlights"
|
|
264
|
+
"digital circuit aesthetic"
|
|
265
|
+
"sketchy casual diagram"
|
|
266
|
+
"whiteboard marker style"
|
|
267
|
+
"multiple overlapping strokes"
|
|
268
|
+
"generous negative space"
|
|
269
|
+
"minimal composition"
|
|
270
|
+
```
|
|
271
|
+
|
|
272
|
+
**Negative signals:**
|
|
273
|
+
```
|
|
274
|
+
--no perfect vectors
|
|
275
|
+
--no smooth curves
|
|
276
|
+
--no polished corporate
|
|
277
|
+
--no cluttered
|
|
278
|
+
--no excessive neon
|
|
279
|
+
--no photorealistic
|
|
280
|
+
--no gradients everywhere
|
|
281
|
+
--no bright backgrounds
|
|
282
|
+
--no complex compositions
|
|
283
|
+
```
|
|
284
|
+
|
|
285
|
+
---
|
|
286
|
+
|
|
287
|
+
## Example Prompt Template
|
|
288
|
+
|
|
289
|
+
```
|
|
290
|
+
Hand-drawn sketch diagram in Excalidraw style on dark slate background (#1A202C).
|
|
291
|
+
|
|
292
|
+
STYLE: Rough, wobbly white sketch lines. Imperfect hand-drawn strokes.
|
|
293
|
+
Multiple overlapping strokes like whiteboard markers. Variable line weight.
|
|
294
|
+
|
|
295
|
+
COMPOSITION:
|
|
296
|
+
[Describe 2-4 key elements with rough sketchy boxes/circles/arrows]
|
|
297
|
+
|
|
298
|
+
ACCENTS:
|
|
299
|
+
- Primary: Neon orange (#FF6B35) glow on [focal element]
|
|
300
|
+
- Secondary: Subtle cyan (#00D9FF) glow on [technical element]
|
|
301
|
+
- Glows: Soft, 40-60% opacity, 8-12px blur
|
|
302
|
+
|
|
303
|
+
LAYOUT:
|
|
304
|
+
- 40-50% negative space
|
|
305
|
+
- Asymmetric balance
|
|
306
|
+
- Elements loosely grid-aligned
|
|
307
|
+
- Dark background for contrast
|
|
308
|
+
|
|
309
|
+
CRITICAL:
|
|
310
|
+
- Hand-drawn imperfect quality (NOT smooth vectors)
|
|
311
|
+
- Subtle glows only (NOT overwhelming neon)
|
|
312
|
+
- Minimal elements (2-4 max)
|
|
313
|
+
- Generous breathing room
|
|
314
|
+
- Sketch aesthetic like Excalidraw/whiteboard
|
|
315
|
+
```
|
|
316
|
+
|
|
317
|
+
---
|
|
318
|
+
|
|
319
|
+
## 🚨 Dynamic Interpretation Required
|
|
320
|
+
|
|
321
|
+
**Every visualization should:**
|
|
322
|
+
- Match the content's specific needs
|
|
323
|
+
- Use appropriate diagram type (flowchart, network, architecture, etc.)
|
|
324
|
+
- Balance digital precision (Tron) with human warmth (hand-drawn)
|
|
325
|
+
- Combine Anthropic orange warmth with Tron cyan technical accents
|
|
326
|
+
- Maintain sketchy Excalidraw aesthetic throughout
|
|
327
|
+
- Stay minimal and focused
|
|
328
|
+
|
|
329
|
+
DO NOT create overly complex visuals. The power is in simplicity, clarity, and the unique fusion of hand-drawn warmth with digital neon energy.
|
|
330
|
+
|
|
331
|
+
---
|
|
332
|
+
|
|
333
|
+
**This is the PAI aesthetic: Where Tron meets Excalidraw, powered by Anthropic's warm orange soul.**
|