PERANCANGAN DAN PEMBUATAN DIGITAL SIGNAGE DENGAN CODEIGNITER

Transkripsi

1 PERANCANGAN DAN PEMBUATAN DIGITAL SIGNAGE DENGAN CODEIGNITER SKRIPSI Disusun sebagai salah satu syarat menyelesaikan Jenjang Strata I pada Program Studi Informatika Fakultas Komunikasi dan Informatika Universitas Muhammadiyah Surakarta Oleh : ANDREAN LUTHFI PERMANA L PROGRAM STUDI INFORMATIKA FAKULTAS KOMUNIKASI DAN INFORMATIKA UNIVERSITAS MUHAMMADIYAH SURAKARTA DESEMBER 2014

2 ii

3 iii

4 iv

5 MOTTO DAN PERSEMBAHAN MOTTO : Tak mungkin membuat semua orang senang sekaligus, tak mungkin juga membuat orang susah sekaligus, orang lain tak butuh alasan untuk menilai kita, tetap melangkah sesuai pilihan kita sendiri. Nikmati dan jalani apa yang terjadi sekarang, berusaha dan berdoa untuk apa yang akan terjadi di masa yang akan datang. (Penulis) Dan bahwasanya seorang manusia tiada memperoleh selain apa yang telah diusahakannya. (Q.S An-Najm, 39) v

6 PERSEMBAHAN : Puji syukur kehadirat Allah SWT atas limpahan berkah dan rahmat-nya penulis dapat menyelesaikan skripsi ini. Dan skripsi ini penulis dedikasikan untuk : 1. Kedua orang tua tercinta Ibu dan Bapak atas kasih sayang, dukungan moril, materiil, setiap doa yang dipanjatkan untuk keberhasilan, kesuksesan. 2. Keluarga besar yang selalu memberi dukungan dan semangatnya. 3. Bapak Dr. Heru Supriyono M.Sc selaku pembimbing skripsi yang telah memberikan bimbingan serta pengarahan kepada penulis sehingga dapat menyelesaikan tugas akhir ini. 4. Teman sejawat Abdan, Ahmad, Andhik, Badriyatul, Benny, Chandra, David, Dhody, Fachrudin, Fenny, Galih, Hasan, Imam, Lutfi, Lutfiyatul, Mukhrom, Paramanda, Wahyu Andri, Wahyu Trianggoro dan khususnya kelas D Jurusan Teknik Informatika angkatan 2010 terima kasih kebersamaan, kerjasama waktu dan semangatnya. 5. Biro Skripsi dan Pegawai Tata Usaha Jurusan Informatika UMS atas segala bantuan dan kerjasamanya. 6. Teman-teman Jurusan Informatika angkatan 2010 dan keluarga besar Jurusan Informatika UMS, atas semua hal yang telah diberikan. 7. Semua pihak yang selalu ada di sekelilingku yang tidak bisa kusebutkan satu persatu. vi

7 KATA PENGANTAR Assalaamu alaikum warahmatullahi wabarakatuh Alhamdulillah, segala puji syukur penulis panjatkan kehadirat Allah SWT yang telah melimpahkan rahmat dan hidayah-nya sehingga penulis dapat menyelesaikan skripsi ini dengan judul Perancangan dan Pembuatan Digital Signage dengan Codeigniter. Skripsi ini disusun untuk memenuhi kurikulum pada Program Studi Informatika Universitas Muhammadiyah Surakarta, sebagai kewajiban mahasiswa dalam rangka menyelesaikan program sarjana. Penulis menyadari bahwa skripsi ini masih jauh dari kesempurnaan, oleh karena itu kritik saran yang membangun dari berbagai pihak sangat penulis harapkan demi perbaikan-perbaikan ke depan. Terwujudnya skripsi ini tidak lepas dari bantuan berbagai pihak. Oleh karena itu dalam kesempatan ini penulis ingin mengucapkan terima kasih yang sebesar-besarnya kepada : 1. Allah S.W.T, atas ridho dan karunianya sehingga penulis bisa menyelesaikan Tugas Akhir Skripsi ini. 2. Kedua orang tuaku tercinta, teman-temanku dan seluruh keluarga besar terima kasih atas semua kasih sayang, do a, yang tiada hentinya dan tidak pernah surut sehingga penulis bisa menyelesaikan pendidikan ini. 3. Bapak Husni Thamrin, S.T, MT., Ph.D. selaku Dekan Fakultas Komunikasi dan Informatika Universitas Muhammadiayah Surakarta. vii

