Infografik di Era Interaktivitas

Menyajikan data mentah hanya akan membingungkan pembaca. Namun, mencampuradukkan berbagai kumpulan data berpotensi mengungkap kisah yang tersembunyi. Mungkin saja Anda akan melihat pola dan membuat koneksi yang tak terduga.

Stephen Komives – Direktur Eksekutif, Society for News Design.

Bagaimana bentuk infografik di internet? Luar biasa.

Mengacu pada hasil penelitian akademisi jurnalisme Mark Deuze, media massa tradisional mengalami perubahan drastis dalam jaringan – dari sebuah entitas editorial murni menjadi medium yang interaktif dan partisipatif.

Knowledge Sharing bersama Bank Indonesia

Materi presentasi yang mudah dipahami serta memperhatikan estetika visual semakin dibutuhkan seiring dengan perkembangan zaman dan teknologi. Pada 21 September 2015, Idinfografik berkesempatan untuk berbagi ilmu tentang infografik bersama staf analis ekonomi Departemen Kebijakan Ekonomi dan Moneter, Divisi Asesmen Ekonomi Regional Bank Indonesia di The Stone Hotel, Bali. Kegiatan ini berlangsung selama tiga jam mulai pukul 20.00 di sela-sela pertemuan regular analis ekonomi regional Bank Indonesia.

Peringatan 2 Abad Meletusnya Gunung Tambora

Bulan April 2015 merupakan peringatan 2 abad meletusnya Gunung Tambora di Nusa Tenggara Timur. Letusan yang sungguh dahsyat itu memusnahkan kehidupan di sekitarnya. Peristiwa yang terjadi pada tahun 1815 itu mengakibatkan efek luar biasa di belahan bumi utara khususnya Eropa. Tahun 1816 di Eropa dan Amerika terjadi tahun tanpa musim panas, dan mengakibatkan kegagalan panen yang berimbas pada bencana kelaparan. Setelah diselidiki ternyata peyebabnya adalah letusan Gunung Tambora yang berada di jauh di timur. Letusan yang banyak menjadi inspirasi tulisan dan cerita itu begitu bersejarah, dan momentum 2 abad sejak letusan dahsyat itu diperingati dalam bentuk pameran tentang letusan gunung api di Indonesia.

Sambutan Hangat Kota Pelajar

Selasa (24/2/2015), seusai Magrib, sekitar 150 orang duduk lesehan memenuhi ruang tengah Bentara Budaya Yogyakarta (BBY) untuk mengikuti acara diskusi tentang infogafik. Laretna T Adisakti (dosen arsitek UGM), Sumbo Tinarbuko (aktivis desain/dosen ISI Yogyakarta), dan Lim Bun Chai (desiner grafis Kompas) saling bersambut memberikan paparan, gagasan, dan aplikasi infografik. Bu Sita (panggilan Laretna) memberikan masukan agar infografik ikut berperan dalam pengembangan pusaka di Indonesia, salah satunya dengan cara menampilkan infografik pada papan informasi di situs pusaka. Sumbo mengapresiasi infografik sebagai sebuah karya seni yang memiliki fungsi pengetahuan. Sumbo juga berpesan agar para desainer infografik harus terus mengembangkan kreatifitas mengikuti perkembangan zaman.

Juan Velasco Berkunjung ke Harian “Kompas”

Pada Jumat, 7 November 2014, harian Kompas kedatangan tamu istimewa dari Washington DC, Amerika Serikat. Juan Velasco, mantan graphics art director di New York Times dan art director di National Geographic Magazine mengunjungi redaksi harian Kompas setelah menyampaikan materi pelatihan dalam sanggar kerja (workshop) di Hotel Santika Premiere Jakarta. Pelatihan yang diikuti 4 desainer grafis Kompas tersebut bertajuk “Meeting Print-to-Web Challenge: Interactive Graphics and Data Visualization in Newspaper” dan berlangsung pada 6-7 November 2014. Art director yang telah mendapatkan lebih dari 50 penghargaan Society for Newsdesign ini mengaku sangat senang dapat diundang ke Kompas dan menilai harian Kompas adalah salah satu surat kabar dengan desain terbaik di Asia Tenggara.

Nilai tinggi dan lebar elemen-elemen HTML bisa diambil menggunakan Javascript meskipun kita tidak menentukannya dalam styling CSS.

Tinggi Elemen

Perintah Javascript yang digunakan untuk mengambil nilai tinggi sebuah elemen adalah clientHeight, offsetHeight, dan scrollHeight.

