AI प्रदायकलाई टेलिप्रम्टर बनाउन छोड्नुहोस्, सबएजेन्ट, स्किल र कमान्ड बनाउनुहोस्

प्रम्प्टमा निर्भरताबाट बुद्धिमान एजेन्ट प्रणालीतर्फ

धेरैजसो मानिस अझै पनि AI लाई टेलिप्रम्टर जसरी प्रयोग गर्छन्।

तिनले प्रम्प्ट टाइप गर्छन्। कुर्छन्। जवाफ पाउँछन्। कतै कपी-पेस्ट गर्छन्। अनि फेरि त्यही गर्छन्। फेरि र फेरि। हरेक अन्तरक्रिया शून्यबाट सुरु हुन्छ। हरेक कुराकानीले अघि के भएको थियो भुलिदिन्छ।

यो सहकार्य होइन। अतिरिक्त झन्झटसहितको डिक्टेसन हो।

२०२६ मा, तपाईं अझै आफ्नो AI प्रदायकलाई टेलिप्रम्टर बनाइरहनुभएको छ भने, तपाईंको पैताला मुनि भइरहेको पूरै परिवर्तन तपाईंले गुमाइरहनुभएको छ।

टेलिप्रम्टरको समस्या

AI लाई टेलिप्रम्टर जसरी प्रयोग गर्दा, तपाईं सम्भावित रूपमा स्वायत्त प्रणालीलाई एकपल्टे टेक्स्ट जेनेरेटरको रूपमा व्यवहार गरिरहनुभएको हुन्छ। यसको ढाँचा यस्तो हुन्छ:

1. तपाईं विस्तृत प्रम्प्ट लेख्नुहुन्छ
2. जवाफको प्रतीक्षा गर्नुहुन्छ
3. आउटपुट आफैँ हातले जाँच्नुहुन्छ
4. सुधार गरेर फेरि प्रम्प्ट गर्नुहुन्छ
5. च्याट बन्द गर्ने बित्तिकै सबै सन्दर्भ गुमाउनुहुन्छ

यो मोडेलमा तीन घातक कमजोरी छन्:

स्थायी ज्ञान छैन। हरेक कुराकानी कोरा पाटीजस्तै हुन्छ। तपाईं उही सन्दर्भ पटक-पटक बुझाउनुहुन्छ। तपाईंको AI ले तपाईंको कोडबेस, रुचि, सीमा वा इतिहास केही पनि जान्दैन।

जिम्मा सुम्पने व्यवस्था छैन। तपाईं नै अवरोध बनिरहनुहुन्छ। हरेक निर्णय, हरेक प्रमाणीकरण, हरेक अर्को कदमका लागि तपाईंको इनपुट चाहिन्छ। AI ले अब के गर्ने भनेर तपाईंले भन्ने प्रतीक्षा गरिरहन्छ।

विशेषज्ञता छैन। कोडिङ, डक्युमेन्टेसन, डिजाइन, टेस्टिङ, डिप्लोयमेन्ट, सबैका लागि तपाईं एउटै सामान्य इन्टरफेस प्रयोग गर्नुहुन्छ। एउटै प्रम्प्ट शैली। एउटै कन्टेक्स्ट विन्डो। धेरैको काम गर्ने एउटै कुराकानी।

टेलिप्रम्टर मोडेलले AI लाई औजार ठान्छ। तर औजारले स्वायत्तता बढाउँदैन। एजेन्टले बढाउँछ।

एजेन्टमा सोच्दा के बदलिन्छ

Claude Code मा एजेन्ट आर्किटेक्चर तीन आधारभूत तत्वले बनेको छ:

• सबएजेन्ट: अलग्गै कन्टेक्स्ट विन्डो भएका विशेषज्ञ Claude इन्स्ट्यान्स (~/.claude/agents/)
• स्किल: SKILL.md फाइलसहितका, स्वतः सक्रिय हुने ज्ञान मोड्युल (~/.claude/skills/)
• कमान्ड: स्पष्ट कार्यका लागि प्रयोगकर्ताले चलाउने /slash कमान्ड (~/.claude/commands/)

परम्परागत प्रम्प्टिङसँगको मुख्य भिन्नता:

• स्किल सन्दर्भका आधारमा Claude ले स्वतः सक्रिय गर्छ
• कमान्ड चलाउन तपाईंले आफैँ /command टाइप गर्नुपर्छ
• सबएजेन्ट आफ्नै औजारसहित छुट्टै कन्टेक्स्टमा चल्छ

