Nu mai dicta furnizorului tău de AI: creează subagenți, abilități și comenzi

De la dependența de prompturi la sisteme inteligente de agenți

Cei mai mulți oameni folosesc încă AI-ul ca pe un teleprompter.

Scriu un prompt. Așteaptă. Primesc un răspuns. Îl copiază și îl lipesc undeva. Apoi o iau de la capăt. Și iar. Fiecare interacțiune pornește de la zero. Fiecare conversație uită ce a fost înainte.

Asta nu e colaborare. E dictare, doar cu mai mulți pași.

În 2026, dacă încă îi dictezi furnizorului tău de AI ca la teleprompter, ratezi schimbarea întreagă care se petrece chiar sub ochii tăi.

Problema teleprompterului

Când folosești AI-ul ca pe un teleprompter, tratezi un sistem potențial autonom ca pe un simplu generator de text de unică folosință. Tiparul arată așa:

1. Scrii un prompt detaliat
2. Aștepți răspunsul
3. Evaluezi manual rezultatul
4. Rafinezi și trimiți din nou promptul
5. Pierzi tot contextul când închizi chatul

Acest model are trei defecte fatale:

Nicio cunoaștere persistentă. Fiecare conversație e o foaie goală. Explici același context iar și iar. AI-ul tău nu îți cunoaște codul, preferințele, constrângerile sau istoricul.

Nicio delegare. Rămâi blocajul. Fiecare decizie, fiecare validare, fiecare pas următor îți cere intervenția. AI-ul așteaptă să-i spui ce să facă mai departe.

Nicio specializare. Folosești o singură interfață generică pentru toate: cod, documentație, design, teste, livrare. Un singur stil de prompt. O singură fereastră de context. O singură conversație care face munca multora.

Modelul teleprompterului vede AI-ul ca pe o unealtă. Dar uneltele nu scalează autonomia. Agenții da.

Ce se schimbă când gândești în agenți

În Claude Code, arhitectura agenților are trei elemente de bază:

• Subagenți: instanțe Claude specializate, cu ferestre de context izolate (~/.claude/agents/)
• Abilități (Skills): module de cunoaștere declanșate automat, cu fișiere SKILL.md (~/.claude/skills/)
• Comenzi: comenzi /slash declanșate de utilizator pentru acțiuni explicite (~/.claude/commands/)

Diferența esențială față de promptingul clasic:

• Abilitățile sunt declanșate automat de Claude, în funcție de context
• Comenzile cer să scrii explicit /command
• Subagenții rulează într-un context separat, cu propriile unelte

Privește diferența:

Abordarea teleprompterului:

„Scrie-mi o componentă card cu o imagine, un titlu, un text de conținut și un buton principal, urmând tiparele sistemului nostru de design și standardele de accesibilitate...”

Abordarea Claude Code:

/generate card --variant=default --with-image=true --with-button=true

Prima e o cerere. A doua invocă o abilitate care știe deja ce este un card, ce cere sistemul tău de design, ce standarde de accesibilitate se aplică și cum să-și valideze singură rezultatul.

Arhitectura: subagenți, abilități și comenzi

Iată structura care înlocuiește modelul teleprompterului:

Nivelul 1: Subagenți

Subagenții sunt fișiere markdown independente din ~/.claude/agents/ care execută munca în paralel. Au propriile ferestre de context și pot invoca abilități.

~/.claude/agents/
├── header-builder.md
├── footer-builder.md
└── dashboard-builder.md

Fiecare fișier de subagent are un frontmatter YAML:

• name: un identificator clar
• description: ce face și când trebuie invocat
• tools: capabilitățile permise (Read, Write, Bash, Grep, Glob)

Exemplu de subagent (header-builder.md):

---
name: header-builder
description: Build complete header components with navigation
tools: Read, Write, Bash, Glob, Grep
---  You are a header component specialist...

Nivelul 2: Abilități

Abilitățile sunt module de cunoaștere declanșate automat. Când îi ceri lui Claude ceva ce se potrivește cu scopul unei abilități, Claude o aplică singur.

~/.claude/skills/
├── card/
│   ├── SKILL.md
│   ├── workflows/
│   │   ├── generate.md
│   │   ├── validate.md
│   │   └── improve.md
│   ├── references/
│   │   └── schema.yml
│   └── scripts/
│       └── validate.py

