Soal 3: Elemen Multimedia, Kompresi/Dekompresi & Animasi
(b) Jelaskan apa yang dimaksud dengan Compression dan Decompression dalam Multimedia.
(c) Jelaskan tentang Animasi dan Format dalam Multimedia.
Bagian A: Elemen-elemen Multimedia
Multimedia dibangun dari 5 elemen dasar. Kelima elemen ini dikombinasikan untuk menghasilkan pengalaman pengguna yang kaya dan engaging:
1. Teks (Text)
Elemen paling mendasar. Menyampaikan informasi secara eksplisit melalui karakter dan simbol — fondasi bagi seluruh konten multimedia.
- Format: Plain text (.txt), Rich text (.rtf), Hypertext (.html), Document (.pdf, .docx)
- Jenis font: Serif (Times New Roman), Sans-serif (Arial), Script, Decorative
- Penggunaan umum: Judul, body text, caption, subtitle, menu navigasi, link
2. Gambar / Grafik (Image/Graphics)
Representasi visual 2D yang terbagi menjadi dua jenis dengan perbedaan signifikan:
- Bitmap/Raster: Susunan pixel — semakin tinggi resolusi semakin tajam, namun akan pecah saat diperbesar (JPG, PNG, GIF, BMP, WebP)
- Vector: Berbasis rumus matematika — dapat diperbesar tanpa batas tanpa kehilangan ketajaman (SVG, AI, EPS, CDR)
- Penggunaan umum: Foto, ilustrasi, ikon, diagram, background, texture
3. Audio (Suara)
Gelombang suara yang telah didigitalisasi. Audio memberikan dimensi emosional dan menciptakan suasana yang lebih imersif — film horor tanpa suara akan kehilangan seluruh efek ketegangannya.
- Format uncompressed: WAV, AIFF (kualitas baik, namun ukuran file sangat besar)
- Format compressed: MP3, AAC, OGG, WMA (lossy — ukuran kecil); FLAC, ALAC (lossless — besar namun tanpa kehilangan data)
- Jenis: Narasi/voice-over, musik latar, sound effect (SFX), ambient sound
4. Video
Rangkaian gambar bergerak (frame) yang diputar berurutan dengan kecepatan tertentu (frame rate). Mekanismenya serupa flip book digital — semakin tinggi frame rate, semakin mulus gerakan yang dihasilkan.
- Format container: MP4, MKV, AVI, MOV, WebM — format ini berfungsi sebagai wadah (container), sementara isinya adalah codec
- Codec: H.264, H.265/HEVC, VP9, AV1 — codec menentukan tingkat efisiensi dan ukuran file video
- Parameter penting: Resolusi (480p–8K), frame rate (24/30/60 fps), bitrate, aspect ratio
5. Animasi
Ilusi gerakan dari rangkaian gambar diam. Prinsip dasarnya persistence of vision — mata manusia mempertahankan gambar selama ~1/16 detik, sehingga pada 24+ frame per detik rangkaian gambar tersebut terlihat sebagai gerakan yang mulus.
- Jenis: 2D (cel animation, motion graphics), 3D (CGI, virtual reality)
- Teknik: Frame-by-frame, tweening, motion capture, procedural
- Penggunaan umum: Transisi UI, karakter animasi, explainer video, simulasi, game
Bagian B: Kompresi dan Dekompresi dalam Multimedia
Apa Itu Kompresi dan Dekompresi?
Kompresi (Compression) adalah proses memperkecil ukuran file multimedia dengan menghilangkan data yang redundant atau berulang. Dekompresi (Decompression) adalah proses sebaliknya — mengembalikan data yang telah dikompres ke bentuk yang dapat ditampilkan atau diputar. Secara sederhana: kompresi = memperkecil (seperti zip file), dekompresi = mengembalikan (seperti unzip).
🔄 Lossless Compression
Tidak ada data yang hilang. Hasil dekompresi identik sepenuhnya dengan data asli — bit-per-bit sama persis.
- Teknik: Run-Length Encoding (RLE), Huffman coding, LZW, DEFLATE
- Rasio: Rendah–sedang (2:1 hingga 5:1) — cukup signifikan namun tidak drastis
- Format: PNG (gambar), FLAC (audio), ZIP, GIF
- Cocok untuk: Gambar yang banyak teks, arsip, audio kualitas studio — konten yang tidak boleh mengalami penurunan kualitas sedikit pun
🔅 Lossy Compression
Data mengalami kehilangan. Hasil dekompresi tidak identik dengan data asli — data yang dianggap kurang signifikan bagi persepsi manusia dihapus. Prinsip utamanya: mengorbankan sedikit kualitas untuk memperoleh ukuran file yang jauh lebih kecil.
- Teknik: Transform coding (DCT, DWT), quantization, chroma subsampling
- Rasio: Sangat tinggi (10:1 hingga 200:1) — inilah yang memungkinkan ukuran file menjadi sangat kecil
- Format: JPEG (gambar), MP3, AAC (audio), H.264, H.265 (video)
- Cocok untuk: Foto, streaming video, musik streaming — selama hasil akhir masih nyaman dilihat atau didengar
Codec Utama dalam Multimedia
| Jenis Media | Codec/Format | Lossy/Lossless | Rasio Kompresi | Penggunaan Umum |
|---|---|---|---|---|
| Gambar | JPEG | Lossy | 10:1 – 20:1 | Foto digital, gambar di web — paling umum digunakan |
| Gambar | PNG | Lossless | 2:1 – 5:1 | UI, logo, screenshot — membutuhkan transparansi |
| Gambar | WebP | Keduanya | 25-35% lebih kecil dari JPEG/PNG | Web modern — dikembangkan oleh Google |
| Audio | MP3 | Lossy | 10:1 – 12:1 | Musik streaming, podcast — format audio paling dominan |
| Audio | AAC | Lossy | Kualitas lebih baik dari MP3 pada bitrate sama | YouTube, iPhone, streaming — penerus MP3 |
| Video | H.264 (AVC) | Lossy | 50:1 – 100:1 | Streaming, Blu-ray, kamera — paling banyak digunakan |
| Video | H.265 (HEVC) | Lossy | 2× lebih efisien dari H.264 | Streaming 4K/8K, HDR — ukuran file setengah dengan kualitas setara |
| Video | AV1 | Lossy | 30% lebih efisien dari HEVC | Streaming generasi mendatang, royalty-free — codec masa depan |
Pipeline Kompresi-Dekompresi
Bagian C: Animasi dan Format dalam Multimedia
Apa Itu Animasi?
Animasi adalah teknik menciptakan ilusi gerakan dari gambar-gambar diam (frame) yang diputar secara berurutan dalam kecepatan tertentu. Prinsip dasarnya adalah persistence of vision — mata manusia mempertahankan gambar selama sekitar 1/16 detik, sehingga pada 24+ fps rangkaian frame tersebut terlihat sebagai gerakan mulus, bukan sekadar slideshow.
Jenis-jenis Animasi
| Jenis | Deskripsi | Teknik | Contoh |
|---|---|---|---|
| 2D Animation | Animasi di ruang dua dimensi (x, y) — bergerak di bidang datar | Frame-by-frame, tweening, rigging, onion skinning | Cartoon klasik (seperti Spongebob), explainer video, motion graphics, animasi UI |
| 3D Animation | Animasi di ruang tiga dimensi (x, y, z) — punya kedalaman | Modeling, rigging, keyframing, motion capture, physics simulation | Film Pixar (Toy Story, Up), game 3D, arsitektur, VR |
| Stop Motion | Foto frame-by-frame objek fisik secara aktual — digerakkan sedikit, difoto, digerakkan lagi, difoto, dan seterusnya | Claymation, puppet animation, cut-out animation | Wallace & Gromit, Coraline, LEGO movies |
| Motion Graphics | Animasi elemen grafis dan teks — bukan karakter, berfokus pada visual abstrak | Keyframe interpolation, expressions, particle systems | Logo animasi, title sequence film, info-grafik, HUD game |
Format File Animasi
| Format | Tipe | Karakteristik | Penggunaan |
|---|---|---|---|
| GIF | Raster, 2D | Hanya 256 warna, lossless, mendukung loop, tanpa audio, ukuran kecil — format legendaris internet | Meme, sticker, UI micro-interaction, banner iklan |
| APNG | Raster, 2D | 24-bit color (jutaan warna), mendukung transparansi, kualitas jauh lebih baik dari GIF | Alternatif modern GIF, icon animasi, sticker HD |
| WebP (animated) | Raster, 2D | Dapat lossy atau lossless, efisiensi kompresi tinggi, format modern | Animasi web, pengganti GIF/APNG dengan ukuran lebih kecil |
| SVG (animated) | Vector, 2D | Dianimasikan dengan CSS/SMIL, resolution-independent, ukuran file sangat kecil | Animasi UI, logo animasi, ilustrasi web, Lottie |
| Lottie (JSON) | Vector, 2D | Ekspor dari After Effects, sangat ringan, interaktif, scalable — format andalan desainer UX | Animasi di aplikasi (iOS/Android), animasi web modern |
| MP4 / WebM (video) | Raster | Video sebagai animasi, rasio kompresi sangat tinggi, dapat menyertakan audio | Animasi panjang, tutorial, video explainer, rekaman layar |
| FBX / glTF | 3D | Model 3D, animasi, dan texture dalam satu file — standar industri | Game, AR/VR, 3D web (Three.js) |
12 Prinsip Animasi (Disney)
Prinsip fundamental agar animasi tampak hidup dan natural — menjadi pedoman utama para animator. Dirumuskan oleh dua animator Disney (Ollie Johnston dan Frank Thomas) pada tahun 1981, dan masih digunakan hingga saat ini:
- Squash & Stretch
- Anticipation
- Staging
- Straight Ahead & Pose to Pose
- Follow Through & Overlapping Action
- Slow In & Slow Out
- Arcs
- Secondary Action
- Timing
- Exaggeration
- Solid Drawing
- Appeal