1# Site Template
2 
3Use these templates when setting up a new project for the build loop.
4 
5## SITE.md Template
6 
7```markdown
8# Project Vision & Constitution
9 
10> **AGENT INSTRUCTION:** Read this file before every iteration. It serves as the project's "Long-Term Memory."
11 
12## 1. Core Identity
13* **Project Name:** [Your project name]
14* **Stitch Project ID:** [Your Stitch project ID]
15* **Mission:** [What the site achieves]
16* **Target Audience:** [Who uses this site]
17* **Voice:** [Tone and personality descriptors]
18 
19## 2. Visual Language
20*Reference these descriptors when prompting Stitch.*
21 
22* **The "Vibe" (Adjectives):**
23    * *Primary:* [Main aesthetic keyword]
24    * *Secondary:* [Supporting aesthetic]
25    * *Tertiary:* [Additional flavor]
26 
27## 3. Architecture & File Structure
28* **Root:** `site/public/`
29* **Asset Flow:** Stitch generates to `queue/` → Validate → Move to `site/public/`
30* **Navigation Strategy:** [How nav works]
31 
32## 4. Live Sitemap (Current State)
33*Update this when a new page is successfully merged.*
34 
35* [x] `index.html` - [Description]
36* [ ] `about.html` - [Description]
37 
38## 5. The Roadmap (Backlog)
39*Pick the next task from here if available.*
40 
41### High Priority
42- [ ] [Task description]
43- [ ] [Task description]
44 
45### Medium Priority
46- [ ] [Task description]
47 
48## 6. Creative Freedom Guidelines
49*When the backlog is empty, follow these guidelines to innovate.*
50 
511. **Stay On-Brand:** New pages must fit the established vibe
522. **Enhance the Core:** Support the site mission
533. **Naming Convention:** Use lowercase, descriptive filenames
54 
55### Ideas to Explore
56*Pick one, build it, then REMOVE it from this list.*
57 
58- [ ] `stats.html` - [Description]
59- [ ] `settings.html` - [Description]
60 
61## 7. Rules of Engagement
621. Do not recreate pages in Section 4
632. Always update `next-prompt.md` before completing
643. Consume ideas from Section 6 when you use them
65```
66 
67## DESIGN.md Template
68 
69Generate this using the `design-md` skill from an existing Stitch screen, or create manually:
70 
71```markdown
72# Design System: [Project Name]
73**Project ID:** [Stitch Project ID]
74 
75## 1. Visual Theme & Atmosphere
76[Describe mood, density, aesthetic philosophy]
77 
78## 2. Color Palette & Roles
79- **[Descriptive Name]** (#hexcode) – [Functional role]
80- **[Descriptive Name]** (#hexcode) – [Functional role]
81 
82## 3. Typography Rules
83[Font family, weights, sizes, spacing]
84 
85## 4. Component Stylings
86* **Buttons:** [Shape, color, behavior]
87* **Cards:** [Corners, background, shadows]
88* **Inputs:** [Stroke, background, focus states]
89 
90## 5. Layout Principles
91[Whitespace strategy, margins, grid alignment]
92 
93## 6. Design System Notes for Stitch Generation
94**Copy this block into every baton prompt:**
95 
96**DESIGN SYSTEM (REQUIRED):**
97- Platform: [Web/Mobile], [Desktop/Mobile]-first
98- Theme: [Dark/Light], [descriptors]
99- Background: [Description] (#hex)
100- Primary Accent: [Description] (#hex)
101- Text Primary: [Description] (#hex)
102- Font: [Description]
103- Layout: [Description]
104```
105