clientHeight: tinggi diukur berdasarkan tinggi elemen ditambah padding vertikal. Ukuran border dan bilah gulung tidak dihitung.

offsetHeight: tinggi diukur berdasarkan tinggi elemen ditambah padding dan border vertikal.

Perintah yang jarang digunakan adalah getBoundingClientRect().

Berikut kode HTML, CSS, dan Javascript yang digunakan untuk mengambil nilai tinggi elemen dan dijalankan di tiga browser yang berbeda.

Tes

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

 

      * {
		margin: 0;
		padding: 0;
	}

	#box {
		width: 300px;
		height: 300px;
		background: rgba(255,0,0,0.3);
		padding: 10px;
		margin: 20px;
		border: solid 5px #f00;
		overflow: auto;
	}
var ob = document.getElementById('box');
console.log('clientHeight: ' + ob.clientHeight);
console.log('offsetHeight: ' + ob.offsetHeight);
console.log('scrollHeight: ' + ob.scrollHeight);
console.log('getBoundingClientRect(): ' + ob.getBoundingClientRect().height);

 

Firefox

firefox

IE 11

ie11

Chrome

chrome

 

 

4 Situs Baru  Dalam Waktu 2 Bulan

[responsivevoice_button voice=”Indonesian Female” buttontext=”Dengarkan Versi Audio”]

 

Merancang dan mengelola situs menggunakan platform WordPress memang sangat mudah dan menyenangkan. Dalam waktu dua (2) bulan,  Harian Kompas berhasil meluncurkan empat situs baru untuk menunjang aktifitas marketing, promosi dan pastinya untuk lebih dekat dengan para pembaca Harian Kompas.

Dengan konsep Themes, Plugin dan juga Multiple User yang memungkinkan kolaborasi pengerjaan secara pararel, pengerjaan situs-situs tersebut rata-rata hanya  dilakukan dalam wakti 1 – 7 hari saja!

Apa saja situs baru tersebut ? berikut daftarnya …

Tambora Challenge

tamboraKisah piluh yang terjadi 200 tahun silam itu terus membekas di kalangan masyarakat Pulau Sumbawa, dan Nusa Tenggara Barat umumnya. Cerita dari mulut ke mulut tentang letusan Gunung Tambora tersebut seolah tidak berkesudahan. Masyarakat Sumbawa, dan Nusa Tenggara Barat pada umumnya sulit melupakan kisah letusan Gunung Tambora pada tahun 1815.

Saba Kampus

sabaMerupakan one-day thematic knowledge branding forum bernuansakan media yang diselenggarakan Harian Kompas sejak tahun 2013. Antusiasme dan semangat generasi muda perihal industri media mendorong kami untuk mengedukasi dan terus menginspirasi. Hingga saat ini sudah ribuan mahasiswa yang berpartisipasi dari tujuh kampus yang telah mejadi venue

Cerpen Kompas

cerpenSejak mengawali tradisi pemuatan cerita pendek asli berbahasa Indonesia pada tahun 1970, Kompas telah menyajikan puluhan cerita seperti ini. Anda akan menemukan sebiji dua “kisah dari pinggiran” di rubik yang hadir setiap hari minggu. Berbeda dengan penghargaan untuk cerpen terbaik di tahun sebelumnya, tahun ini Kompas mengadakan workshop cerpen di 5 kota.

Kompas HUB

hubKompas Daily HUB adalah sebuah platform bagi para komunitas untuk berbagi inspirasi kepada khalayak luas melalui informasi sesuai dengan bidangnya, selain itu Kompas Daily HUB menghubungkan antara satu komunitas dengan yang lain dengan harapan dapat berkolaborasi dalam mendukung satu sama lain.

 

Selamat menikmati situs-situs baru kami!

Mobile Game Kompas TTS

[responsivevoice_button voice=”Indonesian Female” buttontext=”Dengarkan Versi Audio”]

 

Sejarah KOMPAS TTS

Teka Teki Silang Harian KOMPAS, yang terbit setiap hari Minggu, punya pamor tinggi. Bukan hanya karena sudah demikian lama terbit, melainkan karena soal-soalnya terkenal sangat sulit. Mampu menyelesaikan satu edisi TTS Harian KOMPAS adalah pencapaian tersendiri bagi pemainnya. Bangga!

Pamor ini kemudian dipindahkan ke buku oleh Penerbit Buku KOMPAS. Hingga awal 2015, tak kurang dari 8 edisi buku TTS telah terbit, dengan tajuk “TTS Pilihan KOMPAS”. Semua, berdasarkan catatan penjualan di Toko Buku Gramedia, boleh dibilang laku keras.