Aceasta urmează metodologia Atomic Design: atomi, molecule, organisme. Fiecare abilitate e expertă în exact un lucru. Când ai nevoie de un card, abilitatea card se declanșează automat.

Fiecare abilitate cunoaște:

• Schema componentei (props, sloturi, variante)
• Convențiile sistemului tău de design
• Tiparele specifice framework-ului
• Cerințele de accesibilitate WCAG
• Abilitățile înrudite la care poate face referire

Nivelul 3: Comenzi

Comenzile sunt scurtături declanșate de utilizator. Scrii /command ca să le invoci. Trăiesc în fluxurile de lucru ale abilităților sau la nivel global:

~/.claude/skills/card/workflows/
├── generate.md    # /generate card
├── validate.md    # /validate card
├── improve.md     # /improve card
├── document.md    # /document card
├── test.md        # /test card
└── a11y.md        # /a11y card

Comenzile pot invoca subagenți pentru planificare, iar apoi Claude principal se ocupă de execuție. Astfel obții fluxuri de lucru structurate, cu acces complet la unelte.

Exemplu complet: abilitatea Card

Să-ți arăt exact cum funcționează asta, cu o abilitate reală:

Structura abilității

~/.claude/skills/card/
├── SKILL.md           # Core prompt and instructions
├── workflows/         # Slash commands
│   ├── generate.md
│   ├── validate.md
│   ├── improve.md
│   ├── document.md
│   ├── test.md
│   └── a11y.md
├── references/        # Documentation loaded into context
│   └── schema.yml
└── scripts/           # Executable Python/Bash scripts
    └── validate.py

Fișierul SKILL.md

---
name: card
description: Generate and validate card components 
  for any design system with accessibility checks
---  # Card Skill  When user requests card components, this skill 
auto-triggers based on context.
 ## Schema  props:
  title: string
  body: string
  image: { src, alt, width }
  variant: default | horizontal | overlay
 slots:
  header: Custom header content
  footer: Buttons, links
 ## Related Skills  This skill can reference:
- image
- heading
- button
- link
- text

Folosirea comenzilor slash

Generează un card nou:

/generate card \   --variant="default" \   --title="Welcome" \   --with-image=true \   --with-button=true

Validează un card existent:

/validate card \   --file="components/card.jsx"

Verifică conformitatea cu accesibilitatea:

/a11y card --level="AA"

Îmbunătățește experiența pentru un context anume:

/improve card \   --context="e-commerce product listing" \   --focus="conversion"

Ce se întâmplă în spate

Când invoci /generate card, Claude:

1. Declanșează abilitatea card: SKILL.md se încarcă în context
2. Citește schema:  Validează parametrii tăi față de props-urile permise
3. Face referire la alte abilități:  abilitățile image, heading, button își aduc expertiza
4. Rulează fluxul de lucru: se execută workflows/generate.md
5. Se autovalidează: rulează fluxul validate pe propriul rezultat
6. Returnează rezultatul:  oferă componenta plus eventualele avertismente

Abilitatea card nu generează doar markup. Ea orchestrează un sistem de specialiști, fiecare contribuind cu expertiza din domeniul său.

De ce contează: de la constructor la gânditor de sisteme

Modelul teleprompterului te ține în rolul de operator. Modelul abilităților te face arhitect.

Când am trecut de la scrisul de prompturi la proiectarea de abilități, s-au schimbat mai multe lucruri:

Am încetat să mai repet contextul. Fiecare abilitate își cunoaște deja domeniul. Nu mai explic ce e un card de fiecare dată când am nevoie de unul.

Am început să gândesc în compoziție. O pagină nu e un singur prompt, ci o coordonare de organisme, care sunt coordonări de molecule, care sunt coordonări de atomi. Fiecare strat are propria abilitate.

Am delegat validarea. În loc să verific manual fiecare rezultat, comanda /validate verifică structura, comanda /a11y verifică conformitatea WCAG, iar comanda /test rulează verificări automate. Eu revizuiesc excepțiile, nu fiecare rezultat.

Am construit cunoaștere instituțională. Când îmbunătățesc SKILL.md al unei abilități, îmbunătățirea rămâne. Sistemul devine mai inteligent în timp, nu doar în cadrul unei singure conversații.

Asta e diferența dintre a folosi AI și a construi cu AI.

Designul este codul

În munca mea cu sistemele de design am ajuns la un principiu: Designul este codul.

