STEP 3: Integrazione agency-archivist nelle skill
- agency-visual-generator/SKILL.md:
- Lettura catalogo risorse prima di generare asset
- Richiesta proattiva risorse mancanti (@agency-archivist)
- Recupero logo e immagini da catalog.md
- agency-design-system/SKILL.md:
- Verifica brand assets (logo, colori, font) prima di iniziare
- Richiesta risorse mancanti con requisiti specifici
- Integrazione resource_types.md nelle references
- agency-web-developer/SKILL.md:
- Lettura catalogo per immagini sito (logo, hero, team, favicon)
- Richiesta asset mancanti prima di sviluppare
- Collegamento asset da assets/ a website/assets/
- Integrazione resource_types.md e flusso consigliato
Pattern comune per tutte le skill:
1. Leggi clients/{client}/assets/catalog.md
2. Cerca risorse per tag/tipo
3. Se mancano: FERMATI, tagga @agency-archivist, specifica requisiti
4. Attendi sblocco dopo upload e re-scan
This commit is contained in:
AgentePotente
parent
b1f3ba033e
commit
ea5b68beb9
3 changed files with 98 additions and 27 deletions
|
|
@ -1,6 +1,6 @@
|
|||
---
|
||||
name: agency-design-system
|
||||
description: "Creare design system coerente con tokens, components e page layouts. Usare quando: (1) nuovo progetto needs UI system, (2) standardizzare design, (3) creare component library. Output: Design tokens, components library, page layouts, design system doc."
|
||||
description: "Creare design system coerente con tokens, components e page layouts. PRIMA di iniziare: leggi clients/{client}/assets/catalog.md per logo e brand assets. Se mancano, richiedi @agency-archivist. Usare quando: (1) nuovo progetto needs UI system, (2) standardizzare design, (3) creare component library. Output: Design tokens, components library, page layouts, design system doc."
|
||||
---
|
||||
|
||||
# Agency Visual Designer — Design System
|
||||
|
|
@ -29,29 +29,48 @@ Traduce la direzione creativa in un design system coerente e riutilizzabile.
|
|||
|
||||
## Processo
|
||||
|
||||
### Fase 1: Design Tokens
|
||||
### Fase 1: Risorse e Design Tokens
|
||||
|
||||
**Obiettivo:** Definire variabili di design di base.
|
||||
**Obiettivo:** Verificare brand assets e definire variabili di design.
|
||||
|
||||
**Azioni:**
|
||||
|
||||
1. **Typography:**
|
||||
1. **LEGGI CATALOGO RISORSE:**
|
||||
- Apri `clients/{client}/assets/catalog.md`
|
||||
- Cerca:
|
||||
- Logo: `#logo`, `#brand` → Path per UI
|
||||
- Colori: `#brand`, `#guidelines` → PDF con palette
|
||||
- Font: `#brand`, `#guidelines` → Specifiche typography
|
||||
|
||||
2. **Se risorse mancanti:**
|
||||
- **FERMATI** e segnala: "🔒 Bloccato: servono brand assets"
|
||||
- Tagga: @agency-archivist
|
||||
- Specifica:
|
||||
```
|
||||
Per creare design system, servono:
|
||||
- [ ] Logo aziendale (PNG/SVG)
|
||||
- [ ] Brand colors (codici HEX o documento guidelines)
|
||||
- [ ] Font (nomi o file font)
|
||||
```
|
||||
- **Attendi** che archivist carichi e sblocchi
|
||||
|
||||
3. **Typography:**
|
||||
- Font family (primary, secondary)
|
||||
- Font sizes (H1-H6, body, caption)
|
||||
- Font weights
|
||||
- Line heights
|
||||
|
||||
2. **Spacing:**
|
||||
4. **Spacing:**
|
||||
- Scala modulare (es. 4/8/16/24/32/48/64)
|
||||
- Section padding (desktop/mobile)
|
||||
|
||||
3. **Colors:**
|
||||
5. **Colors:**
|
||||
- Primary (brand)
|
||||
- Secondary (accents)
|
||||
- Neutrals (text, backgrounds)
|
||||
- Semantic (success, warning, error)
|
||||
|
||||
4. **Breakpoints:**
|
||||
6. **Breakpoints:**
|
||||
- Mobile (<768px)
|
||||
- Tablet (768-1024px)
|
||||
- Desktop (>1024px)
|
||||
|
|
@ -230,6 +249,9 @@ Traduce la direzione creativa in un design system coerente e riutilizzabile.
|
|||
- [design_patterns.md](../../references/design_patterns.md) — UI patterns
|
||||
- [qa_visual.md](../../references/qa_visual.md) — QA checklist
|
||||
|
||||
### Resources & Assets
|
||||
- [resource_types.md](../agency-archivist/references/resource_types.md) — Tipologie risorse e use case
|
||||
|
||||
### Technical Implementation (Handoff)
|
||||
**Per handoff a developer o implementazione diretta:**
|
||||
- [html_semantics.md](../agency-web-developer/references/html_semantics.md) — Semantic HTML structure
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
---
|
||||
name: agency-visual-generator
|
||||
description: "Generare asset visuali (card, carousel, thumbnail) per social e YouTube basati su content approvato e style guide. Usare quando: (1) post social needs visual, (2) YouTube thumbnail, (3) carousel Instagram/LinkedIn. Output: Asset PNG/webp in cartella client, QA visual compilato."
|
||||
description: "Generare asset visuali (card, carousel, thumbnail) per social e YouTube basati su content approvato e style guide. Usare quando: (1) post social needs visual, (2) YouTube thumbnail, (3) carousel Instagram/LinkedIn. PRIMA di generare: leggi clients/{client}/assets/catalog.md per risorse disponibili. Se mancano risorse, richiedi @agency-archivist. Output: Asset PNG/webp in cartella client, QA visual compilato."
|
||||
---
|
||||
|
||||
# Agency Visual Generator — Asset Visuali
|
||||
|
|
@ -50,22 +50,39 @@ Genera asset visuali platform-ready basati su content approvato e style guide.
|
|||
|
||||
---
|
||||
|
||||
### Fase 2: Style Guide Check
|
||||
### Fase 2: Risorse e Style Guide Check
|
||||
|
||||
**Obiettivo:** Caricare o creare style guide.
|
||||
**Obiettivo:** Verificare risorse disponibili e caricare style guide.
|
||||
|
||||
**Azioni:**
|
||||
|
||||
1. Cerca `clients/{client}/design/style_guide.md` o `clients/{client}/assets/brand/style_guide.md`
|
||||
1. **LEGGI CATALOGO RISORSE:**
|
||||
- Apri `clients/{client}/assets/catalog.md`
|
||||
- Cerca risorse per il task:
|
||||
- Logo: `#logo`, `#brand`
|
||||
- Foto prodotto: `#prodotto`, `#product`
|
||||
- Immagini team: `#team`, `#people`
|
||||
- Sfondi: `#stock`, `#background`
|
||||
|
||||
2. Se esiste:
|
||||
- Carica colori (hex)
|
||||
- Carica font (family, weights)
|
||||
- Carica logo (se disponibile)
|
||||
2. **Se risorse mancanti:**
|
||||
- **FERMATI** e segnala: "🔒 Bloccato: servono [descrizione]"
|
||||
- Tagga: @agency-archivist
|
||||
- Specifica requisiti:
|
||||
```
|
||||
Per generare [tipo asset], servono:
|
||||
- [ ] Logo aziendale (PNG trasparente, minimo 512x512px)
|
||||
- [ ] Foto prodotto (sfondo bianco, minimo 1000x1000px)
|
||||
```
|
||||
- **Attendi** che archivist carichi e sblocchi
|
||||
|
||||
3. Se NON esiste:
|
||||
- Crea draft style guide in `clients/{client}/assets/brand/style_guide.md`
|
||||
- Chiedi approvazione prima di procedere
|
||||
3. **Carica style guide:**
|
||||
- Cerca `clients/{client}/design/style_guide.md` o `clients/{client}/assets/brand/style_guide.md`
|
||||
- Se esiste: Carica colori, font, logo path
|
||||
- Se NON esiste: Crea draft e chiedi approvazione
|
||||
|
||||
4. **Recupera logo da catalogo:**
|
||||
- Usa path da `catalog.md` (es. `assets/images/logo/logo_primary.png`)
|
||||
- Se multiplo: Scegli quello primario o chiedi conferma
|
||||
|
||||
**Template Style Guide:**
|
||||
|
||||
|
|
@ -225,6 +242,7 @@ Genera asset visuali platform-ready basati su content approvato e style guide.
|
|||
- [qa_visual.md](../../references/qa_visual.md) — QA checklist
|
||||
- [platform_patterns.md](../../references/platform_patterns.md) — Pattern per piattaforma
|
||||
- [publishing_gates.md](../../references/publishing_gates.md) — Gate pre-publish
|
||||
- [resource_types.md](../agency-archivist/references/resource_types.md) — Tipologie risorse e use case
|
||||
|
||||
---
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
---
|
||||
name: agency-web-developer
|
||||
description: "Sviluppare siti web statici o landing page partendo da copy e design system. Usare quando: (1) costruire sito da sitemap + copy, (2) creare landing page, (3) implementare design in HTML/CSS/JS. Output: Sito completo con HTML semantico, CSS (Bootstrap o custom), JS (jQuery + GSAP)."
|
||||
description: "Sviluppare siti web statici o landing page partendo da copy e design system. PRIMA di sviluppare: leggi clients/{client}/assets/catalog.md per immagini e asset. Se mancano, richiedi @agency-archivist. Usare quando: (1) costruire sito da sitemap + copy, (2) creare landing page, (3) implementare design in HTML/CSS/JS. Output: Sito completo con HTML semantico, CSS (Bootstrap o custom), JS (jQuery + GSAP)."
|
||||
---
|
||||
|
||||
# Agency Web Developer — Sviluppo Siti Web Statici
|
||||
|
|
@ -31,14 +31,36 @@ Trasforma copy e design system in siti web funzionanti con HTML semantico, CSS e
|
|||
|
||||
## Processo
|
||||
|
||||
### Fase 1: Setup Struttura Progetto
|
||||
### Fase 1: Risorse e Setup Struttura Progetto
|
||||
|
||||
**Obiettivo:** Creare directory structure per il sito.
|
||||
**Obiettivo:** Verificare asset disponibili e creare directory structure.
|
||||
|
||||
**Azioni:**
|
||||
|
||||
1. Crea cartella `clients/{client}/website/`
|
||||
2. Crea sottocartelle:
|
||||
1. **LEGGI CATALOGO RISORSE:**
|
||||
- Apri `clients/{client}/assets/catalog.md`
|
||||
- Cerca:
|
||||
- Logo: `#logo` → Per header/footer
|
||||
- Immagini hero: `#hero`, `#sfondo`, `#prodotto` → Per homepage
|
||||
- Immagini pagine: `#team`, `#ufficio`, `#prodotto` → Per pagine interne
|
||||
- Favicon: `#icon`, `#favicon` → Per `<head>`
|
||||
|
||||
2. **Se risorse mancanti:**
|
||||
- **FERMATI** e segnala: "🔒 Bloccato: servono immagini per il sito"
|
||||
- Tagga: @agency-archivist
|
||||
- Specifica:
|
||||
```
|
||||
Per sviluppare il sito, servono:
|
||||
- [ ] Logo (PNG/SVG, per header)
|
||||
- [ ] Immagine hero (1920x1080, per homepage)
|
||||
- [ ] Foto team/prodotto (per pagine interne)
|
||||
- [ ] Favicon (32x32 o 64x64)
|
||||
```
|
||||
- **Attendi** che archivist carichi e sblocchi
|
||||
|
||||
3. **Crea cartella `clients/{client}/website/`**
|
||||
|
||||
4. **Crea sottocartelle:**
|
||||
- `index.html` (homepage)
|
||||
- `pages/` (altre pagine HTML)
|
||||
- `css/` (stylesheet)
|
||||
|
|
@ -47,13 +69,17 @@ Trasforma copy e design system in siti web funzionanti con HTML semantico, CSS e
|
|||
- `assets/img/`
|
||||
- `assets/fonts/`
|
||||
|
||||
3. Inizializza file base:
|
||||
5. **Collega asset da archivio:**
|
||||
- Crea symlink o copia da `clients/{client}/assets/` a `website/assets/`
|
||||
- Oppure usa path relativi: `../assets/images/logo/logo.png`
|
||||
|
||||
6. **Inizializza file base:**
|
||||
- `css/main.css` (o `css/bootstrap.min.css` + `css/custom.css`)
|
||||
- `js/main.js`
|
||||
- `assets/` (vuoto, pronto per asset)
|
||||
|
||||
**Output:**
|
||||
- Struttura directory pronta
|
||||
- Asset collegati o copiati
|
||||
|
||||
---
|
||||
|
||||
|
|
@ -333,9 +359,14 @@ $(document).ready(function() {
|
|||
- [conversion_patterns.md](../references/conversion_patterns.md) — CTA hierarchy, forms, friction reducers
|
||||
- [layout_systems.md](../references/layout_systems.md) — Grid, spacing, vertical rhythm
|
||||
|
||||
### Resources & Assets
|
||||
- [resource_types.md](../agency-archivist/references/resource_types.md) — Tipologie risorse e use case
|
||||
|
||||
**Flusso consigliato:**
|
||||
1. Leggi pattern UX da shared references (COSA fare)
|
||||
2. Implementa con technical references (COME codificare)
|
||||
1. Leggi catalogo risorse (`assets/catalog.md`)
|
||||
2. Verifica asset disponibili o richiedi ad @agency-archivist
|
||||
3. Leggi pattern UX da shared references (COSA fare)
|
||||
4. Implementa con technical references (COME codificare)
|
||||
|
||||
---
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue