APLIKASI KIOS INFORMASI UNTUK PEMISAHAN SAMPAH ORGANIK DAN SAMPAH ANORGANIK SPLIT THE WASTE MENGGUNAKAN HTML 5

APLIKASI KIOS INFORMASI UNTUK PEMISAHAN SAMPAH ORGANIK DAN SAMPAH ANORGANIK “SPLIT THE WASTE” MENGGUNAKAN HTML 5 Digna Bethananda Andika; Renny Marisa; Fredy Purnomo Jurusan Teknik Informatika, Fakultas Ilmu Komputer, Universitas Bina Nusantara Jl. KH. Syahdan No. 9, Palmerah, Jakarta Barat 11480 [email protected]

ABSTRACT The purpose of the research in this paper is to give information to people about organic and anorganic waste, which might be expected to increase people’s awareness that is important to separate between organic waste and anorganic waste. Methods that being used in this research are IMSDD (Interactive Multimedia System Design and Development), which the stages are system requirements analysis, design considerations, implementation, and evaluation. The result from the research is information kiosk application “Split the Waste” using HTML 5 that have some features, such as the differences between organic and anorganic waste, the effects of not splitting the waste, the advantages of splitting the waste, and how to split the waste. There’s a mini game feature to see how far the user know about organic and anorganic waste. To be resumed, this application already fulfill the users needs to get knowing about splitting the organic and anorganic waste, even though there are some flaws in features and animations. Keywords: information kiosk, split the waste, HTML 5

ABSTRAK Tujuan penelitian, ialah untuk memberikan informasi kepada masyarakat tentang sampah organik dan sampah organik, yang diharapkan nantinya dapat meningkatkan kesadaran masyarakat akan pentingnya dari dilakukannya pemisahan sampah organik dan sampah anorganik. Metode yang digunakan adalah Interactive Multimedia System Design and Development (IMSDD) dengan tahapan, yaitu: identifikasi kebutuhan sistem, identifikasi perancangan, implementasi, serta evaluasi. Hasil yang dicapai, ialah aplikasi kios informasi “Split the Waste” menggunakan HTML 5 yang menyediakan fitur – fitur perbedaan sampah organik dan sampah anorganik, akibat dari tidak dilakukannya pemisahan sampah, manfaat dari pemisahan sampah, dan cara pemisahan sampah. Terdapat pula fitur mini game: Pemisahan Sampah sebagai salah satu media untuk mengukur tingkat pengertian pengguna tentang sampah organik dan sampah anorganik. Simpulan yang didapatkan adalah aplikasi ini telah dapat memenuhi kebutuhan pengguna untuk mengetahui informasi seputar pemisahan sampah organik dan sampah anorganik, walaupun masih ada kekurangan di beberapa fitur dan animasi. Kata Kunci: kios informasi, pemisahan sampah, HTML 5.

PENDAHULUAN Sampah adalah semua material yang dibuang dari kegiatan rumah tangga, perdagangan, industri dan kegiatan pertanian. Atau dengan kata lain sampah adalah bagian dari sesuatu yang tidak dipakai, tidak disenangi atau sesuatu yang harus dibuang, yang umumnya berasal dari kegiatan yang dilakukan manusia (termasuk kegiatan industri), tetapi bukan yang biologis. Kurangnya penyuluhan dari pemerintah dan kurangnya perhatian dari masyarakat menyebabkan banyaknya sampah yang menumpuk di berbagai tempat. Penumpukan sampah ini, menimbulkan berbagai macam masalah, dapat dilihat dari masalah yang terkecil seperti pemandangan yang kurang bagus dan bau yang tidak sedap, sampai pada masalah yang besar seperti banjir. Pada dasarnya, sampah dapat dibedakan menjadi dua macam, yaitu sampah organik dan sampah anorganik. Sampah organik adalah sampah yang mudah membusuk dan dapat diolah langsung menjadi kompos. Sedangkan sampah anorganik adalah sampah yang tidak mudah membusuk dan pengolahannya dapat dijadikan sebagai sampah komersil untuk dijadikan produk lainnya. Tetapi, kesadaran masyarakat akan pemisahan sampah, apalagi masyarakat di kota besar, masih sangat kurang. Banyak yang tidak tahu bahwa pemisahan sampah mempunyai pengaruh yang besar pada pengurangan penumpukan sampah. Berkurangnya penumpukan sampah mempunyai manfaat, antara lain: lingkungan yang lebih bersih dan sehat, berkurangnya resiko banjir, dan sebagainya. Oleh karena itu, salah satu solusi untuk meningkatkan kesadaran masyarakat akan pentingnya pemisahan sampah dengan membuat aplikasi kios informasi untuk pemisahan sampah organik dan sampah anorganik.

