{"id":7512,"date":"2026-01-22T22:12:09","date_gmt":"2026-01-22T14:12:09","guid":{"rendered":"https:\/\/infernews.com\/?page_id=7512"},"modified":"2026-01-22T22:12:10","modified_gmt":"2026-01-22T14:12:10","slug":"agent-skill-vs-speccoding-%e5%bd%b1%e7%89%87%e8%a3%bd%e4%bd%9c%e8%85%b3%e6%9c%ac","status":"publish","type":"page","link":"https:\/\/infernews.com\/blog\/agent-skill-vs-speccoding-%e5%bd%b1%e7%89%87%e8%a3%bd%e4%bd%9c%e8%85%b3%e6%9c%ac\/","title":{"rendered":"Agent Skill vs. SpecCoding \u5f71\u7247\u88fd\u4f5c\u8173\u672c"},"content":{"rendered":"\n<!-- COPY FROM HERE DOWN -->\n<script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\n\n<style>\n    \/* Scoped wrapper to prevent affecting the rest of the WP site *\/\n    .wp-script-wrapper {\n        --bg-page: #f8fafc;\n        --bg-card: #ffffff;\n        --accent-primary: #0284c7;\n        --accent-secondary: #d97706;\n        --text-main: #0f172a;\n        --text-muted: #475569;\n        --border-color: #cbd5e1;\n        --spacing-unit: 1.5rem;\n        \n        font-family: 'Inter', system-ui, -apple-system, sans-serif;\n        background-color: var(--bg-page);\n        color: var(--text-main);\n        line-height: 1.7;\n        font-size: 20px;\n        padding: 2rem 0; \/* Add some padding around the wrapper *\/\n    }\n\n    .wp-script-wrapper * {\n        box-sizing: border-box;\n    }\n\n    \/* Typography overrides for this section *\/\n    .wp-script-wrapper h1, \n    .wp-script-wrapper h2, \n    .wp-script-wrapper h3 {\n        font-weight: 800;\n        letter-spacing: -0.025em;\n        line-height: 1.2;\n        margin-top: 0;\n    }\n\n    .wp-script-wrapper .mono {\n        font-family: 'Fira Code', monospace;\n        color: var(--accent-primary);\n        background: rgba(2, 132, 199, 0.1);\n        padding: 0.2em 0.4em;\n        border-radius: 4px;\n        font-size: 0.9em;\n        font-weight: 600;\n    }\n\n    \/* Layout Utilities *\/\n    .wp-script-wrapper .container {\n        max-width: 1100px;\n        margin: 0 auto;\n        padding: 0 var(--spacing-unit);\n    }\n\n    \/* Header Section *\/\n    .wp-script-wrapper .script-header {\n        padding: 5rem 0;\n        text-align: center;\n        background: #ffffff;\n        border-bottom: 1px solid var(--border-color);\n        margin-bottom: 4rem;\n        border-radius: 8px; \/* Added radius for WP compatibility *\/\n    }\n\n    .wp-script-wrapper .script-header h1 {\n        font-size: 3.5rem;\n        margin-bottom: 1.5rem;\n        color: var(--text-main);\n    }\n\n    .wp-script-wrapper .subtitle {\n        font-size: 1.5rem;\n        color: var(--text-muted);\n        margin-bottom: 2.5rem;\n        font-weight: 500;\n    }\n\n    .wp-script-wrapper .concept-card {\n        background: #fffbeb;\n        display: inline-flex;\n        align-items: center;\n        padding: 1rem 2.5rem;\n        border-radius: 9999px;\n        border: 2px solid var(--accent-secondary);\n        color: var(--accent-secondary);\n        font-weight: 700;\n        font-size: 1.1rem;\n        box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);\n    }\n\n    \/* Timeline \/ Script Section *\/\n    .wp-script-wrapper .timeline {\n        position: relative;\n        padding-bottom: 4rem;\n    }\n\n    .wp-script-wrapper .timeline::before {\n        content: '';\n        position: absolute;\n        left: 24px;\n        top: 0;\n        bottom: 0;\n        width: 4px;\n        background: var(--border-color);\n        opacity: 0.5;\n    }\n\n    @media (min-width: 900px) {\n        .wp-script-wrapper .timeline::before {\n            left: 50%;\n            transform: translateX(-50%);\n        }\n    }\n\n    .wp-script-wrapper .script-block {\n        margin-bottom: 5rem;\n        position: relative;\n    }\n\n    \/* Timestamp Badge *\/\n    .wp-script-wrapper .timestamp {\n        background: var(--bg-card);\n        border: 2px solid var(--accent-primary);\n        color: var(--accent-primary);\n        padding: 0.5rem 1rem;\n        border-radius: 12px;\n        font-family: monospace;\n        font-weight: 800;\n        font-size: 1.1rem;\n        display: inline-block;\n        margin-bottom: 1.5rem;\n        position: relative;\n        z-index: 10;\n        box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);\n    }\n\n    @media (min-width: 900px) {\n        .wp-script-wrapper .script-block {\n            display: flex;\n            justify-content: center;\n            align-items: flex-start;\n            gap: 5rem;\n        }\n        \n        .wp-script-wrapper .timestamp {\n            position: absolute;\n            top: 0;\n            left: 50%;\n            transform: translateX(-50%);\n            margin-bottom: 0;\n        }\n    }\n\n    \/* Cards *\/\n    .wp-script-wrapper .card {\n        background: var(--bg-card);\n        border-radius: 16px;\n        padding: 2rem;\n        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\n        border: 1px solid var(--border-color);\n        transition: transform 0.2s ease;\n        height: 100%;\n        margin-bottom: 0; \/* Reset WP default margin *\/\n    }\n\n    .wp-script-wrapper .card:hover {\n        transform: translateY(-4px);\n        border-color: var(--accent-primary);\n        box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);\n    }\n\n    .wp-script-wrapper .card-title {\n        font-size: 1.25rem;\n        margin-bottom: 1.2rem;\n        display: flex;\n        align-items: center;\n        gap: 0.75rem;\n        color: var(--text-muted);\n        text-transform: uppercase;\n        font-weight: 700;\n        letter-spacing: 0.05em;\n    }\n\n    \/* Visual Column styles *\/\n    .wp-script-wrapper .visual-col {\n        flex: 1;\n    }\n\n    .wp-script-wrapper .visual-card {\n        border-left: 6px solid var(--accent-secondary);\n    }\n\n    .wp-script-wrapper .visual-card .card-title i { color: var(--accent-secondary); }\n\n    \/* Audio Column styles *\/\n    .wp-script-wrapper .audio-col {\n        flex: 1;\n    }\n\n    .wp-script-wrapper .audio-card {\n        border-left: 6px solid var(--accent-primary);\n    }\n\n    .wp-script-wrapper .audio-card .card-title i { color: var(--accent-primary); }\n\n    .wp-script-wrapper .dialogue {\n        font-style: italic;\n        color: var(--text-main);\n        margin-bottom: 1.2rem;\n        padding-left: 1.25rem;\n        border-left: 4px solid var(--border-color);\n        font-size: 1.1rem;\n    }\n\n    \/* Gold Quote Section *\/\n    .wp-script-wrapper .golden-quote {\n        text-align: center;\n        margin: 5rem 0;\n        padding: 4rem 2rem;\n        background: #fffbeb;\n        border-radius: 24px;\n        border: 2px solid #fcd34d;\n        box-shadow: 0 10px 15px -3px rgba(245, 158, 11, 0.1);\n    }\n\n    .wp-script-wrapper .golden-quote h3 {\n        font-size: 2rem;\n        color: var(--accent-secondary);\n        margin-bottom: 0.5rem;\n        font-weight: 800;\n    }\n\n    \/* Highlights Grid *\/\n    .wp-script-wrapper .highlights-grid {\n        display: grid;\n        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\n        gap: 2rem;\n        margin-top: 2.5rem;\n    }\n\n    .wp-script-wrapper .highlight-item {\n        background: var(--bg-card);\n        padding: 2rem;\n        border-radius: 16px;\n        border: 1px solid var(--border-color);\n        border-top: 6px solid var(--accent-primary);\n        box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);\n    }\n    \n    .wp-script-wrapper .highlight-item h3 {\n        font-size: 1.5rem;\n        margin-top: 0;\n    }\n\n    \/* Responsive adjustments *\/\n    @media (max-width: 900px) {\n        .wp-script-wrapper .script-block {\n            flex-direction: column;\n            margin-left: 2.5rem;\n        }\n        \n        .wp-script-wrapper .card {\n            margin-bottom: 1.5rem;\n        }\n        \n        .wp-script-wrapper .script-header h1 {\n            font-size: 2.5rem;\n        }\n    }\n<\/style>\n\n<div class=\"wp-script-wrapper\">\n    <div class=\"script-header\">\n        <div class=\"container\">\n            <h1>Agent Skill vs. SpecCoding<\/h1>\n            <p class=\"subtitle\">\u5f71\u7247\u88fd\u4f5c\u8173\u672c | Video Production Script<\/p>\n            <div class=\"concept-card\">\n                <i data-lucide=\"chef-hat\" style=\"width: 28px; height: 28px; margin-right: 12px;\"><\/i>\n                \u6838\u5fc3\u6bd4\u55bb\uff1a\u4f60\u7684 AI \u958b\u767c\u74b0\u5883\u5c31\u662f\u4e00\u9593\u300c\u9802\u7d1a\u9910\u5ef3\u300d\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <div class=\"container\">\n        \n        <div class=\"golden-quote\">\n            <i data-lucide=\"quote\" style=\"width: 48px; height: 48px; color: var(--accent-secondary); margin-bottom: 1.5rem;\"><\/i>\n            <h3>\u300cAI \u4e0d\u662f\u4e0d\u61c2\u7a0b\u5f0f\uff0c\u800c\u662f\u4f60\u6c92\u544a\u8a34\u5b83\u300e\u4f60\u8981\u4ec0\u9ebc\u6a23\u7684\u5de5\u7a0b\u5e2b\u300f\u3002\u300d<\/h3>\n        <\/div>\n\n        <div class=\"timeline\">\n\n            <!-- 0:00 - 0:50 -->\n            <article class=\"script-block\">\n                <div class=\"timestamp\">0:00 &#8211; 0:50<\/div>\n                \n                <div class=\"visual-col\">\n                    <div class=\"card visual-card\">\n                        <div class=\"card-title\"><i data-lucide=\"monitor-play\"><\/i> \u756b\u9762 Visual<\/div>\n                        <p style=\"font-weight: 700; margin-bottom: 1rem;\">\u5834\u666f\uff1a\u5eda\u623f\u88e1\u7684\u707d\u96e3<\/p>\n                        <ul style=\"list-style-position: outside; margin-left: 1.5rem; color: var(--text-muted);\">\n                            <li>\u4e00\u500b\u770b\u8d77\u4f86\u5f88\u53b2\u5bb3\u7684\u6a5f\u5668\u4eba\u5eda\u5e2b\uff08LLM\uff09\uff0c\u9762\u5c0d\u4e00\u5806\u98df\u6750\u624b\u5fd9\u8173\u4e82\u3002<\/li>\n                            <li>\u4f60\u5c0d\u5b83\u558a\uff1a\u300c\u505a\u500b\u6f22\u5821\uff01\u300d<\/li>\n                            <li>\u7d50\u679c\u5b83\u505a\u51fa\u4f86\u4e00\u500b\u628a\u8089\u653e\u5728\u9eb5\u5305\u5916\u9762\u7684\u5947\u602a\u7269\u9ad4\uff0c\u6216\u8005\u52a0\u4e86\u5de7\u514b\u529b\u91ac\u7684\u6f22\u5821\u3002<\/li>\n                            <li style=\"margin-top: 1rem; color: var(--text-main);\"><strong>\u7279\u6548\u5b57\u5361\uff1a<\/strong>\u300cAI \u4e0d\u662f\u4e0d\u61c2\u7a0b\u5f0f\uff0c\u800c\u662f\u4f60\u6c92\u544a\u8a34\u5b83\u300e\u4f60\u8981\u4ec0\u9ebc\u6a23\u7684\u5de5\u7a0b\u5e2b\u300f\u3002\u300d<\/li>\n                        <\/ul>\n                    <\/div>\n                <\/div>\n\n                <div class=\"audio-col\">\n                    <div class=\"card audio-card\">\n                        <div class=\"card-title\"><i data-lucide=\"mic\"><\/i> \u65c1\u767d Narration<\/div>\n                        <div class=\"dialogue\">\u300c\u4f60\u662f\u5426\u89ba\u5f97\u4f60\u7684 AI \u5beb Code \u7e3d\u662f\u300e\u6709\u505a\u6c92\u6709\u61c2\u300f\uff1f\u660e\u660e\u80fd\u8dd1\uff0c\u4f46\u5beb\u6cd5\u5b8c\u5168\u4e0d\u7b26\u5408\u4f60\u5011\u5718\u968a\u7684\u898f\u7bc4\uff1f\u300d<\/div>\n                        <div class=\"dialogue\">\u300c\u554f\u984c\u4e0d\u5728 AI \u7b28\uff0c\u800c\u5728\u65bc\u4f60\u628a\u5b83\u7576\u6210\u4e00\u500b\u8def\u4eba\uff0c\u76f4\u63a5\u53eb\u5b83\u505a\u83dc\u3002\u300d<\/div>\n                        <div class=\"dialogue\">\u300c\u4eca\u5929\u6211\u5011\u7528\u300e\u9802\u7d1a\u9910\u5ef3\u300f\u7684\u6982\u5ff5\uff0c\u5fb9\u5e95\u641e\u61c2 Agent Skill \u548c SpecCoding\u3002\u300d<\/div>\n                    <\/div>\n                <\/div>\n            <\/article>\n\n            <!-- 0:50 - 2:00 -->\n            <article class=\"script-block\">\n                <div class=\"timestamp\">0:50 &#8211; 2:00<\/div>\n                \n                <div class=\"visual-col\">\n                    <div class=\"card visual-card\">\n                        <div class=\"card-title\"><i data-lucide=\"chef-hat\"><\/i> \u756b\u9762 Visual<\/div>\n                        <p style=\"font-weight: 700; margin-bottom: 0.5rem;\">Part 1: Agent Skill \u2014\u2014 \u4e3b\u5eda\u7684\u300c\u6d41\u6d3e\u8207\u7d00\u5f8b\u300d<\/p>\n                        <p style=\"margin-bottom:1rem; color:var(--accent-secondary); font-weight: 600;\">Skill = \u4e3b\u5eda\u7684\u8a13\u7df4 (The Context \/ The Persona)<\/p>\n                        <ul style=\"list-style-position: outside; margin-left: 1.5rem; color: var(--text-muted);\">\n                            <li>\u7d66\u539f\u672c\u88f8\u9ad4\u7684\u6a5f\u5668\u4eba\u7a7f\u4e0a\u6f54\u767d\u7684\u5eda\u5e2b\u670d\uff0c\u6234\u4e0a\u9ad8\u5e3d\u3002<\/li>\n                            <li>\u5e3d\u5b50\u4e0a\u5beb\u8457\u300c\u7c73\u5176\u6797\u4e09\u661f\u6a19\u6e96\u300d\u6216\u300c\u56b4\u683c\u885b\u751f\u898f\u7bc4\u300d\u3002<\/li>\n                        <\/ul>\n                    <\/div>\n                <\/div>\n\n                <div class=\"audio-col\">\n                    <div class=\"card audio-card\">\n                        <div class=\"card-title\"><i data-lucide=\"mic\"><\/i> \u65c1\u767d Narration<\/div>\n                        <div class=\"dialogue\">\u300cAgent Skill \u5c31\u50cf\u662f\u5eda\u5e2b\u7684\u300e\u8077\u524d\u8a13\u7df4\u300f\u3002\u300d<\/div>\n                        <div class=\"dialogue\">\u300c\u5b83\u5b9a\u7fa9\u4e86\u9019\u4f4d\u5eda\u5e2b\u7684\u6d41\u6d3e\uff1a\u662f\u505a\u6cd5\u5f0f\u6599\u7406\uff08<span class=\"mono\">Python\/Django<\/span>\uff09\uff1f\u9084\u662f\u65e5\u5f0f\u677f\u524d\uff08<span class=\"mono\">Go\/Microservices<\/span>\uff09\uff1f\u300d<\/div>\n                        <div class=\"dialogue\">\u300c\u5b83\u4e5f\u5b9a\u7fa9\u4e86\u300e\u5eda\u623f\u7d00\u5f8b\u300f\uff1a\u5200\u5b50\u7528\u5b8c\u8981\u6b78\u4f4d\uff08\u8b8a\u6578\u547d\u540d\u898f\u5247\uff09\u3001\u62b9\u5e03\u4e0d\u80fd\u4e82\u4e1f\uff08Error Handling \u898f\u7bc4\uff09\u3002\u300d<\/div>\n                        <div class=\"dialogue\">\u300c\u9019\u4e9b\u898f\u5247\u662f <strong>\u6c38\u4e45\u7684<\/strong>\uff0c\u4e0d\u7ba1\u4eca\u5929\u716e\u4ec0\u9ebc\u83dc\uff0c\u90fd\u8981\u9075\u5b88\u3002\u300d<\/div>\n                    <\/div>\n                <\/div>\n            <\/article>\n\n            <!-- 2:00 - 3:10 -->\n            <article class=\"script-block\">\n                <div class=\"timestamp\">2:00 &#8211; 3:10<\/div>\n                \n                <div class=\"visual-col\">\n                    <div class=\"card visual-card\">\n                        <div class=\"card-title\"><i data-lucide=\"scroll-text\"><\/i> \u756b\u9762 Visual<\/div>\n                        <p style=\"font-weight: 700; margin-bottom: 0.5rem;\">Part 2: SpecCoding \u2014\u2014 \u5ba2\u4eba\u7684\u300c\u9ede\u9910\u55ae\u300d<\/p>\n                        <p style=\"margin-bottom:1rem; color:var(--accent-secondary); font-weight: 600;\">Spec = \u7576\u4e0b\u7684\u8a02\u55ae (The Instruction \/ The Task)<\/p>\n                        <ul style=\"list-style-position: outside; margin-left: 1.5rem; color: var(--text-muted);\">\n                            <li>\u670d\u52d9\u751f\u905e\u9032\u4f86\u4e00\u5f35\u55ae\u5b50\uff08Markdown \u6587\u4ef6\uff09\u3002<\/li>\n                            <li>\u4e0a\u9762\u5beb\u8457\uff1a\u300cA \u684c\u5ba2\u4eba\uff1a\u4e09\u5206\u719f\u725b\u6392\u3001\u4e0d\u8981\u6d0b\u8525\u3001\u91ac\u6c41\u5206\u958b\u653e\u3002\u300d<\/li>\n                        <\/ul>\n                    <\/div>\n                <\/div>\n\n                <div class=\"audio-col\">\n                    <div class=\"card audio-card\">\n                        <div class=\"card-title\"><i data-lucide=\"mic\"><\/i> \u65c1\u767d Narration<\/div>\n                        <div class=\"dialogue\">\u300c\u6709\u4e86\u597d\u5eda\u5e2b\uff08Skill\uff09\uff0c\u4ed6\u9084\u662f\u4e0d\u77e5\u9053\u73fe\u5728\u8981\u505a\u4ec0\u9ebc\u3002\u9019\u6642\u5019\u4f60\u9700\u8981 SpecCoding\u3002\u300d<\/div>\n                        <div class=\"dialogue\">\u300cSpec \u5c31\u662f\u9019\u5f35\u300e\u9ede\u9910\u55ae\u300f\u3002\u5b83\u544a\u8a34\u4e3b\u5eda\uff1a\u300e\u73fe\u5728\u6211\u8981\u4e00\u500b\u767b\u5165\u529f\u80fd\uff08\u725b\u6392\uff09\u300f\uff0c\u300e\u5bc6\u78bc\u8981\u52a0\u5bc6\uff08\u4e09\u5206\u719f\uff09\u300f\u3002\u300d<\/div>\n                        <div class=\"dialogue\">\u300c\u9019\u5f35\u55ae\u5b50\u662f <strong>\u4e00\u6b21\u6027\u7684<\/strong>\uff0c\u505a\u5b8c\u9019\u9053\u83dc\uff0c\u9019\u5f35\u55ae\u5b50\u5c31\u7d50\u6848\u4e86\u3002\u300d<\/div>\n                    <\/div>\n                <\/div>\n            <\/article>\n\n            <!-- 3:10 - 4:10 -->\n            <article class=\"script-block\">\n                <div class=\"timestamp\">3:10 &#8211; 4:10<\/div>\n                \n                <div class=\"visual-col\">\n                    <div class=\"card visual-card\">\n                        <div class=\"card-title\"><i data-lucide=\"git-merge\"><\/i> \u756b\u9762 Visual<\/div>\n                        <p style=\"font-weight: 700; margin-bottom: 0.5rem;\">Part 3: \u6d41\u7a0b\u89e3\u5bc6\uff08\u70ba\u4ec0\u9ebc\u9806\u5e8f\u5f88\u91cd\u8981\uff1f\uff09<\/p>\n                        <div style=\"background: #f1f5f9; padding: 1.5rem; margin-top: 1rem; border-radius: 12px; font-family: monospace; font-size: 1rem; text-align: center; border: 1px solid var(--border-color);\">\n                            LLM (\u7d20\u4eba)<br>\n                            <i data-lucide=\"arrow-down\" style=\"margin: 5px 0; color: #cbd5e1;\"><\/i><br>\n                            <span style=\"color:var(--accent-secondary); font-weight:bold;\">\u7a7f\u4e0a Skill (\u8b8a\u4e3b\u5eda)<\/span><br>\n                            <i data-lucide=\"arrow-down\" style=\"margin: 5px 0; color: #cbd5e1;\"><\/i><br>\n                            <span style=\"color:var(--accent-primary); font-weight:bold;\">\u63a5\u5230 Spec (\u770b\u8a02\u55ae)<\/span><br>\n                            <i data-lucide=\"arrow-down\" style=\"margin: 5px 0; color: #cbd5e1;\"><\/i><br>\n                            <strong>Code (\u4e0a\u83dc)<\/strong>\n                        <\/div>\n                    <\/div>\n                <\/div>\n\n                <div class=\"audio-col\">\n                    <div class=\"card audio-card\">\n                        <div class=\"card-title\"><i data-lucide=\"mic\"><\/i> \u65c1\u767d Narration<\/div>\n                        <div class=\"dialogue\">\u300c\u5f88\u591a\u4eba\u641e\u932f\u9806\u5e8f\uff0c\u4ee5\u70ba\u53ef\u4ee5\u76f4\u63a5\u4e1f Spec \u7d66 LLM\u3002\u932f\u4e86\uff01\u300d<\/div>\n                        <div class=\"dialogue\">\u300c\u60f3\u50cf\u4e00\u4e0b\uff0c\u4f60\u7d66\u4e00\u500b\u8def\u4eba\uff08LLM\uff09\u4e00\u5f35\u9ede\u83dc\u55ae\uff0c\u4ed6\u770b\u5f97\u61c2\u5b57\uff0c\u4f46\u4ed6\u6c92\u6709\u53d7\u904e\u8a13\u7df4\uff0c\u505a\u51fa\u4f86\u7684\u83dc\u80fd\u5403\u55ce\uff1f\u300d<\/div>\n                        <div class=\"dialogue\">\u300c\u6b63\u78ba\u6d41\u7a0b\u662f\uff1a <strong>\u5148\u8f09\u5165 Skill<\/strong> \uff08\u78ba\u8a8d\u4ed6\u662f\u4f60\u5011\u5718\u968a\u7684\u4e00\u54e1\uff09\uff0c <strong>\u518d\u7d66 Spec<\/strong> \uff08\u544a\u8a34\u4ed6\u4efb\u52d9\uff09\u3002\u300d<\/div>\n                    <\/div>\n                <\/div>\n            <\/article>\n\n            <!-- 4:10 - 5:20 -->\n            <article class=\"script-block\">\n                <div class=\"timestamp\">4:10 &#8211; 5:20<\/div>\n                \n                <div class=\"visual-col\">\n                    <div class=\"card visual-card\">\n                        <div class=\"card-title\"><i data-lucide=\"alert-triangle\"><\/i> \u756b\u9762 Visual<\/div>\n                        <p style=\"font-weight: 700; margin-bottom: 0.5rem;\">Part 4: \u932f\u8aa4\u793a\u7bc4\uff08\u70ba\u4ec0\u9ebc\u4e0d\u80fd\u6df7\u6dc6\uff1f\uff09<\/p>\n                        <div style=\"margin-top: 1.5rem; padding: 1rem; background: #fef2f2; border-radius: 8px; border-left: 4px solid #ef4444;\">\n                            <p style=\"color: #ef4444; font-weight: 800; margin-bottom: 0.5rem;\">\u60c5\u5883 A\uff1a\u628a\u300c\u9ede\u9910\u5167\u5bb9\u300d\u5beb\u5728\u300c\u5eda\u5e2b\u8a13\u7df4\u624b\u518a\u300d\u88e1<\/p>\n                            <p style=\"color: var(--text-muted); font-size: 0.95em;\">\u756b\u9762\uff1a\u5eda\u5e2b\u7684\u8a13\u7df4\u624b\u518a\u88e1\u5beb\u8457\u689d\u6b3e\uff1a\u300c\u6bcf\u9053\u83dc\u90fd\u8981\u52a0\u9999\u83dc\u300d\u3002\u7d50\u679c\u5ba2\u4eba\u9ede\u8349\u8393\u86cb\u7cd5\uff0c\u5eda\u5e2b\u4e5f\u52a0\u4e86\u9999\u83dc\u3002<\/p>\n                        <\/div>\n                        <div style=\"margin-top: 1.5rem; padding: 1rem; background: #fef2f2; border-radius: 8px; border-left: 4px solid #ef4444;\">\n                            <p style=\"color: #ef4444; font-weight: 800; margin-bottom: 0.5rem;\">\u60c5\u5883 B\uff1a\u628a\u300c\u885b\u751f\u898f\u7bc4\u300d\u5beb\u5728\u300c\u9ede\u9910\u55ae\u300d\u4e0a<\/p>\n                            <p style=\"color: var(--text-muted); font-size: 0.95em;\">\u756b\u9762\uff1a\u5ba2\u4eba\u9ede\u9910\u6642\uff0c\u8981\u5728\u55ae\u5b50\u4e0a\u5beb\uff1a\u300c\u6211\u8981\u725b\u6392\uff0c\u9084\u6709\u8acb\u8a18\u5f97\u6d17\u624b\u3001\u8acb\u8a18\u5f97\u6234\u5e3d\u5b50&#8230;\u300d\u5ba2\u4eba\u5d29\u6f70\u3002<\/p>\n                        <\/div>\n                    <\/div>\n                <\/div>\n\n                <div class=\"audio-col\">\n                    <div class=\"card audio-card\">\n                        <div class=\"card-title\"><i data-lucide=\"mic\"><\/i> \u65c1\u767d Narration<\/div>\n                        <div class=\"dialogue\">\u300c\u628a\u696d\u52d9\u908f\u8f2f\uff08Spec\uff09\u5beb\u9032 Skill\uff0c\u5c31\u50cf\u5f37\u8feb\u5eda\u5e2b\u4e0d\u7ba1\u716e\u4ec0\u9ebc\u90fd\u8981\u52a0\u9999\u83dc\uff0c\u9019\u6703\u6bc0\u4e86\u4f60\u7684\u5c08\u6848\u3002\u300d<\/div>\n                        <div class=\"dialogue\">\u300c\u628a\u901a\u7528\u898f\u7bc4\uff08Skill\uff09\u5beb\u9032 Spec\uff0c\u4f60\u6bcf\u6b21\u958b\u767c\u65b0\u529f\u80fd\u90fd\u8981\u91cd\u8907\u5beb\u4e00\u5806\u5ee2\u8a71\uff0c\u6548\u7387\u6975\u4f4e\u3002\u300d<\/div>\n                    <\/div>\n                <\/div>\n            <\/article>\n\n            <!-- 5:20 - 6:00 -->\n            <article class=\"script-block\">\n                <div class=\"timestamp\">5:20 &#8211; 6:00<\/div>\n                \n                <div class=\"visual-col\">\n                    <div class=\"card visual-card\">\n                        <div class=\"card-title\"><i data-lucide=\"party-popper\"><\/i> \u756b\u9762 Visual<\/div>\n                        <p style=\"font-weight: 700; margin-bottom: 1rem;\">\u7d50\u5c3e\u8207\u5f69\u86cb (Pro Tip)<\/p>\n                        <p>\u5c55\u793a\uff1a<span class=\"mono\">.cursorrules<\/span> (Skill) \u548c <span class=\"mono\">spec.md<\/span> (Spec) \u7684\u771f\u5be6\u6a23\u5b50\u3002<\/p>\n                    <\/div>\n                <\/div>\n\n                <div class=\"audio-col\">\n                    <div class=\"card audio-card\">\n                        <div class=\"card-title\"><i data-lucide=\"mic\"><\/i> \u65c1\u767d Narration<\/div>\n                        <div class=\"dialogue\">\u300c\u7e3d\u7d50\uff1aSkill \u8ca0\u8cac\u300e\u600e\u9ebc\u505a\u300f(How)\uff0cSpec \u8ca0\u8cac\u300e\u505a\u4ec0\u9ebc\u300f(What)\u3002\u300d<\/div>\n                        <div class=\"dialogue\">\u300c\u6700\u5f8c\u7d66\u500b\u5c0f\u6487\u6b65\uff1a\u9802\u7d1a\u9910\u5ef3\u90fd\u6709\u300e\u8a66\u83dc\u300f\u74b0\u7bc0\u3002\u300d<\/div>\n                        <div class=\"dialogue\">\u300c\u5728\u8b93 AI \u5beb\u5b8c\u6574\u500b App \u4e4b\u524d\uff0c\u5148\u53eb\u5b83\u300e\u5099\u6599\u300f(Generate Plan)\u3002\u8b93\u5b83\u5148\u89e3\u91cb\u5b83\u6253\u7b97\u600e\u9ebc\u505a\uff0c\u78ba\u8a8d\u6c92\u554f\u984c\u518d\u958b\u706b\u3002\u300d<\/div>\n                    <\/div>\n                <\/div>\n            <\/article>\n\n        <\/div>\n\n        <section style=\"margin-bottom: 6rem;\">\n            <h2><i data-lucide=\"sparkles\" style=\"color:var(--accent-secondary); vertical-align: bottom;\"><\/i> \u88fd\u4f5c\u5efa\u8b70 Highlights<\/h2>\n            <div class=\"highlights-grid\">\n                <div class=\"highlight-item\">\n                    <h3 style=\"color: var(--accent-primary); margin-bottom: 1rem;\">\u8996\u89ba\u5c0d\u6bd4<\/h3>\n                    <p style=\"color: var(--text-muted);\">\u5de6\u908a\u653e\u4e00\u76e4\u300c\u8def\u908a\u6524\u4e82\u7092\u300d\uff08\u6c92\u6709 Skill \u7684 Code\uff09\u3002\u53f3\u908a\u653e\u4e00\u76e4\u300c\u7cbe\u7dfb\u64fa\u76e4\u6599\u7406\u300d\uff08\u52a0\u4e86 Skill \u7684 Code\uff09\u3002\u7528\u7d05\u7b46\u5708\u51fa\u5dee\u7570\uff08\u4f8b\u5982\uff1a\u8a3b\u89e3\u3001Docstring\uff09\u3002<\/p>\n                <\/div>\n                <div class=\"highlight-item\">\n                    <h3 style=\"color: var(--accent-primary); margin-bottom: 1rem;\">\u97f3\u6548\u904b\u7528<\/h3>\n                    <p style=\"color: var(--text-muted);\">\u8b1b\u5230 Skill \u6642\uff0c\u7528\u6e05\u8106\u7684\u300c\u78e8\u5200\u8072\u300d\u6216\u300c\u5eda\u623f\u6574\u968a\u8072\u300d\uff08\u4ee3\u8868\u7d00\u5f8b\uff09\u3002\u8b1b\u5230 Spec \u6642\uff0c\u7528\u300c\u6253\u5370\u6a5f\u5370\u51fa\u55ae\u64da\u300d\u7684\u8072\u97f3\uff08\u4ee3\u8868\u4efb\u52d9\u4f86\u4e86\uff09\u3002<\/p>\n                <\/div>\n                <div class=\"highlight-item\">\n                    <h3 style=\"color: var(--accent-primary); margin-bottom: 1rem;\">\u771f\u5be6\u6a94\u6848\u5c55\u793a<\/h3>\n                    <p style=\"color: var(--text-muted);\">\u4e0d\u8981\u53ea\u8b1b\u6982\u5ff5\uff0c\u756b\u9762\u8981\u9583\u904e <span class=\"mono\">.cursorrules<\/span> \u548c <span class=\"mono\">spec.md<\/span> \u7684\u771f\u5be6\u6a23\u5b50\uff0c\u8b93\u89c0\u773e\u77e5\u9053\u9019\u4e0d\u50c5\u50c5\u662f\u6bd4\u55bb\uff0c\u800c\u662f\u53ef\u4ee5\u843d\u5730\u7684\u6280\u8853\u3002<\/p>\n                <\/div>\n            <\/div>\n        <\/section>\n\n    <\/div>\n    \n    <div class=\"script-footer\" style=\"text-align: center; padding: 3rem; border-top: 1px solid var(--border-color); margin-top: 4rem; color: var(--text-muted);\">\n        <p>AI Automation Video Script Project &copy; 2024<\/p>\n    <\/div>\n<\/div>\n\n<script>\n    \/\/ Robust icon initialization for WordPress environment\n    (function() {\n        var interval = setInterval(function() {\n            if (typeof lucide !== 'undefined') {\n                lucide.createIcons();\n                clearInterval(interval);\n            }\n        }, 100);\n        \n        \/\/ Stop checking after 5 seconds to avoid infinite loop if script fails\n        setTimeout(function() { clearInterval(interval); }, 5000);\n    })();\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>Agent Skill vs. SpecCoding \u5f71\u7247\u88fd\u4f5c\u8173\u672c | Video Production Script \u6838\u5fc3\u6bd4\u55bb\uff1a\u4f60\u7684 AI \u958b\u767c\u74b0\u5883\u5c31\u662f\u4e00\u9593\u300c\u9802\u7d1a\u9910\u5ef3\u300d \u300cAI \u4e0d\u662f\u4e0d\u61c2\u7a0b\u5f0f\uff0c\u800c\u662f\u4f60\u6c92\u544a\u8a34\u5b83\u300e\u4f60\u8981\u4ec0\u9ebc\u6a23\u7684\u5de5\u7a0b\u5e2b\u300f\u3002\u300d 0:00 &#8211; 0:50 \u756b\u9762 Visual \u5834\u666f\uff1a\u5eda\u623f\u88e1\u7684\u707d\u96e3 \u4e00\u500b\u770b\u8d77\u4f86\u5f88\u53b2\u5bb3\u7684\u6a5f\u5668\u4eba\u5eda\u5e2b\uff08LLM\uff09\uff0c\u9762\u5c0d\u4e00\u5806\u98df\u6750\u624b\u5fd9\u8173\u4e82\u3002 \u4f60\u5c0d\u5b83\u558a\uff1a\u300c\u505a\u500b\u6f22\u5821\uff01\u300d \u7d50\u679c\u5b83\u505a\u51fa\u4f86\u4e00\u500b\u628a\u8089\u653e\u5728\u9eb5\u5305\u5916\u9762\u7684\u5947\u602a\u7269\u9ad4\uff0c\u6216\u8005\u52a0\u4e86\u5de7\u514b\u529b\u91ac\u7684\u6f22\u5821\u3002 \u7279\u6548\u5b57\u5361\uff1a\u300cAI \u4e0d\u662f\u4e0d\u61c2\u7a0b\u5f0f\uff0c\u800c\u662f\u4f60\u6c92\u544a\u8a34\u5b83\u300e\u4f60\u8981\u4ec0\u9ebc\u6a23\u7684\u5de5\u7a0b\u5e2b\u300f\u3002\u300d \u65c1\u767d Narration \u300c\u4f60\u662f\u5426\u89ba\u5f97\u4f60\u7684 AI \u5beb Code \u7e3d\u662f\u300e\u6709\u505a\u6c92\u6709\u61c2\u300f\uff1f\u660e\u660e\u80fd\u8dd1\uff0c\u4f46\u5beb\u6cd5\u5b8c\u5168\u4e0d\u7b26\u5408\u4f60\u5011\u5718\u968a\u7684\u898f\u7bc4\uff1f\u300d \u300c\u554f\u984c\u4e0d\u5728 AI \u7b28\uff0c\u800c\u5728\u65bc\u4f60\u628a\u5b83\u7576\u6210\u4e00\u500b\u8def\u4eba\uff0c\u76f4\u63a5\u53eb\u5b83\u505a\u83dc\u3002\u300d \u300c\u4eca\u5929\u6211\u5011\u7528\u300e\u9802\u7d1a\u9910\u5ef3\u300f\u7684\u6982\u5ff5\uff0c\u5fb9\u5e95\u641e\u61c2 Agent Skill \u548c SpecCoding\u3002\u300d 0:50 &#8211; 2:00 \u756b\u9762 Visual Part 1: Agent Skill \u2014\u2014 \u4e3b\u5eda\u7684\u300c\u6d41\u6d3e\u8207\u7d00\u5f8b\u300d Skill = \u4e3b\u5eda\u7684\u8a13\u7df4 (The [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"googlesitekit_rrm_CAowvqSiDA:productID":"","footnotes":""},"class_list":["post-7512","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/infernews.com\/blog\/wp-json\/wp\/v2\/pages\/7512","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/infernews.com\/blog\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/infernews.com\/blog\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/infernews.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/infernews.com\/blog\/wp-json\/wp\/v2\/comments?post=7512"}],"version-history":[{"count":1,"href":"https:\/\/infernews.com\/blog\/wp-json\/wp\/v2\/pages\/7512\/revisions"}],"predecessor-version":[{"id":7513,"href":"https:\/\/infernews.com\/blog\/wp-json\/wp\/v2\/pages\/7512\/revisions\/7513"}],"wp:attachment":[{"href":"https:\/\/infernews.com\/blog\/wp-json\/wp\/v2\/media?parent=7512"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}