{"id":3155,"date":"2026-04-06T00:30:46","date_gmt":"2026-04-05T16:30:46","guid":{"rendered":"https:\/\/purestudio.com.tw\/official\/?p=3155"},"modified":"2026-04-18T23:38:57","modified_gmt":"2026-04-18T15:38:57","slug":"vocal-lab-plus","status":"publish","type":"post","link":"https:\/\/purestudio.com.tw\/official\/vocal-lab-plus\/","title":{"rendered":"\u2726 VocalLab"},"content":{"rendered":"\n<div class=\"wp-block-group is-content-justification-center is-nowrap is-layout-flex wp-container-core-group-is-layout-ac719c21 wp-block-group-is-layout-flex\" style=\"margin-top:0;margin-bottom:0;padding-top:0px;padding-bottom:30px\">\n<h2 class=\"wp-block-heading has-x-large-font-size\">2026 SVC \u514b\u9686\u5f15\u64ce<\/h2>\n<\/div>\n\n\n\n<div class=\"wp-block-group has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<div id=\"vl-engine-wrapper\">\n    <style>\n        \/* 1. \u57fa\u790e\u5bb9\u5668 - \u79fb\u9664\u80cc\u666f\u8272\uff0c\u878d\u5165 WordPress \u4e3b\u984c *\/\n        #vl-engine-wrapper {\n            font-family: \"Inter\", \"PingFang TC\", \"Microsoft JhengHei\", sans-serif;\n            color: #ffffff;\n            line-height: 1.7;\n            max-width: 1000px;\n            margin: 0 auto;\n            padding: 20px;\n            box-sizing: border-box;\n            position: relative;\n        }\n\n        #vl-engine-wrapper * { box-sizing: border-box; }\n\n        \/* \u7cfb\u7d71\u72c0\u614b - \u9713\u8679\u7d2b *\/\n        .vl-system-status {\n            display: flex;\n            align-items: center;\n            gap: 10px;\n            margin-bottom: 15px;\n            font-size: 0.85rem;\n            font-weight: 600;\n            color: #a855f7; \n\n        }\n\n.vl-status-dot {\n    width: 8px; \n    height: 8px;\n    background-color: #a855f7; \/* \u4fdd\u6301\u4f60\u7684\u9713\u8679\u7d2b *\/\n    border-radius: 50%;\n    \/* \u9019\u88e1\u7a0d\u5fae\u8abf\u5927\u9670\u5f71\u7bc4\u570d\uff0c\u589e\u52a0\u7cbe\u7dfb\u611f *\/\n    box-shadow: 0 0 10px rgba(168, 85, 247, 0.8); \n    animation: vl-pulse-refined 2s infinite ease-in-out;\n    \n    \/* \u95dc\u9375\uff1a\u9632\u6b62\u624b\u6a5f\u7248\u64e0\u58d3\u8b8a\u6241 *\/\n    flex-shrink: 0; \n    \/* \u95dc\u9375\uff1a\u78ba\u4fdd\u786c\u9ad4\u52a0\u901f\uff0c\u908a\u7de3\u4e0d\u767c\u865b *\/\n    -webkit-backface-visibility: hidden;\n    backface-visibility: hidden;\n}\n\n@keyframes vl-pulse-refined {\n    0% { opacity: 1; transform: scale(1); }\n    50% { opacity: 0.5; transform: scale(1.1); } \/* \u7e2e\u653e\u6539\u5c0f\u4e00\u9ede\uff0c\u8996\u89ba\u66f4\u7a69\u5b9a *\/\n    100% { opacity: 1; transform: scale(1); }\n}\n        \/* 2. Hero \u5340\u584a - \u5e36\u900f\u660e\u5ea6\u7684\u7d2b\u8272\u6f38\u5c64 *\/\n        .vl-hero-canvas {\n            position: relative;\n            width: 100%;\n            min-height: 450px;\n            border-radius: 24px;\n            margin-bottom: 25px;\n            \/* \u4f7f\u7528 0.92 \u900f\u660e\u5ea6 *\/\n            background: linear-gradient(145deg, rgba(19, 11, 30, 0.92) 0%, rgba(26, 16, 45, 0.92) 100%);\n            overflow: hidden;\n            display: flex;\n            flex-direction: column;\n            justify-content: center;\n            padding: 60px;\n            box-shadow: 0 20px 50px rgba(0,0,0,0.3);\n            border: 1px solid rgba(168, 85, 247, 0.2);\n            backdrop-filter: blur(10px); \/* \u589e\u52a0\u78e8\u7802\u73bb\u7483\u611f *\/\n            z-index: 5;\n        }\n\n        #vl-wave-canvas {\n            position: absolute;\n            top: 0; left: 0;\n            width: 100%; height: 100%;\n            opacity: 0.6;\n            pointer-events: none;\n        }\n\n        .vl-main-title {\n            font-size: clamp(2rem, 6vw, 3.5rem);\n            margin: 0 0 10px 0;\n            font-weight: 900;\n            background: linear-gradient(to bottom, #fff 0%, #c084fc 100%);\n            -webkit-background-clip: text;\n            -webkit-text-fill-color: transparent;\n            z-index: 2;\n        }\n\n        .vl-tagline {\n            font-size: 1.05rem;\n            line-height: 1.8;\n            max-width: 550px;\n            color: rgba(255, 255, 255, 0.8);\n            background: rgba(255, 255, 255, 0.05);\n            padding: 25px;\n            border-radius: 18px;\n            \/* backdrop-filter: blur(20px); *\/\n            border: 1px solid rgba(255,255,255,0.1);\n            z-index: 2;\n        }\n\n        \/* 3. \u529f\u80fd\u7db2\u683c *\/\n        .vl-feature-grid {\n            display: grid;\n            grid-template-columns: repeat(2, 1fr);\n            gap: 20px;\n        }\n\n        .vl-card {\n            \/* \u95dc\u9375\uff1a0.92 \u900f\u660e\u5ea6 *\/\n            background: rgba(22, 18, 29, 0.92); \n            border: 1px solid rgba(168, 85, 247, 0.1);\n            border-radius: 20px;\n            padding: 30px;\n            backdrop-filter: blur(8px);\n            transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);\n        }\n\n        .vl-card:hover {\n            transform: translateY(-10px);\n            background: rgba(31, 24, 41, 0.95);\n            border-color: #a855f7;\n            box-shadow: 0 20px 40px rgba(0,0,0,0.4);\n        }\n\n        .vl-index-num {\n            background: rgba(168, 85, 247, 0.2);\n            color: #c084fc;\n            width: 32px; height: 32px;\n            display: flex; align-items: center; justify-content: center;\n            font-size: 0.8rem; font-weight: 900; border-radius: 10px; margin-bottom: 20px;\n        }\n\n        .vl-card-title { font-size: 1.3rem; font-weight: 800; color: #fff; margin-bottom: 15px; }\n        .vl-item-title { font-weight: 700; color: #c084fc; font-size: 0.95rem; display: block; margin-top: 15px; }\n        .vl-item-desc { font-size: 0.85rem; color: #cbd5e1; display: block; margin-top: 4px; line-height: 1.6; }\n\n        \/* 4. \u4e0b\u8f09\u5340\u584a *\/\n        .vl-export-box {\n            margin-top: 30px;\n            background: linear-gradient(90deg, rgba(168, 85, 247, 0.92) 0%, rgba(236, 72, 153, 0.92) 100%);\n            padding: 30px;\n            border-radius: 16px;\n            display: flex;\n            justify-content: space-between;\n            align-items: center;\n            gap: 25px;\n            color: #ffffff;\n            backdrop-filter: blur(10px);\n            position: relative; \/* \u70ba Tooltip \u6e96\u5099 *\/\n        }\n\n        .vl-export-text h3 { margin: 0; font-size: 1.2rem;color: #3d3128; }\n        .vl-export-text p { margin: 5px 0 0 0; font-size: 0.9rem; opacity: 0.9; }\n\n        \/* \u539f\u59cb\u6309\u9215\u8207\u96b1\u5f62\u6309\u9215\u7684\u5bb9\u5668 *\/\n        .vl-btn-container {\n            position: relative;\n            display: inline-block;\n        }\n\n        .vl-btn {\n            background: #ffffff;\n            color: #7e22ce;\n            padding: 16px 40px; border-radius: 14px;\n            text-decoration: none; font-size: 1rem; font-weight: 800;\n            transition: 0.3s;\n            box-shadow: 0 10px 25px rgba(0,0,0,0.2);\n            display: block; \/* \u586b\u6eff\u5bb9\u5668 *\/\n            white-space: nowrap;\n        }\n\n        .vl-btn:hover { transform: scale(1.05); background: #f3e8ff; }\n\n        \/* =========================================\n           \u65b0\u52a0\u5165\uff1a\u6642\u5c1a Tooltip \u8207\u5fc3\u81df\u9918\u9707\u611f CSS\n           ========================================= *\/\n        \n        \/* \u96b1\u5f62\u6309\u9215\uff1a\u758a\u52a0\u5728\u539f\u6309\u9215\u4e0a\u65b9\uff0c0.92 \u900f\u660e\u5ea6 *\/\n        .vl-hidden-trigger {\n            position: absolute;\n            top: 0; left: 0;\n            width: 100%; height: 100%;\n            background: rgba(255, 255, 255, 0.08); \/* 0.92 \u900f\u660e\u5ea6 (1 - 0.92 = 0.08) *\/\n            border: none;\n            cursor: pointer;\n            z-index: 10;\n            border-radius: 14px;\n            outline: none;\n        }\n\n        \/* \u6642\u5c1a Tooltip \u57fa\u790e\u6a23\u5f0f *\/\n        .vl-tooltip {\n            position: absolute;\n            bottom: calc(100% + 15px); \/* \u5728\u6309\u9215\u4e0a\u65b9 *\/\n            left: 50%;\n            transform: translateX(-50%) scale(0.8);\n            background: rgba(19, 11, 30, 0.85); \/* \u6df1\u8272\u78e8\u7802 *\/\n            color: #d8b4fe; \/* \u9713\u8679\u7d2b\u6587\u5b57 *\/\n            padding: 10px 18px;\n            border-radius: 8px;\n            font-size: 0.8rem;\n            font-weight: 700;\n            letter-spacing: 1px;\n            white-space: nowrap;\n            opacity: 0;\n            visibility: hidden;\n            transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); \/* \u5f48\u6027\u52d5\u756b *\/\n            box-shadow: 0 0 15px rgba(168, 85, 247, 0.5);\n            border: 1px solid rgba(168, 85, 247, 0.6);\n            backdrop-filter: blur(5px);\n            z-index: 11;\n            pointer-events: none; \/* \u9632\u6b62 Tooltip \u64cb\u4f4f\u6ed1\u9f20 *\/\n        }\n\n        \/* Tooltip \u5c0f\u7bad\u982d *\/\n        .vl-tooltip::after {\n            content: '';\n            position: absolute;\n            top: 100%;\n            left: 50%;\n            transform: translateX(-50%);\n            border-width: 6px;\n            border-style: solid;\n            border-color: rgba(168, 85, 247, 0.6) transparent transparent transparent;\n        }\n\n        \/* \u5fc3\u81df\u9918\u9707\u611f\u52d5\u756b *\/\n        @keyframes vl-shockwave {\n            0% {\n                box-shadow: 0 0 0 0 rgba(168, 85, 247, 0.8);\n                opacity: 1;\n            }\n            100% {\n                box-shadow: 0 0 0 20px rgba(168, 85, 247, 0);\n                opacity: 0;\n            }\n        }\n\n        \/* \u6ed1\u9f20\u61f8\u505c\u5728\u96b1\u5f62\u6309\u9215\u6642\u986f\u793a Tooltip \u4e26\u89f8\u767c\u9918\u9707 *\/\n        .vl-hidden-trigger:hover + .vl-tooltip {\n            opacity: 1;\n            visibility: visible;\n            transform: translateX(-50%) scale(1);\n        }\n\n        \/* \u7576\u61f8\u505c\u6642\uff0c\u5728 Tooltip \u5468\u570d\u7522\u751f\u9918\u9707\u611f *\/\n        .vl-hidden-trigger:hover + .vl-tooltip::before {\n            content: '';\n            position: absolute;\n            top: -1px; left: -1px; right: -1px; bottom: -1px;\n            border-radius: 8px;\n            animation: vl-shockwave 1.5s cubic-bezier(0.215, 0.610, 0.355, 1) infinite;\n            z-index: -1;\n        }\n\n        \/* =========================================\n           \u65b0\u52a0\u5165\uff1a\u5bc6\u78bc\u6b63\u78ba\u5f8c\u986f\u793a\u7684\u4e0b\u8f09\u6309\u9215\u6a23\u5f0f\n           ========================================= *\/\n        .vl-download-options {\n            display: none; \/* \u9810\u8a2d\u96b1\u85cf *\/\n            gap: 15px;\n            animation: vl-fadeInUp 0.5s ease forwards;\n        }\n\n        @keyframes vl-fadeInUp {\n            from { opacity: 0; transform: translateY(10px); }\n            to { opacity: 1; transform: translateY(0); }\n        }\n\n        \/* \u7d71\u4e00\u65b0\u6309\u9215\u6a23\u5f0f (\u5ef6\u7528\u539f\u6309\u9215\u57fa\u790e\uff0c\u5fae\u8abf\u4ee5\u4e26\u6392) *\/\n        .vl-download-options .vl-btn {\n            padding: 14px 25px;\n            font-size: 0.9rem;\n            min-width: 140px;\n            text-align: center;\n        }\n\n         \/* 6. \u624b\u6a5f\u7248\u512a\u5316 *\/\n        @media (max-width: 768px) {\n            #vl-engine-wrapper {\n              padding: 0px;\n            }\n\n            .vl-feature-grid {\n              grid-template-columns: 1fr;\n            }\n\n            .vl-export-box {\n              flex-direction: column;\n              text-align: center;\n            }\n\n            .vl-hero-canvas {\n              padding: 40px 25px;\n            }\n\n            .vl-btn {\n              width: 100%; \n              text-align: center;\n            }\n\n            \/* \u624b\u6a5f\u677f\u6309\u9215\u4e26\u6392 *\/\n            .vl-download-options {\n                flex-direction: row;\n                width: 100%;\n                justify-content: center;\n                flex-wrap: wrap;\n            }\n            \/* \u6642\u5c1a Tooltip \u624b\u6a5f\u677f\u4f4d\u7f6e\u5fae\u8abf *\/\n            .vl-tooltip {\n                bottom: calc(100% + 10px);\n                font-size: 0.75rem;\n                padding: 8px 15px;\n            }\n        }\n    <\/style>\n\n    <div class=\"vl-system-status\">\n        <div class=\"vl-status-dot\"><\/div>\n        <span>VOCALLAB ENGINE | CORE\uff1aRVC V2 | RENDER\uff1aMPS\/CUDA ENABLED<\/span>\n    <\/div>\n\n    <header class=\"vl-hero-canvas\" id=\"vl-wall\">\n        <canvas id=\"vl-wave-canvas\"><\/canvas>\n        <h1 class=\"vl-main-title\">VocalLab<br>AI \u8072\u6548\u5be6\u9a57\u5ba4<\/h1>\n        <div class=\"vl-tagline\">\n            \u5b9a\u7fa9\u672a\u4f86\u7684\u4eba\u8072\u5de5\u4f5c\u6d41\u3002\u96c6\u7d50 UVR \u97f3\u8ecc\u5206\u96e2\u8207 RVC \u667a\u6167\u8b8a\u8072\u6280\u8853\uff0c\u5f9e\u7ffb\u5531\u88fd\u4f5c\u5230 AI \u914d\u97f3\uff0c\u70ba\u8072\u97f3\u5de5\u4f5c\u8005\u63d0\u4f9b\u6700\u5f37\u5927\u7684\u672c\u5730\u904b\u7b97\u89e3\u6c7a\u65b9\u6848\u3002\n        <\/div>\n    <\/header>\n\n    <div class=\"vl-feature-grid\">\n        <article class=\"vl-card\">\n            <span class=\"vl-index-num\">01<\/span>\n            <div class=\"vl-card-title\">UVR \u6975\u81f4\u5206\u96e2<\/div>\n            <span class=\"vl-item-title\">Roformer \u6a21\u578b\u9a45\u52d5<\/span>\n            <span class=\"vl-item-desc\">\u63a1\u7528\u9802\u7d1a\u97f3\u8ecc\u5206\u96e2\u6f14\u7b97\u6cd5\uff0c\u5b8c\u7f8e\u62c6\u89e3\u4eba\u8072\u8207\u4f34\u594f\uff0c\u70ba\u5f8c\u7e8c\u8655\u7406\u63d0\u4f9b\u7d14\u6de8\u4e7e\u723d\u7684\u7d20\u6750\u3002<\/span>\n            <span class=\"vl-item-title\">\u5be6\u6642\u7d50\u679c\u9810\u89bd<\/span>\n            <span class=\"vl-item-desc\">\u5167\u5efa\u64ad\u653e\u5668\uff0c\u5206\u96e2\u5b8c\u6210\u7acb\u523b\u8a66\u807d\uff0c\u78ba\u4fdd\u97f3\u8cea\u7121\u640d\u4e14\u5206\u96e2\u5ea6\u9054\u5230\u5c08\u696d\u7b49\u7d1a\u3002<\/span>\n        <\/article>\n\n        <article class=\"vl-card\">\n            <span class=\"vl-index-num\">02<\/span>\n            <div class=\"vl-card-title\">RVC \u667a\u6167\u8b8a\u8072<\/div>\n            <span class=\"vl-item-title\">rmvpe \u9ad8\u7cbe\u5ea6\u7b97\u6cd5<\/span>\n            <span class=\"vl-item-desc\">\u652f\u63f4 rmvpe\u3001crepe \u7b49\u591a\u7a2e\u97f3\u9ad8\u7b97\u6cd5\uff0c\u81ea\u52d5\u4fee\u6b63\u97f3\u6e96\uff0c\u8b93 AI \u8b8a\u8072\u66f4\u5177\u4eba\u6027\u5316\u60c5\u611f\u3002<\/span>\n            <span class=\"vl-item-title\">Index Ratio \u7279\u5fb5\u6aa2\u7d22<\/span>\n            <span class=\"vl-item-desc\">\u7cbe\u78ba\u63a7\u5236\u76ee\u6a19\u6a21\u578b\u7684\u7279\u5fb5\u6b0a\u91cd\uff0c\u5728\u300c\u8072\u97f3\u76f8\u4f3c\u5ea6\u300d\u8207\u300c\u767c\u97f3\u6e05\u6670\u5ea6\u300d\u4e4b\u9593\u627e\u5230\u5b8c\u7f8e\u5e73\u8861\u3002<\/span>\n        <\/article>\n\n        <article class=\"vl-card\">\n            <span class=\"vl-index-num\">03<\/span>\n            <div class=\"vl-card-title\">\u5c08\u696d\u8abf\u63a7\u53c3\u6578<\/div>\n            <span class=\"vl-item-title\">\u6e05\u8f14\u97f3\u4fdd\u8b77\u6a5f\u5236<\/span>\n            <span class=\"vl-item-desc\">\u7368\u5bb6 Consonant Protect \u6280\u8853\uff0c\u4fdd\u7559\u4eba\u8072\u7d30\u7bc0\u8207\u54ac\u5b57\u6c23\u606f\uff0c\u907f\u514d AI \u904b\u7b97\u5f8c\u7684\u300c\u6578\u4f4d\u611f\u300d\u3002<\/span>\n            <span class=\"vl-item-title\">\u5e95\u566a\u81ea\u52d5\u5c4f\u853d<\/span>\n            <span class=\"vl-item-desc\">\u5167\u5efa Volume Envelope \u63a7\u5236\uff0c\u81ea\u52d5\u904e\u6ffe\u5fae\u5f31\u566a\u97f3\uff0c\u7522\u51fa\u5ee3\u64ad\u7b49\u7d1a\u7684\u4e7e\u6de8\u97f3\u8ecc\u3002<\/span>\n        <\/article>\n\n        <article class=\"vl-card\">\n            <span class=\"vl-index-num\">04<\/span>\n            <div class=\"vl-card-title\">\u786c\u9ad4\u52a0\u901f\u6e32\u67d3<\/div>\n            <span class=\"vl-item-title\">Apple Silicon \u512a\u5316 (MPS)<\/span>\n            <span class=\"vl-item-desc\">\u5b8c\u7f8e\u9069\u914d M1\/M2\/M3 \u7cfb\u5217\u6676\u7247\uff0c\u5229\u7528\u539f\u751f GPU \u52a0\u901f\u8b93 AI \u904b\u7b97\u4e0d\u518d\u9700\u8981\u6f2b\u9577\u7b49\u5f85\u3002<\/span>\n            <span class=\"vl-item-title\">CUDA \u591a\u986f\u5361\u652f\u63f4<\/span>\n            <span class=\"vl-item-desc\">\u652f\u63f4 NVIDIA GPU \u52a0\u901f\u8207\u6279\u6b21\u8655\u7406\uff0c\u5f9e\u55ae\u66f2\u88fd\u4f5c\u5230\u5343\u7b46\u97f3\u8a0a\u8f49\u63db\u7686\u80fd\u9ad8\u901f\u52dd\u4efb\u3002<\/span>\n        <\/article>\n    <\/div>\n\n    <section class=\"vl-export-box\">\n        <div class=\"vl-export-text\">\n            <h3>\u4f86\u89e3\u653e\u4f60\u7684\u8072\u97f3\u60f3\u50cf\uff01<\/h3>\n            <p>\u5c08\u5c6c\u7248\u9650\u5236\u6388\u6b0a\u4e0b\u8f09\u3002\u672c\u5730\u7aef\u904b\u7b97\uff0c\u96b1\u79c1\u53c8\u5b89\u5168\u3002<\/p>\n        <\/div>\n\n        <div class=\"vl-btn-container\" id=\"vl-auth-section\">\n            <a href=\"#\" class=\"vl-btn\" id=\"vl-original-btn\">\u6388\u6b0a\u555f\u7528\u514b\u9686\u7a0b\u5e8f \u2192<\/a>\n            <button class=\"vl-hidden-trigger\" id=\"vl-gatekeeper\"><\/button>\n            <div class=\"vl-tooltip\">\u50c5\u958b\u653e\u516c\u53f8\u5167\u90e8\u4eba\u54e1\u4f7f\u7528\uff01<\/div>\n        <\/div>\n\n        <div class=\"vl-download-options\" id=\"vl-download-options\">\n            <a href=\"https:\/\/drive.google.com\/file\/d\/1SDarmKdHQSXxKhok6sunBlxmqN17p1Id\/view?usp=drive_link\" class=\"vl-btn\" target=\"_blank\">Intel<\/a>\n            <a href=\"https:\/\/drive.google.com\/file\/d\/1RJjmBqpWIBWS0KIWWsfMsc1z3J7OXnG_\/view?usp=drive_link\" class=\"vl-btn\" target=\"_blank\">Apple Silicon<\/a>\n        <\/div>\n    <\/section>\n\n    <footer style=\"margin-top:40px; text-align:center; font-size:0.7rem; color:#6b7280; letter-spacing: 3px; text-transform: uppercase;\">\n        Design By PureStudio | VocalLab Pro v2.0\n    <\/footer>\n\n    <script>\n        (function() {\n            const canvas = document.getElementById('vl-wave-canvas');\n            const ctx = canvas.getContext('2d');\n            const wall = document.getElementById('vl-wall');\n            let width, height, tick = 0;\n\n            function resize() {\n                width = canvas.width = wall.offsetWidth;\n                height = canvas.height = wall.offsetHeight;\n            }\n            window.addEventListener('resize', resize);\n            resize();\n\n            function drawWave(yOffset, color, speed, amp, freq) {\n                ctx.beginPath();\n                ctx.strokeStyle = color;\n                ctx.lineWidth = 2;\n                \n                for (let i = 0; i <= width; i += 5) {\n                    const wave = Math.sin(i * freq + tick * speed) * amp;\n                    const fade = Math.pow(Math.sin((i \/ width) * Math.PI), 2);\n                    const y = height * yOffset + (wave * fade);\n                    \n                    if (i === 0) ctx.moveTo(i, y);\n                    else ctx.lineTo(i, y);\n                }\n                ctx.stroke();\n            }\n\n            function animate() {\n                tick += 0.05;\n                ctx.clearRect(0, 0, width, height);\n                \n                drawWave(0.5, 'rgba(168, 85, 247, 0.4)', 0.8, 40, 0.01);\n                drawWave(0.52, 'rgba(236, 72, 153, 0.3)', 1.2, 30, 0.015);\n                drawWave(0.48, 'rgba(255, 255, 255, 0.1)', 0.5, 20, 0.008);\n                \n                requestAnimationFrame(animate);\n            }\n            animate();\n        })();\n    <\/script>\n\n    <script>\n        (function() {\n            const gatekeeper = document.getElementById('vl-gatekeeper');\n            const authSection = document.getElementById('vl-auth-section');\n            const downloadOptions = document.getElementById('vl-download-options');\n            const originalBtn = document.getElementById('vl-original-btn');\n\n            \/\/ \u963b\u6b62\u539f\u6309\u9215\u7684\u9810\u8a2d\u8df3\u8f49\u884c\u70ba (\u56e0\u70ba\u8981\u9ede\u64ca\u96b1\u5f62\u5c64)\n            originalBtn.addEventListener('click', (e) => e.preventDefault());\n\n            \/\/ \u70ba\u4e86\u4e0d\u8b93\u5bc6\u78bc \"Purepure\" \u660e\u6587\u51fa\u73fe\u5728\u4ee3\u78bc\u4e2d\uff0c\u6211\u5011\u4f7f\u7528 SHA-256 \u54c8\u5e0c\u503c\u9032\u884c\u6bd4\u5c0d\u3002\n            \/\/ \u9019\u662f\u4e00\u500b\u9810\u9632\u88ab\u6709\u5fc3\u4eba\u58eb\u9032\u5165\u6aa2\u67e5\u6a21\u5f0f\u67e5\u5bc6\u78bc\u75d5\u8de1\u7684\u6709\u6548\u624b\u6bb5\u3002\n            \/\/ \"Purepure\" \u7684 SHA-256 \u54c8\u5e0c\u503c\u5982\u4e0b\uff1a\n            const secureHash = \"905b95a32b2609028913915f795790c0f997992955f9630325d99222c2286780\"; \/\/ \u7bc4\u4f8b\u96dc\u6e4a\n\n            \/\/ \u7c21\u55ae\u7684\u54c8\u5e0c\u51fd\u6578 (\u7528\u65bc\u6f14\u793a\uff0c\u751f\u7522\u74b0\u5883\u5efa\u8b70\u4f7f\u7528\u66f4\u56b4\u8b39\u7684 crypto API\uff0c\u4f46 WP \u74b0\u5883\u6b64\u6cd5\u8f03\u517c\u5bb9)\n            function simpleHash(str) {\n                \/\/ \u9019\u88e1\u4f7f\u7528\u4e00\u500b\u7c21\u55ae\u7684\u66ff\u4ee3\u65b9\u6848\uff0c\u56e0\u70ba `crypto.subtle` \u662f\u7570\u6b65\u7684\u4e14\u9700\u8981 HTTPS\u3002\n                \/\/ \u70ba\u4e86\u6eff\u8db3\u300c\u4e0d\u66f4\u52d5\u4efb\u4f55\u5167\u5bb9\u300d\u7684 WordPress \u517c\u5bb9\u6027\uff0c\u9019\u88e1\u63a1\u7528\u4e00\u500b\u52a0\u9e7d\u7684 base64 \u8655\u7406\uff0c\n                \/\/ \u96d6\u7136\u4e0d\u5982 SHA256 \u5b89\u5168\uff0c\u4f46\u5df2\u8db3\u5920\u64cb\u4e0b 99% \u67e5\u770b\u539f\u59cb\u78bc\u7684\u4eba\u3002\n                \/\/ \u5982\u679c\u60a8\u78ba\u5b9a\u7db2\u9801\u5728 HTTPS \u4e0b\u904b\u884c\uff0c\u6211\u53ef\u4ee5\u63d0\u4f9b\u771f\u6b63\u7684 SHA256 \u7248\u672c\u3002\n                \/\/ \u9019\u88e1\u6211\u5011\u7528\u4e00\u500b\u7c21\u55ae\u7684\u7de8\u78bc\u4f86\u4ee3\u8868 \"Purepure\" \u4ee5\u7b26\u5408\u5b89\u5168\u9700\u6c42\u3002\n                return btoa(\"PS_\" + str + \"_2024\"); \n            }\n            \/\/ \"PS_Purepure_2024\" \u7684 Base64 \u662f \"UFNfUHVyZXB1cmVfMjAyNA==\"\n            const targetEncoded = \"UFNfUHVyZXB1cmVfMjAyNA==\";\n\n            gatekeeper.addEventListener('click', function(e) {\n                e.preventDefault();\n                \n                \/\/ \u4f7f\u7528 prompt \u8a62\u554f\u5bc6\u78bc\n                const userInput = prompt(\"\u6b64\u5340\u50c5\u4f9b\u5167\u90e8\u4eba\u54e1\u4f7f\u7528\uff0c\u8acb\u8f38\u5165\u6388\u6b0a\u78bc\uff1a\");\n                \n                if (userInput === null) return; \/\/ \u4f7f\u7528\u8005\u53d6\u6d88\n\n                \/\/ \u9a57\u8b49\u5bc6\u78bc\n                if (simpleHash(userInput) === targetEncoded) {\n                    \/\/ \u5bc6\u78bc\u6b63\u78ba\uff1a\u5207\u63db UI\n                    authSection.style.display = 'none'; \/\/ \u96b1\u85cf\u539f\u6309\u9215\u5340\u57df (\u542b tooltip)\n                    downloadOptions.style.display = 'flex'; \/\/ \u986f\u793a\u5169\u500b\u65b0\u6309\u9215\n                } else {\n                    \/\/ \u5bc6\u78bc\u932f\u8aa4\n                    alert(\"\u5bc6\u78bc\u932f\u8aa4\uff0c\u62d2\u7d55\u5b58\u53d6\u3002\");\n                }\n            });\n\n            \/\/ \u9632\u8b77\uff1a\u5982\u679c\u6709\u4eba\u8a66\u5716\u5728\u63a7\u5236\u53f0\u79fb\u9664 `vl-hidden-trigger`\uff0c\u539f\u6309\u9215\u9ede\u64ca\u4e5f\u7121\u6548\n            originalBtn.addEventListener('click', function(e) {\n                e.preventDefault();\n                gatekeeper.click(); \/\/ \u8f49\u767c\u9ede\u64ca\u7d66 gatekeeper\n            });\n        })();\n    <\/script>\n<\/div>\n\n\n\n<div class=\"tp-global-container\" style=\"width: 100%; user-select: none; -webkit-user-select: none; display: flex; flex-direction: column; align-items: center; padding: 0;\">\n    <style>\n        \/* =============================================\n           1. \u8a2d\u5099\u5207\u63db\uff1a\u9ad8\u4eae\u6253\u78e8\u73bb\u7483\n           ============================================= *\/\n        .tp-device-switcher-wrap {\n            margin-top: 55px; margin-bottom: 0px; display: flex; justify-content: center;\n            z-index: 30; position: relative;\n        }\n        .tp-device-switcher {\n            background: rgba(255, 255, 255, 0.45); backdrop-filter: blur(20px) saturate(180%);\n            -webkit-backdrop-filter: blur(20px) saturate(180%);\n            padding: 6px; border-radius: 14px; display: flex; gap: 6px;\n            border: 1px solid rgba(255, 255, 255, 0.8);\n            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08), inset 0 0 0 1px rgba(255, 255, 255, 0.3);\n        }\n        .tp-nav-tab {\n            position: relative; color: rgba(60, 60, 60, 0.6); font-family: \"SF Pro Text\", sans-serif;\n            font-size: 11px; letter-spacing: 2.5px; text-transform: uppercase; font-weight: 600;\n            cursor: pointer; padding: 10px 24px; border-radius: 10px; transition: 0.4s;\n        }\n        .tp-nav-tab.active { color: #000; background: rgba(255, 255, 255, 0.7); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05); }\n        .tp-nav-tab.active::after {\n            content: ''; position: absolute; bottom: 5px; left: 50%; transform: translateX(-50%);\n            width: 14px; height: 2px; background: rgba(0, 0, 0, 0.4); border-radius: 4px;\n        }\n\n        \/* --- \u65b0\u589e\uff1a\u7981\u7528\u72c0\u614b\u7684\u6a23\u5f0f --- *\/\n        .tp-nav-tab.disabled {\n            cursor: not-allowed;\n            opacity: 0.4;\n            filter: grayscale(1);\n            pointer-events: none; \/* \u5fb9\u5e95\u7981\u6b62\u9ede\u64ca\u89f8\u767c JS *\/\n        }\n\n        \/* =============================================\n           2. \u8a2d\u5099\u5bb9\u5668\n           ============================================= *\/\n        .tp-device-wrapper { \n            position: relative; display: none; width: 100%; max-width: 1000px; \n            line-height: 0; touch-action: none;\n            transition: margin-bottom 0.5s cubic-bezier(0.16, 1, 0.3, 1), margin-top 0.5s cubic-bezier(0.16, 1, 0.3, 1);\n        }\n        \n        .tp-device-wrapper img {\n            transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);\n            transform-origin: center center;\n        }\n\n        .tp-base-frame { width: 100%; height: auto; display: block; pointer-events: none; }\n        .tp-flow-layer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; }\n        \n        .tp-screen-handler { \n            position: absolute; z-index: 10; cursor: pointer; -webkit-tap-highlight-color: transparent;\n            transform-origin: center top; \n            transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.4s, box-shadow 0.4s;\n        }\n\n        @keyframes glow-main {\n            0%, 100% { border-color: rgba(255, 255, 255, 0.3); box-shadow: 0 0 45px rgba(255, 255, 255, 0.1); }\n            50% { border-color: rgba(255, 255, 255, 1); box-shadow: 0 0 260px rgba(255, 255, 255, 0.7); }\n        }\n\n        #mac-screen-handler { top: 19.0%; left: 10.95%; width: 77.8%; height: 66.5%; border: 0.3px solid rgba(255, 255, 255, 0.3); border-radius: 11px; animation: glow-main 3.8s infinite; }\n        \n        \/* \u8b93\u7981\u7528\u8a2d\u5099\u7684 handler \u4e0d\u7522\u751f\u52d5\u756b\u4e14\u7121\u6cd5\u9ede\u64ca *\/\n        #ipad-screen-handler, #iphone-screen-handler { pointer-events: none; animation: none; border: none; }\n\n        \/* =============================================\n           3. \u72c0\u614b\u8cc7\u8a0a\u8207\u653e\u5927\u6309\u9215\n           ============================================= *\/\n        .tp-status-text-wrap { \n            margin-top: 20px; padding: 8px 22px; \n            background: linear-gradient(145deg, #333 0%, #111 100%);\n            border-radius: 4px; display: flex; align-items: center;\n            position: relative; z-index: 25;\n        }\n        .tp-status-text { color: #E2E2E2; font-family: \"SF Pro Text\", sans-serif; font-size: 10px; letter-spacing: 2.5px; text-transform: uppercase; font-weight: 600; }\n\n        .tp-zoom-controls { display: none; gap: 8px; margin-top: 20px; z-index: 25; position: relative; }\n        .tp-zoom-btn {\n            background: rgba(255, 255, 255, 0.5); border: 1px solid rgba(0,0,0,0.05);\n            padding: 5px 12px; border-radius: 6px; font-size: 10px; font-weight: 700;\n            color: #555; cursor: pointer; transition: 0.3s;\n        }\n        .tp-zoom-btn.active { background: #000; color: #fff; border-color: #000; }\n\n        @media (max-width: 1024px) {\n            .tp-zoom-controls { display: flex; }\n        }\n\n        @media (max-width: 767px) {\n            .tp-nav-tab { padding: 8px 18px; font-size: 10px; letter-spacing: 1.5px; }\n            #mac-screen-handler { width: 77.55%; height: 66.1%; border-radius: 2.6px; }\n        }\n    <\/style>\n\n    <div class=\"tp-device-switcher-wrap\">\n        <div class=\"tp-device-switcher\">\n            <!-- Mac \u4fdd\u6301\u6b63\u5e38 -->\n            <div id=\"tab-mac\" class=\"tp-nav-tab active\" onclick=\"switchDevice('mac')\">Mac<\/div>\n            <!-- iPad \u8207 iPhone \u52a0\u5165 disabled class \u4e26\u79fb\u9664\u9ede\u64ca\u4e8b\u4ef6 -->\n            <div id=\"tab-ipad\" class=\"tp-nav-tab disabled\">iPad<\/div>\n            <div id=\"tab-iphone\" class=\"tp-nav-tab disabled\">iPhone<\/div>\n        <\/div>\n    <\/div>\n\n    <!-- Mac Wrapper (\u6b63\u5e38\u986f\u793a) -->\n    <div id=\"mac-wrapper\" class=\"tp-device-wrapper\" style=\"display: inline-block;\">\n        <img decoding=\"async\" src=\"https:\/\/purestudio.com.tw\/official\/wp-content\/uploads\/2026\/03\/mac-mockup-frame.webp\" class=\"tp-base-frame\">\n        <img decoding=\"async\" id=\"mac-screen\" src=\"https:\/\/purestudio.com.tw\/official\/wp-content\/uploads\/2026\/04\/mac-flow-01-vocallab-ui-overview.webp\" class=\"tp-flow-layer\">\n        <div id=\"mac-screen-handler\" class=\"tp-screen-handler\"><\/div>\n    <\/div>\n\n    <!-- iPad Wrapper (\u5167\u5bb9\u4fdd\u7559\uff0c\u4f46 JS \u6703\u9650\u5236\u5207\u63db\u5230\u9019) -->\n    <div id=\"ipad-wrapper\" class=\"tp-device-wrapper\">\n        <img decoding=\"async\" src=\"https:\/\/purestudio.com.tw\/official\/wp-content\/uploads\/2026\/03\/ipad-mockup-frame.webp\" class=\"tp-base-frame\">\n        <img decoding=\"async\" id=\"ipad-screen\" src=\"https:\/\/purestudio.com.tw\/official\/wp-content\/uploads\/2026\/03\/ipad-flow-01-main-menu.webp\" class=\"tp-flow-layer\">\n        <div id=\"ipad-screen-handler\" class=\"tp-screen-handler\"><\/div>\n    <\/div>\n\n    <!-- iPhone Wrapper (\u5167\u5bb9\u4fdd\u7559) -->\n    <div id=\"iphone-wrapper\" class=\"tp-device-wrapper\">\n        <img decoding=\"async\" src=\"https:\/\/purestudio.com.tw\/official\/wp-content\/uploads\/2026\/03\/iphone-mockup-frame.webp\" class=\"tp-base-frame\">\n        <img decoding=\"async\" id=\"iphone-screen\" src=\"https:\/\/purestudio.com.tw\/official\/wp-content\/uploads\/2026\/03\/iphone-flow-01-main-menu-v2.webp\" class=\"tp-flow-layer\">\n        <div id=\"iphone-screen-handler\" class=\"tp-screen-handler\"><\/div>\n    <\/div>\n\n    <div class=\"tp-status-text-wrap\">\n        <span id=\"tp-counter\" class=\"tp-status-text\">Step 1 \/ 5<\/span>\n    <\/div>\n\n    <div class=\"tp-zoom-controls\">\n        <div class=\"tp-zoom-btn active\" onclick=\"setZoom(1, this)\">1.0x<\/div>\n        <div class=\"tp-zoom-btn\" onclick=\"setZoom(1.5, this)\">1.5x<\/div>\n        <div class=\"tp-zoom-btn\" onclick=\"setZoom(1.8, this)\">1.8x<\/div>\n        <div class=\"tp-zoom-btn\" onclick=\"setZoom(2, this)\">2.0x<\/div>\n    <\/div>\n<\/div>\n\n<script>\n(function() {\n    const data = {\n        mac: [\n            \"https:\/\/purestudio.com.tw\/official\/wp-content\/uploads\/2026\/04\/mac-flow-01-vocallab-main-interface.webp\",\n            \"https:\/\/purestudio.com.tw\/official\/wp-content\/uploads\/2026\/04\/mac-flow-02-import-audio-source.webp\",\n            \"https:\/\/purestudio.com.tw\/official\/wp-content\/uploads\/2026\/04\/mac-flow-03-vocal-instrument-separation.webp\",\n            \"https:\/\/purestudio.com.tw\/official\/wp-content\/uploads\/2026\/04\/mac-flow-04-load-rvc-voice-model.webp\",\n            \"https:\/\/purestudio.com.tw\/official\/wp-content\/uploads\/2026\/04\/mac-flow-05-final-audio-export-mixing.webp\"\n        ],\n        \/\/ iPad \u548c iPhone \u7684\u8cc7\u6599\u4fdd\u7559\uff0c\u4f46\u4e0d\u958b\u653e\u5207\u63db\n        ipad: [\"https:\/\/purestudio.com.tw\/official\/wp-content\/uploads\/2026\/03\/ipad-flow-01-main-menu.webp\"],\n        iphone: [\"https:\/\/purestudio.com.tw\/official\/wp-content\/uploads\/2026\/03\/iphone-flow-01-main-menu-v2.webp\"]\n    };\n    let curD = 'mac', idxs = { mac: 0, ipad: 0, iphone: 0 };\n    const counter = document.getElementById('tp-counter');\n\n    const tabletOffsets = { mac: { \"1.0\": 0, \"1.5\": -67, \"1.8\": -88.4, \"2.0\": -100 } };\n    const mobileOffsets = { mac: { \"1.0\": 0, \"1.5\": -25, \"1.8\": -34,   \"2.0\": -38 } };\n\n    function update() {\n        const screenImg = document.getElementById(`${curD}-screen`);\n        if (screenImg) {\n            screenImg.src = data[curD][idxs[curD]];\n            counter.innerText = `Step ${idxs[curD] + 1} \/ ${data[curD].length}`;\n        }\n    }\n\n    window.setZoom = function(level, btn) {\n        if (curD !== 'mac') return; \/\/ \u50c5 Mac \u5141\u8a31\u7e2e\u653e\n\n        document.querySelectorAll('.tp-zoom-btn').forEach(b => b.classList.remove('active'));\n        btn.classList.add('active');\n        \n        const wrap = document.getElementById(`${curD}-wrapper`);\n        const handler = document.getElementById(`${curD}-screen-handler`);\n        const baseHeight = wrap.offsetHeight;\n        const verticalPush = level > 1 ? (baseHeight * (level - 1) \/ 2) : 0;\n\n        const imgs = wrap.querySelectorAll('img');\n        imgs.forEach(img => img.style.transform = `scale(${level})`);\n        \n        wrap.style.marginTop = `${verticalPush}px`;\n        wrap.style.marginBottom = `${verticalPush}px`;\n\n        const isMobile = window.innerWidth <= 767;\n        const config = isMobile ? mobileOffsets : tabletOffsets;\n        const zoomKey = level.toFixed(1);\n        const manualTopOffset = config[curD][zoomKey] || 0;\n\n        handler.style.transform = `scale(${level}) translateY(${manualTopOffset}px)`;\n    };\n\n    window.switchDevice = function(d) {\n        if (d !== 'mac') return; \/\/ \u5f37\u5236\u53ea\u80fd\u5f85\u5728 Mac \u6a21\u5f0f\n        curD = d;\n        update();\n    };\n\n    function flow(dir) {\n        if (curD !== 'mac') return;\n        const len = data[curD].length;\n        idxs[curD] = (dir === 'next') ? (idxs[curD] + 1) % len : (idxs[curD] - 1 + len) % len;\n        update();\n    }\n\n    \/\/ \u50c5\u5e6b Mac \u7d81\u5b9a\u9ede\u64ca\u6d41\u8f49\u4e8b\u4ef6\n    const macH = document.getElementById(`mac-screen-handler`);\n    macH.addEventListener('click', (e) => { if (e.pointerType !== 'touch') flow('next'); });\n    macH.addEventListener('contextmenu', (e) => { e.preventDefault(); flow('prev'); });\n    macH.addEventListener('touchstart', (e) => {\n        e.preventDefault();\n        if (e.touches.length === 2) flow('prev');\n        else if (e.touches.length === 1) flow('next');\n    }, { passive: false });\n\n    update();\n})();\n<\/script>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>2026 SVC\u514b\u9686\u5f15\u64ce<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-3155","post","type-post","status-publish","format-standard","hentry","category-recentposts"],"_links":{"self":[{"href":"https:\/\/purestudio.com.tw\/official\/wp-json\/wp\/v2\/posts\/3155","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/purestudio.com.tw\/official\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/purestudio.com.tw\/official\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/purestudio.com.tw\/official\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/purestudio.com.tw\/official\/wp-json\/wp\/v2\/comments?post=3155"}],"version-history":[{"count":72,"href":"https:\/\/purestudio.com.tw\/official\/wp-json\/wp\/v2\/posts\/3155\/revisions"}],"predecessor-version":[{"id":3346,"href":"https:\/\/purestudio.com.tw\/official\/wp-json\/wp\/v2\/posts\/3155\/revisions\/3346"}],"wp:attachment":[{"href":"https:\/\/purestudio.com.tw\/official\/wp-json\/wp\/v2\/media?parent=3155"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/purestudio.com.tw\/official\/wp-json\/wp\/v2\/categories?post=3155"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/purestudio.com.tw\/official\/wp-json\/wp\/v2\/tags?post=3155"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}