AI வழங்குநருக்கு டெலிபிராம்ப்டர் வேலை செய்வதை நிறுத்துங்கள்: Subagents, Skills & Commands உருவாக்குங்கள்
Prompt சார்பிலிருந்து அறிவார்ந்த agent அமைப்புகளை நோக்கி
பெரும்பாலானோர் இன்னும் AI-யை ஒரு டெலிபிராம்ப்டர் போலவே பயன்படுத்துகிறார்கள்.
ஒரு prompt எழுதுகிறார்கள். காத்திருக்கிறார்கள். பதில் வருகிறது. அதை எங்கோ நகலெடுத்து ஒட்டுகிறார்கள். மறுபடியும் அதையே செய்கிறார்கள். ஒவ்வொரு உரையாடலும் பூஜ்யத்திலிருந்து தொடங்குகிறது. முந்தையதை ஒவ்வொரு உரையாடலும் மறந்துவிடுகிறது.
இது கூட்டுழைப்பு அல்ல. கூடுதல் படிகளுடன் கூடிய சொல்லெழுதுதல் (dictation) மட்டுமே.
2026-ல் நீங்கள் இன்னும் உங்கள் AI வழங்குநருக்கு டெலிபிராம்ப்டர் வேலை செய்துகொண்டிருந்தால், உங்கள் காலடியில் நடந்துகொண்டிருக்கும் மாபெரும் மாற்றத்தை நீங்கள் தவறவிடுகிறீர்கள்.
டெலிபிராம்ப்டர் பிரச்சினை
AI-யை டெலிபிராம்ப்டராகப் பயன்படுத்தும்போது, தானாகச் செயல்படக்கூடிய ஒரு அமைப்பை ஒரே முறை உரை உருவாக்கும் கருவியாக நடத்துகிறீர்கள். அதன் வடிவம் இதுதான்:
- விரிவான prompt ஒன்றை எழுதுகிறீர்கள்
- பதிலுக்காகக் காத்திருக்கிறீர்கள்
- வெளியீட்டை நீங்களே கைமுறையாக மதிப்பிடுகிறீர்கள்
- திருத்தி மீண்டும் prompt செய்கிறீர்கள்
- அரட்டையை மூடியதும் எல்லா context-ஐயும் இழக்கிறீர்கள்
இந்த மாதிரியில் மூன்று கடுமையான குறைபாடுகள் உள்ளன:
நிலையான அறிவு இல்லை. ஒவ்வொரு உரையாடலும் வெற்றுப் பலகை. அதே context-ஐ திரும்பத் திரும்ப விளக்குகிறீர்கள். உங்கள் குறியீட்டுத் தளம், விருப்பங்கள், கட்டுப்பாடுகள், வரலாறு எதுவும் உங்கள் AI-க்குத் தெரியாது.
பணி ஒப்படைப்பு இல்லை. தடைக்கல் நீங்கள்தான். ஒவ்வொரு முடிவுக்கும், சரிபார்ப்புக்கும், அடுத்த படிக்கும் உங்கள் உள்ளீடு வேண்டும். அடுத்து என்ன செய்வது என்று நீங்கள் சொல்லும் வரை AI காத்திருக்கிறது.
சிறப்புத்துவம் இல்லை. குறியீடு, ஆவணப்படுத்தல், வடிவமைப்பு, சோதனை, வெளியீடு என எல்லாவற்றுக்கும் ஒரே பொதுவான இடைமுகம். ஒரே prompt பாணி. ஒரே context window. பலரின் வேலையை ஒரே உரையாடல் செய்ய முயல்கிறது.
டெலிபிராம்ப்டர் மாதிரி AI-யை ஒரு கருவியாகவே பார்க்கிறது. ஆனால் கருவிகள் தன்னாட்சியை அளவிடுவதில்லை. Agents அதைச் செய்கின்றன.
Agents என்று சிந்திக்கும்போது என்ன மாறுகிறது
Claude Code-ல் agent கட்டமைப்பு மூன்று அடிப்படை அலகுகளால் ஆனது:
- Subagents: தனித்த context window கொண்ட சிறப்பு Claude நிகழ்வுகள் (~/.claude/agents/)
- Skills: SKILL.md கோப்புகளுடன் தானாகத் தூண்டப்படும் அறிவுத் தொகுதிகள் (~/.claude/skills/)
- Commands: வெளிப்படையான செயல்களுக்குப் பயனர் தூண்டும் /slash கட்டளைகள் (~/.claude/commands/)
வழக்கமான prompting-இலிருந்து முக்கிய வேறுபாடு:
- Skills context அடிப்படையில் Claude-ஆல் தானாகத் தூண்டப்படுகின்றன
- Commands நீங்களே
/commandஎன்று வெளிப்படையாக உள்ளிட வேண்டும் - Subagents தங்களுக்கென்று கருவிகளுடன் தனி context-ல் இயங்குகின்றன
வேறுபாட்டைப் பாருங்கள்:
டெலிபிராம்ப்டர் அணுகுமுறை:
"எங்கள் design system முறைகளையும் அணுகல்தன்மைத் தரங்களையும் பின்பற்றி, ஒரு படம், தலைப்பு, உடல் உரை, முதன்மைப் பொத்தான் கொண்ட card component எழுதித் தா..."
Claude Code அணுகுமுறை:
/generate card --variant=default --with-image=true --with-button=trueமுதலாவது ஒரு கோரிக்கை. இரண்டாவது, card என்றால் என்ன, உங்கள் design system எதைக் கோருகிறது, எந்த அணுகல்தன்மைத் தரங்கள் பொருந்தும், தன் வெளியீட்டை எப்படிச் சரிபார்ப்பது என்பதெல்லாம் ஏற்கனவே அறிந்த ஒரு skill-ஐ இயக்குகிறது.
கட்டமைப்பு: Subagents, Skills & Commands
டெலிபிராம்ப்டர் மாதிரிக்குப் பதிலாக வரும் அமைப்பு இதோ:
நிலை 1: Subagents
Subagents என்பவை ~/.claude/agents/-ல் உள்ள தனித்த markdown கோப்புகள்; அவை பணிகளை இணையாகச் செய்கின்றன. அவற்றுக்கு சொந்த context window உண்டு, skills-ஐயும் அழைக்கலாம்.
~/.claude/agents/
├── header-builder.md
├── footer-builder.md
└── dashboard-builder.mdஒவ்வொரு subagent கோப்புக்கும் YAML frontmatter உண்டு:
- name: தெளிவான அடையாளப் பெயர்
- description: அது என்ன செய்கிறது, எப்போது அழைக்க வேண்டும்
- tools: அனுமதிக்கப்பட்ட திறன்கள் (Read, Write, Bash, Grep, Glob)
எடுத்துக்காட்டு 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...நிலை 2: Skills
Skills என்பவை தானாகத் தூண்டப்படும் அறிவுத் தொகுதிகள். ஒரு skill-இன் நோக்கத்துடன் பொருந்தும் ஒன்றை Claude-இடம் கேட்கும்போது, Claude அதைத் தானாகப் பயன்படுத்துகிறது.
~/.claude/skills/
├── card/
│ ├── SKILL.md
│ ├── workflows/
│ │ ├── generate.md
│ │ ├── validate.md
│ │ └── improve.md
│ ├── references/
│ │ └── schema.yml
│ └── scripts/
│ └── validate.pyஇது Atomic Design முறையைப் பின்பற்றுகிறது: atoms, molecules, organisms. ஒவ்வொரு skill-உம் சரியாக ஒரே விஷயத்தில் நிபுணர். card தேவைப்படும்போது, card skill தானாகத் தூண்டப்படும்.
ஒவ்வொரு skill-உம் அறிந்திருப்பவை:
- component-இன் schema (props, slots, variants)
- உங்கள் design system மரபுகள்
- framework சார்ந்த முறைகள்
- WCAG அணுகல்தன்மைத் தேவைகள்
- அது குறிப்பிடக்கூடிய தொடர்புடைய skills
நிலை 3: Commands
Commands என்பவை பயனர் தூண்டும் குறுக்குவழிகள். அவற்றை இயக்க /command என்று உள்ளிடுகிறீர்கள். அவை skill workflows-லோ உலகளாவிய அளவிலோ இருக்கும்:
~/.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 cardCommands திட்டமிடலுக்காக subagents-ஐ அழைக்கலாம்; பிறகு செயல்படுத்தலை முதன்மை Claude கையாளும். இது முழு கருவி அணுகலுடன் கட்டமைக்கப்பட்ட workflows-ஐ உங்களுக்குத் தருகிறது.
முழு எடுத்துக்காட்டு: Card Skill
ஒரு உண்மையான skill மூலம் இது எப்படிச் செயல்படுகிறது என்பதைக் காட்டுகிறேன்:
Skill அமைப்பு
~/.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.pySKILL.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
- textSlash Commands பயன்படுத்துதல்
புதிய card உருவாக்க:
/generate card \ --variant="default" \ --title="Welcome" \ --with-image=true \ --with-button=trueஏற்கனவே உள்ள card-ஐச் சரிபார்க்க:
/validate card \ --file="components/card.jsx"அணுகல்தன்மை இணக்கத்தைச் சோதிக்க:
/a11y card --level="AA"குறிப்பிட்ட சூழலுக்கு UX-ஐ மேம்படுத்த:
/improve card \ --context="e-commerce product listing" \ --focus="conversion"திரைக்குப் பின்னால் என்ன நடக்கிறது
/generate card என்று இயக்கும்போது, Claude:
- card skill-ஐத் தூண்டுகிறது: SKILL.md context-ல் ஏற்றப்படுகிறது
- schema-வைப் படிக்கிறது: உங்கள் அளவுருக்களை அனுமதிக்கப்பட்ட props-உடன் சரிபார்க்கிறது
- பிற skills-ஐக் குறிப்பிடுகிறது: image, heading, button skills தங்கள் நிபுணத்துவத்தை வழங்குகின்றன
- workflow-ஐ இயக்குகிறது: workflows/generate.md செயல்படுகிறது
- தன்னைத்தானே சரிபார்க்கிறது: தன் வெளியீட்டின் மீதே validate workflow-ஐ இயக்குகிறது
- முடிவைத் தருகிறது: component-ஐயும் எச்சரிக்கைகள் இருந்தால் அவற்றையும் வழங்குகிறது
card skill வெறும் markup-ஐ உருவாக்குவதில்லை. ஒவ்வொன்றும் தத்தம் துறை நிபுணத்துவத்தை வழங்கும் நிபுணர்களின் ஓர் அமைப்பையே அது ஒருங்கிணைக்கிறது.
இது ஏன் முக்கியம்: கட்டுபவரிலிருந்து அமைப்புச் சிந்தனையாளராக
டெலிபிராம்ப்டர் மாதிரி உங்களை இயக்குபவராகவே வைத்திருக்கிறது. skill மாதிரி உங்களைக் கட்டிடக் கலைஞராக்குகிறது.
prompts எழுதுவதிலிருந்து skills வடிவமைப்பதற்கு மாறியபோது, பல விஷயங்கள் மாறின:
context-ஐத் திரும்பச் சொல்வதை நிறுத்தினேன். ஒவ்வொரு skill-க்கும் தன் துறை ஏற்கனவே தெரியும். card தேவைப்படும் ஒவ்வொரு முறையும் card என்றால் என்ன என்று விளக்குவதில்லை.
கூட்டமைப்பில் சிந்திக்கத் தொடங்கினேன். ஒரு பக்கம் என்பது ஒரே prompt அல்ல; அது organisms-இன் ஒருங்கிணைப்பு, அவை molecules-இன் ஒருங்கிணைப்பு, அவை atoms-இன் ஒருங்கிணைப்பு. ஒவ்வொரு அடுக்குக்கும் தனக்கான skill உண்டு.
சரிபார்ப்பை ஒப்படைத்தேன். ஒவ்வொரு வெளியீட்டையும் கைமுறையாக மதிப்பாய்வு செய்வதற்குப் பதிலாக, /validate கட்டளை கட்டமைப்பைச் சோதிக்கிறது, /a11y கட்டளை WCAG இணக்கத்தைச் சோதிக்கிறது, /test கட்டளை தானியங்கிச் சோதனைகளை இயக்குகிறது. நான் விதிவிலக்குகளை மட்டுமே பார்க்கிறேன், ஒவ்வொரு முடிவையும் அல்ல.
நிறுவன அறிவை உருவாக்கினேன். ஒரு skill-இன் SKILL.md-ஐ மேம்படுத்தினால், அந்த மேம்பாடு நிலைத்து நிற்கிறது. அமைப்பு ஒரே உரையாடலில் மட்டுமல்ல, காலப்போக்கிலும் புத்திசாலியாகிறது.
AI-யைப் பயன்படுத்துவதற்கும் AI-யுடன் சேர்ந்து உருவாக்குவதற்கும் உள்ள வேறுபாடு இதுதான்.
வடிவமைப்பே குறியீடு
design systems உடனான என் பணியில் ஒரு கொள்கைக்கு வந்திருக்கிறேன்: வடிவமைப்பே குறியீடு (The Design Is the Code).
design tokens, component schemas, agent கட்டமைப்புகள் ஒன்றுபடும்போது, வடிவமைப்பாளர்கள் குறிப்பிடுவதற்கும் உருவாக்குநர்கள் கட்டுவதற்கும் இடையில் மொழிபெயர்ப்பு அடுக்கே தேவையில்லை. விவரக்குறிப்பே செயலாக்கமாகிறது.
agents இதை எப்படி நிஜமாக்குகின்றன என்பது இதோ:
# 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இந்த schema வெறும் ஆவணம் அல்ல. அதுவே உண்மையின் மூலம். agent அதிலிருந்து components-ஐ உருவாக்குகிறது. validator அதற்கு எதிராகச் சரிபார்க்கிறது. design tokens அதைக் குறிப்பிடுகின்றன. ஒரே கோப்பு, பல பயன்பாடுகள்.
Figma-வில் வடிவமைப்பாளர் token மதிப்புகளைப் புதுப்பிக்கும்போது, agent கட்டமைப்பு புதுப்பிக்கப்படுகிறது. agent கட்டமைப்பு புதுப்பிக்கப்படும்போது, உருவாக்கப்பட்ட components புதுப்பிக்கப்படுகின்றன. இரண்டும் ஒரே schema-விலிருந்து பெறப்படுவதால், வடிவமைப்பே குறியீடு.
Claude Code மூலம் உருவாக்கத் தொடங்குவது எப்படி
டெலிபிராம்ப்டர் மாதிரியைத் தாண்டிச் செல்லத் தயாரென்றால், இதோ ஒரு நடைமுறைப் பாதை:
படி 1: உங்கள் துறைகளை அடையாளம் காணுங்கள்
உங்கள் பணியின் எந்தப் பகுதிகள் திரும்பத் திரும்ப வருபவை, விதிகளுக்குட்பட்டவை, context சார்ந்தவை? அவையே skill வேட்பாளர்கள்:
- குறியீடு உருவாக்கம்
- ஆவணப்படுத்தல்
- சோதனை
- மதிப்பாய்வும் சரிபார்ப்பும்
- Design system மேலாண்மை
- வெளியீடும் DevOps-உம்
படி 2: உங்கள் முதல் skill-ஐ உருவாக்குங்கள்
எளிய SKILL.md-உடன் தொடங்குங்கள்:
---
name: my-component
description: Generate and validate my-component
--- # My Component Skill When user asks about my-component, apply these rules...படி 3: Workflows (Commands) சேர்க்கவும்
workflows/-ல் ஆறு அடிப்படைக் கட்டளைகளை உருவாக்குங்கள்:
| கட்டளை | நோக்கம் |
|---|---|
/generate | புதிய படைப்புகளை உருவாக்குதல் |
/validate | ஏற்கனவே உள்ளவற்றைச் சரிபார்த்தல் |
/improve | மேம்பாடுகளைப் பரிந்துரைத்தல் |
/document | விளக்கி, பதிவு செய்தல் |
/test | தானியங்கிச் சோதனைகளை உருவாக்குதல் |
/a11y | WCAG இணக்கத்தைச் சோதித்தல் |
ஒவ்வொரு கட்டளையும் அறிவுறுத்தல்கள் அடங்கிய ஒரு markdown கோப்பு.
படி 4: Skill குறிப்புகளை நிறுவுங்கள்
Skills பிற skills-ஐக் குறிப்பிடலாம்:
## Related Skills This skill uses:
- image (for card images)
- button (for CTAs)
- heading (for titles)இந்தச் சார்புகளை வரைபடமாக்குங்கள். படிநிலை உங்கள் துறையின் இயல்பான கட்டமைப்புடன் பொருந்த வேண்டும்.
படி 5: சிக்கலான பணிகளுக்கு Subagents உருவாக்குங்கள்
தனிமைப்படுத்தப்பட்ட context அல்லது இணையான செயலாக்கம் தேவைப்படும்போது, ~/.claude/agents/-ல் ஒரு subagent கோப்பை உருவாக்குங்கள்:
---
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உங்கள் Skill நூலகத்தை உருவாக்குதல்
உங்கள் skills-ஐ Atomic Design படி கட்டமையுங்கள்:
| வகை | பங்கு | எடுத்துக்காட்டுகள் |
|---|---|---|
| Atoms | அடிப்படைக் கட்டுமானத் தொகுதிகள் | button, input, checkbox, avatar, badge, icon, link, image |
| Molecules | atoms-இன் சேர்க்கைகள் | card, modal, tabs, accordion, alert, dropdown, toast |
| Organisms | சிக்கலான components | header, footer, dashboard, login-form, hero, sidebar |
ஒவ்வொரு skill-உம்:
- தனக்கென
SKILL.mdகட்டமைப்பைக் கொண்டுள்ளது - slash commands கொண்ட
workflows/உள்ளது - ஆவணங்கள் கொண்ட
references/உள்ளது - தானியக்கத்துக்கு
scripts/உள்ளது - எந்த skills-ஐக் குறிப்பிடுகிறது என்பதை அறிந்துள்ளது
இது ஒரு நிலையான, அளவிடக்கூடிய அமைப்பை உருவாக்குகிறது; context அடிப்படையில் Claude சரியான skill-ஐத் தானாகத் தூண்டுகிறது.
எதிர்காலம் agentic
Atomic Design-ஐ உருவாக்கிய Brad Frost இந்த மாற்றத்தைப் பற்றிப் பேசி வருகிறார்: AI agents இப்போது மனிதக் குழுக்கள் பயன்படுத்தும் அதே components கொண்டு UI-களை இணைக்கின்றன; எனவே design systems இயந்திரம் படிக்கக்கூடிய உள்கட்டமைப்பாக மாற வேண்டும்.
இது 2030-ஐப் பற்றிய கணிப்பு அல்ல. இது இப்போதே நடக்கிறது.
உங்கள் design system-ஐ ஒரு agent-ஆல் பகுத்தறிய முடியவில்லை என்றால், அது காலாவதியாகிக்கொண்டிருக்கிறது. உங்கள் மேம்பாட்டு workflow-ல் ஒவ்வொரு படிக்கும் மனிதர் prompt செய்ய வேண்டுமென்றால், அது அளவிட முடியாதது. உங்கள் AI தொடர்புகள் ஒவ்வொரு முறையும் பூஜ்யத்திலிருந்து தொடங்கினால், திரட்டிய அறிவை வீணடிக்கிறீர்கள்.
AI ஒரு புதுமையாக இருந்தபோது டெலிபிராம்ப்டர் மாதிரி சரியாக இருந்தது. AI உள்கட்டமைப்பாகிவிட்ட பிறகு அது சரியல்ல.
Prompt செய்வதை நிறுத்துங்கள். வடிவமைக்கத் தொடங்குங்கள்.
Agents உருவாக்குங்கள். அவற்றுக்கு skills கொடுங்கள். அவை ஒருங்கிணைந்து செயல்படட்டும்.
எதிர்காலம் scripts எழுதுபவர்களுக்கு அல்ல, அமைப்புகளை வடிவமைப்பவர்களுக்கே சொந்தம்.
வலை மேம்பாட்டின் எதிர்காலத்துக்காக agentic design systems உருவாக்குகிறேன்.
மேலும் படிக்க
- The Design Is the Code design systems-ல் செல்லுலார் ஆட்டோமேட்டா சிந்தனை பற்றிய என் ஆய்வு
- Brad Frost எழுதிய Atomic Design component படிநிலைகளுக்குப் பின்னுள்ள முறை
- Designing Systems That Build Themselves கட்டுபவரிலிருந்து அமைப்புச் சிந்தனையாளராக