8 viii

9 DAFTAR ISI HALAMAN JUDUL... i HALAMAN PERSETUJUAN... ii HALAMAN PENGESAHAN... iii DAFTAR KONTRIBUSI... iv MOTTO... v PERSEMBAHAN... vi KATA PENGANTAR... vii DAFTAR ISI... ix DAFTAR TABEL... xii DAFTAR GAMBAR... xiii ABSTRAKSI... xvi BAB I PENDAHULUAN Latar Belakang Rumusan Masalah Batasan Masalah Tujuan Penelitian Manfaat Penelitian Sistematika Penulisan... 4 BAB II TINJAUAN PUSTAKA Telaah Penelitian Landasan Teori Signage... 9 ix

10 2. Digital Signage Web Codeigniter PHP MySQL WampServer Pengujian Perangkat Lunak BAB III METODE PENELITIAN 3.1 Waktu dan Tempat Penelitian Peralatan Utama dan Pendukung A. Perancangan dan Pembuatan Software Hardware B. Alur Penelitian Perancangan Aplikasi A. Metode Pengumpulan Data Metode Studi Pustaka Metode Dokumentasi Metode Wawancara B. Desain Aplikasi Desain Aplikasi Desain User Interface Use Case x

11 4. Database dan Tabel Alur Kerja dan Konfigurasi Codeigniter A. Alur Kerja Framework Codeigniter B. Instalasi dan Konfigurasi Codeigniter BAB IV HASIL DAN PEMBAHASAN Hasil Penelitian Akses Aplikasi di Localhost Akses Aplikasi di Hosting Penerapan Keamanan Pengujian Black box Testing User Acceptance Test Pengujian dengan lebih dari 1 Display Analisa dan Pembahasan BAB V KESIMPULAN DAN SARAN Kesimpulan Saran DAFTAR PUSTAKA LAMPIRAN xi

12 DAFTAR TABEL Tabel 4.1 : List hasil pengujian dengan pendekatan black box pada Halaman Login...64 Tabel 4.2 : List hasil pengujian dengan pendekatan black box pada Menu Posting...65 Tabel 4.3 : List hasil pengujian dengan pendekatan black box pada Menu Media...66 Tabel 4.4 : List hasil pengujian dengan pendekatan black box pada Menu User...67 Tabel 4.5 : List hasil pengujian dengan pendekatan black box pada Menu Setting...67 Tabel 4.6 : List hasil pengujian dengan pendekatan black box pada Tombol Logout...68 Tabel 4.7 : Tabel Hasil Tanggapan Responden Pegawai TU Jurusan...69 Tabel 4.8 : Daftar responden mahasiswa...71 Tabel 4.9 : Tabel Hasil Tanggapan Responden Mahasiswa...71 Tabel 4.10 : Daftar responden mahasiswa dan dosen...74 Tabel 4.11 : Tabel Hasil Tanggapan Responden...74 xii

13 DAFTAR GAMBAR Gambar 3.1 : Flowchart Penelitian Gambar 3.2 : Rancangan Tampilan aplikasi pada monitor Gambar 3.3 : Alur Kerja Aplikasi Gambar 3.4 : Cara Kerja Aplikasi Gambar 3.5 : Rancangan Halaman Depan Gambar 3.6 : Rancangan HalamanLogin Gambar 3.7 : Rancangan Halaman Administrator Gambar 3.8 : Use Case Administrator Gambar 3.9 : ERD Gambar 3.10 : Alur Kerja Codeigniter Gambar 3.11 : Tampilan Wampserver aktif Gambar 3.12 : Tampilan folder www pada wamp Gambar 3.13 : Tampilan awal Codeigniter Gambar 3.14 : Tampilan folder config Gambar 3.15 : Tampilan file routes.php Gambar 3.16 : Tampilan file config.php Gambar 3.17 : Tampilan setting file database.php Gambar 3.18 : Struktur file di folder controller Gambar 3.19 : Struktur file di folder models Gambar 3.20 : Struktur file di folder views Gambar 4.1 : Tampilan halaman aplikasi Gambar 4.2 : Tampilan halaman login xiii

