single.html 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <meta http-equiv="X-UA-Compatible" content="ie=edge, Chrome=1">
  7. <meta http-equiv="Cache-Control" content="no-cache">
  8. <title>ChoozMo AI 分身夢想計畫 | 免費客製您的專屬分身 | 集仕多</title>
  9. <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
  10. integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
  11. <link rel="stylesheet" href="//use.fontawesome.com/releases/v5.11.2/css/all.css">
  12. <link rel="stylesheet" href="/css/style.css">
  13. <!-- Start of HubSpot Embed Code -->
  14. <!-- <script type="text/javascript" id="hs-script-loader" async defer src="//js-na1.hs-scripts.com/20485755.js"></script> -->
  15. <!-- End of HubSpot Embed Code -->
  16. <!-- Google Tag Manager -->
  17. <script>(function (w, d, s, l, i) {
  18. w[l] = w[l] || []; w[l].push({
  19. 'gtm.start':
  20. new Date().getTime(), event: 'gtm.js'
  21. }); var f = d.getElementsByTagName(s)[0],
  22. j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : ''; j.async = true; j.src =
  23. 'https://www.googletagmanager.com/gtm.js?id=' + i + dl; f.parentNode.insertBefore(j, f);
  24. })(window, document, 'script', 'dataLayer', 'GTM-MTWWP3G');</script>
  25. <!-- End Google Tag Manager -->
  26. <!-- Google tag (gtag.js) -->
  27. <script async src="https://www.googletagmanager.com/gtag/js?id=G-G5H9MMGQFM"></script>
  28. <script>
  29. window.dataLayer = window.dataLayer || [];
  30. function gtag() { dataLayer.push(arguments); }
  31. gtag('js', new Date());
  32. gtag('config', 'G-G5H9MMGQFM');
  33. </script>
  34. <!-- Global site tag (gtag.js) - Google Ads: 474336061 -->
  35. <script async src="https://www.googletagmanager.com/gtag/js?id=AW-474336061"></script>
  36. <script>
  37. window.dataLayer = window.dataLayer || [];
  38. function gtag() { dataLayer.push(arguments); }
  39. gtag('js', new Date());
  40. gtag('config', 'AW-474336061');
  41. </script>
  42. </head>
  43. <body>
  44. {{ partial "navbar.html" . }}
  45. <main id="ai-virtual-star">
  46. <img src="/imgs/dm/ai-virtual-star/cover.webp" alt="AI 分身夢想計畫" class="cover-img">
  47. <img src="/imgs/dm/ai-virtual-star/aivs02.webp" alt="" class="bg-1">
  48. <section class="container px-3 pt-0 header">
  49. <div class="main">
  50. <h2 class="mb-5 title">【史無前例,僅此一次】<br>免費建模大放送!<br>影音創作者快來搶!</h2>
  51. <p>
  52. 創意滿滿的您是不是在煩惱怎麼讓影片更有亮點,<br>或是對於枯燥乏味的週期性短片拍攝感到疲累,<br>最好還能帥到觀眾下巴掉下來?<br>
  53. 現在還覺得成為 AI 網紅很遙遠嗎?<br>是不是想要一個 AI 分身幫您工作呢?<br>現在集仕多免費幫您訂製您的 AI 分身!</p>
  54. <div class="d-flex justify-content-center">
  55. <a href="https://page.line.me/417lsxlz?oat_content=url&openQrModal=true" target="_blank"
  56. class="sign-up-btn">加入 LINE OA 專人介紹</a>
  57. </div>
  58. <h2 class="mt-4 title">活動獎勵:將有機會獲得專屬的 AI 分身建模</h2>
  59. <p class="mb-0">根據所有報名者所提供的企劃,經由團隊篩選過後,最終將選出多位最具潛力的影音創作者<br>為您量身訂做專屬於您的「AI
  60. 分身」,分身可供您製作成影片,並發布於您的頻道中,讓您的頻道形象超級吸睛!<br>
  61. 也歡迎得獎者自帶團隊拍建模的幕後花絮,記錄下獨一無二的建模過程!<br>🎁 凡報名者皆獲得參與禮:算力傳媒專訪一篇
  62. </p>
  63. <img src="/imgs/dm/ai-virtual-star/home.webp" alt="" class="img-fluid my-5">
  64. <p>即便沒選上也沒關係,人人都有獎,所有報名者均可獲得一則專訪機會,分享您的創作故事,提升個人曝光度!<br>詳細請看 <a
  65. href="https://news.aimedium.org/">https://news.aimedium.org/</a></p>
  66. <!-- <p class="mb-0">活動內容:我們將海選出 <strong class="fs-3">3 位</strong> 最具潛力的影音創作者,<br>為您量身設計專屬 「AI 虛擬角色」,讓您的頻道形象煥然一新!</p> -->
  67. </div>
  68. <div class="d-flex flex-column align-items-center">
  69. <!-- <div class="pb-5 mb-5 d-flex flex-column align-items-center">
  70. <h4>🏆 免費打造 AI 分身物</h4>
  71. <div class="d-flex justify-content-center">
  72. <ul class="ps-4" style="list-style: disc;">
  73. <li>專屬設計與建模,提升您的創作特色。</li>
  74. <li>提供建模過程的幕後花絮拍攝,展現創意與科技的精彩結合。</li>
  75. <li>歡迎自帶團隊拍攝幕後花絮,打造更具個人風格的紀錄片!</li>
  76. </ul>
  77. </div>
  78. <h4 class="mt-5">🎁 參與禮:算力傳媒專訪</h4>
  79. <p class="mb-0">所有報名者均可獲得一則專訪機會,分享您的創作故事,提升個人曝光度!</p>
  80. </div> -->
  81. <div class="mt-4 info">
  82. <h4>參加方式</h4>
  83. <ol class="my-3">
  84. <li>點擊立即報名 →</li>
  85. <li>加入官方 LINE →</li>
  86. <li>告訴我們您的姓名/單位 →</li>
  87. <li>把您的超狂想法告訴我們:免費建了AI 分身後,您想做什麼?</li>
  88. </ol>
  89. <p class="mb-0">我們就收到您的報名啦~很簡單吧!完全免報名費用</p>
  90. <!-- <p>參加方式很簡單!只要</p>
  91. <p class="d-none d-md-block fw-bold mb-0">🎯 點擊立即報名 → 加入官方 LINE → 傳一段文字告訴我們:免費建了 AI 分身後,您想做什麼?</p>
  92. <p class="d-block d-md-none fw-bold text-center mt-3 mb-0">🎯 點擊立即報名 🎯<br> ↓ <br>加入官方 LINE<br> ↓
  93. <br>傳一段文字告訴我們:<br>免費建了 AI 分身後,您想做什麼?
  94. </p> -->
  95. </div>
  96. <div class="w-100 d-flex justify-content-center mt-4">
  97. <a href="https://page.line.me/417lsxlz?oat_content=url&openQrModal=true" target="_blank"
  98. class="sign-up-btn">加入
  99. LINE OA 即可報名</a>
  100. </div>
  101. <div class="w-100 d-flex justify-content-center">
  102. <button class="d-flex justify-content-center align-items-center activity-btn">
  103. <span>點擊展開活動詳情</span>
  104. <div class="ms-3 arrow-wave">
  105. <span></span>
  106. <span></span>
  107. </div>
  108. </button>
  109. </div>
  110. <div class="row align-items-center mt-5 activity-info">
  111. <div class="col-lg-6 d-flex flex-column align-items-center">
  112. <h4>活動流程</h4>
  113. <ol class="pb-4 pb-lg-0 pe-2 pe-lg-3">
  114. <li>決選會依照評比標準,挑選3位創作者免費建模!</li>
  115. <li>您可以獲得:
  116. <ul>
  117. <li>✔️ 進 AI 虛擬攝影棚錄製的機會<br><small>(攝影棚位於 ChoozMo 總公司,竹北高鐵站走路 3 分鐘即可到達)</small></li>
  118. <li>✔️ 一支虛擬攝影棚拍攝的作品,後續 AI 分身還可以用來製作更多主題影片!</li>
  119. </ul>
  120. </li>
  121. <li>作品完成後,您會獲得完整授權使用作品,請分享到 FB 或自有頻道宣傳並設定公開</li>
  122. </ol>
  123. </div>
  124. <div class="col-lg-6 d-flex flex-column align-items-center line-item">
  125. <h4 class="mt-4 mt-lg-5">活動資訊</h4>
  126. <ul class="px-lg-3 line-bottom">
  127. <li>
  128. 📅 活動報名日期:<strong class="d-block fs-4">2025 年 01月 24 日~2025 年 02 月 07 日</strong>
  129. </li>
  130. <li>
  131. 📅 報名截止:2025 年 02 月 07 日 23:59 p.m.
  132. </li>
  133. <li>📅 結果公布:2025 年 02 月 14 日</li>
  134. </ul>
  135. <h4 class="mt-5 mt-lg-4">評分標準</h4>
  136. <ul class="px-lg-3">
  137. <li>
  138. <p class="mb-0 fw-bold text-center">🌟 創意與吸引力(50%)</p>
  139. <small class="d-block text-center">您使用 AI 分身的用途是否有創意?<br>能否快速吸引注意,展現您的獨特構想?</small>
  140. </li>
  141. <li class="mt-3">
  142. <p class="mb-0 fw-bold text-center">💡 影響力與公益性(50%)</p>
  143. <small class="d-block text-center">您使用 AI 分身的方式是否能傳遞正向價值,或對社會產生積極影響?</small>
  144. </li>
  145. </ul>
  146. </div>
  147. </div>
  148. </div>
  149. <!-- <div class="d-flex justify-content-center my-5">
  150. <a href="https://page.line.me/417lsxlz?oat_content=url&openQrModal=true" target="_blank" class="sign-up-btn">加入 LINE OA 即可報名</a>
  151. </div> -->
  152. <div class="row align-items-center py-5">
  153. <div class="col-lg-6">
  154. <img src="/imgs/dm/ai-virtual-star/aivs04.webp" alt="" class="img-fluid">
  155. </div>
  156. <div class="col-lg-6 mt-5 mt-lg-0 d-flex flex-column align-items-center">
  157. <h4>您是不是我們要找的人?</h4>
  158. <ul>
  159. <li>
  160. ✔️ 不需要高知名度,您的<strong>潛力</strong>和<strong>創意</strong>才是我們的目標!
  161. </li>
  162. <li>
  163. ✔️ 有挑戰性和天馬空的企劃等待實現!
  164. </li>
  165. </ul>
  166. </div>
  167. </div>
  168. <div class="row align-items-center py-5">
  169. <div class="col-lg-6 d-flex flex-column align-items-center mb-5 mb-lg-0">
  170. <h4>為什麼要來?</h4>
  171. <ul>
  172. <li>
  173. ✨ 當您完成 AI 分身建模,大量製作影片內容都沒問題!
  174. </li>
  175. <li>
  176. ✨ 未被選上也能透過優惠方案輕鬆入手,實現您的創作夢想!
  177. </li>
  178. <li>
  179. ✨ 我們有滿滿的經驗與資源,別懷疑了,心動不如馬上報名!
  180. </li>
  181. </ul>
  182. </div>
  183. <div class="col-lg-6">
  184. <img src="/imgs/dm/ai-virtual-star/aivs05.webp" alt="" class="img-fluid">
  185. </div>
  186. </div>
  187. <div class="row align-items-center py-5">
  188. <div class="col-lg-6">
  189. <img src="/imgs/dm/ai-virtual-star/aivs06.webp" alt="" class="img-fluid">
  190. </div>
  191. <div class="col-lg-6 mt-5 mt-lg-0 d-flex flex-column align-items-center">
  192. <h4>ChoozMo 電視台水準?<br>這樣您要參加了嗎?🎥</h4>
  193. <p class="text-center">我們與多家電視台有多次合作經驗,也參與過眾多 AI 活動,作品品質絕對無庸置疑,連大螢幕播放都沒問題!</p>
  194. </div>
  195. </div>
  196. <div class="d-flex flex-column align-items-center">
  197. <h3 class="title">AI 分身是什麼?<h3>
  198. <p class="text-center px-lg-5">
  199. 是透過 AI 生成技術創建的虛擬角色,具有類似人類的外觀、行為和互動能力。<br>這些分身可以用於模擬真人的行為,並應用於多種場景中,例如電視台 AI 主播「克隆娟」,就是我們最典型的實際應用。
  200. </p>
  201. <img src="/imgs/dm/ai-virtual-star/aivs08.webp" alt="" class="img-fluid">
  202. </div>
  203. <div class="d-flex flex-column align-items-center py-5 position-relative">
  204. <img src="/imgs/dm/ai-virtual-star/aivs09.webp" alt="" class="bg-2">
  205. <div class="position-relative" style="z-index: 100;">
  206. <h2 class="mb-3 title">用 AI 科技實現頻道大躍進!</h2>
  207. <p class="text-center">您是否曾想過擁有一個專屬的 AI 分身,為您的頻道創造無限可能?<br>現在機會來了!只要您有需求,歡迎一起參與免費 AI 分身建模計畫!</p>
  208. <div class="row mt-5 justify-content-center align-items-center">
  209. <div class="col-lg-4 text-center mb-3 mb-lg-0">
  210. <h4>科技 x 創意的視覺震撼</h4>
  211. <p>
  212. 製作團隊會引導您完成所有製作需求<br>
  213. 我們將您的想像化為現實,讓每個創作者都能感受到 AI 時代的無限魅力!
  214. </p>
  215. </div>
  216. <div class="col-lg-4">
  217. <img src="/imgs/dm/ai-virtual-star/aivs07.webp" alt="" class="img-fluid">
  218. </div>
  219. </div>
  220. </div>
  221. </div>
  222. <div class="d-flex justify-content-center mb-lg-5">
  223. <a href="https://page.line.me/417lsxlz?oat_content=url&openQrModal=true" target="_blank" class="sign-up-btn">加入
  224. LINE OA 即可報名</a>
  225. </div>
  226. <div id="form">
  227. {{ partial "form-main.html" . }}
  228. </div>
  229. </section>
  230. </main>
  231. {{ partial "footer.html" . }}
  232. <script type="application/javascript">
  233. var doNotTrack = false;
  234. if (!doNotTrack) {
  235. (function (i, s, o, g, r, a, m) {
  236. i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function () {
  237. (i[r].q = i[r].q || []).push(arguments)
  238. }, i[r].l = 1 * new Date(); a = s.createElement(o),
  239. m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m)
  240. })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');
  241. ga('create', 'UA-153100602-5', 'auto');
  242. ga('send', 'pageview');
  243. }
  244. </script>
  245. <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js"
  246. integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p"
  247. crossorigin="anonymous"></script>
  248. <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.min.js"
  249. integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF"
  250. crossorigin="anonymous"></script>
  251. <script>
  252. console.log('>>', $(".activity-btn"));
  253. $('.activity-btn').on('click', function () {
  254. // 切換箭頭方向
  255. $('.arrow-wave').toggleClass('active');
  256. // 展開或收起內容
  257. $('.activity-info').toggleClass('active');
  258. })
  259. </script>
  260. </body>
  261. </html>