Sebagai seorang mahasiswa/i atau pekerja yang sering berurusan dengan dengan pemaparan tugas, materi ataupun kebutuhan meeting tentunya tidak asing dengan kegiatan presentasi. Umumnya kegiatan persentasi tersebut didukung oleh perangkat lunak seperti Microsoft Power Point yang merupakan salah satu produk office dari Microsoft. Dengan perkembangan teknologi informasi yang canggih pembuatan slide presentasi dapat dibuat dengan menggunakan teknologi berbasis web. Salah satunya menggunakan kombinasi JavaScript dan HTML5. Berikut ini alternatif yang dapat teman-teman coder coba sebagai penunjang kegiatan presentasi baru dengan teknologi masa kini.
1. Reveal.js
Reveal.js merupakan sebuah framework presentasi berbasis HTML yang dapat dijalankan pada web browser. Reveal.js dapat mendukung teman-teman coder untuk membuat slide yang interaktif dan cantik. Dengan berbagai fitur diantaranya seperti:
- Transisi vertical
- Transisi horizontal
- Transisi background
- Tampilan yang responsive terhadap berbagai device
- Mendukung markdown
- Fragment styles
- Berbagai tema menarik
- Penulisan code yang cantik
- Marvelous list
- Fantastic ordered list
- Tabel tabular
- Pembuatan kutipan
- Speaker notes
- Export ke format pdf
Untuk menggunakan Reveal.js sebagai pendukung presentasi, teman-teman setidaknya harus sudah memahami konsep dasar CSS dan HTML. Namun tidak perlu khawatir, bagi teman-teman yang belum paham dapat langsung melakukannya di editor online pada halaman ini. Reveal.js dapat menjadi pilihan terbaik untuk teman-teman coder yang menyukai tampilan sederhana namun informatif. Untuk dokumentasi lengkapnya teman-teman coder dapat mengunjungi langsung di halaman ini.
2. Impress.js
Impress.js merupakan framework berbasis CSS3 dengan mengandalkan transformasi dan transisi pada web browser modern. Impress.js terinspirasi dari sebuah ide di balik prezi.
Fitur-fitur yang tersedia pada Impress.js juga sangat lengkap seperti:
- Mendukung transisi animasi dan atribut warna yang beragam.
- Mendukung konsol speaker dengan catatan, preview dan timer.
- Memiliki progress bar yang dapat memberitahu posisi slide berada.
- Mendukung versi bahasa arab, seperti tulisan yang dibaca dari kanan.
- Mendukung penggunaan format audio dalam HTML5 yang dapat disisipkan pada slide.
- Mengkonversi ke dalam format pdf.
- Membuat slideshow sederhana dengan slide diatur pada tepi poligon yang beraturan.
- Mendukung format markdown untuk pembuatan slide yang cepat.
Untuk dokumentasi lengkapnya teman-teman coder dapat mengunjungi langsung di halaman ini
3. Deck.js
Deck.js merupakan sebuah library JavaScript yang digunakan untuk membangun presentasi berbasis HTML modern. Deck.js berjalan cukup fleksibel dengan penggunaan CSS dan JavaScript yang dapat di kustomisasi.
Deck.js juga menyediakan template dan tema untuk pemula HTML dalam membangun slideshow yang standar. Beberapa ekstensi, tema dan proyek-proyek presentasi terbaik dapat dilihat di wiki Deck.js. Berbeda dengan Reveal.js dan Impress.js sendiri, Deck.js memerlukan library tambah seperti JQuery dan Modernizr. Untuk dokumentasi lengkapnya teman-teman coder dapat mengunjunginya langsung di halaman ini.
Itulah beberapa alternatif membuat presentasi dengan JavaScript dan HTML5. Buat teman-teman coder yang ingin tampil beda saat membawakan presentasi, tidak ada salahnya mencoba hal baru ini. Selamat Mencoba! Tetap Berkarya! Happy Coding!
Level artikel ini adalah advanced.
Dituliskan oleh
Bramanto (bramanto)
pada 8 Februari 2017 dan telah dibaca sebanyak 14099 kali.
Tag:
javascript,
html5,
presentasi
Komentar:
Somo
127
1
·
7 tahun, 7 bulan yang lalu
·
0 jempol
keren bos, mungkin perlu dibuatkan artikel mengenai tutorialnya.
Darknur
20
6
·
7 tahun, 6 bulan yang lalu
·
0 jempol
wuih, mantab artikelnya, thank you :D
NaufalAlHikam
24
0
·
7 tahun, 4 bulan yang lalu
·
0 jempol
Wah kirain Impress JS yang no 1 wkwk ternyata disini diduakan :v
NaufalAlHikam
24
0
·
7 tahun, 4 bulan yang lalu
·
1 jempol
thanks infonya
DaebeN
300
2
·
7 tahun, 2 bulan yang lalu
·
0 jempol
Thanks infonya bang, sangat bermanfaat :).
Luthfi_Azzammi
100
2
·
7 tahun, 2 bulan yang lalu
·
0 jempol
Makasih banyak bang, nice info. Baru tau ane
santriamatir
9
0
·
6 tahun, 4 bulan yang lalu
·
0 jempol
mantaplah
fikriroy234
160
0
·
6 tahun, 2 bulan yang lalu
·
0 jempol
Keren, baru tahu saya
crystal.tkd
17
0
·
5 tahun, 11 bulan yang lalu
·
0 jempol
Ini semacam prezi bukan ya?
mzaini30
33
0
·
5 tahun, 9 bulan yang lalu
·
0 jempol
Tapi kayaknya tetap lebih enak pakai Power Point deh.
Bays
0
0
·
5 tahun, 6 bulan yang lalu
·
0 jempol
caranya gmn nih apa langsung dipanggil gitu JS nya lalu isinya presentasi di htmlnya?
seorangkucing
118
0
·
3 tahun, 9 bulan yang lalu
·
0 jempol
every day we learn something new, kaya ini contohnya. thanks bang!
agustinmiharja
52
2
·
2 bulan, 3 minggu yang lalu
·
0 jempol
Mantap artikelnya, Proses pembuatan power point sekarang bisa lewat html Terimakasih bram
Artikel Lainnya
Irwansyah
6 Februari 2017Yuk belajar Kriptografi atau Enkripsi lebih mudah dengan software "CrypTool"
Hallo coder, selamat malam....
pada kesempatan kali ini saya ingin membahas tentang bagaimana belajar Kriptografi/Enkripsi lebih mudah dengan program "CrypTool". yukkkk simak artikelnya .... ^.^
Bagi para coders atau praktisi IT ...
5 menit bacaan
Musliadi
5 Januari 2017Bagaimana Saya Belajar Code ?
Pada kali ini saya ingin berbagi tentang bagaimana saya belajar code. Sebenarnya bisa dibilang saya juga masih termasuk programmer pemula, tapi menurut saya hal itu tidak menjadi penghalang bagi saya ...
26 menit bacaan · beginner
fromadhana135
0
·
7 tahun, 8 bulan yang lalu
·
0 jempol