फरक हेरौँ:

टेलिप्रम्टर शैली:

"हाम्रो डिजाइन सिस्टमका ढाँचा र पहुँचसम्बन्धी मापदण्ड पालना गर्दै, तस्बिर, शीर्षक, मुख्य पाठ र प्राथमिक बटनसहितको कार्ड कम्पोनेन्ट मलाई लेखिदेऊ..."

Claude Code शैली:

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

पहिलो एउटा अनुरोध हो। दोस्रोले त्यस्तो स्किल चलाउँछ जसले कार्ड के हो, तपाईंको डिजाइन सिस्टमले के माग्छ, कुन पहुँच मापदण्ड लागू हुन्छ र आफ्नै आउटपुट कसरी प्रमाणित गर्ने भन्ने पहिल्यै जानेको हुन्छ।

आर्किटेक्चर: सबएजेन्ट, स्किल र कमान्ड

टेलिप्रम्टर मोडेलको ठाउँ लिने संरचना यस्तो छ:

तह १: सबएजेन्ट

सबएजेन्ट ~/.claude/agents/ मा रहने स्वतन्त्र markdown फाइल हुन्, जसले समानान्तर रूपमा काम गर्छन्। तिनीहरूका आफ्नै कन्टेक्स्ट विन्डो हुन्छन् र तिनले स्किल चलाउन सक्छन्।

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

हरेक सबएजेन्ट फाइलमा YAML फ्रन्टम्याटर हुन्छ:

• name: स्पष्ट पहिचान नाम
• description: यसले के गर्छ र कहिले चलाउने
• tools: अनुमति पाएका क्षमता (Read, Write, Bash, Grep, Glob)