Bermula dari event “KOMPAS-ITB Application Developers Competition 2011 for BlackBerry”, lahirlah versi pertama TTS Harian KOMPAS dalam format mobile game. Dalam perjalanannya, versi ini kemudian disempurnakan menjadi versi berikutnya, masih khusus untuk pengguna BlackBerry. Sayang, meski cukup banyak penggunanya, pengembangan KOMPAS TTS for BlackBerry akhirnya tidak dilanjutkan.

Pertengahan 2014, Harian KOMPAS memutuskan untuk membuka kembali pengembangan TTS dalam format mobile game. Mengikuti aturan penamaan dari beberapa mobile app Harian KOMPAS sebelumnya, namanya kemudian diubah menjadi KOMPAS TTS.

Kolaborasi Pembuatan KOMPAS TTS

Pengembangan KOMPAS TTS dimungkinkan oleh adanya kolaborasi dengan pihak di luar Harian KOMPAS. Versi perdana dari KOMPAS TTS hadir di platform Windows Phone, hasil kolaborasi Harian KOMPAS dengan Nokia Indonesia dan Radya Labs.

pengembangan Kompas TTS bersama Radyalabs

pengembangan Kompas TTS bersama Radyalabs

Radya Labs adalah sebuah perusahaan pengembang mobile app yang berbasis di Bandung, Jawa Barat. Jenis mobile app yang mereka kembangkan cukup beragam, mulai dari bisnis, gaya hidup, hingga pendidikan.

Platform KOMPAS TTS

KOMPAS TTS kini sudah hadir di semua mobile platform utama dunia, yaitu Windows Phone, Android, dan iOS. KOMPAS TTS versi Windows Phone diluncurkan pada 28 Maret 2014, versi Android pada 26 November 2014, dan versi iOS pada 9 Desember 2014.

Kompas TTS di iOS, Android dan Windows Phone

Kompas TTS di iOS, Android dan Windows Phone

 

Kenyamanan memainkan mobile game ini sangat terjamin, karena masing-masing versi dibangun dalam native environment.

Fitur Unggulan KOMPAS TTS

Didesain khusus untuk memberi kenyamanan saat dimainkan sebagai mobile game, KOMPAS TTS mengandalkan beberapa fitur unggulan berikut ini:

  1. Setiap harinya, KOMPAS TTS menyediakan satu soal gratis bagi pemain
  2. Pemain dapat memilih mode “Bermain dengan Waktu” yang memungkinkan dirinya mencatatkan kecepatan menyelesaikan soal di Klasemen atau “Bermain Tanpa Waktu” yang menawarkan banyak bantuan, namun membuat pemain tidak diperkenankan mencatatkan prestasi waktunya di Klasemen
  3. KOMPAS TTS dapat dimainkan secara off-line tanpa koneksi internet. Tentu saja itu setelah soal selesai diunduh dan hanya dapat dimainkan dalam mode “Bermain Tanpa Waktu”
  4. Daftar soal terbaru. Setiap hari, soal terbaru dapat dilihat di sini dan kemudian diunduh
  5. Daftar soal terpopuler. Berisi soal-soal TTS yang paling banyak dimainkan
  6. Daftar soal yang sudah terunduh. Memuat daftar semua soal TTS yang pernah diunduh oleh pemain. Daftar ini akan kosong jika KOMPAS TTS di-install ulang setelah sebelumnya sempat di-uninstall
  7. Pemain dapat memberi rating ke setiap soal yang sudah selesai dikerjakan, sebelum submit jawaban menggunakan KompasID. Rating yang tersedia: Mudah, Sedang, dan Sulit
  8. Jika pemain memiliki/membuat akun KompasID dan kemudian bermain dalam posisi log in maka dirinya berkesempatan mengakses soal premium, berhadiah, atau mencatatkan diri di Klasemen. Akses soal premium didapatkan dari voucher, sementara soal berhadiah dihadirkan sesuai program dari Harian KOMPAS selaku pengelola KOMPAS TTS
  9. Dalam mode “Bermain dengan Waktu” atau “Bermain Tanpa Waktu”, pemain dapat mengecek kebenaran jawabannya
  10. Bantuan melalui social media dapat digunakan saat menghadapi pertanyaan yang sulit. Namun, fitur ini hanya dapat digunakan pada mode “Bermain Tanpa Waktu”
  11. Semua pemain yang log in dengan KompasID dan memainkan KOMPAS TTS dalam mode “Bermain dengan Waktu” otomatis tercatat di database saat dia melakukan submit Catatan ini kemudian ditampilkan dalam Klasemen
  12. Arsip, memuat daftar semua soal TTS yang tersedia di KOMPAS TTS secara gratis
  13. Pengguna dapat menghubungi akun resmi KOMPAS TTS: [email protected] untuk menanyakan bantuan teknis.

