Makalah
PERANCANGAN DAN PEMBUATAN DIGITAL SIGNAGE DENGAN CODEIGNITER
Disusun Oleh : Andrean Luthfi Permana Dr. Heru Supriyono M.Sc
PROGRAM STUDI INFORMATIKA FAKULTAS KOMUNIKASI DAN INFORMATIKA UNIVERSITAS MUHAMMADIYAH SURAKARTA DESEMBER 2014
PERANCANGAN DAN PEMBUATAN DIGITAL SIGNAGE DENGAN CODEIGNITER Andrean Luthfi Permana, Heru Supriyono Informatika, Fakultas Komunikasi dan Informatika Universitas Muhammadiyah Surakarta Email :
[email protected] ABSTRAK
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 pengubahan 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,
PENDAHULUAN Di zaman ini teknologi
Informasi dan di depan Ruang Tata
digital semakin berkembang pesat
informasi, apabila ada informasi baru
beberapa penyampaian informasi tak
yang masuk maka kemudian petugas
lagi melalui media cetak, berangsur
Tata Usaha akan mencetak dan
bergeser pada penggunaan media
menempelkannya. Digital Signage
elektronik di berbagai bidang dan
dapat
aspek kehidupan sehari-hari. Salah
pendamping lembar teks dan gambar
satu
yang ditempel tersebut. Informasi
contoh
elektronik
penggunaan adalah
media
penyampaian
Usaha untuk media penyampaian
dapat
menjadi
solusi
digantikan
sebagai
dengan
teks,
informasi dan media promosi, dapat
gambar, video, pengumuman lainnya
dilihat di pusat perbelanjaan, instansi
di dalam sebuah monitor.
pemerintah pelayanan digital
maupun
tempat
masyarakat.
Teknologi
yang
sekarang
sedang
Berdasarkan hal ini maka diperlukan penggunaan
Digital
Signage
Informatika,
di
berkembang adalah digital signage.
Jurusan
Digital Signage merupakan aplikasi
Jurusan Informatika memiliki 2 buah
pengelola konten digital yang telah
monitor besar yang pemanfaatannya
diprogram untuk dapat menampilkan
belum
informasi atau pesan kepada target
penyampai informasi.
optimal
mengingat
sebagai
sarana
audien secara efektif, cepat, tepat dan handal. Dengan sistem yang terdiri dari komposisi server atau Personal Computer (PC), monitor, dan software menjadikan Digital Signage ini menjadi lebih efisien dalam segi tenaga, waktu dan biaya. Selama Informatika
ini
masih
Jurusan
menggunakan
cara manual dengan menempelkan lembar
pengumuman
di
Papan
TINJAUAN PUSTAKA Puspita Widhy Pradhana (2011)
dalam
berpendapat
penelitiannya
bahwa
dengan
berkembangnya teknologi web dan pertukaran informasi yang semakin pesat, web dinamis yang berbasis Hypertext (HTML)
Markup semakin
Language ditinggalkan,
sehingga dibutuhkan sebuah sistem yang
lebih
dinamis
sehingga
pengguna tidak lagi berhubungan
bisnis yang efektif dan ampuh.
langsung dengan script atau listing
Digital Signage merupakan media
program kecuali ada bug dan harus
paling cocok untuk media promosi
melakukan
dan
suatu produk. Dalam penelitian ini
bagaimana merancang sebuah sistem
Digital Signage yang dibuat berbasis
aplikasi
untuk
desktop dengan bahasa pemrograman
mengatur halaman website. Aplikasi
Delphi 2007, memiliki beberapa
yang dibutuhkan adalah aplikasi
fitur,
yang digunakan untuk melakukan
poster, video dan iklan berjalan.
update konten atau artikel dalam
Pengujian
sebuah website, dan bisa digunakan
menampilkan Digital Signage di
untuk mengatur tampilan website,
monitor besar dengan tiga layout
tanpa harus bersinggungan dengan
yang berbeda. Hasil dari pengujian
script.
ini dapat di ambil kesimpulan bahwa
pembenahan
yang
digunakan
Purnomo Tristia Putra (2013)
dalam
penelitiannya
berpendapat bahwa digital signage sangat
berpengaruh
konsumen,
bisa
terhadap
dilihat
semakin
selektif dalam pemilihan produk untuk digunakan. Strategi yang harus dilakukan memberikan
perusahaan
untuk
informasi
kepada
konsumen adalah dengan melalui media
periklanan. Produk-produk
diantaranya
menampilkan
dilakukan
dengan
digital signage dapat menampilkan poster, video, dan iklan berjalan di beberapa layout berbeda di monitor besar. Format video mempengaruhi kualitas yang ditampilkan, untuk ekstensi video yang menghasilkan tampilan baik yaitu mov, mp4 dan avi. Untuk poster, kualitas tampilan dipengaruhi oleh resolusi dan format poster, resolusi
yang disarankan
adalah 769x1219 pixel atau lebih.
yang padat iklan merupakan produk
Fakkar Robbi Radhian
yang mengandung tingkat persaingan
(2011)
yang ketat. Pada saat ini iklan telah
berpendapat
dipandang sebagai sumber informasi,
Information Display System (FIDS)
hiburan,
pada Bandar Udara Ahmad Yani
dan
media
komunikasi
dalam
penelitiannya bahwa
Flight
Semarang
sebagai
alat
pemberi
informasi atau pelayanan
kepada
(SIKUMA)” membahas SIKUMA
udara
merupakan sebuah perangkat lunak
pengguna dengan
fasilitas
bandar
software
itu
sendiri,
Perkuliahan
yang
Mahasiswa
dikembangkan
untuk
digunakan juga untuk menampilkan
membantu mahasiswa memperoleh
informasi
penerbangan
bagi
informasi
penumpang
atau
jasa
kuliah dan informasi lainnya dari
bandara dan ditempatkan di lokasi-
fakultas dan universitas. Mahasiswa
lokasi (di terminal bandara) yang
yang bertindak sebagai user dapat
mudah dilihat oleh para pengguna
melihat semua informasi yang ada
jasa bandar udara. FIDS di Bandara
hanya
Ahmad Yani Semarang ini berbasis
penampil, dimana layar penampil
web, sehingga aksesnya dilakukan
ini diletakkan di tempat umum yang
melalui jaringan komputer. FIDS ini
ramai oleh mahasiswa. Sehingga
memiliki fitur untuk menampilkan
dapat mempermudah penyampaian
informasi
informasi, juga difungsikan sebagai
nomor
pengguna
penernbangan penerbangan,
jadwal
berupa, maskapai,
kedatangan
atau
tentang
dengan
media
adalah klien-server dimana server sebagai
sumber
penerbangan berfungsi
data
utama untuk
dan
status klien
menampilkan
informasi
penerbangan
bagi
penumpang
atau
jasa
pengguna
bandara. Agung Nugroho Jati (2011) yang Sistem
dengan judul skripsinya berjudul Informasi
“Pembangunan Pengumuman
mata
melihat
promosi
layar
karya
dari
mahasiswa yang berupa video.
keberangkatan, asal atau tujuan dan juga keterangan. Cara kerja FIDS ini
jadwal
Siti Rochimah (2006) dalam
jurnalnya
yang
berjudul
“Perangkat Lunak ‘Digital Signage Manager’ ” berpenadapat bahwa teknologi
komputer
dewasa
memegang peranan
ini
yang sangat
penting dan vital bagi efektivitas pekerjaan.
Perlunya
pemberian
informasi secara akurat dan menarik akan
banyak
perusahaan produk,
membantu
untuk
layanan,
sebuah
menyampaikan dan
informasi
kepada
khalayak
ramai.
Digital
perkuliahan yang tepat waktu dan
signage adalah suatu alat untuk
tanpa terbatas ruang dan waktu bagi
menampilkan
multimedia
mahasiswa menjadi sangat penting
kepada umum, terdiri dari dua
dalam dunia yang penuh dengan
komponen penting yaitu manager
mobilitas
dan player. Digital Signage Manager
dalam
(DSM) adalah suatu perangkat lunak
bagaimana
yang mempunyai fungsi mengelola
sistem
perangkat lunak Digital Signage
memberikan informasi mengenai lalu
Player
lintas perkuliahan yang dibutuhkan
konten
(DSP).
menyangkut
Pengelolaan pengaturan
ini dan
oleh
yang
tinggi.
penelitian
Masalah
ini
adalah
membangun
sebuah
yang
dapat
mahasiswa
maupun
secara
dan pengaturan konten yang ada di
sehingga
DSP.
ini
selama kegiatan perkuliahan. Dalam
dikembangkan DSM dari perangkat
pembuatan aplikasi di penelitian ini
BZNP-100 buatan Sony Corporation.
menggunakan bahasa pemrograman
Dalam pengujian perangkat lunak
Hypertext
DSM dilakukan dengan menjalankan
sebagai
uji
berdasarkan
Apilkasi akan ditampilkan dalam
fungsionalitasnya yaitu pembuatan
browser dengan mode fullscreen.
material,
manajemen
Hasil dari penelitian ini adalah
manajemen
playlist,
penelitian
coba
DSP,
manajemen
sebuah
dapat
tepat
dosen
pengiriman konten, pengaturan DSP,
Dalam
cepat,
membantu
dan
akurat
berjalan
lancar
Preprocessor server
sitem
scripting.
tampilan
(Display
remote dan playlist. Dari uji coba
System)
tersebut
menampilkan informasi mengenai
menunjukkan
perangkat
DSM telah berfungsi dengan baik. Dionisius Manswetus (2010) dalam penelitiannya tentang Sistem Perkuliahan kebutuhan
Tampilan berpendapat akan
Informasi bahwa informasi
yang
side
(PHP)
dirancang
untuk
perkuliahan yang dibutuhkan oleh mahasiswa
maupun
dosen
lancarnya aktivitas perkuliahan.
demi
METODE
B. Alur Penelitian
A. Perancangan dan Pembuatan 1.
Software Software
yang
digunakan
peneliti dalam perancangan dan pembuatan aplikasi ini adalah : a.
Sistem Operasi Windows 7 Ultimate
2.
b.
CodeIgniter 2.14
c.
Wampserver2.4-x86
d.
Google Chrome
e.
Notepad ++
Hardware Hardware
yang
digunakan
peneliti dalam perancangan dan
Gambar 1 Flowchart Penelitian
pembuatan aplikasi ini adalah 1. Laptop
dengan
spesifikasi
Gambar 1 Flowchart Penelitian
sebagai berikut : a. Processor Intel (R) Core i5, 2.5 GHz b. Harddisk 640 GB c. RAM 2 GB d. Sistem Operasi Windows 7 Ultimate 2. Toshiba Power TV 32 inch 3. Perangkat mobile
HASIL DAN PEMBAHASAN Hasil
yang
dicapai
dari
penelitian ini adalah aplikasi digital signage yang dapat digunakan untuk menyampaikan
informasi
berupa
pengumuman, gambar, video dan kegiatan yang akan dilakasanakan. Aplikasi
ini
menggunkan Chrome
dan
di
uji
browser mendapat
pengujian sebagai berikut :
dengan Google hasil
1. Akses User Terhadap Halaman
index.php/login”
pada
Depan Program
addressbar di web browser ,
Halaman depan program adalah
akan
halaman saat pertama kali user
seperti gambar 3 dibawah ini.
menghasilkan
tampilan
mengetikkan “http://localhost/andre/” pada addressbar di web browser yang
terhubung
dengan
web
server localhost. Halaman yang muncul
setelah
mengetikkan
alamat tersebut adalah halaman yang akan menampilkan beberapa
Gambar 3 Halaman login
konten dalam satu halaman, yaitu teks pengumuman, gambar, video,
3. Akses User Terhadap Menu
dan tulisan berjalan. Tampilan
Aplikasi
halaman yang akan ditampilkan
Halaman
pada TV besar dapat dilihat pada
(administrator) terdapat beberapa
gambar 2.
menu,
utama
pada
diantaranya
user
menu
Posting, Media, User, dan Setting.
Gambar 4 Halaman menu user Gambar 2 Halaman depan
a. Menu Media
2. Akses User Terhadap Halaman
Menu Media berfungsi untuk mengganti file gambar dan
Login Untuk dapat masuk ke
video ke dalam aplikasi ini yang
perlu
akan disimpan di dalam folder
melakukan login, dengan cara
photo dan video. Juga berfungsi
mengetikkan
untuk menghapus yang telah di
“http://localhost/andre/
upload sebelumnya.
dalam
aplikasi
maka
c. Menu User Menu
ini
digunakan
untuk menambah dan menghapus user di aplikasi ini.
Gambar 5 Menu Media b. Menu Posting Posting
Menu
digunakan untuk menginputkan beberapa konten, yaitu berupa teks
pengumuman,
event
dan
tulisan berjalan.
Gambar 7 Menu User User
yang
sudah
ada
akan
ditampilkan dalam daftar, lalu untuk menambah user dengan cara klik pada tombol tambah user. Muncul form seperti gambar 8,
Gambar 6 Menu Posting Untuk
menuliskan
teks
pengumuman dan event cukup dengan mengisi form yang sudah ada.
Untuk
tulisan
berjalan
dengan menulis di kolom tulisan berjalan
di
bawah
tersebut.
Pengumuman dan event yang telah dibuat akan ditampilkan
Gambar 8 Tambah user
pada daftar dibawah, dan masih
Pada menu ini juga terdapat
dapat di edit maupun dihapus.
fasilitas
untuk
melakukan
penggantian
password
apabila
mengalami kelupaan. Tampilan
PENGUJIAN 1) Pengujian Internal
form untuk penggantian password
Pengujian dilakukan oleh penulis
seperti gambar 9.
dengan cara menjalankan aplikasi digital signage setelah selesai dibuat
pada
localhost
dan
hosting . Berikut tabel pengujian sistem ditujukan pada Tabel 1 Tabel 1 Hasil Pengujian Internal No
Gambar 9 Ubah password d. Menu Setting Menu Setting digunakan untuk
mengatur
pengumuman,
jumlah
jumlah
event,
waktu refresh halaman depan, dan pilihan untuk menampilkan event
Item yang diuji
Kelancaran sistem Loading 2 buka tiap menu Respons 3 sistem Kinerja 4 sistem Keterangan:
Kondisi B
C
K
√
1
√ √ √
1. Kelancaran sistem berjalan cukup
atau tidak dihalaman depan.
baik, tidak mengalami kendala. 2. Loading saat membuka menu berjalan
cukup
baik,
tidak
mengalami keterlambatan. 3. Respons sistem cukup lancar untuk
menginputkan
menampilkan
data
dan yang
dikehendaki. 4. Gambar 10 Menu Setting
Kinerja
sistem
cukup
baik,
dalam proses upload foto dan video.
P5
2) Pengujian Eksternal
Kemudahan
penggunaan
Pengujian eksternal dilakukan
sistem
dengan
form
P6
: Tampilan sistem
kuesioner. Kuesioner diberikan
P7
:
kepada Pegawai Tata Usaha dan
sebagai media promosi Jurusan
Dosen
Informatika
P8
sebagai pengelola sistem dan
8
kepada
6
menggunakan
Jurusan
mahasiswa
sebagai
penerima informasi. a.
:
Hasil
dapat
dijadikan
: Keseluruhan sistem
4
Pengujian
Kuesioner
Sistem
terhadap
dengan
2
Pegawai
0 Baik
Tata Usaha Tabel 2 Hasil Kuisioner
Cukup Baik
Buruk
Gambar 11 Grafik Hasil Kuesioner
Jawaban
N o 1
Pertan yaan P1
Cukup √
2
P2
√
bahwa jawaban dari Pegawai Tata
3
P3
√
Usaha Jurusan Informatika secara
4
P4
√
keseluruhan dapat membantu proses
5
P5
√
6
P6
√
7
P7
8
P8
Baik
Buruk
:
penyampaian
pada
informasi
kepada
mahasiswa, sistem digital signage sudah cukup baik dan cukup mudah
√
dalam pengoperasiannya. Selain itu √
sistem digital signage digunakan
Pengumuman
yang
ditampilkan jelas P2
grafik
Gambar 11, maka dapat dianalisa
Keterangan : P1
Berdasarkan
: Tampilan pengumuman di
monitor menarik P3
: Kelengkapan menu-menu
P4
: Kejelasan menu-menu
juga dapat
sebagai media promosi
Jurusan Informatika.
b.
Hasil
Pengujian
dengan
Kuesioner terhadap Mahasiswa
15 10
Pengujian dilakukan terhadap 10
5
mahasiswa dengan cara menjawab
0 Setuju
Kurang Setuju
pertanyaan pada form kuesioner yang diajukan.
Gambar 12 Grafik Hasil Kuesioner
Tabel 3 Hasil Kuisioner No. Pertanyaan 1. P1 2. P2 3. P3 4. P4 Keterangan :
Berdasarkan
Jawaban S KS TS 10 0 0 10 0 0 10 0 0 10 0 0
KS
: Kurang Setuju
TS
: Tidak Setuju
:
secara keseluruhan bahwa sistem digital signage dapat diterapkan media
penyampai
Berdasarkan hasil penelitian dan pembahasan,
Pengumuman jelas
dan
yang mudah
dipahami P2
bahwa jawaban dari 10 mahasiswa
KESIMPULAN
Keterangan :
ditampilkan
pada
pengumuman di Jurusan Informatika.
: Setuju
:
grafik
Gambar 12, maka dapat dianalisa
sebagai
S
P1
Tidak Setuju
yang
dapat
disimpulkan sebagai berikut : 1.
Aplikasi digital signage ini
telah Pengumuman
maka
selesai
dibuat
menggunakan
dengan
Codeigniter
2.14
ditampilkan menarik
dengan fitur dapat menampilkan
P3
konten
sudah
: Konten yang ditampilkan cukup
mengakomodir
berupa
pengumuman,
gambar,
video
teks
dan
tulisan
pada
digital
kebutuhan informasi
berjalan.
P4
signage telah berhasil ditampilkan
: Keseluruhan sistem yang
ditampilkan sudah baik
pada
Tampilan
monitor.
Aplikasi
Digital
Signage ini memanfaatkan mode fullscreen Chrome
pada
browser
sehingga
Google
tampilan
monitor juga fullscreen.
di
2. Dari hasil pengujian dengan menggunakan
berbagai
perangkat
keseluruhan
3.
laptop, dan dan handphone, diketahui
dengan
bahwa sistem dapat berjalan dengan
mahasiswa
baik.
touschscreen,
Tata
Usaha,
dan
mahasiswa
atau
tidak
terbatas pada satu jurusan saja.
seperti Personal Computer (PC),
3. Hasil kuesioner dari Pegawai
kampus
Aplikasi dapat dikembangkan fitur
interaksi dengan
dengan fasilitas
namun
juga
menyesuaikan dengan sarana dan prasana yang tersedia.
menunjukkan bahwa sistem telah
4.
memenuhi kebutuhan yaitu :
informasi dengan tepat dan tidak
a.
b.
Pengumuman
ditampilkan jelas dan mudah
diletakkan pada tempat yang strategis
dipahami
yang sering dilalui oleh kebanyakan
Tampilan
pengumuman
Pengoperasian sistem mudah Sistem
dapat
sebagai
digunakan
media
promosi
Jurusan Saran Berdasarkan kesimpulan dan pembahasan hasil penelitian maka dikemukakan beberapa saran sebagai berikut : Aplikasi digital signage dapat
dikembangkan menambahkan
lagi fitur
dengan penggantian
layout dan scheduling (penjadwalan). 2.
memberikan
terbatas ruang, baiknya layar display
d.
1.
dapat
yang
menarik c.
Agar
Penambahan fungsi baru agar
dapat sehingga
menambah dapat
kegunaanya, diterapkan
di
mahasiswa.
DAFTAR PUSTAKA Jati , Agung Nugroho. 2013. “Pembangunan Sistem Informasi Pengumuman Perkuliahan Mahasiswa (SIKUMA)”. Universitas Atma Jaya Yogyakarta. Manswetus, Dionisius. 2010. “Sistem Tampilan Informasi Perkuliahan.” Universitas Janabadra Yogyakarta. Putra , Purnomo Tristia. 2013. “Sistem Penampil Iklan untuk Digital Signage”. Universitas Muhammadiyah Surakarta. Pradhana , Puspita Widhy. 2011. “Perancangan dan Pembuatan Content Management
System
(CMS)
“Widi
CMS”
Menggunakan
Framework Codeigniter”. STMIK Amikom Yogyakarta. Radhian , Fakkar Robbi. 2011. “Flight Information Display System Pada Bandar Udara Intenasional Ahmad Yani Semarang.” Universitas Diponegoro Semarang. Rochimah, Siti dan Kusbandono Ari Bowo. 2006. “PERANGKAT LUNAK DIGITAL SIGNAGE MANAGER’ “. Jurnal Ilmiah Teknologi Inforrmasi. Volume 5.2 (2006) : 66-72.
BIODATA PENULIS Nama
: Andrean Luthfi Permana
Nim
: L200100086
Tempat Lahir
: Sragen
Tanggal Lahir
: 4 November 1992
Jenis Kelamin
: Laki-laki
Agama
: Islam
Pendidikan
: S1
Jurusan/ Fakultas
: Informatika/ Komunikasi dan Informatika
Perguruan Tinggi
: Universitas Muhammadiyah Surakarta
Alamat Rumah
: Saren Rt.11/2 , Kalijambe, Sragen.
No. HP
: +6285727900942
Email
:
[email protected]
