|
|
@@ -27,64 +27,190 @@
|
|
|
<body>
|
|
|
|
|
|
<section class='Analytics-report'>
|
|
|
- <div class='Analytics-report-page'>
|
|
|
- <div class='container-fluid'>
|
|
|
- <img style="position: absolute;" class='Orange' src="./img/背景橘.png" alt="">
|
|
|
- <img style="position: absolute;" class='Purple' src="./img/背景紫.png" alt="">
|
|
|
- <div class='text-end'>
|
|
|
- <img class='choozmo mt-1' src="./img/logo_choozmo.webp" alt="">
|
|
|
- </div>
|
|
|
- <div class='Analytics-report-title'>
|
|
|
- <h1 class='fw-bold'>微電影網路聲量調查報告</h1>
|
|
|
- <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellat ratione maiores quasi cum itaque,
|
|
|
- architecto esse unde eum quas quis quaerat,</p>
|
|
|
+ <div id="report-cover" class='Analytics-report-page'>
|
|
|
+ <div class='text-end mb-3'>
|
|
|
+ <img class='choozmo-cover mt-5 me-3' src="./img/logo_choozmo.webp" alt="">
|
|
|
+ </div>
|
|
|
+ <div class='container-fluid px-0 mx-0'>
|
|
|
+ <div style="z-index: 100;" class="card text-white border-0">
|
|
|
+ <img src="./img/PC.jpeg" class="card-img" alt="...">
|
|
|
+ <div class="card-img-overlay">
|
|
|
+ <div class="cover-title">
|
|
|
+ <h1 class="card-title mb-0">集仕多</h1>
|
|
|
+ <h1 class="card-title">數據資訊量表</h1>
|
|
|
+ <p class="card-text py-3">整合多元的數據來源，清楚呈現了解資料的各種不同面向，以數據驅動思考及判斷，作為組織決策之輔助工具。</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- <div style="height: 75vh;" class="d-flex align-items-center justify-content-center">
|
|
|
- <div>
|
|
|
- <h1 style="font-size: 72px;">封面圖片</h1>
|
|
|
+ <div class="card text-dark border-0">
|
|
|
+ <div class="row px-0 mx-0">
|
|
|
+ <div class="col-4">
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div class="col-8">
|
|
|
+ <img style="margin-top: -30px;" src="./img/圖層 2.png" class="img-fluid card-img" alt="...">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="card-img-overlay">
|
|
|
+ <div class="cover-text">
|
|
|
+ <h1 class="card-title">微電影網路聲量調查報告</h1>
|
|
|
+ <p class="card-text">分析微電影在Facebook、Youtube等平台上的互動：觀察及分析微電影該產業類型在Facebook、Youtube等社群媒體上受到的討論、關注及互動的程度。</p>
|
|
|
+ <hr>
|
|
|
+ <h1 class="card-title">工研院行銷傳播處</h1>
|
|
|
+
|
|
|
+ <div class="copyrighted">
|
|
|
+ <div class="row px-0 mx-0">
|
|
|
+ <div class="choozmo-copyrighted col-12 order-2 col-md-6 order-md-1 px-0">
|
|
|
+ <p>集仕多股份有限公司 ©版權所有</p>
|
|
|
+ </div>
|
|
|
+ <div class="col-12 order-1 col-md-6 order-md-2 px-0">
|
|
|
+ <p class="text-end">最後更新日期：2021/12/24</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+
|
|
|
+ <!-- 第一頁 -->
|
|
|
<div class='Analytics-report-page'>
|
|
|
- <div class='container-fluid'>
|
|
|
- <img style="position: absolute;" class='Orange' src="./img/背景橘.png" alt="">
|
|
|
- <img style="position: absolute;" class='Purple' src="./img/背景紫.png" alt="">
|
|
|
- <div class='text-end'>
|
|
|
- <img class='choozmo mt-1' src="./img/logo_choozmo.webp" alt="">
|
|
|
- </div>
|
|
|
- <div class='Analytics-report-title'>
|
|
|
- <h1 class='fw-bold'>微電影網路聲量調查報告</h1>
|
|
|
- <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellat ratione maiores quasi cum itaque,
|
|
|
- architecto esse unde eum quas quis quaerat,</p>
|
|
|
- </div>
|
|
|
- <div style="height: 75vh;" class="d-flex align-items-center justify-content-center">
|
|
|
- <div>
|
|
|
- <h1 style="font-size: 72px;">封面圖片</h1>
|
|
|
+ <img style="position: absolute;" class='Orange2' src="./img/背景橘.png" alt="">
|
|
|
+ <img style="position: absolute;" class='Purple2' src="./img/背景紫.png" alt="">
|
|
|
+ <div class='text-end mb-3'>
|
|
|
+ <img class='choozmo mt-2 me-3' src="./img/logo_choozmo.webp" alt="">
|
|
|
+ </div>
|
|
|
+ <div class='Analytics-chart'>
|
|
|
+ <div class="row mx-0 px-0">
|
|
|
+ <div class="row mx-0">
|
|
|
+ <div class="col-12">
|
|
|
+ <h2 class='Data-h2 fw-bold mt-1'>關於微電影</h2>
|
|
|
+ <p class="my-3">隨著媒體技術的發展，微電影是近年來極爲盛行的一種行銷作品，不同於傳統電影，微電影主要以時長較短且敘事有盡，情意無窮的完整劇情來呈現，對民眾來説是受歡迎且具有吸引力的，尤其是新時代的速食收看習慣，民眾或許更喜歡通過微電影，快速得到想要的資訊，還可以從中得到深刻的啓發和省思。微電影可分成各種形式，例如：公益推廣、敘事音樂MV、個人創意、商業廣告等。</p>
|
|
|
+ <p class="mb-3">當數位内容開始走進智慧型手機裝置，依微電影精簡的長度，加上無線寬頻和5G技術的進步，微電影可以説是新時代民眾最合適的娛樂管道。大多數的微電影都選擇在社群平台上播出，藉由網路的快速傳播，使得微電影在網路上的曝光率逐漸增加。同時，社群平台也具備了按讚、轉發功能，並有反覆觀看等特徵，跟新時代的民眾所使用的社群平台有著關聯性，加上微電影故事性強，能在短時間内引起共鳴，為此加深了民眾對微電影的印象、關注和分享，更是創造了話題性和新聞價值。</p>
|
|
|
+ </div>
|
|
|
+ <div class="col-12">
|
|
|
+ <h2 class='Data-h2 fw-bold mt-1'>微電影與其他的影像形式比較分析</h2>
|
|
|
+ <table class="table-1 table table-bordered mt-1">
|
|
|
+ <thead>
|
|
|
+ <tr>
|
|
|
+ <th scope="col" style="width: 18%;"></th>
|
|
|
+ <th scope="col" class='text-center'>微電影<br>(工研院))</th>
|
|
|
+ <th scope="col" class='text-center'>網紅<br>(howhow)</th>
|
|
|
+ <th scope="col" class='text-center'>新聞專題 (眼球中央、科技新報)</th>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ <tbody>
|
|
|
+ <tr>
|
|
|
+ <th scope="row" style="width: 25%;" class='px-0 text-center'>時間長短</th>
|
|
|
+ <td class='text-center'>1分鐘-5分鐘</td>
|
|
|
+ <td class='text-center'>1分鐘-10分鐘</td>
|
|
|
+ <td class='text-center'>2分鐘-15分鐘</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <th scope="row" class="px-0 text-center">播放平台</th>
|
|
|
+ <td>Facebook、YouTube</td>
|
|
|
+ <td>Facebook、YouTube</td>
|
|
|
+ <td>Facebook、YouTube</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <th scope="row" class='text-center'>內容</th>
|
|
|
+ <td>透過劇情傳達該產品的用途與涵義</td>
|
|
|
+ <td>以無釐頭搞笑短劇的脚本結合品牌概念（業配）</td>
|
|
|
+ <td>關心社會的趨勢與新聞</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <th scope="row" class="text-center px-0">評估方式</th>
|
|
|
+ <td class='text-center'>點擊率</td>
|
|
|
+ <td class='text-center'>點擊率</td>
|
|
|
+ <td class='text-center'>點擊率</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <th scope="row" class='text-center'>品質</th>
|
|
|
+ <td class='text-center'>中</td>
|
|
|
+ <td class='text-center'>中</td>
|
|
|
+ <td class='text-center'>中</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <th scope="row" class="text-center">話題性</th>
|
|
|
+ <td class='text-center'>低</td>
|
|
|
+ <td class='text-center'>高</td>
|
|
|
+ <td class='text-center'>中</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <th scope="row" class="text-center">置入</th>
|
|
|
+ <td class='text-center'>高</td>
|
|
|
+ <td class='text-center'>高</td>
|
|
|
+ <td class='text-center'>低</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <th scope="row" class="px-0 text-center">喜好程度</th>
|
|
|
+ <td class='text-center'>中</td>
|
|
|
+ <td class='text-center'>高</td>
|
|
|
+ <td class='text-center'> 中</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <th scope="row" class="px-0 text-center">製片預算</th>
|
|
|
+ <td class='text-center'>中</td>
|
|
|
+ <td class='text-center'>高</td>
|
|
|
+ <td class='text-center'>中</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <th scope="row" class="px-0 text-center">不受時空限制</th>
|
|
|
+ <td class='text-center'>低</td>
|
|
|
+ <td class='text-center'>低</td>
|
|
|
+ <td class='text-center'>低</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <th scope="row" class="px-0 text-center">故事性強</th>
|
|
|
+ <td class='text-center'>高</td>
|
|
|
+ <td class='text-center'>中</td>
|
|
|
+ <td class='text-center'>中</td>
|
|
|
+
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <th scope="row" class="px-0 text-center">趣味性</th>
|
|
|
+ <td class='text-center'>中</td>
|
|
|
+ <td class='text-center'>高</td>
|
|
|
+ <td class='text-center'>中</td>
|
|
|
+ </tr>
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+ <p class="text-center">表(1)</p>
|
|
|
+ <div>
|
|
|
+ <p class="mb-3">工研院之微電影透過具有張力的劇情來傳達產品服的用途及核心價值，將其信念明確的表達出來，相比於一般的新聞專題影片的單向播報新聞資訊，較難引起觀眾的共鳴及留下印象。而相較於網紅活動推廣或是品牌影片較為簡短的情境示意，工研院之微電影的故事主軸較為明顯。</p>
|
|
|
+ <p class="mb-3">除此之外，基於工研院微電影之偏技術面之特性，對於多數觀眾可能無法一時之間完全理解，故它所引起的話題討論度相比於網紅的品牌宣傳影片較低。</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
</div>
|
|
|
</div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div class='pagenumber'>
|
|
|
+ <p>1</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <!-- 第一頁 -->
|
|
|
<div class='Analytics-report-page'>
|
|
|
<img style="position: absolute;" class='Orange2' src="./img/背景橘.png" alt="">
|
|
|
<img style="position: absolute;" class='Purple2' src="./img/背景紫.png" alt="">
|
|
|
<div class='text-end mb-3'>
|
|
|
- <img class='choozmo mt-1' src="./img/logo_choozmo.webp" alt="">
|
|
|
+ <img class='choozmo mt-2 me-3' src="./img/logo_choozmo.webp" alt="">
|
|
|
</div>
|
|
|
<div class='Analytics-chart'>
|
|
|
<div class="row mx-0">
|
|
|
<div class="row mx-0">
|
|
|
- <div class="col-6">
|
|
|
+ <div class="col-12 col-md-6">
|
|
|
<h2 class='Data-h2 fw-bold'>觀眾較常收看之影音類型</h2>
|
|
|
<canvas id="myChart2" width="200" height="200"></canvas>
|
|
|
+ <p class="text-center">圖(1)</p>
|
|
|
<h4 class='fw-bold'>觀眾喜好的影音類型</h4>
|
|
|
<p>
|
|
|
据圖表顯示，影音類型佔最高比例的電影/微電影為觀眾較常觀看的内容，音樂/MV内容則佔据第二。連續劇/偶像劇/美食/旅游/綜藝/八卦/笑話趣味影片/影集/電玩/動漫等内容類型也有高達25%~38%的觀眾喜歡，顯示現代觀眾的分眾特性，各種主題都有人支持。
|
|
|
</p>
|
|
|
-
|
|
|
+
|
|
|
</div>
|
|
|
- <div class="col-6">
|
|
|
+ <div class="col-12 col-md-6">
|
|
|
<h2 class='Data-h2 fw-bold'>微電影廣告吸引力面向</h2>
|
|
|
<div class='mb-3'>
|
|
|
<div class="my-3">
|
|
|
@@ -104,12 +230,13 @@
|
|
|
<p>不到30%的人則會受到微電影的製作精良場面浩大以及體驗度高而被吸引。</p>
|
|
|
</div>
|
|
|
<canvas id="myChart" width="200" height="200"></canvas>
|
|
|
+ <p class="text-center">圖(2)</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class='row mx-0'>
|
|
|
<h2 class='Data-h2 fw-bold'>媒體行銷之比較</h2>
|
|
|
- <div class="col-6">
|
|
|
+ <div class="col-12 col-md-6">
|
|
|
<table class="table-1 table table-bordered mt-3">
|
|
|
<thead>
|
|
|
<tr>
|
|
|
@@ -174,8 +301,9 @@
|
|
|
</tr>
|
|
|
</tbody>
|
|
|
</table>
|
|
|
+ <p class="text-center">表(2)</p>
|
|
|
</div>
|
|
|
- <div class="col-6">
|
|
|
+ <div class="col-12 col-md-6">
|
|
|
<div class="mt-3">
|
|
|
<h4 class='fw-bold'>微電影發展模式之建構</h4>
|
|
|
<p class='mb-3'>微電影介於廣告與電影之間，運用吸引人的劇情內容，巧妙地將品牌精神與產品行銷，融入故事情節當中，再透過劇情傳達訴求，提升品牌認同與產品的好感度，進而產生消費行為。</p>
|
|
|
@@ -236,20 +364,22 @@
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
- <div class='pagenumber'><p>1</p></div>
|
|
|
+ <div class='pagenumber'>
|
|
|
+ <p>2</p>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<!-- 第二頁 -->
|
|
|
<div class='Analytics-report-page'>
|
|
|
<img style="position: absolute;" class='Orange2' src="./img/背景橘.png" alt="">
|
|
|
<img style="position: absolute;" class='Purple2' src="./img/背景紫.png" alt="">
|
|
|
<div class='text-end mb-3'>
|
|
|
- <img class='choozmo mt-1' src="./img/logo_choozmo.webp" alt="">
|
|
|
+ <img class='choozmo mt-2 me-3' src="./img/logo_choozmo.webp" alt="">
|
|
|
</div>
|
|
|
<div class='Analytics-chart'>
|
|
|
<div class="row mx-0">
|
|
|
<div class='row mx-0'>
|
|
|
- <h2 class='Data-h2 fw-bold'>廣告主演是否為明星佔比</h2>
|
|
|
- <div class="col-6">
|
|
|
+ <h2 class='Data-h2 fw-bold'>廣告類型與主演是否為明星佔比</h2>
|
|
|
+ <div class="col-12 col-md-6">
|
|
|
<div class="row px-0 mx-0">
|
|
|
<div class="Doughnut-box col-6 px-0 border-end border-bottom">
|
|
|
<canvas id="myChart-Doughnut1" width="200" height="200"></canvas>
|
|
|
@@ -267,9 +397,10 @@
|
|
|
<canvas id="myChart-Doughnut4" width="200" height="200"></canvas>
|
|
|
<p>政府公益</p>
|
|
|
</div>
|
|
|
+ <p class="text-center">圖(3)</p>
|
|
|
<h2 class='Data-h2 fw-bold mt-3'>廣告時長與故事類型</h2>
|
|
|
|
|
|
- <div class='border mb-2 pb-3'>
|
|
|
+ <div class='border mb-2 pb-3 px-0'>
|
|
|
<div class="row px-0 mx-0">
|
|
|
<div class="col-6">
|
|
|
<div class='adv-type'>
|
|
|
@@ -345,6 +476,7 @@
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <p class="text-center">圖(4)</p>
|
|
|
<div>
|
|
|
<h4 class='fw-bold'>廣告時長和故事類型 </h4>
|
|
|
<p>微電影透過各種故事類型來呈現内容，因此不同的主題有不同的合適觀看時間。据圖標顯示:</p>
|
|
|
@@ -362,16 +494,17 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="col-6">
|
|
|
+ <div class="col-12 col-md-6">
|
|
|
<div class="mt-3">
|
|
|
<div>
|
|
|
<h4 class='fw-bold'>各微電影類別與素人之關係</h4>
|
|
|
- <p class="mb-3">除此之外，從圖表中可以發現，在品牌形象類型的微電影中，雖然業主選擇明星來當主演的概率為最大，但是，業主選擇素人當主演的比例大幅高於產品廣告類型的微電影中素人當主演的比例。
|
|
|
+ <p class="mb-3">除此之外，從圖(3)中可以發現，在品牌形象類型的微電影中，雖然業主選擇明星來當主演的概率為最大，但是，業主選擇素人當主演的比例大幅高於產品廣告類型的微電影中素人當主演的比例。
|
|
|
</p>
|
|
|
<p class="mb-3">由此可以推論出，可能是業主希望自身品牌形象的微電影能夠離觀眾距離更近一點，縮短品牌與觀眾的距離。</p>
|
|
|
</div>
|
|
|
- <h2 class='Data-h2 fw-bold'>廣告主演是否為明星佔比</h2>
|
|
|
+ <h2 class='Data-h2 fw-bold'>微電影主演是否為明星佔比</h2>
|
|
|
<canvas id="myChart-pie" width="200" height="200"></canvas>
|
|
|
+ <p class="text-center mt-2">圖(5)</p>
|
|
|
<div class="mt-3">
|
|
|
<h4 class='fw-bold'>微電影與主演人物之關係</h4>
|
|
|
<p>總的來說，廣告主偏好用明星來擔任微電影廣告的主角，由於明星的臉孔對於觀眾而言較為熟悉，觀眾比較會停留下來觀賞完影片，以達成宣傳目的。</p>
|
|
|
@@ -383,150 +516,117 @@
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
- <div class='pagenumber'><p>2</p></div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <!-- 第三頁 -->
|
|
|
- <div class='Analytics-report-page'>
|
|
|
- <img style="position: absolute;" class='Orange2' src="./img/背景橘.png" alt="">
|
|
|
- <img style="position: absolute;" class='Purple2' src="./img/背景紫.png" alt="">
|
|
|
- <div class='text-end mb-3'>
|
|
|
- <img class='choozmo mt-1' src="./img/logo_choozmo.webp" alt="">
|
|
|
+ <div class='pagenumber'>
|
|
|
+ <p>2</p>
|
|
|
</div>
|
|
|
- <div class='Analytics-chart'>
|
|
|
- <div class="row mx-0 px-0">
|
|
|
- <div class="row mx-0">
|
|
|
- <h2 class='Data-h2 fw-bold mt-1'>微電影與其他的影像形式比較分析</h2>
|
|
|
- <div class="col-7">
|
|
|
- <table class="table-1 table table-bordered">
|
|
|
- <thead>
|
|
|
- <tr>
|
|
|
- <th scope="col" style="width: 18%;"></th>
|
|
|
- <th scope="col" class='text-center'>微電影<br>(工研院))</th>
|
|
|
- <th scope="col" class='text-center'>網紅<br>(howhow)</th>
|
|
|
- <th scope="col" class='text-center'>新聞專題 (眼球中央、科技新報)</th>
|
|
|
- </tr>
|
|
|
- </thead>
|
|
|
- <tbody>
|
|
|
- <tr>
|
|
|
- <th scope="row" class='px-0 text-center'>時間長短</th>
|
|
|
- <td class='text-center'>1分鐘-5分鐘</td>
|
|
|
- <td class='text-center'>1分鐘-10分鐘</td>
|
|
|
- <td class='text-center'>2分鐘-15分鐘</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <th scope="row" class="px-0 text-center">播放平台</th>
|
|
|
- <td>Facebook、YouTube</td>
|
|
|
- <td>Facebook、YouTube</td>
|
|
|
- <td>Facebook、YouTube</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <th scope="row" class='text-center'>內容</th>
|
|
|
- <td>透過劇情傳達該產品的用途與涵義</td>
|
|
|
- <td>以無釐頭搞笑短劇的脚本結合品牌概念（業配）</td>
|
|
|
- <td>關心社會的趨勢與新聞</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <th scope="row" class="text-center px-0">評估方式</th>
|
|
|
- <td class='text-center'>點擊率</td>
|
|
|
- <td class='text-center'>點擊率</td>
|
|
|
- <td class='text-center'>點擊率</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <th scope="row" class='text-center'>品質</th>
|
|
|
- <td class='text-center'>中</td>
|
|
|
- <td class='text-center'>中</td>
|
|
|
- <td class='text-center'>中</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <th scope="row" class="text-center">話題性</th>
|
|
|
- <td class='text-center'>低</td>
|
|
|
- <td class='text-center'>高</td>
|
|
|
- <td class='text-center'>中</td>
|
|
|
- </tr>
|
|
|
- </tbody>
|
|
|
- </table>
|
|
|
- <!-- <h4 class='fw-bold'>電影與其他影片類型比較</h4> -->
|
|
|
- </div>
|
|
|
- <div class="col-5">
|
|
|
- <table class="table-1 table table-bordered">
|
|
|
- <thead>
|
|
|
- <tr>
|
|
|
- <th scope="col" style="width: 18%;"></th>
|
|
|
- <th scope="col" class='text-center'>微電影<br>(工研院))</th>
|
|
|
- <th scope="col" class='text-center'>網紅<br>(howhow)</th>
|
|
|
- <th scope="col" class='text-center'>新聞專題<br>(眼球中央、<br>科技新報)</th>
|
|
|
- </tr>
|
|
|
- </thead>
|
|
|
- <tbody>
|
|
|
- <tr>
|
|
|
- <th scope="row">置入</th>
|
|
|
- <td class='text-center'>高</td>
|
|
|
- <td class='text-center'>高</td>
|
|
|
- <td class='text-center'>低</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <th scope="row" class="px-0">喜好程度</th>
|
|
|
- <td class='text-center'>中</td>
|
|
|
- <td class='text-center'>高</td>
|
|
|
- <td class='text-center'> 中</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <th scope="row" class="px-0">製片預算</th>
|
|
|
- <td class='text-center'>中</td>
|
|
|
- <td class='text-center'>高</td>
|
|
|
- <td class='text-center'>中</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <th scope="row" class="px-0">不受時空限制</th>
|
|
|
- <td class='text-center'>低</td>
|
|
|
- <td class='text-center'>低</td>
|
|
|
- <td class='text-center'>低</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <th scope="row" class="px-0">故事性強</th>
|
|
|
- <td class='text-center'>高</td>
|
|
|
- <td class='text-center'>中</td>
|
|
|
- <td class='text-center'>中</td>
|
|
|
-
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <th scope="row" class="px-0">趣味性</th>
|
|
|
- <td class='text-center'>中</td>
|
|
|
- <td class='text-center'>高</td>
|
|
|
- <td class='text-center'>中</td>
|
|
|
- </tr>
|
|
|
-
|
|
|
- </tbody>
|
|
|
- </table>
|
|
|
+ </div>
|
|
|
+ <!-- 第三頁 -->
|
|
|
+ <div class='Analytics-report-page'>
|
|
|
+ <img style="position: absolute;" class='Orange2' src="./img/背景橘.png" alt="">
|
|
|
+ <img style="position: absolute;" class='Purple2' src="./img/背景紫.png" alt="">
|
|
|
+ <div class='text-end mb-3'>
|
|
|
+ <img class='choozmo mt-2 me-3' src="./img/logo_choozmo.webp" alt="">
|
|
|
+ </div>
|
|
|
+ <div class='Analytics-chart'>
|
|
|
+ <div class="row mx-0 px-0">
|
|
|
+ <div class="row mx-0">
|
|
|
+ <h2 class='Data-h2 fw-bold mt-1'>微電影與其他的影像形式比較分析(YT)</h2>
|
|
|
+ <div class="col-12 col-md-7 mb-3">
|
|
|
+ <canvas class="mt-3" id="myChart-bar-yt" width="200" height="200"></canvas>
|
|
|
+ <p class="text-center mt-2">圖(6)</p>
|
|
|
+ </div>
|
|
|
+ <div class="col-12 col-md-5">
|
|
|
+ <div class="mt-3">
|
|
|
+ <p class="mb-3">綜觀而言，《工研院微電影 激「立」 完整版》有最高的觀看次數、讚數以及留言數，由於該影片的上傳時間相較於其他影片早，所以因此累積較多的觀看次數。</p>
|
|
|
+ <p>除此之外工研院微電影 激「立」
|
|
|
+ 完整版與其他電視台有合作，因此傳播的效果較佳。與其同一時期的另一部《來日》，由於在臉書上的貼文連結已經失效，且其貼文內容並沒有放入影片，容易被使用者忽略，因此該部影片的觀看次數並不高。</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="col-12">
|
|
|
+ <p>
|
|
|
+ 另外，近期的兩部：《我的黑手阿爸》、《那些足球教我的事》，兩部皆有超過萬次觀看，主要由於在臉書當中兩篇影片的貼文都有不低的觀看數及分享次數，其中《那些足球教我的事》聲量較高，可以從臉書中觀察得知該部微電影的貼文分享次數較高，因此，該影片的傳播的效果較佳。
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- <div class="col-12">
|
|
|
- <p>
|
|
|
- 工研院之微電影透過具有張力的劇情來傳達產品服的用途及核心價值，將其信念明確的表達出來，相比於一般的新聞專題影片的單向播報新聞資訊，較難引起觀眾的共鳴及留下印象。而相較於網紅活動推廣或是品牌影片較為簡短的情境示意，工研院之微電影的故事主軸較為明顯。除此之外，基於工研院微電影之偏技術面之特性，對於多數觀眾可能無法一時之間完全理解，故它所引起的話題討論度相比於網紅的品牌宣傳影片較低。
|
|
|
- </p>
|
|
|
+ <div class="row px-0 mx-0 mt-5">
|
|
|
+ <div class="row mx-0">
|
|
|
+ <h2 class='Data-h2 fw-bold'>微電影與其他的影像形式比較分析(FB)</h2>
|
|
|
+ <div class="col-12 col-md-7">
|
|
|
+ <canvas class="mt-3" id="myChart-bar" width="200" height="200"></canvas>
|
|
|
+ <p class="text-center mt-2">圖(7)</p>
|
|
|
+ </div>
|
|
|
+ <div class="col-12 col-md-5">
|
|
|
+ <div class="mt-3">
|
|
|
+ <p class="mb-3">
|
|
|
+ 綜觀而言，黑手阿爸與那些足球教我的事兩部影片於臉書的反應較為熱烈，主要是由於該兩則貼文皆有融合留言抽獎活動，因此，貼文的按讚數、觀看次數及留言數，皆有明顯的高聲量表現。
|
|
|
+ </p>
|
|
|
+ <p>除此之外，貼文的標題以及開頭文字也是一大因素，從經濟部的GreenCampus
|
|
|
+ 綠光篇貼文與其他貼文比較起來，由於其他的貼文標題及開頭皆是採用較為口語的文字敘述，像是與觀眾對話，較能夠吸引使用者繼續閱讀及觀看，因此在觀看數與按讚數都較高。</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div class='pagenumber'>
|
|
|
+ <p>3</p>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- <div class="row px-0 mx-0">
|
|
|
- <div class="row mx-0">
|
|
|
- <h2 class='Data-h2 fw-bold'>微電影與其他的影像形式比較分析(FB)</h2>
|
|
|
- <div class="col-12">
|
|
|
- <canvas id="myChart-bar" width="200" height="200"></canvas>
|
|
|
+ <!-- 第四頁 -->
|
|
|
+ <!-- 第三頁 -->
|
|
|
+ <div class='Analytics-report-page'>
|
|
|
+ <img style="position: absolute;" class='Orange2' src="./img/背景橘.png" alt="">
|
|
|
+ <img style="position: absolute;" class='Purple2' src="./img/背景紫.png" alt="">
|
|
|
+ <div class='text-end mb-3'>
|
|
|
+ <img class='choozmo mt-2 me-3' src="./img/logo_choozmo.webp" alt="">
|
|
|
+ </div>
|
|
|
+ <div class='Analytics-chart'>
|
|
|
+ <div class="row mx-0 px-0">
|
|
|
+ <div class="row mx-0">
|
|
|
+ <div class="col-12 col-md-6">
|
|
|
+ <h2 class='Data-h2 fw-bold'>科專成果之微電影映後聲量調查與分析(YT)</h2>
|
|
|
+ <canvas class="mt-3" id="bar-yt" width="200" height="200"></canvas>
|
|
|
+ <p class="text-center mt-2">圖(8)</p>
|
|
|
+ </div>
|
|
|
+ <div class="col-12 col-md-6">
|
|
|
+ <h2 class='Data-h2 fw-bold'>科專成果之微電影映後聲量調查與分析(FB)</h2>
|
|
|
+ <canvas class="mt-3" id="bar-fb" width="200" height="200"></canvas>
|
|
|
+ <p class="text-center mt-2">圖(9)</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="row px-0 mx-0 mt-2">
|
|
|
+ <div class="row mx-0">
|
|
|
+ <div class="col-12">
|
|
|
+ <div class="mb-3">
|
|
|
+ <h4 class='fw-bold'>那些足球教我的事</h4>
|
|
|
+ <p>5G是最新一代行動通訊技術，為4G系統的延伸。其效能目標是高資料速率、減少延遲、節省能源、降低成本、提高系統容量和大規模裝置連接，實現更好的網路體驗。加上熱門討論的邊緣運算MEC (Multi-access Edge Computing) 更可以改善現行 4G 終端對雲端的長路徑。
|
|
|
+ 而該部電影主軸内容由經濟部攜手台灣多個國際大廠，結合產官學量能，全面啟動累積的深厚產業基底，拼搏台灣5G產業，較為貼近目前的生活形式，因此觸及率較高，如圖(9)在臉書的留言也會比《我的黑手阿爸》來得高。
|
|
|
+ </p>
|
|
|
</div>
|
|
|
- <div class="col-12">
|
|
|
- <!-- <h4 class='fw-bold'>工研院微電影聲量</h4> -->
|
|
|
+ <div class="mb-3">
|
|
|
+ <h4 class='fw-bold'>我的黑手阿爸</h4>
|
|
|
+ <p>該部微電影主軸為由經濟部技術處與工研院攜手研發打造出的 智慧機械雲，協助產業轉型，解決數位升級的困境，由於該服務主要的目標對象為廠商，對於一般民眾而言距離較遠，較無法產生共鳴，因此，如圖(9)在臉書中留言數稍比那些足球教我的事少一些。
|
|
|
+ 然而，細看留言的內容可以發現，該部微電影的留言內容有提及服務而不單是抽獎的回覆，有觀眾詢問申請事宜，想要有進一步的了解，以微電影的服務宣傳目的而言，有實質的效果。
|
|
|
+ 誠如上面所述，由於目標對象為廠商，廠商有較為強烈的動機暸解及關注該種專頁服務技術，因此，在留言回應的部分，廠商會反應出需求或者是依據過往相關經驗予以評論。
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ <div class="mb-3">
|
|
|
+ <h4 class='fw-bold'>總結</h4>
|
|
|
+ <p>如圖(8)在YouTube的成效，《那些足球教我的事》觀看數比《我的黑手阿爸》來得高，推測因爲《那些足球教我的事》受眾為一般民眾，較為貼近現在的生活形式和有共鳴，因此觀看數自然會高。而《我的黑手阿爸》目標或許是鎖定在廠商服務，受眾數量較少，因此觀看次數較低。
|
|
|
+ 但《我的黑手阿爸》按贊數及留言數會比《那些足球教我的事》來得多，也許是因為廠商具備該服務的需求及具有一定的相關經驗與知識背景，因此，與該種技術服務內容的影片所產生的連結力相當的強。
|
|
|
+ </p>
|
|
|
|
|
|
-
|
|
|
- <p>綜觀而言，黑手阿爸與那些足球教我的事兩部影片於臉書的反應較為熱烈，主要是由於該兩則貼文皆有融合留言抽獎活動，因此，貼文的按讚數、觀看次數及留言數，皆有明顯的高聲量表現。
|
|
|
- 除此之外，貼文的標題以及開頭文字也是一大因素，從經濟部的GreenCampus
|
|
|
- 綠光篇貼文與其他貼文比較起來，由於其他的貼文標題及開頭皆是採用較為口語的文字敘述，像是與觀眾對話，較能夠吸引使用者繼續閱讀及觀看，因此在觀看數與按讚數都較高。
|
|
|
- 註:"愛是最短的距離---織足藏樂館"無臉書觀看次</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class='pagenumber'><p>3</p></div>
|
|
|
</div>
|
|
|
+ <div class='pagenumber'>
|
|
|
+ <p>3</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
</section>
|
|
|
|
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.6.2/chart.min.js"
|
|
|
@@ -999,6 +1099,218 @@
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
+
|
|
|
+ var ctx9 = document.getElementById('myChart-bar-yt');
|
|
|
+ var myChart8 = new Chart(ctx9, {
|
|
|
+ type: 'bar', //圖表類型
|
|
|
+ data: {
|
|
|
+ //標題
|
|
|
+ labels: ['黑手阿爸', ['微電影', '激「立」預告片'], '那些足球教我的事', ['愛是最短的距離', '---織足藏樂館'], '來日'],
|
|
|
+ datasets: [
|
|
|
+ {
|
|
|
+ label: 'like',
|
|
|
+ data: [2, 14.5, 0.44, 86.4, 1.16],
|
|
|
+ borderColor: 'rgba(255, 206, 86, 1)',
|
|
|
+ backgroundColor: 'rgba(255, 206, 86, 1)',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: 'views',
|
|
|
+ data: [5.40, 17.30, 12.22, 91.31, 0.82],
|
|
|
+ borderColor: 'rgba(255, 99, 132, 1)',
|
|
|
+ backgroundColor: 'rgba(255, 99, 132, 1)',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: 'comment',
|
|
|
+ data: [7.5, 32.5, 0, 95, 12.5],
|
|
|
+ borderColor: 'rgba(54, 162, 235, 1)',
|
|
|
+ backgroundColor: 'rgba(54, 162, 235, 1)',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ options: {
|
|
|
+ indexAxis: 'y',
|
|
|
+ plugins: {
|
|
|
+ legend: {
|
|
|
+ // display: false,
|
|
|
+ labels: {
|
|
|
+ padding: 5,
|
|
|
+ font: {
|
|
|
+ display: false,
|
|
|
+ size: 16,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ scales: {
|
|
|
+ x: {
|
|
|
+ ticks: {
|
|
|
+ font: {
|
|
|
+ size: 16,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ title: {
|
|
|
+ display: false,
|
|
|
+ font: {
|
|
|
+ family: 'Times',
|
|
|
+ size: 48,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ y: {
|
|
|
+ title: {
|
|
|
+ display: true,
|
|
|
+ },
|
|
|
+ ticks: {
|
|
|
+ font: {
|
|
|
+ size: 16,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ beginAtZero: true,
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ var ctx10 = document.getElementById('bar-yt');
|
|
|
+ var myChart10 = new Chart(ctx10, {
|
|
|
+ type: 'bar', //圖表類型
|
|
|
+ data: {
|
|
|
+ //標題
|
|
|
+ labels: ['我的黑手阿爸', '那些足球教我的事'],
|
|
|
+ datasets: [
|
|
|
+ {
|
|
|
+ label: 'like',
|
|
|
+ data: [50, 11],
|
|
|
+ borderColor: 'rgba(255, 206, 86, 1)',
|
|
|
+ backgroundColor: 'rgba(255, 206, 86, 1)',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: 'views',
|
|
|
+ data: [40.57, 91.72],
|
|
|
+ borderColor: 'rgba(255, 99, 132, 1)',
|
|
|
+ backgroundColor: 'rgba(255, 99, 132, 1)',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: 'comment',
|
|
|
+ data: [30, 0],
|
|
|
+ borderColor: 'rgba(54, 162, 235, 1)',
|
|
|
+ backgroundColor: 'rgba(54, 162, 235, 1)',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ options: {
|
|
|
+ // indexAxis: 'y',
|
|
|
+ plugins: {
|
|
|
+ legend: {
|
|
|
+ // display: false,
|
|
|
+ labels: {
|
|
|
+ padding: 5,
|
|
|
+ font: {
|
|
|
+ display: false,
|
|
|
+ size: 16,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ scales: {
|
|
|
+ x: {
|
|
|
+ ticks: {
|
|
|
+ font: {
|
|
|
+ size: 16,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ title: {
|
|
|
+ display: false,
|
|
|
+ font: {
|
|
|
+ family: 'Times',
|
|
|
+ size: 48,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ y: {
|
|
|
+ title: {
|
|
|
+ display: true,
|
|
|
+ },
|
|
|
+ ticks: {
|
|
|
+ font: {
|
|
|
+ size: 16,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ beginAtZero: true,
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ var ctx11 = document.getElementById('bar-fb');
|
|
|
+ var myChart9 = new Chart(ctx11, {
|
|
|
+ type: 'bar', //圖表類型
|
|
|
+ data: {
|
|
|
+ //標題
|
|
|
+ labels: ['我的黑手阿爸', '那些足球教我的事'],
|
|
|
+ datasets: [
|
|
|
+ {
|
|
|
+ label: 'like',
|
|
|
+ data: [88.75, 55.15],
|
|
|
+ borderColor: 'rgba(255, 206, 86, 1)',
|
|
|
+ backgroundColor: 'rgba(255, 206, 86, 1)',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: 'views',
|
|
|
+ data: [55.71, 97.14],
|
|
|
+ borderColor: 'rgba(255, 99, 132, 1)',
|
|
|
+ backgroundColor: 'rgba(255, 99, 132, 1)',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: 'comment',
|
|
|
+ data: [94.5, 97.7],
|
|
|
+ borderColor: 'rgba(54, 162, 235, 1)',
|
|
|
+ backgroundColor: 'rgba(54, 162, 235, 1)',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ options: {
|
|
|
+ // indexAxis: 'y',
|
|
|
+ plugins: {
|
|
|
+ legend: {
|
|
|
+ // display: false,
|
|
|
+ labels: {
|
|
|
+ // padding:20,
|
|
|
+ font: {
|
|
|
+ display: false,
|
|
|
+ size: 16,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ scales: {
|
|
|
+ x: {
|
|
|
+ ticks: {
|
|
|
+ font: {
|
|
|
+ size: 16,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ title: {
|
|
|
+ display: false,
|
|
|
+ font: {
|
|
|
+ family: 'Times',
|
|
|
+ size: 48,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ y: {
|
|
|
+ title: {
|
|
|
+ display: true,
|
|
|
+ },
|
|
|
+ ticks: {
|
|
|
+ font: {
|
|
|
+ size: 16,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ beginAtZero: true,
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
</script>
|
|
|
</body>
|
|
|
|