Când token-urile de design, schemele componentelor și configurările agenților sunt aliniate, nu mai există un strat de traducere între ce specifică designerii și ce construiesc dezvoltatorii. Specificația este implementarea.

Iată cum fac agenții asta real:

# The schema IS the source of truth schema:   props:     variant:       type: string
      enum: [primary, secondary, success, danger, warning, info]       default: primary
    size:       type: string
      enum: [sm, md, lg]       default: md
 tokens:   colors:     - --btn-bg
    - --btn-color
    - --btn-border-color

Această schemă nu e doar documentație. Este sursa de adevăr. Agentul generează componente pornind de la ea. Validatorul verifică în raport cu ea. Token-urile de design se raportează la ea. Un singur fișier, mai multe utilizări.

Când un designer actualizează valorile token-urilor în Figma, configurarea agentului se actualizează. Când configurarea agentului se actualizează, componentele generate se actualizează. Designul este codul, pentru că ambele derivă din aceeași schemă.

Cum începi să construiești cu Claude Code

Dacă ești gata să depășești modelul teleprompterului, iată un drum practic:

Pasul 1: Identifică-ți domeniile

Ce zone din munca ta sunt repetitive, guvernate de reguli și dependente de context? Acelea sunt candidate pentru abilități:

• Generarea de cod
• Documentație
• Testare
• Revizuire și validare
• Gestionarea sistemului de design
• Livrare și DevOps

Pasul 2: Creează prima ta abilitate

Începe cu un SKILL.md simplu:

---
name: my-component
description: Generate and validate my-component
---  # My Component Skill  When user asks about my-component, apply these rules...

Pasul 3: Adaugă fluxuri de lucru (comenzi)

Creează cele șase comenzi de bază în workflows/:

Fiecare comandă este un fișier markdown cu instrucțiuni.

Pasul 4: Stabilește referințele între abilități

Abilitățile pot face referire la alte abilități:

## Related Skills  This skill uses:
- image (for card images)
- button (for CTAs)
- heading (for titles)

Cartografiază aceste dependențe. Ierarhia ar trebui să respecte structura naturală a domeniului tău.

Pasul 5: Creează subagenți pentru sarcini complexe

Când ai nevoie de context izolat sau de execuție paralelă, creează un fișier de subagent în ~/.claude/agents/:

---
name: header-builder
description: Build complete header components with navigation, logo, and search
tools: Read, Write, Bash, Glob, Grep
---  You are a header component specialist. When building headers:
1. Check existing header patterns in the codebase
2. Use the nav, button, logo skills for sub-components
3. Ensure responsive design and accessibility

Construirea bibliotecii tale de abilități

Structurează-ți abilitățile după Atomic Design:

Fiecare abilitate:

• Are propria configurare SKILL.md
• Are workflows/ cu comenzi slash
• Are references/ cu documentație
• Are scripts/ pentru automatizare
• Știe la ce alte abilități face referire

Rezultatul e un sistem coerent și scalabil, în care Claude declanșează automat abilitatea potrivită, în funcție de context.

Viitorul este agentic

Brad Frost, creatorul Atomic Design, vorbește despre această schimbare: sistemele de design trebuie să devină infrastructură care poate fi citită de mașini, pentru că agenții AI asamblează deja interfețe din aceleași componente pe care le folosesc echipele umane.

Nu e o prognoză pentru 2030. Se întâmplă acum.

Dacă sistemul tău de design nu poate fi interpretat de un agent, devine moștenire (legacy). Dacă fluxul tău de dezvoltare cere un om care să dea prompt la fiecare pas, nu scalează. Dacă interacțiunile tale cu AI-ul pornesc de la zero de fiecare dată, irosești cunoașterea acumulată.

Modelul teleprompterului era în regulă când AI-ul era o noutate. Nu mai e în regulă când AI-ul e infrastructură.

Nu mai da prompturi. Începe să proiectezi.

Construiește agenți. Dă-le abilități. Lasă-i să se coordoneze.

Viitorul aparține celor care proiectează sisteme, nu celor care scriu scripturi.

Construiesc sisteme de design agentice pentru viitorul dezvoltării web.

Lecturi suplimentare

• The Design Is the Code  Explorarea mea a gândirii automatelor celulare în sistemele de design
• Atomic Design by Brad Frost  Metodologia din spatele ierarhiilor de componente
• Designing Systems That Build Themselves  De la constructor la gânditor de sisteme