Connettore Claude di Gradiently: design con MCP dentro Claude

Per configurare il connettore Gradiently Claude, punta Claude al server MCP ospitato di Gradiently su https://gradiently.design/api/mcp. Nell'app Claude, aggiungilo come connettore personalizzato e accedi a Gradiently. In Claude Code, aggiungilo dal terminale con una chiave API con ambito. In entrambi i casi Claude può cercare i Mark, leggere il tuo brand kit e creare design salvati nel tuo spazio di lavoro che si aprono nello Studio, con ogni parola ancora modificabile.

MCP, il Model Context Protocol, è lo standard aperto che permette a Claude di usare strumenti reali. Cos'è MCP lo spiega in modo semplice, e il protocollo stesso è documentato su modelcontextprotocol.io.

Quale strada scegliere per collegare Claude

Qualunque strada scegli, devi essere proprietario o amministratore dello spazio di lavoro Gradiently. Editor e lettori non possono collegare assistenti né creare chiavi.

Collegare l'app Claude con un connettore personalizzato

1. 1

   Apri le impostazioni dei connettori di Claude

   Aggiungi un connettore personalizzato. Quali piani di Claude consentono i connettori personalizzati lo decide Anthropic, quindi controlla le pagine di aiuto di Claude se non vedi l'opzione. I connettori di Claude spiega la funzione.

2. 2

   Incolla l'indirizzo del server

   Chiamalo Gradiently e usa https://gradiently.design/api/mcp. Scegli l'accesso OAuth.

3. 3

   Accedi e scegli uno spazio di lavoro

   Nella finestra di Gradiently, scegli lo spazio di lavoro in cui Claude deve operare e leggi i permessi sotto Consenti a questo assistente di.

4. 4

   Consenti, poi verifica

   Scegli Consenti connessione. Tornato in Claude, chiedigli di elencare i suoi strumenti Gradiently per conferma.

L'accesso si rinnova da solo fino a 30 giorni, poi ti ricolleghi. Un connettore personalizzato lo puoi usare subito; un inserimento nella directory pubblica di Claude è una cosa a parte e richiede la revisione di Anthropic.

Collegare Claude Code con una chiave API con ambito

Claude Code usa una chiave invece dell'accesso. Creane una in Gradiently sotto Impostazioni › API e agenti: scegli lo spazio di lavoro, dalle un nome che dica dove vive (Claude Code, portatile), spunta cosa può fare e seleziona Crea chiave. La chiave viene mostrata una sola volta, quindi copiala subito nel tuo gestore di password.

export GRADIENTLY_API_KEY="gr_live_…"

claude mcp add --transport http gradiently https://gradiently.design/api/mcp \
  --header "Authorization: Bearer $GRADIENTLY_API_KEY"

Gli altri client che leggono un file JSON di solito accettano lo stesso server e la stessa intestazione. Le Impostazioni mostrano uno snippet pronto sotto Collega un client MCP.

{
  "mcpServers": {
    "gradiently": {
      "url": "https://gradiently.design/api/mcp",
      "headers": { "Authorization": "Bearer gr_live_…" }
    }
  }
}

Scegliere i permessi della chiave

Ogni permesso è un ambito. Una nuova chiave parte con cinque che coprono ogni strumento di design, quindi la maggior parte delle persone non cambia nulla. Aggiungi gli altri solo quando Claude ne ha davvero bisogno.

Cosa può fare Claude una volta collegato

Claude lavora attraverso le stesse azioni che hai nel prodotto. Può cercare nel Mercato per nome, parole di colore o codice; leggere il profilo, la voce e i font del tuo brand; disegnare un design originale, guardare l'immagine renderizzata e rifinirla; compilare uno dei template di Gradiently; cambiare le parole di un design salvato; creare copie ridimensionate; e renderizzare un design in PNG o PDF. Quando Claude compone da solo il design, Gradiently non addebita crediti IA. Se gli chiedi di passare il lavoro al Designer di Gradiently, quello usa crediti come nello Studio.

Claude Code rende facile un tipo particolare di lavoro. Poniamo che tu tenga un blog e voglia un'immagine di anteprima per ogni articolo. Chiedi: «Per ogni articolo in /content, crea un'anteprima link da 1200×630 nel nostro brand con il titolo dell'articolo, poi renderizzale una per una in PNG dentro /public/og.» Claude disegna ogni immagine in Gradiently, la controlla e scrive i file dove il tuo sito li aspetta. La dimensione dell'immagine Open Graph spiega perché 1200×630.

Prompt che funzionano bene con Claude

• «Leggi il profilo del nostro brand, poi crea un post LinkedIn e un post X per annunciare il nostro nuovo ufficio a Bristol.»
• «Trova tre Mark scuri con un materiale seta vicino al verde acqua profondo e dammi i loro codici.»
• «Prendi l'annuncio di ieri e fanne una storia e una miniatura YouTube.»
• «Cambia la data sul poster dell'evento al 14 novembre e renderizzalo in PDF.»

Quanto migliore è il tuo brand kit, meno devi dire in ogni richiesta; la voce del brand per l'IA mostra cosa compilare. Per altre idee sui post social, vedi Claude per i social media, e per il quadro generale, design con Claude.

Tenere al sicuro la connessione

Se una chiave trapela o smetti di usarla, seleziona Revoca accanto a essa in Impostazioni › API e agenti e smette subito di funzionare. Le chiavi si fermano anche quando chi le ha create lascia lo spazio di lavoro o perde il ruolo di amministratore. Usi anche ChatGPT? Gradiently in ChatGPT ha la sua configurazione, e il riferimento completo agli strumenti è nella documentazione per sviluppatori.