Tujuan Adapun tujuan dari penelitian ini adalah untuk membantu masyarakat meningkatkan kesadaran akan pentingnya pemisahan sampah organik dan sampah anorganik. Selain itu juga, untuk membantu para pengolah sampah dengan cara menghemat waktu karena tidak perlu lagi melakukan pemisahan sampah.

Studi Pustaka Multimedia Menurut Tay Vaughan (2010), multimedia adalah sebuah kombinasi yang saling berkaitan dari teks, foto dan gambar, suara, animasi, dan video, yang dimanipulasi secara digital. Sedangkan menurut Hofstetter (2001), multimedia adalah aplikasi pada komputer yang berguna untuk menghindarkan dan menggabungkan tulisan, grafik, gambar, suara, dan video disertai link-link dan tool-tool yang memungkinkan penggunanya untuk mengontrol, berinteraksi, menciptakan sesuatu dan berkomunikasi. Menurut Tay Vaughan (2010), ada lima elemen utama multimedia. Elemen yang pertama dan merupakan elemen yang paling umum digunakan oleh manusia untuk berkomunikasi adalah teks. Teks dapat dibagi menjadi empat kategori, yaitu printed text, scanned text, electronic text, dan hypertext. Elemen yang kedua adalah gambar. Gambar pada umumnya digunakan untuk memperjelas atau memvisualisasikan isi teks. Gambar dapat dibedakan menjadi enam kategori, yaitu bitmap image, vector image, holographic image, clip art image, digitalized picture image, dan hyperpicture image. Elemen yang ketiga adalah suara. Suara dapat merubah presentasi menjadi lebih baik dan lebih menarik, tetapi jika digunakan dengan tidak benar, suara malah dapat mengganggu ataupun merusak presentasi. Terdapat 4 jenis objek suara yang dapat digunakan dalam multimedia, yaitu : waveform audio, MIDI sound track, compact disc (CD) audio, dan MP3 files. Elemen yang ke empat adalah video. Video merupakan gabungan gambar – gambar diam yang dibaca berurutan dengan kecepatan tertentu. Video bermanfaat untuk meningkatkan penyampaian pesan kepada pengguna secara efektif, dan pengguna akan lebih mengingat apa yang telah mereka saksikan. Elemen yang ke lima dan yang terakhir adalah animasi. Animasi adalah suatu ilusi yang bergerak dari sebuah rangkaian gambar, masing-masing gambar berada di posisi yang berbeda dan ketika ditampilkan dalam selang waktu yang sanga cepat akan menghasilkan suatu efek gerak. Animasi terdiri dari beberapa kategori, yaitu frame animation, vector animation, computational animation, dan morphing.

Perancangan Antar Muka Perancangan antar muka adalah bagian dari sistem komputer yang memungkinkan manusia untuk berinteraksi dengan komputer. Menurut Shneiderman (2010, p88-89) ada 8 aturan dalam merancang perancangan antar muka, yaitu: (1) Konsistensi. Rangkaian aksi yang konsisten diperlukan dalam situasi yang mirip. Warna tampilan, layout, tipe font dan sebagainya harus konsisten. (2) Memungkinkan untuk penggunaan universal. Oleh karena itu, interface harus didesain dengan menyesuaikan berbagai kebutuhan pengguna, agar dapat mengakomodasi kebutuhan-kebutuhan tersebut. (3) Memberikan umpan balik yang informatif yang harus ada pada setiap aksi pengguna. Pemberian feedback disesuaikan dengan tingkat frekuensi dari suatu aksi yang dilakukan oleh pengguna.(4) Merancang dialog yang memberikan keadaan akhir dari sistem yang menyatakan kepuasan pencapaian, sebagai tanda untuk mempersiapkan diri memasuki kategori aksi selanjutnya, serta bahwa sekumpulan proses sekuensial telah selesai dilakukan oleh pengguna. (5) Memberikan pencegahan kesalahan didesain untuk mendeteksi kesalahan yang serius. Interface harus mendeteksi kesalahan dan memberikan instruksi yang mudah dimengerti, membangun, dan jelas untuk memperbaikinya, jika pengguna membuat kesalahan. (6) Memungkinkan pengembalian aksi atau undo yang dapat mengembalikan aksi yang telah dilakukan oleh pengguna ke keadaan awal dengan mudah. (7) Mendukung pusat kendali internal yang akan membuat pengguna bertanggung jawab dalam memegang pusat kendali antarmuka dan antarmuka menanggapi aksi yang dilakukan oleh pengguna. (8) Mengurangi beban ingatan jangka pendek dengan memberikan desain antarmuka lebih sederhana, serta mudah diingat oleh pengguna.

