分類
WebTrend

有趣的360全影攝影

剛在 youtube 上看到有趣的 360全景影片, 可以用滑鼠拖拉的方式進行角度的調整, 這樣的攝影方式十分有意思, 目前有一些全景相機(攝影機)可以錄製這樣的影像.

像是這款 Ricoh Theta:

RICOH Theta M15 全天球360°球型環景相機(公司貨)

來看看有趣的全景影片吧:

(引用自: https://www.youtube.com/watch?v=7IaYJZ2Usdk )

繼續閱讀:
https://blog.3bro.info/archives/youtube-360-degree-streaming-video/
http://www.playpcesor.com/2015/03/youtube360google.html

更多 Youtube 360影片:
https://www.youtube.com/channel/UCzuqhhs6NWbgTzMuM09WKDQ

分類
WebTrend

線上轉檔服務-bitcodin

線上影音轉檔服務 bitcodin, 強調快速, 而且支援 MPEG-DASH, 當然也支援 HLS.

之前有介紹過 AWS 上的 Amazon Elastic Transcode 服務(link), 現在這家 bitcodin 來了, 速度很快, 利用他的 sample video 測試, 約是 17倍快的時間可以轉檔完成. 很厲害.

網站在這裡: https://www.bitcodin.com/

而且價格不算貴, 一樣是有 free tier 而且可以選擇多種計價, 依使用量來選擇方案: https://www.bitcodin.com/pricing/

Input 的方式可以用 HTTP、FTP、Dropbox, Output 的方式可以用 FTP、Amazon S3、Dropbox 都有各三種的方式可供選擇, 配合他的 REST API 可以應用的情境就十分廣泛了, 自建的影音庫, 線上隨訊視訊等.

這麼快的轉檔效率, 看起來真的還蠻有競爭力的.

分類
程式技術

在bootstrap下的影片responsive設定

在 bootstrap 下, image 可以很容易地使用 img-responsive class 進行 image 的 responsive 設定, 但是 embed 或是 video 如何處理呢?

在 bootstrap 3.2 起, 增加了好用的 embed-responsive 功能, 簡單說明語法如下:

<div class="embed-responsive embed-responsive-16by9">
    <iframe class="embed-responsive-item" src="//www.youtube.com/embed/ePbKGoIGAXY"></iframe>
</div>

在外部建立一個 div, 包含了 embed-responsive 與 embed-responsive-16by9 or embed-responsive-4by3 class, 然後在 video 或 iframe 包含 embed-responsive-item class, 就可以順利地讓 embed video 能有完整地 responsive 功能了.

參考範例:
http://codepen.io/ncerminara/pen/zbKAD/

分類
WebTrend

Amazon Elastic Transcoder

今天收到了AWS的通知信, 有個新上線的服務Amazon Elastic Transcoder, 用來做影音的線上轉碼, 網址說明在這裡

http://aws.amazon.com/elastictranscoder/

這個服務提供很容易的方式將影音的格式進行轉碼, 可以支援的輸出格式為 h.264 + AAC 的 mp4 檔案, 當然也是目前支援性高也廣泛應用的格式, 內建的幾組預設輸出(preset)如下:

Generic 1080p mp4 System preset generic 1080p
Generic 720p mp4 System preset generic 720p
Generic 480p 16:9 mp4 System preset generic 480p 16:9
Generic 480p 4:3 mp4 System preset generic 480p 4:3
Generic 360p 16:9 mp4 System preset generic 360p 16:9
Generic 360p 4:3 mp4 System preset generic 360p 4:3
Generic 320×240 mp4 System preset generic 320×240
iPhone4 mp4 System preset: iPod touch 5G, 4G, iPad 1G, 2G
iPhone4S mp4 System preset: iPhone 5, iPad 3G, 4G, iPad mini, Samsung Galaxy S2/S3/Tab 2
iPhone3GS mp4 System preset: iPhone 3GS
iPod Touch mp4 System preset: iPhone 1, 3, iPod classic
Apple TV 2G mp4 System preset: Apple TV 2G
Apple TV 3G mp4 System preset: Apple TV 3G, Roku HD/2 XD
Web mp4 System preset: Facebook, SmugMug, Vimeo, YouTube
KindleFireHD mp4 System preset: Kindle Fire HD
KindleFireHD8.9 mp4 System preset: Kindle Fire HD 8.9
KindleFire mp4 System preset: Kindle Fire

若是內建的 preset 不夠用, 也可以自行建立 preset, 建立畫面如下:

如此一來便能建立更符合應用需求的尺寸, 不過一般來說, 內建的 preset 已經很夠用了. 另外大家有沒有注意到, 還有 thumbnails 這項, 對了, 就是產生縮圖的功能, 在轉換影片的過程中, 也一併產生縮圖, 方便在實際應用上的圖片預覽, 在預設的 preset 中也有.

再來就是計價的部分, 是以影片的長度來計算, 以最便宜的地區來看, 每一分鐘轉出的SD影片為0.015美元, 而轉出HD影片為0.03美元, 也是相當便宜呢. 將一部 120分鐘的影片轉檔為SD的格式, 只需要 1.8美元.

以實際上傳來進行轉檔, 把檔案放到 s3 中, 指定好輸入檔案和輸出檔案後, 測試一支 3:30 長度的影片, 720P轉為 480P, 16:9, 只需要不到2分鐘的時間, 效率也很不錯.

目前有每月免費20分鐘的影片轉檔試用, 大家可以來體驗看看這個新上線的 amazon 服務!

[1/30 10:57]
為能再次測試看得到的範例, 從 HD Demo world找了一支影片來測試, 網址在這裡:

http://www.demo-world.eu/trailers/high-definition-trailers.php

使用的是 BBC Germany 22.1MB 20sec

上傳到 s3 的 bucket 裡, 並開始進行轉換, 不過可能是檔案格式為 hd_distributor_bbc_germany.m2ts 是 m2ts 的格式, 所以轉換失敗, 而凌晨測試的格式是 720p 的 mp4 轉為 480p 的 mp4, 所以是順利轉出.

查了一下這個 Amazon Elastic Transcoder 支援的輸入格式說明如下:

Formats: Amazon Elastic Transcoder supports transcoding into H.264 video and AAC audio in an MP4 container. We support most common media formats for input including H.264, AAC, MP4, MPEG-2, FLV, 3GP and AVI.

看起來 m2ts 可能不被支援, 所以測試失敗.

再查了一下, 發現是輸出設定檔案衝突, 所以無法輸出, 真囧, 再次建立 job 進行測試, 於 45sec完成轉換(輸出仍為1080p-生成檔案大小為 30.9MB).

在建立 job 時, 順便看了一下 Additional Job Details 中, Input Container 預設是自動(用預設即可), 下拉後, 有格式選擇如下:

共有 3gp, asf, avi, divx, flv, mkv, mov, mpeg, mpeg-ps, mpeg-ts, mxf, ogg, vob, wav, webm 這些格式, 基本上常用的都有了.

再來繼續測試:

輸出 720p 的格式, 所需時間為 32sec, 輸出檔案大小為 16.7MB
輸出 480p 16:9 的格式, 所需時間為 61sec, 輸出檔案大小為 8.8MB
輸出 360p 16:9 的格式, 所需時間為 27sec, 輸出檔案大小為 5.2MB

雖然 480p 16:9 稍慢一點, 不過看起來可能只是一個案例, 再測一次 480p 16:9 的輸出為 51sec, 有稍快一點, 整體來說轉檔的時間真的還蠻快的呢!

分類
好用軟體

Youtube下載影片插件-Firefox

這個工具是Firefox 的插件, 可以方便地下載 youtube 上的影片, 而且會列出所有可供下載的解析度及格式, 插件名稱為 Easy YouTube Downloader

英文安裝下載頁: https://addons.mozilla.org/en-us/firefox/addon/easy-youtube-video-downl-10137/
中文安裝下載頁: https://addons.mozilla.org/zh-tw/firefox/addon/easy-youtube-video-downl-10137/

安裝好之後, 在瀏覽 youtube 的影片時, 會在下方多出現一個下載, 點擊後會出現所有可用的下載點, 以這頁為例: http://www.youtube.com/watch?v=tub3x22YNbk

下方下載點擷圖如下:
就有純音樂的 M4A, AAC, MP3-128k, MP3-64k, 影片的 MP4 1080p, 720p, 360p, FLV的 480p, 360p, 240p 還有一個預覽圖及說明連結, 點擊後即可下載影片, 方便使用, 真是一個好用工具啊!

分類
Javascript

VideoJS-HTML5的影片播放器

瀏覽器支援HTML5後, 可以利用 <video> 標籤來做影片的播放, 與之前需要 FLASH 的外掛不同, 讓瀏覽器本身就可以直接直援播放影音的功能.

不過有時需要有向前相容的功能, 也就是在不支援 <video> 這個 html5 標籤時, 也需要能播放, 這時候可以利用之前曾提過的 jw player (http://www.longtailvideo.com/players/) 或這篇文章要介紹的 VideoJS – http://videojs.com/

這個播放器利用了純 HTML5 的 <video> 標籤功能, 配合了可以自訂的 CSS 來產生播放器, 並同時支援了多款現行的瀏覽器, 以及向前相容的 FLASH 語法, 方便在撰寫影音播放器的開發者使用, 並且還有一個方便的產生器: http://videojs.com/embed-builder/ 還有多組 SKINS 可供應用: http://videojs.com/skins/ 真的還蠻方便的呢!

分類
懶得分類

實用解析度大剖析

在實作 video 播放器時, 或是做 video 解析度判定時, 往往有許多專有名詞跑出來, 像是 VGA (640*480), NTSC (720*480), 再加上有一些小的解析度, 搞得很多名詞, 很多解析度出來, 這裡一次做一彙整, 把資料名稱和來源及解析度整理清楚. 也方便日後使用.

小尺寸的 CIF: (資料來源: http://zh.wikipedia.org/zh-tw/%E9%80%9A%E7%94%A8%E5%BD%B1%E5%83%8F%E5%82%B3%E8%BC%B8%E6%A0%BC%E5%BC%8F)

共有:
SQCIF 128 × 96
QCIF 176 × 144
CIF 352 × 288
4CIF 704 × 576
16CIF 1408 × 1152

其中 CIF 是 352 × 288, 而 Q 就是指 1/4, 所以各維度減為一半, 而 4CIF 則是 4倍, 也就各維度是 2倍長, 16CIF 則是各維度 4倍長.

再來就是較大尺寸的部分, 這張圖幾乎可以說明一切: http://zh.wikipedia.org/wiki/File:Video_Standards.svg

而顯示解析度更清楚的說明可以在這裡查到: http://zh.wikipedia.org/zh-tw/%E6%98%BE%E7%A4%BA%E5%88%86%E8%BE%A8%E7%8E%87

內容如下:

分類
好用軟體

如何在windows 7(x64)下擷取DV Video

由於安裝了 Windows 7 (x64) 來測試應用狀況, 最近剛好遇到要 capture DV Video, 於是找半天, 在 os 內建的 “windows movie maker”, 結果沒有找到, 但是有 “Windows DVD 製作程式”. 查了 help 發現這個事實:

於是上網找了 windows movie maker 2.6 for vista 的版本來安裝 (link), 安裝倒沒問題, 不過找不到”從視訊裝置擷取” 這個選項:

所以可能是 windows movie maker for vista 在 windows 7 下沒辦法從 dv 擷取 video 出來吧, 於是只好再找看其他的 solution.

從這篇文章發現(link), 原來 live 工具組裡有個 Live Windows Movie Maker:

http://img.wlxrs.com/BJek85RRl3BJdDNE2TfInw/zh-cht/overview.jpg

於是趕快抓來用看看: http://download.live.com/moviemaker, 不過很有可能新版還沒有來得及趕上線, 於是出了個 live movie maker 搶鮮版更新, 在這裡: http://www.microsoft.com/downloads/details.aspx?FamilyID=e7446634-e033-4053-acd3-a7a18ea8a1a2&displaylang=zh-tw 是將原來的使用限期由 2009/6/30 延長至 2009/12/31, 所以也就一併更新一下. 接下來的應用就很單純了, 可以利用 live movie maker 來擷取 dv 內的 video, 也就順利地解決了在 windows 7 (x64) 下截取 dv 內的 video 問題了.

擷取完成, 再配合在 windows 7 內附的 windows dvd 製作程式, 就可以順利燒出 dvd 了耶. 還真不錯哦.

記得不用再去抓 windows movie maker 2.6 for vista 了, 會遭遇無法擷取的問題. 若有人可以擷取的話, 也請留言告知一下, 看是否是什麼環境的問題, 例如是 x32 的版本還是哪裡我沒有注意到的地方.

[2012/11/12 19:59]更新一下連結, movie maker 2011 整合在這個安裝包裡了: http://www.microsoft.com/zh-tw/download/details.aspx?id=29223

分類
Blog服務

youtube台灣官方部落格出來了

在 zdnet 網站上得到這個消息: YouTube台灣官方部落格上線, 實際去拜訪 youtube 台灣官方部落格, http://tw.youtube.com/blog, 目前只有兩篇文章, 社群網站, 這個在地的部落格對於經營會有很大的幫助, 事實上, 透過專有的地方, 與網友溝通, 互動, 對於網友及網站的活化和黏著信心可以有一些幫助. 當然, 實際上還是得看經營的手法及活化方法, 官方部落格上的任務說明如下:

  1. 公佈全球影片活動:全球各版本的 YouTube 持續舉辦各種線上及實體活動,我們將挑選最值得介紹的活動,讓你與全球社群同步脈動。
  2. 介紹台灣社群的影片趨勢:YouTuber 們的創意總令人意想不到﹔我們將不定期介紹社群的影片妙點子,讓大家知道,原來影片可以這樣玩。
  3. YouTube 新功能:注意到了嗎?YouTube 的功能和介面持續在更新,我們也要讓你第一時間就知道。

所以重點就很明顯, 對於 youtube 對台灣網友的關心, 相信應該是更多的, 能否有效達到成效, 我們拭目以待.

stage6關站囉

最早是在 stage6.divx.com 就看到這個利用 divx 做為 codec 的影音分享網站, 由於他的品質非常好, 也可以達到幾乎HD的效果, 對於這個網站, 就常常到訪關心.

前一陣子(大約在2008年初)他整個將網域改為 www.stage6.com, 看起來應該是要獨立經營這個影音分享服務, 可以從下面 alexa 圖表得到改域名的狀況:

不過這個網站利用了 DivX 的 codec , 讓在網站上的影音分享內容也可以達到娛樂的品質, 再加上設計十分不錯的播放器(可以在 IE 及 FF 都可用), 具體的好處可以參考這篇文章:
好物!甜美的Stage6線上影音站台詳解

今天拜訪了這個網站, 發現已經貼出停止服務公告了, 看起來可能龐大的資源(包含頻寬, 服務器, 存放空間)讓他們無法繼續服務下去. 不過 divx player 仍會繼續開發下去, 也會繼續維護.

看到這樣的消息真的令人感到可惜咧. 其他相關文章:
Stage6關站了
DivX Stage6影片分享網站
Stage6:又一個科技界的嘆息! 將於2008/02/28關閉!
stage6即將於2/28關站
Stage6.com 關站了..