सबएजेन्टको उदाहरण (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...

तह २: स्किल

स्किल भनेका स्वतः सक्रिय हुने ज्ञान मोड्युल हुन्। तपाईंले Claude लाई स्किलको उद्देश्यसँग मिल्ने कुरा सोध्नुभयो भने Claude ले त्यो आफैँ लागू गर्छ।

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

यो एटोमिक डिजाइन पद्धति अनुसार छ: एटम, molecule, organism। हरेक स्किल ठ्याक्कै एउटा कुराको विशेषज्ञ हुन्छ। तपाईंलाई कार्ड चाहिँदा card स्किल स्वतः सक्रिय हुन्छ।

हरेक स्किलले जान्दछ:

• कम्पोनेन्टको स्किमा (props, slots, variants)
• तपाईंको डिजाइन सिस्टमका नियम
• फ्रेमवर्क-विशिष्ट ढाँचा
• WCAG पहुँचसम्बन्धी आवश्यकता
• आफूले सन्दर्भ लिन सक्ने सम्बन्धित स्किल

तह ३: कमान्ड

कमान्ड प्रयोगकर्ताले चलाउने सर्टकट हुन्। तिनलाई चलाउन तपाईं /command टाइप गर्नुहुन्छ। तिनीहरू स्किल वर्कफ्लोभित्र वा ग्लोबल रूपमा रहन्छन्:

~/.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

कमान्डले योजना बनाउन सबएजेन्ट बोलाउन सक्छ, अनि मुख्य Claude ले कार्यान्वयन गर्छ। यसले तपाईंलाई सबै औजारको पहुँचसहित संरचित वर्कफ्लो दिन्छ।

पूर्ण उदाहरण: Card स्किल

एउटा वास्तविक स्किलबाट यो ठ्याक्कै कसरी काम गर्छ देखाउँछु:

स्किलको संरचना

~/.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

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

स्ल्यास कमान्ड प्रयोग गर्ने तरिका

नयाँ कार्ड बनाउन:

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

अवस्थित कार्ड प्रमाणित गर्न:

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

पहुँच अनुपालन जाँच्न:

/a11y card --level="AA"

कुनै खास सन्दर्भका लागि UX सुधार्न:

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

भित्र के हुन्छ

तपाईंले /generate card चलाउँदा, Claude ले:

1. card स्किल सक्रिय गर्छ: SKILL.md कन्टेक्स्टमा लोड हुन्छ
2. स्किमा पढ्छ:  तपाईंका प्यारामिटरलाई अनुमति प्राप्त props सँग मिलाएर जाँच्छ
3. अन्य स्किल सन्दर्भ लिन्छ:  image, heading, button स्किलले आ-आफ्नो विशेषज्ञता दिन्छन्
4. वर्कफ्लो चलाउँछ: workflows/generate.md कार्यान्वयन हुन्छ
5. आफैँ प्रमाणित गर्छ: आफ्नै आउटपुटमा validate वर्कफ्लो चलाउँछ
6. नतिजा फर्काउँछ:  कम्पोनेन्टसँगै कुनै चेतावनी भए त्यो पनि दिन्छ

card स्किलले मार्कअप मात्र बनाउँदैन। यसले विशेषज्ञहरूको एउटा प्रणाली सञ्चालन गर्छ, जहाँ हरेकले आफ्नो क्षेत्रको विशेषज्ञता थप्छ।

यो किन महत्त्वपूर्ण छ: निर्माताबाट प्रणाली-चिन्तकसम्म

टेलिप्रम्टर मोडेलले तपाईंलाई सञ्चालक बनाइरहन्छ। स्किल मोडेलले तपाईंलाई आर्किटेक्ट बनाउँछ।

मैले प्रम्प्ट लेख्नुबाट स्किल डिजाइन गर्नतिर सरेपछि धेरै कुरा बदलिए:

मैले सन्दर्भ दोहोर्याउन छोडेँ। हरेक स्किलले आफ्नो क्षेत्र पहिल्यै जानेको हुन्छ। मलाई कार्ड चाहिँदा हरपल्ट कार्ड के हो भनेर बुझाउनु पर्दैन।

मैले संरचनामा सोच्न थालेँ। पेज एउटा प्रम्प्ट होइन, यो organism हरूको समन्वय हो, जुन molecule हरूको समन्वय हो, जुन एटमहरूको समन्वय हो। हरेक तहको आफ्नै स्किल हुन्छ।

मैले प्रमाणीकरणको जिम्मा सुम्पेँ। हरेक आउटपुट हातैले समीक्षा गर्नुको सट्टा, /validate कमान्डले संरचना जाँच्छ, /a11y कमान्डले WCAG अनुपालन जाँच्छ, र /test कमान्डले स्वचालित जाँच चलाउँछ। म हरेक नतिजा होइन, अपवादहरू मात्र हेर्छु।

मैले संस्थागत ज्ञान निर्माण गरेँ। स्किलको SKILL.md सुधार्दा त्यो सुधार टिकिरहन्छ। प्रणाली एउटै कुराकानीमा मात्र होइन, समयसँगै अझ बुद्धिमान हुँदै जान्छ।

AI प्रयोग गर्नु र AI सँग मिलेर निर्माण गर्नुबीचको फरक यही हो।

डिजाइन नै कोड हो

डिजाइन सिस्टमसँगको मेरो कामबाट म एउटा सिद्धान्तमा पुगेको छु: डिजाइन नै कोड हो।

डिजाइन टोकन, कम्पोनेन्ट स्किमा र एजेन्ट कन्फिगरेसन एकआपसमा मिल्दा, डिजाइनरले तोकेको कुरा र डेभलपरले बनाएको कुराबीच कुनै अनुवाद तह रहँदैन। विनिर्देशन नै कार्यान्वयन हो।

एजेन्टले यसलाई यसरी यथार्थ बनाउँछन्:

# 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

यो स्किमा केवल डक्युमेन्टेसन होइन। यो सत्यको स्रोत हो। एजेन्टले यसैबाट कम्पोनेन्ट बनाउँछ। भ्यालिडेटरले यसैविरुद्ध जाँच गर्छ। डिजाइन टोकनले यसैलाई सन्दर्भ लिन्छन्। एउटै फाइल, धेरै प्रयोग।

डिजाइनरले Figma मा टोकनका मान अद्यावधिक गर्दा, एजेन्ट कन्फिगरेसन अद्यावधिक हुन्छ। एजेन्ट कन्फिगरेसन अद्यावधिक हुँदा, बनेका कम्पोनेन्ट अद्यावधिक हुन्छन्। डिजाइन नै कोड हो, किनकि दुवै एउटै स्किमाबाट निस्किएका छन्।

Claude Code सँग निर्माण कसरी सुरु गर्ने

टेलिप्रम्टर मोडेलभन्दा अगाडि बढ्न तयार हुनुहुन्छ भने, यहाँ व्यावहारिक बाटो छ:

चरण १: आफ्ना क्षेत्र पहिचान गर्नुहोस्

तपाईंको कामका कुन क्षेत्र दोहोरिने, नियमबद्ध र सन्दर्भमा निर्भर छन्? ती नै स्किलका उम्मेदवार हुन्:

• कोड जेनेरेसन
• डक्युमेन्टेसन
• टेस्टिङ
• समीक्षा र प्रमाणीकरण
• डिजाइन सिस्टम व्यवस्थापन
• डिप्लोयमेन्ट र DevOps

चरण २: आफ्नो पहिलो स्किल बनाउनुहोस्

एउटा सरल SKILL.md बाट सुरु गर्नुहोस्:

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

चरण ३: वर्कफ्लो (कमान्ड) थप्नुहोस्

workflows/ मा छवटा मुख्य कमान्ड बनाउनुहोस्:

हरेक कमान्ड निर्देशनसहितको एउटा markdown फाइल हो।

चरण ४: स्किल सन्दर्भ स्थापित गर्नुहोस्

स्किलले अन्य स्किललाई सन्दर्भ लिन सक्छन्:

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

यी निर्भरता नक्सांकन गर्नुहोस्। पदानुक्रम तपाईंको क्षेत्रको स्वाभाविक संरचनासँग मिल्नुपर्छ।

चरण ५: जटिल कामका लागि सबएजेन्ट बनाउनुहोस्

तपाईंलाई अलग्गै कन्टेक्स्ट वा समानान्तर कार्यान्वयन चाहिँदा, ~/.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

आफ्नो स्किल पुस्तकालय बनाउँदै

आफ्ना स्किललाई एटोमिक डिजाइन अनुसार व्यवस्थित गर्नुहोस्:

हरेक स्किल:

• को आफ्नै SKILL.md कन्फिगरेसन हुन्छ
• मा स्ल्यास कमान्डसहितको workflows/ हुन्छ
• मा डक्युमेन्टेसनसहितको references/ हुन्छ
• मा स्वचालनका लागि scripts/ हुन्छ
• ले कुन अन्य स्किललाई सन्दर्भ लिन्छ भन्ने जान्दछ

यसले एउटा एकरूप, विस्तारयोग्य प्रणाली बनाउँछ, जहाँ Claude ले सन्दर्भका आधारमा सही स्किल स्वतः सक्रिय गर्छ।

भविष्य एजेन्टिक छ

एटोमिक डिजाइनका सर्जक Brad Frost यही परिवर्तनबारे बोल्दै आएका छन्: डिजाइन सिस्टम मेसिनले पढ्न सक्ने पूर्वाधार बन्नैपर्छ, किनकि AI एजेन्टहरूले अहिले मानव टोलीले प्रयोग गर्ने उही कम्पोनेन्टबाट UI जोड्दैछन्।

यो २०३० को भविष्यवाणी होइन। यो अहिले नै भइरहेको छ।

तपाईंको डिजाइन सिस्टम एजेन्टले पार्स गर्न सक्दैन भने त्यो पुरानो (legacy) बन्दै छ। तपाईंको डेभलपमेन्ट वर्कफ्लोमा हरेक चरणमा मानिसले प्रम्प्ट गर्नुपर्छ भने त्यो विस्तार हुँदैन। तपाईंको AI अन्तरक्रिया हरपल्ट शून्यबाट सुरु हुन्छ भने, तपाईं जम्मा भएको ज्ञान खेर फाल्दै हुनुहुन्छ।

AI नौलो कुरा हुँदा टेलिप्रम्टर मोडेल ठीकै थियो। AI पूर्वाधार भइसकेपछि त्यो ठीक छैन।

प्रम्प्ट गर्न छोड्नुहोस्। डिजाइन गर्न थाल्नुहोस्।

एजेन्ट बनाउनुहोस्। तिनलाई स्किल दिनुहोस्। तिनलाई समन्वय गर्न दिनुहोस्।

भविष्य ती मानिसको हो जसले प्रणालीको आर्किटेक्चर बनाउँछन्, ती मानिसको होइन जसले स्क्रिप्ट लेख्छन्।

वेब डेभलपमेन्टको भविष्यका लागि एजेन्टिक डिजाइन सिस्टम निर्माण गर्दै।

थप पढाइ

• The Design Is the Code  डिजाइन सिस्टममा सेलुलर अटोमाटा सोचको मेरो अन्वेषण
• Atomic Design by Brad Frost  कम्पोनेन्ट पदानुक्रमको पछाडिको पद्धति
• Designing Systems That Build Themselves  निर्माताबाट प्रणाली-चिन्तकसम्म