Panduan Menggunakan Voucher KOMPAS TTS

Dalam perkembangannya, KOMPAS TTS menyediakan akses soal premium bagi penggunanya. Soal-soal ini hanya dapat diakses menggunakan kode voucher, jadi tidak terbuka untuk pemain pada umumnya. Saat ini voucher tersedia dalam bentuk sisipan di “Buku TTS Pilihan KOMPAS Jilid 8” rilisan Penerbit Buku KOMPAS. Jika Anda memiliki voucher KOMPAS TTS, berikut ini cara memanfaatkannya:

  1. Buka Aplikasi KOMPAS TTS yang dapat diunduh di App Store (iOS), Google Play (Android), dan Windows Phone Store (Windows Phone)
  2. Log in/daftar KompasID
  3. Masukkan kode voucher pada menu dashboard untuk KOMPAS TTS versi iOS dan Android atau pada tab premium untuk KOMPAS TTS versi Windows Phone
  4. Tap submit

Integrasi KOMPAS TTS dengan Buku TTS Pilihan KOMPAS Edisi 8

Bekerja sama dengan Penerbit Buku KOMPAS, KOMPAS TTS mengeluarkan voucher yang membuka akses soal premium bagi semua pemilik buku tersebut. Akses ini tentu saja harus diaktifkan melalui mobile game KOMPAS TTS. Pemilik buku yang tidak memainkan mobile game KOMPAS TTS tidak punya kesempatan menikmati benefit yang ditawarkan oleh voucher tersebut.

tts-pilihan-kompas-jilid-2l[1]

Dalam “Buku TTS Pilihan KOMPAS Jilid 8”, voucher KOMPAS TTS bahkan didesain untuk memberi manfaat yang luar biasa bagi pemiliknya. Manfaat tersebut adalah:

  1. Akses pada 10 soal premium
  2. Kesempatan memenangkan hadiah
  3. Akses gratis ke produk berita digital Harian KOMPAS (ePaper KOMPAS dan print.kompas.com) selama sebulan penuh.

Selamat bermain KOMPAS TTS. Isi waktu, dapat ilmu!

Infografik dari Kampus ke Kampus

Rangkaian acara Indonesia dalam Infografik berlanjut dengan kunjungan ke kampus Universitas Multimedia Nusantara (UMN) dan Institut Kesenian Jakarta (IKJ). Pada tanggal 13 September 2014, desainer grafis Kompas Septa Inigopatria dan Novan Nugrahadi, memberikan kuliah umum di depan 200 mahasiswa jurusan desain komunikasi visual UMN. Materi presentasi berupa pengenalan desain infografik di surat kabar dirasakan sangat bermanfaat karena menambah pengetahuan mahasiswa peserta kuliah umum. Di kampus yang terletak di Gading Serpong, Tangerang ini juga dipamerkan 10 karya infografik dari buku Indonesia dalam Infografik.

Awalnya ingin menampilkan nilai dalam array secara berurutan tetapi dengan syarat nilai pertama ditampilkan di baris pertama dulu kemudian tiap baris berikutnya menampilkan dua nilai sampai nilai akhir dalam array tersebut. Ilustrasinya sebagai berikut:

0
1 2
3 4
5

Untaian angka tersebut disimpan dalam sebuah variabel:

$numbers = array(0,1,2,3,4,5);

Secara visual sepertinya mudah, tetapi bagaimana caranya menginstruksikan komputer untuk membuat ilustrasi di atas?

Pertama, ambil nilai pertama dari array tersebut:

echo $numbers[0].'<br>';

Kedua, cabut nilai pertama tersebut dari array tersebut:

unset($numbers[0]);

Nah, nilai array yang kita miliki sekarang adalah (1,2,3,4,5). Kemudian kita pilah array tersebut menjadi beberapa array dengan tiap array berisi dua nilai. Potongan terakhir mungkin hanya berisi satu nilai:

$chunkNumbers = array_chunk($numbers, 2);

Array yang kita miliki sekarang menjadi ((1,2),(3,4),(5)). Sekarang tinggal membuat pengulangan untuk menampilkan nilai-nilai tersebut:

foreach ($chunkNumbers as $chunkNumber) {
	while(list($key, $value) =  each($chunkNumber)) {
		echo $value.'&nbsp;';
	}
	echo '<br>';
}

 


1 2 3 4