JURNAL INFORMATIKA Vol 5, No. 2, Juli 2011
RANCANG BANGUN PERPUSTAKAAN DIGITAL POLITEKNIK NEGERI SEMARANG BERBASIS WEB DENGAN FLEX FRAMEWORK Slamet Handoko, Wahyu Sulistiyo, Budi Prasetyo, Fella Annanuur Dosen Program Studi Teknik Informatika Jurusan Teknik Elektro Politeknik Negeri Semarang
Abstrak Teknologi informasi dan komunikasi atau “ICT” (Information and Communication) telah menjadi bagian yang tak terpisahkan dari kehidupan global manusia, baik secara personal maupun organisasi atau institusi. Perpustakaan sebagai salah satu tempat sumber ilmu perlu ditata dan disajikan agar dapat diakses kapan dan dimanapun tanpa harus datang secara langsung ke perpustakaan dengan melibatkan teknologi ICT dalam bentuk suatu sistem yang terintegrasi. Pengembangan perpustakaan Politeknik Negeri Semarang (Polines) saat ini baru sampai pada tahap scanning/digitalisasi dokumen, sehingga perlu ditata kembali dari sumber data yang ada untuk diolah lebih lanjut dalam bentuk perpustakaan digital yang dapat diakses secara global. Tujuan dari dibuatnya sistem perpustakaan digital Polines ini untuk membantu penelusuran buku umum dan buku Tugas Akhir bagi mahasiswa Polines. Sistem ini dibangun dengan menggunakan aplikasi dari Adobe Flex Builder 4 dan PHP sebagai bahasa pemrograman, dan database MySQL. Sistem ini diuji dengan melakukan pengujian sistem website untuk memastikan semua fungsi berjalan dengan baik. Disamping itu, diuji juga dengan menggunakan uji kepuasan pengguna terhadap sistem perpustakaan digital Polines ini. Dengan sistem informasi ini, pengguna semakin mudah untuk mencari referensi buku umum dan buku Tugas Akhir pada perpustakaan digital Polines. Kata kunci : ICT, perpustakaan digital, Adobe Flex Builder, MySQL, PHP
1. PENDAHULUAN Teknologi informasi dan komunikasi atau “ICT” (Information and Communication) telah menjadi bagian yang tak terpisahkan dari kehidupan global manusia, baik secara personal maupun organisasi atau institusi. Keberadaan perpustakaan disuatu institusi merupakan suatu hal yang sangat penting, karena perpustakaan merupakan sumber ilmu untuk civitas akademik ataupun pihak lain diluar institusi. Mengingat pentingnya suatu perpustakaan maka perlu difikirkan tentang bagaimana membuat perpustakaan yang terintegrasi dengan teknologi “ICT”, sehingga sumber ilmu
554
JURNAL INFORMATIKA Vol 5, No. 2, Juli 2011
yang ada di perpustakaan dapat diakses kapanpun dan dimanapun tanpa harus datang langsung ke perpustakaan. Pengembangan perpustakaan Politeknik Negeri Semarang (Polines) saat ini baru sampai pada tahap scanning/digitalisasi dokumen, sehingga perlu ditata kembali dari sumber data yang ada untuk diolah lebih lanjut dalam bentuk perpustakaan digital yang dapat diakses secara global. Salah satu alternatif penyajian perpustakan digital dapat menggunakan Flex framework. Flex framework merupakan framework open source untuk membangun aplikasi web ekpresif yang menyebarkan secara konsisten disemua browser utama, desktop, dan sistem operasi dengan memanfaatkan Adobe Flash Player dan Adobe AIR runtimes. Sehingga dengan Flex framework, tampilan dari perpustakaan digital yang akan dibuat akan menjadi lebih menarik. 2. KAJIAN PUSTAKA 2.1 Definisi Perpustakaan Digital Perpustakaan Digital adalah sebuah sistem yang memiliki berbagai layanan dan obyek informasi yang mendukung akses obyek informasi tesebut melalui perangkat digital (Sismanto,2008). Layanan ini diharapkan dapat mempermudah pencarian informasi di dalam koleksi obyek informasi seperti dokumen, gambar dan database dalam format digital dengan cepat, tepat, dan akurat. Perpustakaan digital itu tidak berdiri sendiri, melainkan terkait dengan sumber-sumber lain dan pelayanan informasinya terbuka bagi pengguna di seluruh dunia. 2.2 Proses Digitalisasi Dokumen Proses perubahan dari dokumen tercetak (printed document) menjadi dokumen elektronik sering disebut dengan proses digitalisasi dokumen. Seperti pada Gambar 1, dokumen mentah (jurnal, prosiding, buku, majalah, dsb) diproses dengan sebuah alat (scanner) untuk menghasilkan dokumen elektronik. Proses digitalisasi dokumen ini tentu tidak diperlukan lagi apabila dokumen elektronik sudah menjadi standar dalam proses dokumentasi sebuah organisasi.
Gambar 1 Proses digitalisasi dokumen 2.3 Adobe Flex 2.3.1 Pengertian Adobe Flex Flex merupakan sebuah aplikasi pemrograman berbasis web yang dikembangkan oleh Adobe. Adobe menggabungkan teknologi yang dimilikinya dengan bertumpu pada platform Flash untuk menciptakan Flex yang merupakan paradigma dalam pengembangan suatu aplikasi, khususnya aplikasi web. Adobe Flex bertumpu pada platform Flash, maka aplikasi web yang menggunakan Flex tidak melakukan proses HTML Rendering ketika 555
JURNAL INFORMATIKA Vol 5, No. 2, Juli 2011
mempresentasikan dirinya di browser. Selain itu, Flex dikembangkan dengan konsep n-tier, yaitu pemisahan layer antara business process, presentation, dan data access. Ini dikarenakan karena flash tidak dapat koneksi langsung ke data source seperti DBMS ataupun data source dalam bentuk lain. 2.3.2 Struktur MXML MXML adalah sistem pengkodean berbasis tag berasal dari XML. Karena pewarisan ini, maka semua peraturan dan ketentuan mengikuti XML, terutama: a. Tag dapat didefinisikan sendiri b. Tag dapat memiliki attribut, digunakan untuk memberikan informasi tambahan kepada elemen. ex:
. . . c. Tag ditulis dalam hirarki yang tepat (ter-nested dengan baik). ex:
<subchild>….. d. Tag dalam XML bersifat case sensitive e. Penulisan tag tidak diawali dengan angka f. Penulisan tag tidak mengandung spasi, jika elemen lebih dari satu menggunakan karakter ‘_’. g. Dalam penulisan hindari karakter ‘-’ dam ‘.’ h. Tag komentar i. Dalam satu dokumen XML terdapat satu elemen root. j. Berbeda dengan HTML, dalam XML spasi kosong diperhitungkan 2.3.3 Hubungan MXML dan ActionScript Seperti MXML yang merupakan turunan dari XML, maka ActionScript merupakan turunan dari JavaScript. ActionScript dapat dikatakan sebagai sebuah bahasa yang mirip dengan JavaScript, namun memiliki tipe data, dan memiliki struktur OOP yang mirip dengan Java. ActionScript digunakan sebagai logic yang mengatur interaksi dengan pengguna. ActionScript mengatur bagaimana aplikasi Flex yang dibuat berjalan. Flex 3 menggunakan ActionScript 3, dimana ActionScript versi tersebut sudah mendukung OOP secara penuh dan berjalan dengan baik pada Flash Player 10. ActionScript 3 juga memiliki performa yang jauh lebih cepat dibandingkan dengan versi-versi sebelumnya. (Budi Susilo,dkk 2010).
3. METODE PENELITIAN Subjek penelitian ini adalah membuat rancang bangun perpustakaan digital Polines berbasis web dengan flex framework. Data dalam penelitian ini menggunakan data dari perpustakaan Polines. Data yang diperoleh dipindai terlebih dahulu ke dalam data digital. Setelah data digital disiapkan maka selanjutnya dilakukan analisis, perancangan dan implementasi sistem perpustakaan digital Polines berbasis web dengan flex framework.
556
JURNAL INFORMATIKA Vol 5, No. 2, Juli 2011
3.1 Gambaran Umum Sistem Prinsip kerja dari website perpustakaan digital Polines berbasis web dengan flex framework ini adalah data buku-buku perpustakaan diolah oleh satu administrator yang akan dimasukkan ke dalam database melalui web server. Aplikasi ini dapat diakses oleh administrator maupun user melalui web browser yang mendukung Flash Player, gambaran sistemnya dapat dilihat pada Gambar 2. Untuk user (pengguna) dibagi menjadi 3 yaitu : a. user tamu b. user anggota perpustakaan c. administrator
Gambar 2 Gambar umum sistem 3.2 Analisis Sistem Analisis terhadap aplikasi website dilakukan agar dapat memahami bagaimana cara pembuatan suatu aplikasi. Kondisi perpustakaan Polines pada saat ini belum mempunyai perpustakaan digital yang dipublikasikan melalaui internet maka dalam Tugas Akhir ini sebagai dasar analisis kebutuhan sistem yang akan dibangun meliputi: analisis hardware, analisis software, analisis brainware, dan aplikasi. Analisis kebutuhan adalah spesifikasi yang rinci tentang standar minimum dibutuhkan untuk menjalankan aplikasi. Dalam pembuatan aplikasi ini diperlukan hardware dengan spesifikasi minimal sebagai berikut: a. Intel Core 2 Duo b. Microsoft Windows XP Service Pack 2 or Microsoft Windows 7 c. 3 GB RAM d. 500 MB available Hard-Disk space e. Memori VGA 64 Mb (512 Mb lebih disarankan) f. Resolusi layar monitor 1024x768 (ukuran 1280x800 / wide lebih disarankan) Dalam pembuatan aplikasi ini diperlukan software dengan spesifikasi minimal sebagai berikut: a. Adobe Flex Builder 4 b. Flash Player versi 10 c. XAMPP versi 1.7.3 d. Ncesoft Flip Book Maker versi 2.5.3 e. Visual Paradigm versi 3.2 557
JURNAL INFORMATIKA Vol 5, No. 2, Juli 2011
Dalam pembuatan aplikasi ini diperlukan brainware (manusia yang terlibat dalam mengoperasikan serta mengatur sistem di dalam komputer) di antaranya: a. Webmaster yang bertugas membuat materi/isi situs web, mendesain arsitektur situs web, menerapkan aplikasi situs web,membuat tampilan situs web dan mengelola situs web. b. Operator bertugas sebagai pengelola dari isi web yang telah dibuat oleh webmaster. c. User adalah pengguna dari web perpustakaan digital ini. Dalam aplikasi perpustakaan digital ini, analisis sistem dilakukan dengan menggunakan teknologi berorientasi objek (Object Oriented Design) yaitu menggunakan Unified Modeling Language (UML), meliputi pemodelan use case, pemodelan dinamis dengan activity diagram dan perancangan basisdata. a. Pembuatan Diagram Kasus Penggunan (Use Case Diagram) Diagram Kasus Penggunan biasanya diorganisasikan dalam package agar pemodelan dapat diatur dengan lebih mudah. Pada Perpustakaan Digital Polines Berbasis Flex Framework ini, use case dikelompokkan menjadi tiga package dan masing-masing package mengatur kegiatan yang dilakukan oleh sistem. Gambar 3 menunjukkan uses case diagram dari Perpustakaan Digital Polines Berbasis Flex Framework.
Gambar 3 Use Case diagram perpustakaan digital Polines Berdasarkan Gambar 3 dijelaskan bahwa admin dapat melakukan pengolahan data berupa manage User, manage buku, lihat Feedback dan Report. User anggota dapat melihat buku diantaranya buku Tugas Akhir, buku umum dan kirim feedback dengan melakukan login terlebih dahulu. User tamu dapat melihat halaman depan, melakukan pencarian abstraksi buku, melihat tentang UPT Perpustakaan Polines , melihat video profil dari perpustakaan Polines dan dapat melakukan pencarian buku pada links yang disediakan. 3.2.1 Pemodelan Dinamis dengan Activity Diagram Activity diagram menggambarkan aliran fungsionalitas sistem. Dapat juga digunakan untuk menggambarkan aliran kejadian (flow of events) dalam use case. a.
Activity Diagram User Perpustakaan Digital Polines
558
JURNAL INFORMATIKA Vol 5, No. 2, Juli 2011
Activity diagram user Perpustakaan Digital Polines menggambarkan aliran aplikasi perpustakaan digital. Activity diagram dibuat berdasarkan urutan menu dan tampilan yang akan dilalui oleh user. Saat user masuk ke dalam sistem, maka akan muncul tampilan menu utama. Di dalam menu utama terdapat 9 pilihan menu yang dapat dipilih oleh user, diantaranya halaman depan, cari, tentang, video, links, login, buku umum, buku Tugas Akhir dan feedback. Berikut ini adalah penjelasan dari masing-masing menu. 1) Depan Jika pengguna memilih menu depan, maka akan muncul halaman awal website perpustakaan digital. 2) Cari Jika pengguna memilih menu cari, maka akan muncul halaman penelusuran buku yang berisikan data grid daftar buku yang tersedia. Di sini pengguna hanya dapat melihat abstraksi buku. Pengguna juga dapat melakukan pencarian dengan cara penyaringan. Karena disetiap field terdapat tombol untuk penyaringan (filtering). 3) Tentang Jika pengguna memilih menu tentang, maka akan muncul halaman yang berisikan informasi perpustakaan Polines . Pengguna dapat mengetahui informasi pelayanan perpustakaan Polines . 4) Video Jika pengguna memilih menu video, maka akan tampil video tentang profil perpustakaan Polines . 5) Links Jika pengguna memilih menu links, maka akan tampil icon dari situs penelusuran buku pada perpustakaan digital yang ada di internet. 6) Login Jika pengguna memilih menu login, maka akan muncul form login. Pengguna diharuskan memasukkan username dan password. Jika username dan password salah, maka akan muncul peringatan bahwa username/password tidak dikenali. Pengguna yang dapat login ini dinamakan pengguna anggota (user anggota). Selanjutnya pengguna ini dapat melakukan pembacaan buku Tugas Akhir, buku umum dan mengirimkan feedback. 7) Feedback Jika pengguna memilih menu feedback, maka akan tampil form feedback yang terdapat field-filed untuk menuliskan feedback kepada administrator. Pengguna dapat menuliskan kritik dan saran untuk perpustakaan digital. 6) Buku Tugas Akhir Jika pengguna anggota memilih menu Buku Tugas Akhir, maka sistem akan menapilkan data grid yang berisikan daftar judul Tugas Akhir. Pengguna anggota bisa melakukan penelusuran buku Tugas Akhir dengan menuliskan kata kunci yang dimaksudkan. Jika pencarian ditemukan maka akan tampil kata kunci tadi dengan tulisan tebal. Jika tidak ditemukan maka textfield berwarna merah. Pengguna juga dapat melakukan penyaringan data (filter) di setiap field. 7) Buku Umum Jika pengguna anggota memilih menu buku umum, maka sistem akan menapilkan data grid yang berisikan judul buku umum. Buku umum yang dimaksudkan adalah E-Book (electronic book). Pengguna anggota bisa melakukan penelusuran buku umum dengan menuliskan kata kunci yang dimaksudkan. Jika pencarian ditemukan maka akan tampil kata kunci tadi dengan tulisan tebal. Jika tidak ditemukan maka textfield berwarna merah. Pengguna juga dapat melakukan penyaringan data (filter) di setiap field. 559
JURNAL INFORMATIKA Vol 5, No. 2, Juli 2011
Gambar 4 merupakan gambaran activity diagram dari user dalam sistem perpustakaan digital.
Gambar 4 Activity Diagram user b. Activity Diagram Admin pada Perpustakaan Digital Activity diagram admin menggambarkan aliran program setelah admin melakukan login pada sistem. Activity diagram dibuat berdasarkan urutan menu dan tampilan yang akan dilalui admin setelah melakukan login. Saat admin masuk ke dalam panel admin, maka akan muncul tampilan yang dapat dipilih oleh admin, diantaranya adalah user manage, book manage, lihat feedback dan report. Berikut adalah penjelasan dari masing-masing menu. 1) User manage Jika admin memilih menu user manage, maka akan tampil form user manage. Admin dapat melakukan penambahan, pengeditan dan penghapusan data berupa data mahasiswa, dan admin. 2) Book manage Jika admin memilih menu book manage, maka akan tampil form book manage. Dalam book manage terdapat 4 menu pilihan yaitu daftar buku umum, tambah buku umum, tambah buku Tugas Akhir mahasiswa dan daftar buku Tugas Akhir mahasiswa. Admin dapat melakukan penambahan, pengeditan dan penghapusan data buku dalam perpustakaan digital. 3) Lihat feedback Jika admin memilih menu feedback, maka akan tampil data grid yang beriskan komentar dari pembaca. Admin dapat membaca kiriman feedback. 4) Report Jika admin memilih menu report, maka akan tampil data grid yang berisikan nama dan tanggal login ketika mengunjungi website. Admin dapat mencetak laporan tersebut sebagai laporan pengguna. Untuk lebih jelasnya dapat dilihat activity diagram admin dapat pada Gambar 5.
560
JURNAL INFORMATIKA Vol 5, No. 2, Juli 2011
Gambar 5 Activity Diagram Admin 4. HASIL DAN PEMBAHASAN 4.1 Implementasi Halaman Website Setelah melakukan perancangan halaman website, tahap selanjutnya adalah implementasi halaman website yang telah dibuat. Dalam pembuatan seluruh website mengunakan Adobe Flex Builder 4. Untuk memasuki website perpustakaan digital Polines, pengguna dapat mengakses website dengan alamat www.informatika-digilibpolines.com. Gambar 6 menunjukkan saat halaman situs website diakses.
Gambar 6 Tampilan awal halaman situs Jika pengunjung memilih menu cari maka akan tampil halaman seperti pada Gambar 7. Pengunjung dapat melakukan penelusuran buku yang tersedia dalam perpustakaan digital.
561
JURNAL INFORMATIKA Vol 5, No. 2, Juli 2011
Gambar 7 Halaman penelusuran buku Jika pengunjung melakukan login seperti Gambar 8, dan memilih menu feedback, maka akan tampil halaman seperti pada Gambar 9.
Gambar 8 Halaman Login Perpustakaan Digital Pada halaman feedback, pengunjung dapat menuliskan kritik dan sarannya kepada admin web.
Gambar 9 Halaman Feedback
562
JURNAL INFORMATIKA Vol 5, No. 2, Juli 2011
Jika pengunjung memilih menu buku Tugas Akhir, maka akan tampil halaman seperti pada Gambar 10.
Gambar 10 Halaman buku tugas akhir Jika pengunjung memilih menu baca, maka akan tampil halaman seperti pada Gambar 11.
Gambar 11 Halaman baca buku tugas akhir Jika pengunjung memilih menu buku umum, maka akan tampil halaman seperti pada Gambar 12.
Gambar 12 Halaman Buku Umum 563
JURNAL INFORMATIKA Vol 5, No. 2, Juli 2011
Jika pengunjung memilih baca, maka akan tampil halaman seperti pada Gambar 13.
Gambar 13 Halaman baca buku umum 5. SIMPULAN Kesimpulan yang dapat diambil dari penelitian ini adalah sebagai berikut: a. Penelitian berhasil mengintegrasikan Adobe Flex untuk tata letak GUI, PHP untuk layanan koneksi database, dan MySQL untuk penyimpanan database agar terbentuk web perpustakaan digital yang dinamis. b. Dengan adanya penelitian ini, dapat mempermudah pengguna dalam mengakses buku secara online tanpa datang ke perpustakaan. c. Dengan menggunakan Ncesoft Flip Book membuat tampilan buku digital menjadi lebih interaktif dengan adanya fitur-fitur seperti zoom, full screen, next page, previous page, dan thumbnail dokumen. d. Banyaknya halaman pada buku Tugas Akhir yang diunggah berpengaruh terhadap kecepatan akses. Semakin banyak jumlah halaman yang diunggah, semakin lama proses loading buku Tugas Akhir tersebut. e. Berdasarkan uji kepuasan pelanggan, bahwa 60% pengguna (mahasiswa) merasa puas dengan adanya website perpustakaan digital Polines yang berarti website ini dapat membantu pengguna dalam melakukan penelusuran buku umum dan buku Tugas Akhir. Daftar Pustaka [1] Fathansyah,ir. 1999. Buku Text Ilmu Komputer Basis Data. Bandung:INFORMATIKA [2] Nugroho, Bunafit.2004. Aplikasi Pemrograman Web Dinamis dengan PHP dan MySQL, Yogyakarta:Gava Media [3] Susilo, Budi. 2010. Mahir Pemrograman Web dengan Adobe Flex. Yogyakarta: CV.ANDI OFFSET [4] http://www.iwobanas.com/2009/07/creating-mdatagrid-date-filter/. Tanggal unduh: 1 April 2011
564
JURNAL INFORMATIKA Vol 5, No. 2, Juli 2011
[5] http://dougmccune.com/blog/2007/11/03/coverflow-flex-component/. Tanggal unduh: 1 April 2011 [6]
http://dougmccune.com/blog/2007/11/19/flex-coverflow-performance-improvementflex-carousel-component-and-vertical-coverflow/. Tanggal unduh: 12 Mei 2011
[7]
http://examples.adobe.com/flex3/componentexplorer /explorer.html Tanggal unduh: 20 Juni 2011
[8]
http://www.vipercreations.com/tutorials.php?t=28&page=3&c=Adobe%20Flex Tanggal unduh: 21 Juni 2011
[9]
http://cookbooks.adobe.com/post_Flex_DataGrid_Printing-2142.html. tanggal unduh: 24 Juni 2011
[10] http://cookbooks.adobe.com/post_Dynamic_Images_Buttons_in_Datagrid_using_MY SQL__-8703.html. Tanggal unduh: 24 Juni 2011 [11] http://flexfreaky.wordpress.com/2011/08/13/multiple-image-upload-in-flex-3-withphp/. Tanggal unduh: 5 Juli
565
1