Langsung ke konten utama

Membuat Flash Video Player sendiri


pinjem video dari: Iman Brotoseno

Sudah banyak video yang di pasang di website-website maupun web blog setelah popularnya Youtube dan Google belakangan ini. Video-video ini dipasang dengan menggunakan free player yang disedikan oleh mereka. Jadi kita dapat sharing video milik kita yang ditampung di server mereka untuk dipasang di website milik orang.

Nah sekarang gimana kalau kita menggunakan player milik sendiri?
asyik juga kali ya... bisa pasang logo di player itu dan kita juga bisa sharing seperti Youtube dan Google punya.

Disini saya mencoba kasih sedikit trik membuat player sendiri yang simple yang dapat memutar file flash video (flv) sendiri dari mana saja dan trik ini juga saya gunakan di beberapa project pembuatan website multimedia yang saya buat.

Player yang coba dibuat ini menggunakan Flash v.8 dan berikut langkah-langkahnya:

Langkah-1
Buat file flash baru dengan nama 'player'

Langkah-2
Karena document file yang akan kita buat adalah sebuah player, kita set ukuran document ini sesuai dengan player yang kita inginkan melalui toolbar 'modify' | 'document'


Disini saya coba setting dengan ukuran referensi video dari flash (320x240 pixels), kita tambahkan ukuran untuk tinggi menjadi 280 karena space untuk 'playback' video-nya.

Langkah-3
Setting fps (frames per second) dengan 12 standard flash dan supaya video yang dijalankan tidak terlalu berat untuk dimainkan.

Langkah-4Atur lembar kerja layer menjadi 2 beri nama 'action' dan 'player' seperti gambar dibawah:

Langkah-5
Tarik component Playback yang ada di window components, letakkan pada layer 'player'

Beri nama instance name-nya dengan 'player_mc'

Setelah itu rubah angka parameter untuk 'Buffer Time' menjadi 5 (untuk memberi kesempatan playback untuk buffering video sebelum dimainkan dari parameter standarnya adalah 0.1).
Karena dengan parameter 0.1 hampir tidak memungkinkan dengan koneksi yang ada di Indonesia sekarang ini, video akan tersendat-sendat waktu dimainkan.

Langkah-6
Masukkan action script berikut pada layer 'action' melalui window 'action'

Tentukan variable yang bersifat global dengan nama 'file',
variable ini bisa juga difungsikan sebagai URL variable yang dapat dikirim dari luar flash movie
_global.file;

masukkan script ini dibawahnya, yaitu script sebagai playback video yang dibuat:import mx.video.*;
var listenerObject:Object = new Object();
listenerObject.stateChange = function(eventObject:Object):Void {
if(player_mc.buffering){
_root.buffering_mc._visible = true;
} else {
_root.buffering_mc._visible = false;
}
};
player_mc.addEventListener("stateChange", listenerObject);

Tentukan file video yang akan dimainkan
player_mc.contentPath = _root.file;

Langkah-7
Publish file flash anda dengan nama 'player.swf'

Langkah-8
Langkah terakhir adalah memainkan dan memanggil flv file melalui HTML file (player.html)

Buka file html anda dengan 'dreamweaver', tambahkan parameter nama flv file berikut pada object flash anda:

player.swf?file=namafile.flv

Untuk memanggil file yang ada di web masukkan lengkap dengan nama URL anda sepert:

player.swf?file=http://mediasolusindo.com/player/telkomsel.flv

Silahkan berkreasi untuk digabungkan dengan PHP script misalnya atau yang lainnya, trik ini sudah saya coba di beberapa web multimedia yang saya buat seperti:

- Fast Films Production
- Visi Caldecott
- Iman Brotoseno Film Director and Underwater Photography
Selamat Mencoba ...!!!