14 Gambar 4.3 : Tampilan halaman utama admin Gambar 4.4 : Tampilan menu upload gambar Gambar 4.5 : Tampilan menu upload video Gambar 4.6 : Tampilan menu Media Gambar 4.7 : Tampilan menu Posting Gambar 4.8 : Tampilan menu User Gambar 4.9 : Tampilan menu Tambah User Gambar 4.10 : Tampilan menu Password Gambar 4.11 : Tampilan menu Setting Gambar 4.12 : Upload aplikasi ke hosting dengan FileZilla Gambar 4.13 : Tampilan untuk masuk ke File Manager Gambar 4.14 : Tampilan Halaman Login di Perangkat Mobile Gambar 4.15 : Tampilan Menu Posting di Perangkat Mobile Gambar 4.16 : Tampilan Menghapus Postingan di Menu Posting Gambar 4.17 : Tampilan Membuat Event Baru di Menu Posting Gambar 4.18 : Tampilan Membuat Tulisan berjalan di Menu Posting Gambar 4.19 : Tampilan Menu Media Gambar 4.20 : Tampilan fasilitas upload di Menu Media Gambar 4.21 : Tampilan Menu User Gambar 4.22 : Tampilan fasilitas tambah user di Menu User Gambar 4.23 : Tampilan menu Ubah Password Gambar 4.24 : Tampilan menu Setting Gambar 4.25 : Grafik hasil kuesioner xiv

15 Gambar 4.26 : Grafik hasil kuesioner Gambar 4.26 : Grafik hasil kuesioner Gambar 4.28 : Konfigurasi dengan 4 perangkat Display Gambar 4.29 : Tampilan dengan 4 perangkat Display xv

16 ABSTRAKSI Di zaman ini teknologi digital semakin berkembang pesat beberapa penyampaian informasi tak lagi melalui media cetak, namun melalui teknologi yang sedang berkembang saat ini yaitu digital signage. Teknologi dapat menggantikan cara lama menyampaikan informasi dengan media cetak atau kertas, begitu juga cara penyampaian informasi dan pengumuman di Jurusan Informatika yang masih dengan media kertas.tujuan dari penelitian ini adalah untuk merancang dan membuat digital signage yang berfungsi sebagai media penyampai informasi di Jurusan Informatika yang up to date menggunakan framework Codeigniter. Konten informasi yang disampaikan berupa teks pengumuman, gambar, video dan tulisan berjalan. Penelitian ini dilakukan dengan metode observasi, wawancara dan studi literatur. Berdasarkan metode tersebut peneliti membuat sistem dalam bentuk prototype, yang memungkinkan pengembangan berkelanjutan dengan menyesuaikan kebutuhan yang ada di Jurusan Informatika.Pengujian aplikasi dilakukan dengan merubah konten informasi yang ditampilkan, melalui laptop dan perangkat mobile dengan akses internet, dan aplikasi ditampilkan pada sebuah monitor besar, dengan memanfaatkan mode fullscreen pada browser sehingga tampilan di monitor juga fullscreen. Pemakaian fitur update konten dengan perangkat mobile memudahkan administrator untuk mengubah konten dimana saja. Pada pengujian ini aplikasi dapat berjalan dengan baik. Hasil dari aplikasi telah diuji menggunakan pendekatan black-box test dan user acceptance test yang dari hasil uji coba tersebut dapat memenuhi kebutuhan informasi mahasiswa, yaitu pengumuman yang ditampilkan jelas dan mudah dipahami, menarik. Dari sisi Pegawai Tata Usaha Jurusan sebagai administrator sistem mudah untuk dioperasikan dan dapat digunakan sebagai media promosi Jususan sehingga disimpulkan bahwa aplikasi dapat diterapkan di lokasi penelitian. Kata kunci : CodeIgniter, Digital Signage, Media Informasi, Pengumuman, xvi