BAB IV
TEKNIS PRODUKSI MEDIA
4.1 Teknis Produksi Media
4.1 .1 Proses analisis produksi media
Proses analisa produksi media merupakan urutan analisa penulis dari beberapa kinerja yang secara terorganisir dan sistematis tersalurkan yang menjadi sebuah analisa merupakan pencapaikan untuk membuat desain website yang secara arah terkonsep menjadi sebuah karya terlihat statis.
Resolusi desain website yang akan penulis buat adalah 1024 x 768.
alasan penulis memilih resolusi tersebut adalah karena halaman memerlukan resolusi yang lebih pada penempatan desain.
4.1.2 Pra Produksi
Dalam tahapan proses pra produksi penulis membuat jadwal dalam pembuatan website.
Bentuk Kegiatan
Bulan 1 Bulan 2 Bulan 3 Bulan 4 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 A. Pengumpulan Data 1. Refrensi 2. Pencarian Data B. Analisa Data 1. Refrensi Karya C. Konsep Konten
Website 1. Konsep Pembahasan 2. Menentukan Materi 3. Menentukan Struktur
Layout 4. Menentukan Karakter
5. Membuat Desain
Layout 6. Coloring layout &
Karakter 7. Pembuatan Animasi
Flash 8. Menentukan Media
Pendukung 9. Finishing
Tabel. 4.1 Pra Produksi 4.1.3 Produksi
Dalam proses produksi desain website ini terdapat beberapa halaman website,dimana setiap halaman mewakili dari menu yang akan di akses nantinya. Desain website ini terdapat 2 halaman, dimana setiap halamannya memiliki bagian – bagian dan fungsi tertentu dalam menyampaian informasi. Setelah membuat halaman selesai satu per satu kemudian di lanjutkan dengan tahapan pembuatan link, pada tahap ini semua halaman yang sudah selesai dibuat kemudian saling di hubungkan satu sama lain, sehingga nanti semua halaman yang telah dibuat akan menjadi satu.
Dalam tahapan proses Produksi media penulis membagi dua bagian, yaitu proses teknis media utama dan proses teknis media pendukung.
4.1.3.1 Proses Digital Imageing
Dalam tahapan digital imaging adalah tahapan dimana proses pembuatan layout yang menggunakan software digital imaging. Untuk perwarnaan menggunakan warna standar RGB. Tahap digital imaging ini terdiri dari
pembuatan layout seperti : Karakter, background utama, footer, dan button.
4.1.3.1.1 Proses Karakter
Gambar 4.1 Karakter Pertama
Gambar diatas karakter utama dalam desain website AYO BELAJAR. Karakter seorang anak laki – laki yang menggunakan baju putih dan celana berwarna merah. Yang menjadikan karakter tersebut suatu simbol dari website.
Gambar 4.2 Karakter kedua
Gambar diatas karakter utama dalam desain website AYO BELAJAR. Karakter seorang anak
perempuan yang menggunakan baju putih dan rok berwarna merah jambu. Yang menjadikan karakter tersebut suatu simbol dari website.
4.1.3.1.2 Proses Desain Halaman Website
Gambar 4.3 Warna Background
Warna pada background utama disesuaikan dengan tema dari website AYO BELAJAR. Untuk itu penulis membuat rangkaian warna langit yang memiliki gradasi putih. Warna biru muda dan putih.
Pada pembuatan background utama penulis menggunakan teknik gradasi.
Gambar 4.4 Footer
Gambar diatas merupakan desain footer untuk website AYO BELAJAR. Pemilihan gambar menggunakan suasana perkebunan sehingga memiliki kesan sejuk. Footer disesuaikan dengan warna background.
Gambar 4.5 Tampilan halaman utama
Gambar tersebut merupakan hasil salah satu tampilan bagian dari halaman home pada website dan tampilan akan digunakan sebagai halaman utama.
Gambar 4.6 Tampilan Halaman kedua
Gambar tersebut merupakan hasil salah satu tampilan untuk bagian Halaman pelajaran dan tampilan ini akan di gunakan untuk setiap halaman
pada pembuatan website AYO BELAJAR. Yang membedakan hanyalah content atau isinya saja pada setiap halaman.
4.1.3.1.3 Proses Desain Button Website a.Button Utama
Pada button menggunakan button original image dan button rollover image, dengan menggunakan warna – warna yang berbeda pada tiap buttonnya. Warna yang digunakan kuning , orange, biru, dan hijau. Masing – masing warna pada button di beri gradasi sehingga pada setiap button memiliki dua warna yang berbeda. Button original image hanya terdapat simbol seperti rumah, buku, stick games, dan not balok. Pada Rollover Image menggunakan typografi Rumpelstiltskin. Format akhir dari button utama PNG.
Gambar 4.7 Desain Button original image
Gambar 4.8 Desain Button Rollover Image
Gambar 4.9 Desain Button original image
Gambar 4.10 Desain Button Rollover image
Gambar 4.11 Desain Button Original Image
Gambar 4.12 Desain Button Rollover Image
Gambar 4.13 Desain Button original Image
Gambar 4.14 Desain Button Rollover Image
b. Sub Button
Pada Sub button menggunakan button original image dan button rollover image, dengan menggunakan warna – warna yang berbeda pada tiap button tekt. Button Teks menggunakan typografi bubblegums. Button Original Image menggunakan dua warna.
Warna utama putih pada tiap teks dan warna kedua disesuaikan. Munggunakan kepala dari karakter, dan memiliki format akhir PNG.
- Sub Button desain pertama
Gambar 4.15 Desain Button Original Image
Gambar 4.16 Desain Button Rollover Image - Sub Button desain kedua
Gambar 4.17 Desain Button Original Image
Gambar 4.18 Desain Rollover Image 4.1.3.1.4 Proses Website
Gambar 4.19 Desain Halaman Website
4.1.3.1.5 Proses animasi
Gambar 4.20 Animasi
Animasi di dalam website ini menggunakan animasi Motion tween,yang kemudian digerakan. Animasi menggunakan gambar awan, dengan format akhir swf.
4.1.3.1.5.1 Proses Pembuatan Media Pembelajaran
a. Penjumlahan
Media pembelajaran
menggunakan teknik Drag and Drop.
Apel dapat di drag ke bagian apel yang hitam. Dengan menggunakan
background halaman, format akhir swf.
Gambar 4.21 Media Pembelajaran Penjumlahan
b. Belajar Membaca
Media pembelajaran
menggunakan teknik Up and over, Ketika pointer mnyentuh bagian huruf akan mengeluarkan suara.
Dengan menggunakan background halaman dan terdapat animasi awan bergerak.
Gambar 4.22 Media Pembelajaran Belajar Membaca
c.Mengenal Huruf
Media pembelajaran
menggunakan teknik Next and Previous, Ketika button next akan muncul huruf ,dan button previous untuk kembali ke halaman sesudahnya. Pada button dapat mengeluarkan suara. Dengan menggunakan background halaman dan terdapat animasi awan bergerak serta terdapat backsounds.
Gambat 4.23 Media Pembelajaran mengenal huruf
Gambar 4.24 Media Pembelajaran mengenal angka
d.Pengurangan
Media pembelajaran
menggunakan teknik Next and Previous, Ketika button next akan muncul huruf ,dan button previous untuk kembali ke halaman sesudahnya. Pada button dapat mengeluarkan suara. Dengan menggunakan background halaman.
Gambar 4.25 Media Pembelajaran pengurangan
e.Mengenal Suara
Media pembelajaran
menggunakan teknik Up and over, Ketika pointer mnyentuh bagian huruf akan mengeluarkan suara.
Dengan menggunakan background halaman dan terdapat animasi awan bergerak.
Gambar 4.26 Media Pembelajaran Mengenal Suara
4.2 Proses Akhir Media
4.2.1 Media Utama Website
Dalam pembuatan website ini terdiri dari 4 menu. Yaitu : 1. Home
2. Pelajaran: - Isi content 3. Games: - Isi content 4. Video : Isi Content
1. Home
Home pada pembuatan website, halaman utama pada website yang isinya sangat singkat, dan jelas. Pada menu ini terdapat beberapa menu utama seperti :Pelajaran, Games dan bernyanyi serta terdapat karakter. Terdapat animasi awan bergerak.
Gambar 4.27 Halaman Home 2. Pelajaran
Halaman pelajaran pada pembuatan website, halaman kedua pada website yang terdapat button utama, dan button content yang menggunakan ilustasi gambar kepala dari karakter utama.
Gambar 4.28 Halaman Pelajaran
- Isi content
Pada Halaman Isi content pada website, terdapat button utama dan media pembelajaranan.
Gambar 4.29 Halaman isi content
2.Games
Pada halaman games, halaman terdapat button utama, dan button content yang menggunakan ilustasi gambar kepala dari karakter utama.
Gambar 4.30 Halaman Games
- Isi content
Pada Halaman Isi content games pada website, terdapat button utama ,penjelasan cara bermain dan permainan.
Gambar 4.31 Halaman isi contant Games 3. Video
Pada halaman bernyanyi, halaman ini terdapat button utama, dan sub button content yang menggunakan ilustasi gambar kepala dari karakter utama.
Gambar 4.32 Halaman Video
- Isi Content
Pada Halaman Isi content bernyanyi pada website, terdapat button utama ,lirik lagu.
Gambar 4.33 Halaman isi content
4.3 Pasca Produksi
Tahapan ini merupakan tahapan akhir dalam pembuatan desain website, dimana hasil dari desain website tersebut di upload ke internet atau disebut juga mempublish
desain website ke server. Namun sebelum mempublish website memerlukan pembelian domain, dan hosting terlebih dahulu, dan baru nantinya desain website yang telah jadi di upload kemudian dan diaktifkan sehingga dapat di akses oleh pengunjung. Dengan desain yang di buat minimalis secara teknis akan mempermudah pengunjung dalam mengakses website tersebut dengan proses yang cepat tanpa harus menunggu lama saat mengaksesnya.
Dan dilakukan service pada website, agar pemanfaatan website edukasi tersebut terus berjalan dengan baik bagi pengguna.
Untuk membuat website ini terlihat minimalis, dilakukan dengan beberapa cara,misalnya meminimaliskan animasi flash pada website, sehingga penulis hanya terfokus pada bagaimana cara membuat tampilan desain website yang menarik tanpa harus mempergunakan animasi dalam desain website.
4.4 Media Pendukung 1. Mouse Pad
Gambar 4.34 Poster Ukuran Teknis Media
Format : Landscape Ukuran : 19 cm x 19 cm Material : Laminasi Doff Teknis Produksi : Cetak Ofset
Penempatan Media :Media ini dibagikan pada saat kegiatan promosi.
Alasan : pemilihan media ini adalah karena berfungsi sebagai media pengingat dari media utama karena mouse padat dapat dipakai dan ada nilai gunanya.
2. Stiker Meja
Gambar 4.35 stiker meja Ukuran Teknis Media
Format : Landscape
Ukuran : 3 m x 1 m Material : Vinyil
Teknis Produksi : Digital Printing
Penempatan Media : Ditempatkan di stand acara.
Alasan : pemilihan media ini karena berukuran cukup besar sehingga dapat terlihat dengan jelas.
3. Pin
Gambar 4.36 Pin Ukuran Teknis Media
Format : Landscape Ukuran : Diameter 5,5 cm
Material : Kertas ink jet dilaminasi doff Teknis Produksi : Digital Printing
Penempatan Media :Media ini dibagikan pada saat kegiatan promosi.
Alasan : Pemilihan media ini adalah karena berfungsi sebagai media pengingat dari media utama.
4. Jadwal Pelajaran
Gambar 4.37 Jadwal pelajaran Ukuran Teknis Media
Format : Potret Ukuran : A3
Material : Art Paper, 150 gsm Teknis Produksi : Digital Printing
Penempatan Media :Media ini dibagikan pada saat kegiatan promosi.
Alasan : Dapat berfungsi sebagai media pengingat dari media utama karena jadwal pelajaran dapat dipakai dan ada nilai gunanya.
5.Stiker Nama
Gambar 4.38 Stiker nama Ukuran Teknis Media
Format : landscape Ukuran : 8 cm x 4 cm Material : Stiker Vinyl Teknis Produksi : Digital Printing
Penempatan Media :Media ini dibagikan pada saat kegiatan promosi.
Alasan : Dapat berfungsi sebagai media pengingat dari media utama karena stiker nama dapat dipakai dan ada nilai gunanya
6.Penghapus
Gambar 4.39 penghapus
Ukuran Teknis Media
Format : Landscape Ukuran : 7 cm x 6 cm Material : Stiker Vinyl Teknis Produksi : Digital Printing
Penempatan Media :Media ini dibagikan pada saat kegiatan promosi.
Alasan : Dapat berfungsi sebagai media pengingat dari media utama karena penghapus dapat dipakai dan ada nilai gunanya.
7 . Penggaris
Gambar 4.40 Penggaris Ukuran Teknis Media
Format : Landscape Ukuran : 30 cm
Material : Penggaris Pelastik
Penempatan Media :Media ini dibagikan pada saat kegiatan promosi.
Alasan : Karena bisa ditempatkan dimana saja, berfungsi untuk mengingatkan secara terus-menerus, tanpa harus membutuhkan tempat yang luas.
8. Sampul Buku
Gambar 4.41 Sampul Buku Ukuran Teknis Media
Format : landscape Ukuran : 31 cm x 23 cm Material : Art paper, 150 gsm Teknis Produksi : Digital Printing
Penempatan Media :Media ini dibagikan pada saat kegiatan promosi.
Alasan : pemilihan media ini adalah karena berfungsi sebagai media pengingat dari media utama karena sampul buku dapat dipakai dan ada nilai gunanya.
9. T-Shirt
Gambar 4.42 T- shirt Ukuran Teknis Media
Format : Landscape
Ukuran : Anak - anak Material : kaos
Teknis Produksi : Digital Printing
Penempatan Media :Media ini dibagikan pada saat kegiatan promosi.
Alasan : pemilihan media ini adalah karena berfungsi sebagai media pengingat dari media utama karena kaos dapat dipakai dan ada nilai gunanya.
10. Kalender
Gambar 4.43 Kalender Ukuran Teknis Media
Format : Landscape Ukuran : A3
Material : dauble injek, 240 gsm Teknis Produksi : Digital Printing
Penempatan Media :Media ini dibagikan pada saat kegiatan promosi.
Alasan : Dapat berfungsi sebagai media pengingat dari media utama karena kalender dapat dipakai dan ada nilai gunanya.
11. Paper Bag
Gambar 4.44 Paper bag Ukuran Teknis Media
Format : Landscape Ukuran : A5
Material : Double Injek, 240 gsm Teknis Produksi : Digital Printing
Penempatan Media :Media ini dibagikan pada saat kegiatan promosi.
Alasan : Dapat berfungsi sebagai media pengingat dari media utama karena kalender dapat dipakai dan ada nilai gunanya.