Komentar

  1. Mas Ipul,
    1. Untuk file .mpeg (atau sejenisnya) di Flash ditaruh dimana? Di Library-kah?

    2. Trus untuk upload ke DreamWeaver nya masih kurang jelas mas. Tolong lebih terinci lagi, supaya temen2 bisa lebih jelas cara memasukkan di file html nya.

    Terima kasih.
    Gun - Bali

    BalasHapus
  2. @anonymous,
    1. File yg digunakan file .flv utk video-nya sebagai external file, bukan di library.

    2. Di HTML masukkan media flash atau dng dreamweaver dari
    Insert | Media | Flash

    ....
    <param name="movie" value="player.swf" >
    .....
    <embed src="player.swf"
    ....

    tinggal masukkan aja variable/nama file video yg ingin dimainkan setelah 'player.swf' diatas:

    syntac:
    player.swf?file=[URL atau folder file .flv-nya]

    BalasHapus
  3. Salam kenal Mas Ipul,
    saya udah ngikutin semua yg Anda tulis diatas(bahkan sama persis), tapi kok lom bisa jalan juga yah di htmnya?
    bisa kasi contoh filenya ga(fla n htmnya).

    Thanks,
    Yacob-Jakarta

    BalasHapus
  4. @yacob,

    Untuk penempatan HTML, bisa lihat di komentar saya sebelumnya atau video di postingan ini menggunakan trik yg sama, dengan memainkan file video dari 'lycos free hosting' bisa lihat di 'view source' halaman ini dengan keyword 'Membuat Flash Video Player sendiri'

    BalasHapus
  5. keren banget mas ...

    BalasHapus
  6. hiyyaaa..aqu dh coba biqn video sndiri kWeb dFlash tsb.
    Mank keren ^^
    dr k-3 project dAtas aqu sk yg k-2 o(>.<)o KEREN...
    gmn y caranya biqn tampilan web flash bgitu? coz kbetulan aqu da tgs multimedia bwt web tntng entertainment.
    thanx <3

    BalasHapus
  7. artikel anda bagus dan menarik, artikel anda:
    http://design.infogue.com/
    http://design.infogue.com/membuat_flash_video_player_sendiri

    anda bisa promosikan artikel anda di www.infogue.com yang akan berguna untuk semua pembaca. Telah tersedia plugin/ widget vote & kirim berita yang ter-integrasi dengan sekali instalasi mudah bagi pengguna. Salam!

    BalasHapus
  8. """Tentukan variable yang bersifat global dengan nama 'file',
    variable ini bisa juga difungsikan sebagai URL variable yang dapat dikirim dari luar flash movie
    _global.file;"""

    mas saya ngga ngerti sama yang ini maksudnya gimana ya? atau tingga copy paste action scriptnya aja?

    BalasHapus
  9. Halle...
    Mas, saya sudahbaca artikel dan mempraktikkanya. Namun saya bingung langkah ke 6 (tentukan file fideo yang akan dimainkan), dan langkah ke 7.
    Mas.. biasanya saya memasukan video pribadi ke blogger dengan cara upload, nah... apa flash player sekaligus file video (flv)nya juga di upload?

    BalasHapus
  10. @ikhsan,

    iya coba di copy text yg warna biru aja di langkah-6 paste di dalam movie clip player_mc

    @smp negeri 230,
    untuk langkah-7 publish file ke .swf dari aplikasi flash bukan untuk pemaangan.

    untuk masangnya gunakan external host, seprti di contoh ini saya gunakan player dari mediasolusindo.com dan dengan file flv dari lycos.co.uk free host.

    untuk di blogspot gunakan 'element html/javascript', atau ini lengkapnya:

    <object height="180" vspace="5" width="220">
    <param name="movie"
    value="http://mediasolusindo.com/player/msi-player.swf?file=http://members.lycos.co.uk/ipulanwar/media/telkomsel.flv">
    <param
    name="wmode"
    value="transparent">
    <embed
    src="http://mediasolusindo.com/player/msi-player.swf?file=http://members.lycos.co.uk/ipulanwar/media/telkomsel.flv"
    type="application/x-shockwave-flash"
    wmode="transparent"
    height="180"
    vspace="5"
    width="220">
    </embed>
    </object>

    BalasHapus
  11. Terimakasih atas jawabannya....
    lalu tempat upload playernya di mana?

    BalasHapus
  12. @smp negeri 230,

    coba di free hosting, atau baca postingan saya disini:

    http://ipulanwar.blogspot.com/2007/11/apa-sih-hosting-dan-buat-apa.html

    BalasHapus
  13. Mas, jika buatnya tidak memakai dreamweaver bisa ngak? Soalnya saya tidak punya software tsb. Thanks...

    BalasHapus
  14. Mas, bisa buatin gk video-player yg bisa full screen klo di klik 2x trus kecil lagi klo d [esc]

    BalasHapus
  15. mantab dan bagus banget nich blognya, kunjungan balik ya bro di download ebook gratis =p

    BalasHapus
  16. nice blog ,,this is my first time i visit your site...hope i'll learn much about information on your site..regards

    BalasHapus
  17. tku gan semoga ilmu ente berkah,amin

    BalasHapus
  18. Mas, untuk video yang url terakhirnya tidak ada format videonya bisa gak ? misalnya seperti url youtube.

    BalasHapus
  19. Mas, untuk video yang url terakhirnya tidak ada format videonya bisa gak ? misalnya seperti url youtube.

    BalasHapus
  20. Kasih video tutornya dong mas, soalnya saya gk ngerti pas langkah 6 nya :3

    BalasHapus