Kios Informasi Menurut Steinmetz dan Bahrstedt (1995), kios informasi adalah suatu sistem pelayanan informasi umum dengan menggunakan informasi digital. Kios informasi memungkinkan user berinteraksi dengan komputer untuk memperoleh informasi atau layanan yang diinginkan. Oleh karena itu, hendaknya antar muka pengguna (user interface) dirancang sesederhana mungkin sehingga mudah dimengerti dan mudah digunakan, karena tidak semua user dari kios informasi akrab dengan komputer. Sistem kios informasi selain memiliki tampilan yang menarik, juga harus memiliki kecepatan dalam pengaksesan data. Tujuan dari kios informasi adalah untuk menyampaikan atau memberikan informasi digital secara jelas dan terinci karena telah disusun sedemikian rupa sehingga menarik dan dapat dimengerti dengan cepat oleh khalayak. Sedangkan manfaat dari kios informasi menurut Steinmetz dan Bahrstedt (1995) dapat dibagi menjadi dua, yaitu: (1) Dilihat dari segi konsumen, yaitu untuk menarik minat konsumen tentang informasi yang akan ditawarkan, serta untuk memperkenalkan teknologi multimedia sebagai sarana penyebaran informasi kepada masyarakat luas. (2) Dilihat dari segi perusahaan, yaitu untuk membantu pemasaran yang diharapkan dapat meningkatkan laba perusahaan, dan juga untuk mengubah efektifitas dalam perubahan atau penambahan informasi. Kompnen yang digunakan untuk kios informasi pada umumnya sama dengan komputer mikro, seperti prosesor, layar monitor, input device (keyboard, mouse dan sebagainya) dan media penyimpanan (harddisk). Selain itu, kios informasi dapat ditambahkan dengan kamera video atau mikrofon jika dibutuhkan.

HTML 5 Penggunaan Flash sebagai media untuk membuat aplikasi akan segara berakhir seiring dengan munculnya teknologi HTML5 (Cruse dan Jordan, 2011, p169). HTML5 dan CSS3 menyediakan perpustakaan serta plug-in yang lebih banyak, sehingga dapat menciptakan sebuah aplikasi multimedia yang lebih interaktif. Kinerja dari HTML5 dapat hampir disamakan dengan aplikasi desktop atau native. Drag and drop, animasi, local storage, dan fitur - fitur lainnya menjadikan HTML 5 akan mengunguli aplikasi dekstop maupun native di kemudian hari. Walaupun pengimplementasian HTML5 belum dapat digunakan secara maksimal sampai tahun 2022, tidak ada alasan bagi para produsen web browser untuk memulai penggunaan teknologi ini mulai dari sekarang dengan harapan akan didapatkannya banyak masukan yang membangun untuk penyempurnaan teknologi ini nantinya. Beberapa web browser yang telah mendukung, antara lain: Safari, Google Chrome, Mozzila Firefox, Microsoft Internet Explorer, dan Opera.

Beberapa spesifikasi sudah stabil dan telah dapat diterapkan pada HTML5, anatara lain: (1) Markup, HTML 5 memperkenalkan beberapa elemen baru dan atribut yang merefleksikan tipikal penggunaan website modern. Beberapa diantaranya adalah pergantian yang bersifat semantik pada blok yang umum digunakan: yaitu elemen (