Handoff package · CoWork dev

SET — design tokens, surface list, build sequence.

Tutto il design system di SET, l'inventory delle surface costruite finora, gli endpoint, e l'ordine consigliato di build per il team CoWork.

01 — Design tokens

Tutti i token in :root dei file HTML. Cambiare 6 variabili ri-brandizza tutto il sistema.

Color

--bg#0B0B0A

--surface#131311

--border#24221E

--muted#5E5B54

--fg#A8A59E

--accent#9CFF00

Type

Token	Family	Use
--font-display	Geist 300–900	Hero, titles, body, UI labels
--font-mono	Geist Mono 400–600	Indices, codes, metadata, pills

Geist self-host con woff2. Display weight (700) preloaded. Feature settings: "ss01", "cv11" per stilistiche.

Spacing & geometry

Container: 1320px desktop, 880px docs, gutter clamp(20px, 4.5vw, 64px)
Radius: 2px (default), 6px (lg) — preferenza per hard edges
Ease: cubic-bezier(0.16, 1, 0.3, 1)
Vertical rhythm: 80px sezioni desktop, 104px desktop large

02 — Surface inventory · multi-segment

v3.2: prodotto riposizionato da "agency tool" a "sistema per electronic music industry". 4 segmenti ICP. Surface aggiunte: festival-dashboard + club-dashboard.

Public

Surface	Segmento	Status	File
Landing v3	All — 4 segments	P0 · Live	`set-landing-v3.html`
Artist EPK (Peggy Gou)	Agency / Label	P1 · Live	`artist-sample.html`
Festival lineup page	Festival	P1 · Coming v3.3	`festival-sample.html` (TBD)
Club residents page	Club	P1 · Coming v3.3	`club-sample.html` (TBD)

Platform · operator surfaces

Surface	Segmento	Status	File
Agency dashboard	Agency / Label	P1 · Mockup	`platform/agency-dashboard.html`
Festival dashboard	Festival	P2 · Mockup	`platform/festival-dashboard.html`
Club dashboard	Club	P2 · Mockup	`platform/club-dashboard.html`
Artist editor (desktop)	All	P2 · Mockup	`platform/artist-editor.html`

Mobile + Index

Surface	Segmento	Status	File
Artist app	Agency / Label	P2 · Mockup	`app/artist-app.html`
Hub navigabile	Internal	—	`index.html` · `set-prototype-hub.html`

Data model expansion (M3–M6 · v3.2)

Festival/Club tier richiedono event, venue, lineup_slot come entità pluggable parallele all'artist. Migration plan in 17-set-product-spec.md. Tech spike 60h budget (assumption A6).

03 — Stack architecture

frontend            Next.js 14 (App Router) + RSC + Server Actions
                    TypeScript · Tailwind disabled — use raw CSS w/ tokens
                    Geist + Geist Mono self-hosted

backend             Next.js API routes (Edge runtime where possible)
db                  Postgres (Neon) · Drizzle ORM
cache               Vercel ISR (60s) for public EPK · KV for sessions
media               Cloudinary fetch → WebP/AVIF
auth                Clerk · roles: agency-owner, booking-manager, artist
ai                  Claude Haiku 4.5 via window.claude.complete on artifacts;
                    server-side proxy with API key for editor AI rewrite

mobile              Capacitor wrap of editor PWA → iOS + Android

Important

Design tokens MUST stay as CSS variables in :root. White-label clients change 6 values per agency. No hardcoded colors anywhere else.

04 — Build sequence (12 weeks)

Wk	Milestone	Output
01-02	Bootstrap	Next.js + Postgres + Clerk auth + design system tokens + Cloudinary config
03-04	Editor MVP	Section block editor + autosave + version snapshots + publish flow
05-06	Public EPK	SSG + ISR render at `set.fm/[agency]/[artist]` · OG image gen · QR
07-08	Analytics + inquiries	Event tracking + inquiry routing + agency-view fee gate
09-10	Integrations	Spotify · SoundCloud · Bandcamp · Google Calendar OAuth
11	Dashboard + perms	Multi-roster overview + permission control + Gigwell webhook
12	Mobile + polish	Capacitor wrap + bug bash + onboarding flow + first client launch

05 — Hand-off contents (this folder)

set-prototype-hub.html — navigable hub (entry point)
set-landing-v3.html — public marketing landing
artist-sample.html — sample EPK NIRA
platform/agency-dashboard.html — agency desktop dashboard
platform/artist-editor.html — 3-pane editor
app/artist-app.html — iOS/Android mockup
docs/api-spec.md — REST API blueprint
docs/handoff.html — this document

06 — Open questions for CoWork

Capacitor wrap (web → iOS+Android) vs nativo: ok 1 codebase per ridurre ongoing cost?
Hosting: Vercel Pro o Hetzner+self-host per ridurre costi a maturity?
Mailing: Resend o Postmark per booking notifications?
Stripe per setup fee + recurring mensile, ok partire da Stripe Billing direttamente?
Sub-dominio strategy: set.fm/agency/artist vs agency.set.fm/artist?

07 — Contact

Per chiarimenti design / brand: Studio Natale — hello@studionatale.it