Posting Komentar

Postingan populer dari blog ini

Dari Balik Layar Kemeriahan Pesta Blogger 2009

Kemeriahan Pesta Blogger 2009 tanggal 24 Oktober 2009 di gedung SMESCO, Jl. Gatot Subroto, Jakarta lalu yang merupakan puncak acara kopdar dari para Blogger dan dari Komunitas2 Blogger di Indonesia itu secara umum terlaksana cukup sukses. Walau masih ada beberapa kendala seperti yang Mas Iman Brotoseno sebagai manusia Kursi tahun 2009 ini katakan di Blog Pesta Blogger: "Kami juga memohon maaf jika masih banyak kekurangan disana sini, terutama dari pelaksanaan break out seassion dan ‘ udara panas ‘ yang menyergap peserta. Namun kami percaya bahwa peserta tak kehilangan makna dan esensi yang dapat dipetik dari acara tersebut" Di perhelatan akbar para blogger tahun ini terlihat muka2 lama diantara banyaknya muka2 baru yang hadir. Perbedaan mencolok Pesta Blogger tahun ini dibanding Pesta Blogger sebelumnya adalah adanya Blogshop di 10 kota bagi pemula atau yang belum mempunyai blog, dan menghadirkan beberapa Blogger luar di Brakeout Session seperti Brian Giesen (Blogger ya...

Simple Product Gallery untuk di Blog

Busana Model Mix 03 Busana By: Zulfa Collection @ Riristore Web Store Menjual sebuah produk dengan menggunakan Blog sekarang ini sudah menjadi ' Trend ' baru di dunia internet , karena selain relatif lebih mudah dalam hal pembuatannya kita tidak perlu mengeluarkan biaya untuk membuat Blog tersebut alias ' gratis ' dibandingkan harus membuat sebuah Web Store yang akan membutuhkan biaya yang tidak sedikit, belum lagi masalah waktu pembuatan dan customize sebuah Web Store yang tidak akan seperti layaknya di ' sulap ' bila menggunakan Blog barang kita sudah dapat dengan cepat ditampilkan dan siap untuk ditawarkan. Uniknya menjual produk dengan menggunakan blog seperti ini adalah pembeli bisa lebih ' familiar ' dengan si pemilik ' toko ' di blog yang biasanya mencantumkan kata ' Pemilik ' lengkap dengan alamat dan kontak person-nya, bahkan dapat berkomunikasi langsung melalui ' shoutbox ' yang di pasang di blog tersebut ataupun...

Wordpress Trik: Setting dan membuat template sendiri di halaman tertentu

Dunia perblogan sudah tidak popular !! Begitu kira2 suara yang terdengar. Mungkin suara seperti itu muncul karena dilihat dari sudah jarangnya para blogger yang dulu sangat aktif menulis / update blognya secara rutin namun sekarang mereka sudah jarang update blog untuk beberapa tahun terakhir ini **termasuk saya :p Tapi menurut saya dunia perblogan tidak akan pernah mati selama masih ada pemula / newbie di dunia maya internet . Newbie dalam arti bukan hanya para pelajar yang baru melek internet , tetapi mungkin juga para penulis2 baru atau profesi2 lain yang baru mengenal dunia perblogan. Pengenalan ini bisa jadi karena mereka ada kendala dalam pengetahuan internetnya maupun karena sebab lainya. Dalam penggunaan dan manfaatnya blog merupakan media yang sangat simple dan sederhana untuk mengaplikasikan / menuangkan sebuah ide / tulisan atau sekedar memajang foto diri di media internet :) tanpa harus membutuhkan waktu yang relatif lama untuk belajar. Bahkan hanya beberapa jam saja se...