PEMBANGUNAN DAN PENGEMBANGAN E NEWS CAMP
PEMBANGUNAN DAN PENGEMBANGAN E-NEWS CAMPUS
BERBASIS CMS (CONTENT MANAGEMENT SYSTEM)
MENGGUNAKAN PHP, MYSQL DAN JQUERY
Luri Aprinaldo1), Sumijan2) , Eka Praja Wiyata Mandala3)
1)
2)
3)
email : luriaprinaldo@gmail.com / soe@upiyptk.org / eka_praja_199@yahoo.com
J u r u s a n T e k n i k I n fo r ma t i k a , F a k u l t a s I l m u K o m p u t e r , U n i v e r s i t a s P u t r a I n d o n e s i a
“YPTK” Padang
1)
Mahasiswa Teknik Informatika / 2) 3) Pembimbing Skripsi
Abstract - Information is a very necessary thing every person, so that the mode of delivery may influence a
person in obtaining such information. University Putra Indonesia "YPTK" Padang not have a special website to
inform the news to the students, so that the academic information such news announcements, news of academic,
non-academic news, news course, university news and other matters concerning the university cannot be
delivered in full and up to date information to the students or the general public. So in this research the authors
build a web application Content Management System (CMS) for campus news created using programming
languages PHP, MySQL and JQuery. The web application Content management System (CMS) is expected to
provide all the information complete news, rapid, precise, efficient and up to date information to the academic
community the University of Indonesia's son "YPTK" Padang and also the general public.
Keyword : E-News, Website, Content Mangement System
1. PENDAHULUAN
1.1. Latar Berlakang Masalah
Seiring dengan perkembangan Universitas Putra
Indonesia “YPTK” Padang, kebutuhan akan suatu
konsep dan mekanisme penyampaian informasi
kepada segenap civitas akademika Universitas Putra
Indonesia “YPTK” Padang dan masyarakat umum
sangatlah diperlukan. Seperti halnya penyampaian
informasi berita universitas berupa berita akademik
dan non akademik yang menjadi sumber informasi
bagi mahasiswa dan dosen serta informasi umum
lainnya bagi masyarakat yang ingin mengetahui
tentang informasi dan perkembangan universitas.
Sebagaimana yang diketahui, selama ini
Universitas Putra Indonesia “YPTK” Padang hanya
mengunakan website yang telah ada, yakni SISFO
(Sistem Informasi Akademik Kampus) yang
digunakan untuk melakukan kegiatan akademik
seperti PA online, pengisian KRS (Kartu Rencana
Studi) dan pencetakan kartu ujian, serta penyampaian
jadwal akademik lainnya kepada mahasiswa di papan
informasi kampus. Hal ini berbeda dengan universitas
lain yang ada di kota Padang dan seluruh kota di
Indonesia yang mana rata-rata universitas di Indonesia
mempunyai portal khusus dalam penyampaian
informasi berita universitas.
Timbul sebuah pertanyaan, apakah Universitas
Putra Indonesia “YPTK” Padang sudah mempunyai
portal khusus dalam penyampaian informasi berita
universitas? Berdasarkan paparan latar belakang di
atas dapat ditemukan jawaban, bahwa Universitas
Putra Indonesia belum mempunyai portal khusus
untuk hal tersebut. Maka dalam penelitian skripsi ini
penulis akan membahas tentang “Pembangunan dan
Pengembangan E-News Campus Berbasis CMS
(Content Mangement System) Menggunakan PHP,
MySQL dan JQuery”.
Hasil dari penelitian ini adalah sebuah aplikasi
Content Mangement System (CMS) berita kampus
atau sering dikenal dengan E-News Campus. Dengan
hasil penelitian ini diharapkan kampus UPI “YPTK”
Padang bisa menerapkan konsep penyampaian
informasi berbasis website, dan menjadikan portal
berita sebagai pelengkap dari konsep penyampaian
informasi yang ada di Universitas Putra Indonesia
sehingga informasi lebih mudah didapatkan oleh
segenap civitas akademika kampus UPI “YPTK”
Padang dan masyarakat umum.
1.2. Tujuan Penelitian
Selain untuk menyelesaikan Tugas Akhir,
adapun tujuan yang ingin dicapai melalui penelitian
ini antara lain :
1. Membangun sebuah aplikasi web Content
Management System (CMS) untuk berita kampus
Universitas Putra Indonesia “YPTK” Padang,
sehingga memberikan kemudahan bagi segenap
civitas akademika dan masyarakat umum dalam
memperoleh informasi yang dibutuhkan.
2. Menjadikan aplikasi web Content Management
System (CMS) ini sebagai portal khusus untuk
berita kampus, jadi segenap civitas akademika
Universitas Putra Indonesia “YPTK” Padang bisa
menerapkan konsep penyampaian informasi
berbasis web yang dipublish secara online,
sehingga berbagai macam informasi berita
mengenai kampus lebih mudah didapatkan.
3. Mempermudah pihak administrasi kampus dalam
menyampaikan informasi tentang universitas, baik
itu berupa pengumuman, berita akademik dan non
akademik, berita universitas dan lain-lain.
4. Mempermudah pihak administrasi kampus dalam
menampung dan mengelola berbagai macam
informasi berita, seperti : menambah informasi,
memperbaharui informasi, dan menghapus
informasi tersebut.
5. Memberikan informasi yang penuh melalui media
online di internet.
1.3. Manfaat Penelitian
Adapun manfaat dari penelitian ini antara lain :
1. Sebagai bahan masukan bagi kampus Universitas
Putra Indonesia “YPTK” Padang untuk
menghasilkan informasi yang lengkap, cepat dan
tepat untuk disampaikan kepada segenap civitas
akademika dan masyarakat umum.
2. Dapat meningkatkan efisiensi dan efektifitas
informasi yang dibutuhkan.
3. Menciptakan suatu sistem yang nantinya dapat
dimanfaatkan sebagai sumber informasi bagi
segenap civitas akademika dan masyarakat umum.
4. Meningkatkan
jaringan
dalam
pertukaran
informasi dan data bagi segenap civitas akademika
dan masyarakat luas.
1.4. Perumusan M asalah
Berdasarkan latar belakang yang telah diuraikan
diatas, maka ada beberapa masalah yang dapat
dikemukakan, yaitu :
1. Bagaimana aplikasi Content Management System
(CMS) E-News Campus yang diterapkan bisa
menampung dan menampilkan sejumlah informasi
berita kampus berdasarkan kategori berita yang
telah dikelompokkan, yakni berita akademik dan
non akademik yang mencakup berita program
studi masing-masing fakultas, Unit Kegiatan
Mahasiswa (UKM), pengumuman, agenda/event
kampus, informasi beasiswa dan lowongan kerja
serta informasi umum lainnya?
2. Bagaimana aplikasi Content Management System
(CMS) E-News Campus dapat mempermudah
penyampaian informasi berita kampus kepada
segenap civitas akademika Universitas Putra
Indonesia “YPTK” Padang dan masyarakat umum
berdasarkan kepada kategori berita yang telah
dikelompokkan, seperti berita program studi
masing-masing fakultas, Unit Kegiatan Mahasiswa
(UKM),
pengumuman, agenda/event kampus,
informasi beasiswa dan lowongan kerja serta
informasi umum lainnya?
3. Bagaimana aplikasi Content Management System
(CMS) E-News Campus dapat berfungsi sebagai
wadah/sumber informasi bagi segenap civitas
akademika dan masyarakat umum, sehingga
informasi yang dihasilkan selalu up to date?
2. LANDASAN TEORI
2.1. Rekayasa Perangkat Lunak
2.1.1. Definisi Rekayasa Perangkat Lunak
Istilah Rekayasa Perangkat Lunak (RPL)
secara umum disepakati sebagai terjemahan dari
istilah Software Engineering . Istilah Software
Engineering mulai dipopulerkan tahun 1968 pada
Software
Engineering
Conference
yang
diselenggarakan oleh NATO. Sebagian orang
mengartikan RPL hanya sebatas pada bagaimana
membuat program komputer. Padahal ada perbedaan
yang mendasar antara perangkat lunak (software) dan
program komputer (Aunur R. Mulyanto, 2008:2).
Secara teoristis, banyak sekali definisi rekayasa
perangkat lunak, baik yang berasal dari buku, teks
maupun lembaga mandiri seperti ACM dan IEEE atau
juga dari sumber internet. Berikut ini beberapa definisi
resmi dari rekayasa perangkat lunak atau software
engineering yang diambil dari berbagai sumber
(Soetam Rizky, 2011:17-21) yakni :
1. Menurut Ian sommerville
Rekayasa perangkat lunak adalah disiplin
ilmu yang membahas semua aspek produksi
perangkat lunak, mulai dari tahap awal spesifikasi
sistem sampai pemiliharaan sistem setelah
digunakan.
2. Menurut IEEE
Bahwa rekayasa perangkat lunak selain
sistematik juga merupakan pendekatan yang
seharusnya mampu untuk dikuantifikasikan alias
diukur keberadaannya dengan angka-angka atau
ukuran
tertentu
dalam
sebuah
proses
pengembangan perangkat lunak
3. Menurut Conger
Rekayasa perangkat lunak adalah sebuah
proses yang sistematik, bahkan hingga ke proses
saat perangkat lunak tidak lagi digunakan.
4. Menurut Bjorner
Rekayasa perangkat lunak lebih bertujuan ke
arah sebuah efisiensi pengerjaan perangkat lunak
dan mampu memuaskan pengguna dalam asumsi
telah mampu memecahkan masalah yang dihadapi
oleh pengguna.
Sehingga jika diterjemahkan secara harfiah,
maka definisi rekayasa perangkat lunak secara umum
adalah sebuah disiplin ilmu yang mencakup segala hal
yang berhubungan dengan proses pengembangan
perangkat lunak sejak dari tahap perancangan hingga
tahapan implementasi serta pasca implementasi
sehingga siklus hidup perangkat lunak dapat
berlangsung secara efisien dan terukur (Soetam Rizky,
2011:17-21).
2.1.2. Tujuan Rekayasa Perangkat Lunak
Secara umum tujuan rekayasa perangkat lunak
tidak berbeda dengan rekayasa yang lain. Tujuan dari
rekaya perangkat lunak adalah sebagai berikut (Aunur
R. Mulyanto, 2008) :
1. Memperoleh biaya produksi perangkat lunak yang
rendah.
2. Menghasilkan perangkat lunak yang kinerjanya
tinggi, handal dan tepat waktu.
3. Menghasilkan perangkat lunak yang dapat bekerja
pada berbagai jenis platform.
4. Menghasilkan perangkat lunak yang biaya
perawatannya rendah.
2.2. UML (Unified Modelling Language)
2.2.1. Definisi UML
UML (Unified Modelling Language) adalah
salah satu alat bantu yang sangat handal di dunia
pengembangan sistem yang berorientasi obyek. Hal
ini disebabkan karena UML menyediakan bahasa
pemodelan visual yang memungkinkan bagi
pengembang sistem untuk membuat cetak biru atas
visi mareka dalam bentuk yang baku, mudah
dimengerti serta dilengkapi dengan mekanisme yang
efektif
untuk
berbagi
(sharing )
dan
mengkomunikasikan rancangan mereka dengan yang
lain (Munawar, 2005:17).
2.2.2. Diagram UML
UML terdiri dari beberapa teknik notasi yang
berbentuk grafik untuk membuat visual model dari
software system. Pada UML versi 2, diagram UML
mempunyai 13 diagram, meliputi : Use Case Diagram,
StatechartDiagram, Sequence Diagram, Collaboration
Diagram, Activity Diagram, Component Diagram,
Deployment Diagram, Package Diagram, Objeck
Diagram, Communication Diagram, Composite
Structure Diagram, Interaction Overview Diagram,
dan Timing Diagram. Pada jurnal ini hanya akan
dibahas 7 buah diagram UML.
1. Use Case Diagram
Use case diagram adalah deskripsi fungsi dari
sebuah sistem dari perspektif penggguna. Use case
diagram bekerja dengan cara mendeskripsikan
tipikal interaksi antara user sebuah sistem dengan
sistemnya sendiri melaluhi sebuah cerita
bagaimana sebuah sistem dipakai (Munawar,
2005:63).
Use case diagram mempunyai beberapa
aspek penting yang ada dalam perancangan sebuah
system, aspek tersebut antara lain :
a. Actor
Actor merupakan bagian dari Use
Case yang
bertindak
sebagai subjek
(pelaku) dalam suatu proses.
b. Use Case
Use case adalah proses-proses yang
terjadi dalam suatu software. Use case juga
menggambarkan apa yang sedang dilakukan
oleh seorang actor .
c. Relasi
Relasi menggambarkan hubungan antara
actor dan use case. Relasi-relasi tersebut dapat
dibagi menjadi :
1). Undirectional Association
2). Generalization
3). Dependency
2. Class Diagram
Class diagram memberikan gambaran
hubungan antara tabel-tabel yang ada pada
database. Masing-masing class memiliki attribut
dan metoda atau fungsi yang sesuai dengan proses
yang terjadi.
Nama class menggunakan huruf besar di
awal kalimatnya dan diletakkan di atas kotak
(Munawar, 2005).
a. Attribut
Attribut adalah properti dari sebuah class.
Attribut ini melukiskan batas nilai yang
mungkin ada pada obyek dari class. Secara
konvensi, jika nama attribut terdiri atas satu
suku kata, maka ditulis dengan huruf kecil.
Akan tetapi jika nama attribut mengandung
lebih dari satu suku kata maka semua suku
kata digabungkan dengan suku kata pertama
menggunakan huruf kecil dan awal suku kata
berikutnya menggunakan huruf besar.
b. Operation
Operation adalah sesuatu yang bisa
dilakukan oleh sebuah class atau yang dapat
dilakukan untuk sebuah class. Seperti halnya
attribut, nama operation juga menggunakan
huruf kecil semua jika terdiri dari satu suku
kata. Akan tetapi jika lebih dari satu suku
kata, maka semua suku kata digabungkan
dengan suku kata pertama huruf kecil dan
huruf awal tiap suku berikutnya dengan huruf
besar.
3. Sequence Diagram
Sequence diagram menggambarkan interaksi
antar objek di dalam dan di sekitar sistem
(termasuk pengguna, display, dan sebagainya)
berupa message yang digambarkan terhadap
waktu. Sequence diagram biasa digunakan untuk
menggambarkan
skenario
atau
rangkaian
langkah-langkah
yang
dilakukan
sebagai
respons dari sebuah event untuk menghasilkan
output tertentu.
Diawali
dari apa
yang
menggerakkan aktivitas tersebut, proses dan
perubahan apa saja yang terjadi secara internal dan
output apa yang dihasilkan.
Masing-masing
objek, termasuk aktor,
memiliki lifeline vertikal. Message digambarkan
sebagai garis berpanah dari satu objek ke objek
lainnya. Pada fase desain berikutnya, message
akan dipetakan menjadi operasi / metoda dari class
(Munawar, 2005).
4. Collaboration Diagram
Collaboration
diagram
menunjukkan
message-message yang dikirimkan satu sama lain.
Collaboration diagram merupakan bentuk lain dari
sequence diagram. Bila sequence diagram
diorganisir menurut waktu, maka collaboration
diagram diorganisir menurut ruang/space.
Dengan
collaboration
diagram
memungkinkan untuk memodelkan pengiriman
sebuah message kebanyak objek pada class yang
sama. Demikian juga halnya untuk menunjukkan
adanya objek aktif yang mengendalikan aliran dari
message.
5. Statechart Diagram
Statechart diagram menelusuri individuindividu objek melalui keseluruhan daur hidupnya,
menspesifikasikan semua urutan yang mungkin
dari pesan-pesan yang akan diterima objek
tersebut, bersama-sama dengan tanggapan atas
pesan-pesan tersebut (Munawar, 2005).
Secara mudahnya statechart diagram
menggambarkan tentang kelakuan (behavior)
sistem yang akan dibangun.
6. Activity Diagram
Activity diagram adalah teknik untuk
mendiskrispikan logika prosedural, proses bisnis
dan aliran kerja dalam banyak kasus. Activity
diagram mempunyai peran seprti halnya flowchart,
akan tetapi perbedaanya dengan flowchart adalah
activity diagram bisa mendukung prilaku paralel
sedangkan flowchart tidak (Munawar, 2005:109).
Activity diagram bisa digunakan untuk
menunjukkan siapa yang mengerjakan apa, dengan
teknik partision.
7. Deployment Diagram
Deployment diagram menunjukkan tata letak
sebuah sistem secara fisik, menampakkan bagianbagian software yang berjalan pada bagian
hardware.
Deployment diagram menyediakan gambaran
bagaimana sistem secara fisik akan terlihat. Sistem
terdiri dari node-node dimana setiap node diwakili
untuk sebuah kubus. Garis yang menghubungkan
antara 2 kubus menunjukkan hubungan diantara
kedua node tersebut. Tipe node bisa berupa device
yang berwujud hardware dan bisa juga processor
atau execution environment (Munawar, 2005:109).
2.3. Content Management System (CMS)
2.3.1. Definisi CMS
Content
Management
System
(CMS)
merupakan sebuah aplikasi yang dapat digunakan
untuk mengubah, mengurutkan, mengelola berbagai
jenis konten atau informasi digital baik yang berupa
teks, gambar, suara, maupun video secara mudah,
cepat dan rapi pada sebuah sistem yang berjalan di
dalam website sesuai dengan keinginan dari orang
yang akan membuat aplikasi website tersebut
(Wahana Komputer, 2011).
Content Management System (CMS) adalah
kumpulan halaman web yang berfungsi sebagai ruang
kerja bagi admin untuk memanajemen, mengendalikan
dan mengolah isi sebuah website. CMS juga
memberikan kefleksibelan dalam mengatur alur kerja
atau ‘workflow’ dan hak akses, sehingga
memperbesar kesempatan berpartisipasi dari pengguna
dalam pengembangan website. Hal ini akan sangat
menguntungkan bila website yang dikelola memiliki
kompleksitas yang tinggi dan mengalami kemajuan
yang cukup pesat (Lukmanul Hakim, 2004:64).
Jadi dapat disimpulkan bahwa,
Content
Management System (CMS) adalah sebuah sistem
yang dapat membuat, mengatur, medestribusikan,
mempublikasikan dan menjaga informasi, dimana
admin tidak harus mengetahui tag HTML untuk
menjalankanya.
2.3.2. Manfaat Penggunaan Content Management
System (CMS)
Selain dari beberapa hal yang telah disebutkan
di atas, CMS juga dapat memberikan sejumlah
manfaat kepada penggunanya yang dapat dijabarkan
sebagai berikut (Kemas Yunus Antonius, dalam
www.ilmukomputer.com, 18/09/2006) :
1. Manajemen Data
Ini merupakan fungsi utama dari CMS.
Semua data/informasi baik yang telah ditampilkan
ataupun belum dapat diorganisasi dan disimpan
secara baik. Suatu waktu data/informasi tadi dapat
dipergunakan kembali sesuai dengan kebutuhan.
2. Mengatur Siklus Hidup Website
CMS memberikan fasilitas kepada admin
untuk mengelola bagian atau isi mana saja yang
akan ditampilkan, waktu penampilan dan lokasi
penampilan di website. Sebelum ditampilkan
bagian dan isi yang akan ditampilkan di-review
terlebih dulu sehingga terjamin kevaliditasannya.
3. Mendukung web templating dan standarisasi
Setiap halaman website yang dihasilkan
berasal dari template yang telah terlebih dahulu
disediakan oleh CMS. Selain dapat menjaga
konsistensi dari tampilan secara keseluruhan,
admin dapat berkonsentrasi secara penuh dalam
melaksanakan tugasnya menyediakan isi website.
Bila isi telah tersedia, maka proses publikasi dapat
berjalan dengan mudah karena sudah ada template
sebelumnya. Beberapa bagian dari website
biasanya telah ditetapkan sedemikian rupa
sehingga tidak dapat diubah begitu saja. Hal ini
dilakukan untuk memberikan standarisasi kepada
seluruh bagian dari website.
4. Personalisasi website
Sekali sebuah isi ditempatkan ke dalam CMS,
isi tersebut dapat ditampilkan sesuai dengan
kebutuhan. Terlebih lagi dengan kelebihan CMS
yang dapat memisahkan antara desain dan isi,
menyebabkan proses personalisasi dapat berjalan
dengan mudah.
5. Sindikasi
Sindikasi memberikan kemungkinan kepada
sebuah website untuk membagi isinya kepada
website-website yang lain. Format data yang
didukung juga cukup variatif, mulai dari rss, rdf,
xml hingga ‘backend scripting’. Sama halnya
dengan personalisasi, sindikasi juga dapat
dilakukan dengan mudah karena isi dan desain
telah dibuat terpisah.
6. Akuntabilitas
CMS mendukung alur kerja dan hak akses
yang
jelas
kepada
para
penggunanya,
data/informasi
yang
disampaikan
dapat
dipertanggung jawabkan dengan baik. Admin dan
user memiliki hak akses yang berbeda-beda.
Dengan demikian setiap perubahan yang terjadi di
website dapat ditelusuri dan diperbaiki seperlunya
dengan segera.
2.4. News (Berita)
2.4.1. Definisi Berita
Menurut
Kamus
Bahasa
Indonesia
Kontemporer (dalam Ido Priyana Hadi. “Konsep
Penulisan Jurnalistik Masa Depan Dan Desain
Storyboard Untuk Online News”. Vol.5. 2003:112)
berita adalah laporan atau pemberitahuan tentang
sesuatu kejadian atau peristiwa yang disampaikan
melalui orang lain, baik secara lisan maupun tertulis.
Pengertian berita (News) yang dimaksud adalah
penyajian informasi yang sudah, sedang dan akan
terjadi.
2.4.2. Berita Elektronik (E-News)
Berita elektronik (E-News) merupakan berita
yang menggunakan perangkat komputer yang
terhubung dengan jaringan komputer global. Terdapat
juga beberapa istilah untuk berita elektronik yaitu
online news atau digital news (dalam Ido Priyana
Hadi. “Konsep Penulisan Jurnalistik Masa Depan Dan
Desain Storyboard Untuk Online News”. Vol.5.
2003:112).
2.4.3. Berita Kampus
Berita kampus merupakan suatu terbitan yang
diusahakan oleh pihak perguruan tinggi yang isinya
merupakan berita dan informasi yang diperlukan oleh
masyarakat kampus. Umumnya isi berita kampus
menyangkut peraturan-peraturan, peristiwa yang
terjadi serta kegiatan-kegiatan yang dilakukan oleh
masyarakat kampus. (dalam Siswanto.”Peranan
Majalah Kampus Dalam Peningkatan Proses Belajar
Mengajar Pada Perguruan Tinggi Masa Kini dan Masa
Akan Datang”. Vol.5. No.21 – Juli 2007 : 100).
2.5. PHP
PHP adalah bahasa scripting server side yaitu
bahasa yang digunakan pada server tanpa perlu
melakukan kompilasi tetapi cukup menuliskan tulisan
dalan bentuk ASCII-nya saja. PHP disebut juga
sebagai bahasa interpreter (Mufid D Purwanto dan
Muhammad Tito Herlambang, 2002:200, dalam Alif
Amri Suri, 2009).
PHP sangat mirip dengan bahasa C, juga
mempunyai karakteristik yang mirip dengan Perl.
Bahasa pemrograman biasanya diterjemahkan atau
dikompilasi terlebih dahulu. Interpreter adalah sebuah
program yang digunakan untuk membaca file yang
berisi kode program yang akan dijalankan, kemudian
interpreter tersebut akan meminta CPU untuk
melakukan perintah yang diterimanya.
Contoh penulisan kode PHP sebagai berikut:
2.6. JQuery
jQuery adalah Javascript Library atau kumpulan
kode/fungsi Javascript siap pakai, sehingga
mempermudah dan mempercepat kita dalam membuat
kode Javascript (Lukmanul Hakim, 2010:3).
Kesimpulannya, jQuery menyerderhanakan kode
Javascript, hal ini sesuai dengan slogannya ‘write less,
do more’ cukup tulis sedikit, tapi bisa melakukan
banyak hal.
2.7. Database
Database adalah representasi kumpulan fakta
yang saling berhubungan dan disimpan bersama
sedemikian rupa tanpa pengulangan (redudansi) yang
tidak perlu, untuk memenuhi berbagai kebutuhan.
Basis data tersusun atas bagian yang disebut field dan
record yang tersimpan dalam sebuah file. Dalam
sebuah basis data, field diartikan sebagai identitas
spesifik dari sebuah objek. Field merupakan kesatuan
terkecil dari informasi dalam sebuah basis data.
Sekumpulan field yang saling berkaitan membentuk
record (Febrian, 2007).
2.8. MySQL
MySQL adalah database engine atau server
database yang mendukung bahasa database pencarian
SQL. SQL merupakan paket standar untuk
berkomunikasi dengan basis data manapun untuk
melakukan proses pencarian, penyimpanan dan
pengambilan data (Mufid D. Purwanto, 2002:100,
dalam Alif Amri Suri, 2009).
MySQL menyimpan data dalam bentuk file-file
di harddisk. Untuk dapat berjalan dengan baik, file-file
yang berisi basis data dari MySQL ini harus dipasang
pada harddisk lokal. Dengan menghindari pembagian
basis data pada beberapa harddisk di jaringan, dapat
menghindari juga penurunan kecepatan dalam
pengelolaan basis data tersebut.
3. HASIL DAN PEMBAHASAN
3.1. Analisa dan Perancangan Sistem
3.1.1. Analisa Sistem
Tahap analisa sistem merupakan tahap awal
dalam perancangan sebuah sistem, karena pada tahap
inilah diukur kebutuhan dari sistem yang akan
dirancang, serta dilakukan evaluasi terhadap seberapa
jauh kinerja sistem yang sedang berjalan saat ini,
identifikasi terhadap permasalahan-permasalahan yang
ada, dan langkah-langkah untuk kebutuhan
perancangan yang diharapkan dan pada akhirnya akan
sampai pada kesimpulan analisis yang menentukan
apakah sebuah sistem layak atau tidak untuk
digunakan
Edit
Galeri Foto
Tambah Album
Tambah
Galeri Foto
Edit Album
Hapus
Galeri Foto
Hapus Album
Tampil Data
Album
Tampil Data
Galeri Foto
Cari Data
Galeri Foto
Cari Data
Album
Edit
Playlist Video
Tambah
Playlist Video
Tampil Data
Playlist Video
Aktif/Nonaktifkan
Album
Hapus
Playlist Video
Aktif/Nonaktifkan
Playlist Video
Cari Data
Playlist Video
Tambah Video
Tampil Data
Video
Tampil Data
Agenda/Event
>
Cari Data
Agenda/Event
Hapus
Agenda/Event
Cari Data
Video
>
>
Hapus Video
>
Tampil Data
Komentar Video
Manajemen Foto
Manajemen
Agenda/Event
Edit
Agenda/Event
>
Tambah
Tag Video
Tambah
Agenda/Event
>
Cari Data
Komentar Video
3.1.2. Perancangan Sistem Menggunakan Unified
Modelling Language (UML)
Perancangan aplikasi Content Management
System (CMS) ini dirancang menggunakan alat bantu
berupa UML (Unified Modelling Language ) agar
mempermudah memindahkan konsep sistem yang
dirancang ke dalam bentuk program, dimana
perancangannya digambarkan dalam bentuk diagramdiagram berikut :
1. Use Case Diagram
Gambar 3.1 di bawah ini menggambarkan
interaksi aktor terhadap sistem E-News Campus.
Bagian aktor yang disimbolkan dalam bentuk
orang, bagian use case yang disimbolkan dalam
bentuk lingkaran, garis yang berbentuk tanda
panah, dan stereotype yang disimbolkan dengan
tanda ”” diakhirnya
serta dihubungkan dengan tanda panah putusputus. Stereotype ada dua, stereotype yang pertama
yaitu digunakan untuk menunjukkan
bahwa satu use case merupakan tambahan
fungsional dari use case yang lain jika kondisi atau
syarat tertentu yang dipenuhi sedangkan stereotype
yang kedua yaitu digunakan untuk
menggambarkan bahwa satu use case seluruhnya
merupakan fungsionalistas dari use case lainya
Aktor baik itu administrator maupun user
administrator untuk dapat mengakses menu yang
ada dalam sistem (ditandai dengan adanya tanda
panah menuju ke use case seperti Manajemen
Berita Kampu ) maka terlebih dahulu aktor tersebut
harus melakukan login, yang ditandai dengan
adanya tanda panah putus-putus menuju ke arah
login. Setelah login barulah aktor bisa mengakses
berbagai macam menu yang ada pada sistem sesuai
dengan hak akses yang dimiliki masing-masing
aktor.
Use case diagram aplikasi web Content
Management System (CMS) E-News Campus
dapat dilihat pada gambar 3.1 berikut ini :
Edit Video
>
>
Hapus
Tag Video
Manajemen
Video
Edit
Tag Video
>
Edit
Tag Berita
Tampil Data
Tag Video
Tambah
Tag Berita
Hapus
Tag Berita
Cari Data
Tag Video
Hapus Komentar
Video
Tambah
Komentar Berita
Edit
Subkategori Berita
Tampil Data
Subkategori Berita
Tambah
Subkategori Berita
Lihat Komentar
Berita
Edit Komentar
Video
Cari Data
Tag Berita
Lihat Subkategori
Berita
Tampil Data
Komentar Berita
Tampil Data
Tag Berita
Aktif/Nonaktifkan
Subkategori Berita
Lihat
Agenda/Event
Lihat Berita
Edit
Komentar Berita
Cari Data
Subkategori Berita
>
Aktif/Nonaktifkan
Komentar Berita
Lihat
Galeri Foto
Hapus
Komentar Berita
>
Cari Data
Komentar Berita
>
Lihat
Album Foto
Manajemen Berita
Tampil Data
Kategori Berita
Cari Data
Kategori Berita
User Administrator
>
Hapus
Kategori Berita
Aktif/Nonaktifkan
Kategori Berita
Lihat
Playlist Video
Login
Edit
Kategori Berita
Tambah
Kategori Berita
Cari
Data Berita
Tampil
Data Berita
Tambah Berita
Lihat Video
Pengunjung
Lihat
komentar Video
Hapus Berita
Edit Berita
Tambah
Iklan Sidebar
Edit
Iklan Sidebar
Hapus
Iklan Sidebar
Tambah
Komentar Video
Administrator
Ganti
Iklan Home
Tampil Data
Iklan Sidebar
Cari Data
Iklan Sidebar
>
Tampil Data
Iklan Home
>
Lihat
Iklan Sidebar
>
Fasilitas & Layanan
Cari Berita
Lihat Banner
>
Tambah Banner
Lihat
Iklan Home
Hapus Banner
Tambah Poling
Lihat
Hasil Poling
Edit Banner
Cari
Data Poling
Tampil
Data Banner
Lihat
Halaman Statis
Edit Poling
Cari
Data Banner
Lakukan Poling
Edit Identitas
Website
Aktif/Nonaktifkan
Poling
Ganti Logo
Website
Tampil
Data Poling
Tambah Modul
Tambah User
Hapus Modul
Blokir User
Ganti Background
Website
Edit Modul
Edit User
>
Tambah
Halaman Statis
>
Tampil
Data Modul
Tampil
Data Users
Cari
Data User
>
Cari
Data Modul
Hapus
Halaman Statis
Manajemen Users
Edit
Halaman Statis
>
>
>
>
Cari Data
Halaman Statis
Tampil Data
Halaman Statis
>
Setting Website
Tambah Template
>
Tambah
Level User
Edit Template
Hapus Template
Hapus
Level User
Edit
Level User
Hapus
Pesan Masuk
Tambah Menu
Aktif/Nonaktifkan
Level User
Cari Data
Level User
Tampil Data
Pesan Masuk
Aktifkan Template
Tampil Data
Template
Balas
Pesan Masuk
Edit Menu
Tampil
Data Menu
Edit Profil
Lihat Profil
Cari
Data Menu
Aktif/Nonaktifkan
Menu
Gambar 3.1. Use Case Diagram
2. Class Diagram
Class diagram memberikan gambaran
hubungan antara tabel-tabel yang ada pada
database. Masing-masing class memiliki attribut
dan metoda atau fungsi yang sesuai dengan proses
yang terjadi.
Class diagram aplikasi Content Mangement
System (CMS) pada E-News Campus dapat dilihat
pada gambar 3.2 berikut ini :
Gambar 3.2. Class Diagram
3. Sequence Diagram
Gambar 3.3 di bawah ini menjelaskan
skenario / serangkaian langkah-langkah yang
dilakukan admin atau user admin terhadap berita
kampus, yakni : menambah, mengubah,
menghapus, menampilkan sejumlah data berita
serta mencari data berita kampus..
Sequence diagram Manajemen Berita pada
aplikasi Content Management System (CMS) E-
News Campus dapat dilihat pada gambar 3.3
berikut ini :
Administrator
Sistem
User Administrator
Start
Start
login
login
Cek login
entry/ username
entry/ password
do/ login
entry/ username
entry/ password
do/ login
Validasi
Gagal login
Gagal login
Sukses login
: Administrator
Halaman Admin
: login
: Berita
Menampilkan hal aman
administrator
Logout
login( )
Kilk manajemen
berita
verifikasi( )
Menampilkan sub
menu pilihan
Kilk manajemen
berita
Sub menu berita
kampus aktif
Menampilkan data
berita kampus
Sub menu berita
kampus aktif
Tambah Berita
Menampilkan form
tambah berita
Tambah Berita
Tampil
Tambah Berita( )
Input berita
Edit Berita( )
Input berita
Batal
Batal
Simpan
Hapus Berita( )
Tampil Data Berita( )
Menyimpan ke
database
Edit Berita
Menampilkan
form edit berita
Lakukan pengeditan
berita
Batal
Cari Data Berita( )
Simpan
Klik Simpan
Klik Simpan
Edit Berita
Lakukan pengeditan
berita
Batal
Simpan
Simpan
Klik Simpan
Logout
Klik Simpan
Hapus berita
Klik kategori
berita
Gambar 3.3. Sequence Diagram Manajemen Berita
Kampus
Tambah
kategori berita
Menghapus
berita
Menampilkan
data kateg...
Menampilkan form
tambah kategori
Hapus berita
Klik kategori
berita
Tambah
kategori berita
Input kategori
berita
Input kategori
berita
Batal
Batal
Simpan
Klik Simpan
4. Collaboration Diagram
Gambar 3.4 di bawah ini menjelaskan urutan
langkah-langkah/informasi
kejadian
yang
dilakukan admin atau user admin terhadap berita
kampus, yakni : menambah berita, mengubah
berita, menghapus berita, menampilkan sejumlah
data berita serta mencari data berita kampus.
Collaboration diagram Manajemen Berita
pada aplikasi Content Management System (CMS)
E-News Campus dapat dilihat pada gambar 3.4
berikut ini :
Menampilkan form
edit kategori
Lakukan pengeditan
kategori
Batal
Siman
Klik Simpan
Edit kategori
berita
Lakukan pengeditan
kategori
Batal
Simpan
Simpan
Klik Simpan
Akti fkan/nonaktifkan
kategori berita
Klik subkategori
berita
Tambah
subkategori berita
Klik Simpan
Mengaktifkan/menonaktifkan
kategori
Menampilkan data
subkategori
Menampilkan form
tambah subkategori
Akti fkan/nonaktifkan
kategori berita
Klik subkategori
berita
Tambah
subkategori berita
Input subkategori
berita
Input subkategori
berita
Batal
Batal
Simpan
Simpan
Klik Simpan
Menyimpan ke
database
Edit subkategori
berita
Menampilkan form
edit subkategori
Klik Simpan
Edit subkategori
berita
Lakukan pengeditan
subkategori berita
Lakukan pengeditan
subkategori berita
Halaman Admin
2: verifikasi( )
Edit kategori
berita
Menyimpan ke
database
Simpan
Batal
Klik Simpan
Simpan
3: Tampil
Klik Simpan
4: Tambah Berita( )
5: Edit Berita( )
6: Hapus Berita( )
7: Tampil Data Berita( )
8: Cari Data Berita( )
1: login( )
Akti fkan/nonaktifkan
subkategori berita
Akti fkan/nonaktifkan
subkategori berita
Mengaktifkan/menonaktifkan
subkategori
Klik tag/label
berita
Klik tag/label
berita
Menampilkan
data tag berita
Tambah tag
berita
Menampilkan form
tambah tag berita
9: Logout
: Administrator
: login
: Berita
Tambah tag
berita
Logout
Input tag berita
Input tag berita
Batal
Simpan
Batal
Klik Simpan
Gambar 3.4. Collaboration Diagram Manajemen
Berita Kampus
Simpan
Klik Simpan
Edit tag berita
Menyimpan ke
database
Menampilkan
form edit tag
Edit tag berita
Lakukan pengeditan
tag berita
Batal
Lakukan pengeditan
tag berita
Simpan
Batal
5. Activity Diagram
Gambar 3.5 berikut ini menggambarkan
aktivitas yang dilakukan oleh admin atau user
admin terhadap sistem Content Management
System (CMS) E-News Campus yang dimulai
dengan melakukan login, kemudian mengelola
konten berita dengan memilih menu pilihan yang
ada di halaman administrator, dimana admin
memiliki hak akses sepenuhnya terhadap sistem
dalam mengelola dan mengisi konten berita seperti
: menambah, menghapus dan mengubah berita,
menambah,
mengubah
dan
mengaktifkan/menonaktifkan
kategori
&
subkategori berita, manambah, mengubah dan
menghapus tag/label berita, serta melihat dan
menghapus komentar berita.
Activity diagramnya dapat dilihat pada
gambar 3.5 berikut ini :
Klik Simpan
Simpan
Klik Simpan
Hapus tag
berita
Menghapus tag
berita
Klik komentar
berita
Menampilkan
data komen...
Hapus tag
berita
Klik komentar
berita
Lihat komentar
berita
Hapus
komentar berita
Lihat komentar
berita
Hapus
komentar berita
Menghapus
komentar berita
Finish
Finish
Gambar 3.5. Activity Diagram Manajemen Berita
Kampus
6. Statechart Diagram
Gambar 3.6 di bawah ini menjelaskan
bagaimana proses penambahan berita kampus.
Start
No
Hari, Tanggal Bulan Tahun
Pencarian
Selamat Pagi/Siang/Sore/Malam Pengunjung
Login
Home | Menu Utama & Sub Menu
Cek Login
entry/ us ernam e
entry/ pas s word
do/ login
SubKategori 2
SubKategori 1
Yes
berita
entry/ id_berita
entry/ id_kategori
entry/ id_s ubkategori
entry/ us ernam e
entry/ judul
entry/ s ub_judul
entry/ judul_s eo
entry/ headline
entry/ is i_berita
entry/ keterangan_gam bar
entry/ hari
entry/ tanggal
entry/ jam
entry/ gam bar
entry/ dibaca
entry/ tag
do/ Sim pan
Ø
Judul Berita
Ø
Judul Berita
Ø
Judul Berita
Ø
Judul Berita
Headline News
Navigator 3
Hari, Tanggal Bulan Tahun
Ø
Hari, Tanggal Bulan Tahun
Ø
Hari, Tanggal Bulan Tahun
Judul Berita
Judul Berita
Penggalan Isi Berita [Selengkapnya]
Navigator 4
Judul Berita
Navigator 5
Hari, Tanggal Bulan Tahun
Galeri Kampus
×
Ø
Judul Foto
Judul Foto
Judul Foto
Ø
Ø
Ø
Ø
Ø
Ø
Ø
Ø
Gambar Berita
Judul Berita
Hari, Tgl Bulan Tahun
Penggalan isi berita........
Judul
Judul
Judul
Judul
Judul
Judul
Judul
Judul
Tgl Mulai – Tgl Selesai
Gambar
Tema
Gambar
Tgl Mulai – Tgl Selesai
Gambar
Tgl Mulai – Tgl Selesai
Gambar
Tgl Mulai – Tgl Selesai
Tema
Tema
Video Terbaru
Judul Berita
Hari, Tgl Bulan Tahun
Penggalan isi berita
........... [Selengkapnya]
Berita
Berita
Berita
Berita
Berita
Agenda
Tema
Berita
Berita
Berita
Berita
Berita
Berita
Berita
Berita
SubKategori 8
SubKategori 7
Judul
Judul
Judul
Judul
Judul
Judul Foto
Lihat Semua
[Selengkapnya]
Ø
Ø
Ø
Ø
Ø
Judul Foto
SubKategori 4 | SubKategori 5 | SubKategori 6
SubKategori 3
Judul Berita
exit/ logout
Navigator 2
Gambar Berita
Hari, Tanggal Bulan Tahun
Gambar
Berita
Logout
Navigator 1
Hari, Tanggal Bulan Tahun
Gambar
Berita
Ø
Ø
Ø
Ø
Ø
....
....
....
....
....
Hari, Tgl Bulan Tahun
Penggalan isi berita
Video
........... [Selengkapnya]
Judul
Judul
Judul
Judul
Judul
Berita
Berita
Berita
Berita
Berita
....
....
....
....
....
Tanggal Upload
Judul Video
Poling
SubKategori 9
Finis h
Judul Berita
Gambar
Berita
Gambar 3.6. Statechart Diagram Manajemen Berita
Kampus
SubKategori 10
Ø
Ø
Ø
Ø
Ø
Judul Berita
Hari, Tgl Bulan Tahun
Penggalan isi berita
........... [Selengkapnya]
Judul
Judul
Judul
Judul
Judul
Berita
Berita
Berita
Berita
Berita
Gambar
Berita
Ø
Ø
Ø
Ø
Ø
....
....
....
....
....
Hari, Tgl Bulan Tahun
Penggalan isi berita
........... [Selengkapnya]
Judul
Judul
Judul
Judul
Judul
Berita
Berita
Berita
Berita
Berita
....
....
....
....
....
Siapakah Dosen Favorit anda?
A. Eka Praja WM, S.Kom, M.Kom
B. Ir. Sumijan, M.Sc
C. Dr. Gunadi Nurcahyo
D. Abulwafa, S.Kom, M.Kom
E. Syafri Arlies, S.Kom, M.Kom
Pilih
Lihat
Facebook Fan Page
Iklan Tengah 1
7. Deployment Diagram
Deployment diagram menggambarkan tata
letak sebuah sistem secara fisik dengan
menampakkan bagian-bagian software yang
berjalan pada bagian-bagian hardware, dimana
komponen sistem akan terletak pada mesin server
atau piranti keras, bagaimana kemampuan jaringan
pada lokasi tersebut, spesifikasi server , dan hal-hal
lain yang bersifat fisikal.
Pada perancangan sistem ini menggunakan
webserver Apache dan database server MySQL,
sedangkan user
dapat melakukan akses
menggunakan web browser seperti Mozilla
Firefox, Internet Explorer, Safari, Opera, Google
Chrome, dan lain-lain
client browser
google chrome, opera,
mozila, internet explorer
web server dan database server
apache web server, MySQL
SubKategori 11
SubKategori 12
Judul Berita
Gambar
Berita
Ø
Ø
Ø
Ø
Ø
Judul Berita
Hari, Tgl Bulan Tahun
Penggalan isi berita
........... [Selengkapnya]
Judul
Judul
Judul
Judul
Judul
Berita
Berita
Berita
Berita
Berita
Gambar
Berita
Ø
Ø
Ø
Ø
Ø
....
....
....
....
....
Hari, Tgl Bulan Tahun
Penggalan isi berita
........... [Selengkapnya]
Judul
Judul
Judul
Judul
Judul
Berita
Berita
Berita
Berita
Berita
....
....
....
....
....
Iklan Sidebar
Iklan Tengah 2
Profil Universitas | Portal Akademik | Hubungi Kami | RSS Feeds
e-Campus. Developed by Luri Aprinaldo
Copyright. 2013 - 2014 © Universitas Putra Indonesia "YPTK" Padang, Jl. Raya Lubuk Begalung Padang - Sumatera Barat
Telp : (+62751) 776666, (+62751) 775246, Fax : (+62751) 71913
Online : 1 | Kunjungan Hari Ini : 2 / 24374
Gambar 3.8. Desain Halaman Index
2. Desain Halaman Detail Berita
Halaman ini merupakan halaman yang
menampilkan detail isi berita kampus beserta
gambar. Pada halaman ini juga terdapat daftar
berita terkait dan fasilitas komentar berita.
Desain halaman detail berita website E-News
Campus dapat dilihat pada gambar 3.9 berikut ini :
Hari, Tanggal Bulan Tahun
Pencarian
Selamat Pagi/Siang/Sore/Malam Pengunjung
Home | Menu Utama & Sub Menu
< SubKategori
Gambar 3.7. Deployment Diagram
Terpopuler
Judul Berita
Gambar
Komentar
Dibaca : .... Pembaca
Judul Berita
Gambar
3.1.3. Desain Interface
Desain interface aplikasi Content Management
System (CMS) E-News Campus adalah sebagai
berikut :
1. Desain Halaman Index Website (dengan
template semi 3 kolom)
Halaman index merupakan halaman utama
yang menampilkan seluruh isi/konten website ENews Campus, mulai dari menu utama, sub menu,
kumpulan berita kampus, agenda/event, galeri foto,
playlist video, layanan iklan, dan lain-lain.
Desain halaman index website E-News
Campus dapat dilihat pada gambar 3.8 berikut ini :
Terkini
Judul Berita
Hari, Tgl Bulan Tahun-Jam | Dibaca : .... | Komentar : ....
Dibaca : .... Pembaca
Gambar Berita
Judul Berita
Detail isi berita, detail isi berita. Detail isi berita, detail isi berita
.....................................................................................................................................................
.....................................................................................................................................................
....................................................................................................................................................
Gambar
Dibaca : .... Pembaca
Gambar
Dibaca : .... Pembaca
Judul Berita
Judul Berita
Gambar
Dibaca : .... Pembaca
Baca juga :
Ø Judul Berita Terkait ...
Ø Judul Berita Terkait ...
Ø Dan seterusnya ...
Komentar Via Facebook :
Komentar Via Website :
Nama
Text (100)
Email/Website
Poling
Siapakah Dosen Favorit anda?
A. Eka Praja WM, S.Kom, M.Kom
B. Ir. Sumijan, M.Sc
C. Dr. Gunadi Nurcahyo
D. Abulwafa, S.Kom, M.Kom
E. Syafri Arlies, S.Kom, M.Kom
Pilih
Lihat
Text (100)
Iklan Sidebar
Komentar
Text (default)
Masukan .... Kode di atas
X(6)
Kirim Komentar
Profil Universitas | Portal Akademik | Hubungi Kami | RSS Feeds
e-Campus. Developed by Luri Aprinaldo
Copyright. 2013 - 2014 © Universitas Putra Indonesia "YPTK" Padang, Jl. Raya Lubuk Begalung Padang - Sumatera Barat
Telp : (+62751) 776666, (+62751) 775246, Fax : (+62751) 71913
Online : 1 | Kunjungan Hari Ini : 2 / 24374
Gambar 3.9. Desain Halaman Detail Berita
3. Desain Halaman Administrator
Halaman ini merupakan halaman utama
setelah admin & user admin berhasil melakukan
login. Pada halaman inilah admin mengelola dan
mengoperasikan seluruh kontent website, mulai
dari menambah menu utama website, menambah
modul, menambah dan mengganti template
website, mengganti background , mengganti
identitas dan logo website, menambah berita, galeri
foto, video, iklan, dan lain-lain.
Desain halaman administrator aplikasi
Content Management System (CMS) E-News
Campus dapat dilihat pada gambar 3.10 berikut ini
:
Komentar
Berita
E-Campus
Administrator
Dashboard
Manajemen Agenda
Manajemen Berita
Manajemen Video
Manajemen Foto
Pesan
Masuk
Fasilitas & Layanan
Hi, Nama Admin
Selamat pagi/Siang/Sore/Malam
Lihat Website | Logout
Manajemen Users
1. Tampilan Halaman Index Website
Halaman index merupakan halaman utama
yang menampilkan seluruh isi/konten website ENews Campus, mulai dari menu utama, sub menu,
berita kampus, agenda/event, galeri foto, playlist
video, layanan iklan, dan lain-lain.
Tampilan halaman index website E-News
Campus dapat dilihat pada gambar 3.12 berikut ini
:
Foto
Setting Website
Hai Admin, Silahkan klik Icon Menu yang berada di atas untuk mengelola konten website anda.
Atau untuk akses tercepat pilih icon-icon pada Control Panel di bawah ini : (Klik disini untuk menutup pesan ini)
Control Panel
Tambah
Berita Kampus
Tambah Sub
Kategori Berita
Tambah
Agenda Kampus
Tambah
Galeri Kampus
Tambah
Album Kampus
Tambah
Video
Tambah
Playlist Video
Tambah
File Download
Tambah
Poling
Tambah
User Admin
Tambah
Menu Website
Tambah
Halaman Web
Tambah
Modul Website
Ganti
Template Web
Ganti
Background Web
Ganti
Logo Website
Login Hari ini : Hari, Tanggal Bulan Tahun | Jam WIB
Pengunjung Website : ....
Total Kunjungan Hari Ini : ....
Copyright © 2013-2014 © E-News Campus Administrator by Luri Aprinaldo
Gambar 3.10. Desain Halaman Administrator
4. Desain Halaman Manajemen Berita
Halaman ini memiliki beberapa buah sub
menu dengan halaman yang berguna untuk
mengelola semua konten berita, mulai dari list data
berita, kategori berita, sub kategori berita, tag/label
berita dan komentar berita.
Desain halaman manajemen berita aplikasi
Content Management System (CMS) E-News
Campus dapat dilihat pada gambar 3.11 berikut ini
:
Komentar
Berita
E-Campus
Administrator
Dashboard
Manajemen Berita
Berita Kampus
Manajemen Agenda
Kategori Berita
Manajemen Video
Manajemen Foto
SubKategori Berita
Tag Berita
Hi, Nama Admin
Selamat pagi/Siang/Sore/Malam
Lihat Website | Logout
Pesan
Masuk
Fasilitas & Layanan
Manajemen Users
Foto
Setting Website
Komentar Berita
Tambah Berita
Berita Kampus
Lihat 10
No
Data
Judul Berita
Cari Data Text(default)
Diposting Oleh
Tanggal Posting
Aksi
01
Gambar 3.12. Tampilan Halaman Index Website
2. Tampilan Halaman Detail Berita
Halaman ini merupakan halaman yang
menampilkan detail isi berita kampus beserta
gambar. Pada halaman ini juga pengunjung dapat
memberikan komentar berita.
Tampilan halaman detail berita dapat dilihat
pada Gambar 3.13 berikut ini :
02
03
04
Dan seterusnya ....
Tampil 1 sampai 10 dari .... data
Awal
Kembali
1
2
3
....
Lanjut
Akhir
Copyright © 2013-2014 © E-News Campus Administrator by Luri Aprinaldo
Gambar 3.11. Desain Halaman Manajemen Berita
3.2. Implementasi dan Pengujian
Implementasi dan pengujian sistem bertujuan
untuk melihat apakah sistem yang dirancang sudah
sesuai dengan apa yang diharapkan, setelah
melakukan pengujian dan implementasi, kualitas
sebuah sistem akan terlihat. Tampilan program yaitu
merupakan sub bab yang menjelaskan tentang proses
dimulainya sampai program ini selesai di eksekusi,
point-point pada sub bab ini akan menjelaskan tentang
bagaimana sebuah form dijalankan dan apa saja fungsi
yang terdapat pada form tersebut.
Gambar 3.13. Tampilan Halaman Index Website
3. Tampilan Halaman Administrator
Halaman ini merupakan halaman utama
setelah admin & user admin berhasil melakukan
login. Pada halaman inilah admin mengelola dan
mengoperasikan seluruh kontent website, mulai
dari menambah menu utama website, menambah
modul, menambah dan mengganti template
website, mengganti background , mengganti
identitas dan logo website, menambah berita,
galeri foto, video, iklan, dan lain-lain.
Tampilan halaman utama administrator dapat
dilihat pada Gambar 3.14 berikut ini :
semua informasi berita kampus dapat
dipublikasikan dengan baik berdasarkan
kategori yang telah ditetapkan.
2. Dengan pemanfaatan aplikasi web Content
Management System (CMS) E-News Campus,
akan mempermudah penyampaian informasi
berita kampus secara lengkap kepada segenap
civitas akademikaUniversitas Putra Indonesia
“YPTK” Padang dan masyarakat umum.
3. Aplikasi web Content Management System
(CMS) E-News Campus, dapat berfungsi
sebagai sumber/wadah informasi bagi segenap
civitas akademika Universitas Putra Indonesia
“YPTK” Padang dan masyarakat umum.
DAFTAR REFERENSI
Gambar 3.14. Tampilan Halaman Administrator
4. Tampilan Halaman Manajemen Berita
Halaman ini adalah halaman yang berisi
semua list data berita kampus yang ditampilkan
dalam bentuk tabel sehingga memberi kemudahan
bagi admin dan user admin dalam melihat semua
data berita, mulai dari mencari berita, mengubah
berita hingga menghapus data berita. Pada
halaman ini juga terdapat sub menu untuk
mengelola konten kategori & sub kategori berita,
label berita dan komentar berita.
Tampilan halaman manajemen berita kampus
dapat dilihat pada Gambar 3.15 berikut ini :
Gambar 3.15. Tampilan Halaman Manajemen Berita
4. KESIMPULAN
Berdasarkan analisa dari system yang telah
dibuat, maka dapat ditarik kesimpulan sebagai
berikut :
1. Dengan pemanfaatan aplikasi web Content
Management System (CMS) E-News Campus,
semua data informasi berita dapat tersimpan
dengan baik dan terkomputerisasi, sehingga
[1]Mulyanto, Aunur R., 2008. Rekayasa Perangkat
Lunak Jilid 1 . Jakarta : Direktorat Pembinaan
Sekolah Menengah Kejuruan.
[2]Rizky, Soetam., 2011. Konsep Dasar Rekayasa
Perangkat Lunak. Yogyakarta : Prestasi
Pustaka.
[3]Sommerville, Ian., 2003. Software Engineering
(Rekayasa Perangkat Lunak). Jakarta :
Erlangga.
[4]Munawar., 2005. Pemodelan Visual Dengan UML.
Jakarta : Graha Ilmu.
[5]Komputer, Wahana., 2011. Mastering CMS
Programming With PHP & MySQL. Jakarta :
Andi Yogyakarta.
[6]Hakim, Lukmanul., 2010. Bikin Website Super
Keren dengan PHP dan Jquery. Yogyakarta :
Lokomedia.
[7]Antonius, Kemas Yunus., 2006. Content
Management System Dalam Dunia Usaha .
Available
from
http://www.ilmukomputer.com/.
[8]Raharjo, Budi, dkk., 2010. Modul Pemrograman
Web (HTML, PHP, MYSQL). Bandung :
Modula.
[9]Wirawan, Mochamad Joko Adi., 2009. Amazing
News Website with PHP,AJAX, and MY SQL.
Yogyakarta : ANDI Offset.
[10]Kadir, Abdul., 2008. Dasar Pemrograman Web
Dinamis Menggunakan PHP. Yogyakarta :
ANDI Offset.
[11]Sibero, Alexander FK.., 2011. Kitab Suci Web
Programming . Yogyakarta : Mediakom.
[12]Widigdo, Anon Kuncoro., 2006. Dasar
Pemrogaman PHP dan MySQL. Available
from http:///www.ilmukomputer.com/.
[13]Gunawan, Gun Gun., 2006. Web Content
Management System dengan PHP dan MySQL.
Available
from
http://www.ilmukomputer.com/.
[14]Dharwiyanti, Sri. Pengantar Unified Modelling
Language
(UML).
Available
from
http://ilmukomputer.org/2006/08/25/pengantaruml.
[15]Anonymous., 2004. Content Management System.
Available : http://www.cmswatch.com/.
[16]Wirawan, Iman Satya. 2006. Pengembangan
Content Management system Untuk Web
Pendidikan Tinggi. Fakultas Ilmu Komputer,
Institut Pertanian Bogor.
[17]Umar, Rusydi, dkk. 2004. Implementasi Content
Management System (CMS) Pada Situs Portal
Berita . Program Studi Teknik Informatika,
Universitas Ahmad Dahlan Yogyakarta.
[18]Fitriani, Nurul. 2011. Rancang Bangun Sisitem
Informasi Berbasis Web . Fakultas Sains dan
Teknologi,
Universitas
Islam
Syarif
Hidayatullah Jakarta.
[19]Pratama, Gian. 2008. Membangun Koran Online
Jabar . Fakultas Teknik dan Ilmu Komputer,
Universitas Komputer Indonesia Bandung.
[20]Hadi, Ido Priyana. 2003. Konsep Penulisan
Jurnalistik Masa Depan Desain Storyboard
Untuk Online News. Vol.5, No.1, Januari 2003
: 110-122.
BERBASIS CMS (CONTENT MANAGEMENT SYSTEM)
MENGGUNAKAN PHP, MYSQL DAN JQUERY
Luri Aprinaldo1), Sumijan2) , Eka Praja Wiyata Mandala3)
1)
2)
3)
email : luriaprinaldo@gmail.com / soe@upiyptk.org / eka_praja_199@yahoo.com
J u r u s a n T e k n i k I n fo r ma t i k a , F a k u l t a s I l m u K o m p u t e r , U n i v e r s i t a s P u t r a I n d o n e s i a
“YPTK” Padang
1)
Mahasiswa Teknik Informatika / 2) 3) Pembimbing Skripsi
Abstract - Information is a very necessary thing every person, so that the mode of delivery may influence a
person in obtaining such information. University Putra Indonesia "YPTK" Padang not have a special website to
inform the news to the students, so that the academic information such news announcements, news of academic,
non-academic news, news course, university news and other matters concerning the university cannot be
delivered in full and up to date information to the students or the general public. So in this research the authors
build a web application Content Management System (CMS) for campus news created using programming
languages PHP, MySQL and JQuery. The web application Content management System (CMS) is expected to
provide all the information complete news, rapid, precise, efficient and up to date information to the academic
community the University of Indonesia's son "YPTK" Padang and also the general public.
Keyword : E-News, Website, Content Mangement System
1. PENDAHULUAN
1.1. Latar Berlakang Masalah
Seiring dengan perkembangan Universitas Putra
Indonesia “YPTK” Padang, kebutuhan akan suatu
konsep dan mekanisme penyampaian informasi
kepada segenap civitas akademika Universitas Putra
Indonesia “YPTK” Padang dan masyarakat umum
sangatlah diperlukan. Seperti halnya penyampaian
informasi berita universitas berupa berita akademik
dan non akademik yang menjadi sumber informasi
bagi mahasiswa dan dosen serta informasi umum
lainnya bagi masyarakat yang ingin mengetahui
tentang informasi dan perkembangan universitas.
Sebagaimana yang diketahui, selama ini
Universitas Putra Indonesia “YPTK” Padang hanya
mengunakan website yang telah ada, yakni SISFO
(Sistem Informasi Akademik Kampus) yang
digunakan untuk melakukan kegiatan akademik
seperti PA online, pengisian KRS (Kartu Rencana
Studi) dan pencetakan kartu ujian, serta penyampaian
jadwal akademik lainnya kepada mahasiswa di papan
informasi kampus. Hal ini berbeda dengan universitas
lain yang ada di kota Padang dan seluruh kota di
Indonesia yang mana rata-rata universitas di Indonesia
mempunyai portal khusus dalam penyampaian
informasi berita universitas.
Timbul sebuah pertanyaan, apakah Universitas
Putra Indonesia “YPTK” Padang sudah mempunyai
portal khusus dalam penyampaian informasi berita
universitas? Berdasarkan paparan latar belakang di
atas dapat ditemukan jawaban, bahwa Universitas
Putra Indonesia belum mempunyai portal khusus
untuk hal tersebut. Maka dalam penelitian skripsi ini
penulis akan membahas tentang “Pembangunan dan
Pengembangan E-News Campus Berbasis CMS
(Content Mangement System) Menggunakan PHP,
MySQL dan JQuery”.
Hasil dari penelitian ini adalah sebuah aplikasi
Content Mangement System (CMS) berita kampus
atau sering dikenal dengan E-News Campus. Dengan
hasil penelitian ini diharapkan kampus UPI “YPTK”
Padang bisa menerapkan konsep penyampaian
informasi berbasis website, dan menjadikan portal
berita sebagai pelengkap dari konsep penyampaian
informasi yang ada di Universitas Putra Indonesia
sehingga informasi lebih mudah didapatkan oleh
segenap civitas akademika kampus UPI “YPTK”
Padang dan masyarakat umum.
1.2. Tujuan Penelitian
Selain untuk menyelesaikan Tugas Akhir,
adapun tujuan yang ingin dicapai melalui penelitian
ini antara lain :
1. Membangun sebuah aplikasi web Content
Management System (CMS) untuk berita kampus
Universitas Putra Indonesia “YPTK” Padang,
sehingga memberikan kemudahan bagi segenap
civitas akademika dan masyarakat umum dalam
memperoleh informasi yang dibutuhkan.
2. Menjadikan aplikasi web Content Management
System (CMS) ini sebagai portal khusus untuk
berita kampus, jadi segenap civitas akademika
Universitas Putra Indonesia “YPTK” Padang bisa
menerapkan konsep penyampaian informasi
berbasis web yang dipublish secara online,
sehingga berbagai macam informasi berita
mengenai kampus lebih mudah didapatkan.
3. Mempermudah pihak administrasi kampus dalam
menyampaikan informasi tentang universitas, baik
itu berupa pengumuman, berita akademik dan non
akademik, berita universitas dan lain-lain.
4. Mempermudah pihak administrasi kampus dalam
menampung dan mengelola berbagai macam
informasi berita, seperti : menambah informasi,
memperbaharui informasi, dan menghapus
informasi tersebut.
5. Memberikan informasi yang penuh melalui media
online di internet.
1.3. Manfaat Penelitian
Adapun manfaat dari penelitian ini antara lain :
1. Sebagai bahan masukan bagi kampus Universitas
Putra Indonesia “YPTK” Padang untuk
menghasilkan informasi yang lengkap, cepat dan
tepat untuk disampaikan kepada segenap civitas
akademika dan masyarakat umum.
2. Dapat meningkatkan efisiensi dan efektifitas
informasi yang dibutuhkan.
3. Menciptakan suatu sistem yang nantinya dapat
dimanfaatkan sebagai sumber informasi bagi
segenap civitas akademika dan masyarakat umum.
4. Meningkatkan
jaringan
dalam
pertukaran
informasi dan data bagi segenap civitas akademika
dan masyarakat luas.
1.4. Perumusan M asalah
Berdasarkan latar belakang yang telah diuraikan
diatas, maka ada beberapa masalah yang dapat
dikemukakan, yaitu :
1. Bagaimana aplikasi Content Management System
(CMS) E-News Campus yang diterapkan bisa
menampung dan menampilkan sejumlah informasi
berita kampus berdasarkan kategori berita yang
telah dikelompokkan, yakni berita akademik dan
non akademik yang mencakup berita program
studi masing-masing fakultas, Unit Kegiatan
Mahasiswa (UKM), pengumuman, agenda/event
kampus, informasi beasiswa dan lowongan kerja
serta informasi umum lainnya?
2. Bagaimana aplikasi Content Management System
(CMS) E-News Campus dapat mempermudah
penyampaian informasi berita kampus kepada
segenap civitas akademika Universitas Putra
Indonesia “YPTK” Padang dan masyarakat umum
berdasarkan kepada kategori berita yang telah
dikelompokkan, seperti berita program studi
masing-masing fakultas, Unit Kegiatan Mahasiswa
(UKM),
pengumuman, agenda/event kampus,
informasi beasiswa dan lowongan kerja serta
informasi umum lainnya?
3. Bagaimana aplikasi Content Management System
(CMS) E-News Campus dapat berfungsi sebagai
wadah/sumber informasi bagi segenap civitas
akademika dan masyarakat umum, sehingga
informasi yang dihasilkan selalu up to date?
2. LANDASAN TEORI
2.1. Rekayasa Perangkat Lunak
2.1.1. Definisi Rekayasa Perangkat Lunak
Istilah Rekayasa Perangkat Lunak (RPL)
secara umum disepakati sebagai terjemahan dari
istilah Software Engineering . Istilah Software
Engineering mulai dipopulerkan tahun 1968 pada
Software
Engineering
Conference
yang
diselenggarakan oleh NATO. Sebagian orang
mengartikan RPL hanya sebatas pada bagaimana
membuat program komputer. Padahal ada perbedaan
yang mendasar antara perangkat lunak (software) dan
program komputer (Aunur R. Mulyanto, 2008:2).
Secara teoristis, banyak sekali definisi rekayasa
perangkat lunak, baik yang berasal dari buku, teks
maupun lembaga mandiri seperti ACM dan IEEE atau
juga dari sumber internet. Berikut ini beberapa definisi
resmi dari rekayasa perangkat lunak atau software
engineering yang diambil dari berbagai sumber
(Soetam Rizky, 2011:17-21) yakni :
1. Menurut Ian sommerville
Rekayasa perangkat lunak adalah disiplin
ilmu yang membahas semua aspek produksi
perangkat lunak, mulai dari tahap awal spesifikasi
sistem sampai pemiliharaan sistem setelah
digunakan.
2. Menurut IEEE
Bahwa rekayasa perangkat lunak selain
sistematik juga merupakan pendekatan yang
seharusnya mampu untuk dikuantifikasikan alias
diukur keberadaannya dengan angka-angka atau
ukuran
tertentu
dalam
sebuah
proses
pengembangan perangkat lunak
3. Menurut Conger
Rekayasa perangkat lunak adalah sebuah
proses yang sistematik, bahkan hingga ke proses
saat perangkat lunak tidak lagi digunakan.
4. Menurut Bjorner
Rekayasa perangkat lunak lebih bertujuan ke
arah sebuah efisiensi pengerjaan perangkat lunak
dan mampu memuaskan pengguna dalam asumsi
telah mampu memecahkan masalah yang dihadapi
oleh pengguna.
Sehingga jika diterjemahkan secara harfiah,
maka definisi rekayasa perangkat lunak secara umum
adalah sebuah disiplin ilmu yang mencakup segala hal
yang berhubungan dengan proses pengembangan
perangkat lunak sejak dari tahap perancangan hingga
tahapan implementasi serta pasca implementasi
sehingga siklus hidup perangkat lunak dapat
berlangsung secara efisien dan terukur (Soetam Rizky,
2011:17-21).
2.1.2. Tujuan Rekayasa Perangkat Lunak
Secara umum tujuan rekayasa perangkat lunak
tidak berbeda dengan rekayasa yang lain. Tujuan dari
rekaya perangkat lunak adalah sebagai berikut (Aunur
R. Mulyanto, 2008) :
1. Memperoleh biaya produksi perangkat lunak yang
rendah.
2. Menghasilkan perangkat lunak yang kinerjanya
tinggi, handal dan tepat waktu.
3. Menghasilkan perangkat lunak yang dapat bekerja
pada berbagai jenis platform.
4. Menghasilkan perangkat lunak yang biaya
perawatannya rendah.
2.2. UML (Unified Modelling Language)
2.2.1. Definisi UML
UML (Unified Modelling Language) adalah
salah satu alat bantu yang sangat handal di dunia
pengembangan sistem yang berorientasi obyek. Hal
ini disebabkan karena UML menyediakan bahasa
pemodelan visual yang memungkinkan bagi
pengembang sistem untuk membuat cetak biru atas
visi mareka dalam bentuk yang baku, mudah
dimengerti serta dilengkapi dengan mekanisme yang
efektif
untuk
berbagi
(sharing )
dan
mengkomunikasikan rancangan mereka dengan yang
lain (Munawar, 2005:17).
2.2.2. Diagram UML
UML terdiri dari beberapa teknik notasi yang
berbentuk grafik untuk membuat visual model dari
software system. Pada UML versi 2, diagram UML
mempunyai 13 diagram, meliputi : Use Case Diagram,
StatechartDiagram, Sequence Diagram, Collaboration
Diagram, Activity Diagram, Component Diagram,
Deployment Diagram, Package Diagram, Objeck
Diagram, Communication Diagram, Composite
Structure Diagram, Interaction Overview Diagram,
dan Timing Diagram. Pada jurnal ini hanya akan
dibahas 7 buah diagram UML.
1. Use Case Diagram
Use case diagram adalah deskripsi fungsi dari
sebuah sistem dari perspektif penggguna. Use case
diagram bekerja dengan cara mendeskripsikan
tipikal interaksi antara user sebuah sistem dengan
sistemnya sendiri melaluhi sebuah cerita
bagaimana sebuah sistem dipakai (Munawar,
2005:63).
Use case diagram mempunyai beberapa
aspek penting yang ada dalam perancangan sebuah
system, aspek tersebut antara lain :
a. Actor
Actor merupakan bagian dari Use
Case yang
bertindak
sebagai subjek
(pelaku) dalam suatu proses.
b. Use Case
Use case adalah proses-proses yang
terjadi dalam suatu software. Use case juga
menggambarkan apa yang sedang dilakukan
oleh seorang actor .
c. Relasi
Relasi menggambarkan hubungan antara
actor dan use case. Relasi-relasi tersebut dapat
dibagi menjadi :
1). Undirectional Association
2). Generalization
3). Dependency
2. Class Diagram
Class diagram memberikan gambaran
hubungan antara tabel-tabel yang ada pada
database. Masing-masing class memiliki attribut
dan metoda atau fungsi yang sesuai dengan proses
yang terjadi.
Nama class menggunakan huruf besar di
awal kalimatnya dan diletakkan di atas kotak
(Munawar, 2005).
a. Attribut
Attribut adalah properti dari sebuah class.
Attribut ini melukiskan batas nilai yang
mungkin ada pada obyek dari class. Secara
konvensi, jika nama attribut terdiri atas satu
suku kata, maka ditulis dengan huruf kecil.
Akan tetapi jika nama attribut mengandung
lebih dari satu suku kata maka semua suku
kata digabungkan dengan suku kata pertama
menggunakan huruf kecil dan awal suku kata
berikutnya menggunakan huruf besar.
b. Operation
Operation adalah sesuatu yang bisa
dilakukan oleh sebuah class atau yang dapat
dilakukan untuk sebuah class. Seperti halnya
attribut, nama operation juga menggunakan
huruf kecil semua jika terdiri dari satu suku
kata. Akan tetapi jika lebih dari satu suku
kata, maka semua suku kata digabungkan
dengan suku kata pertama huruf kecil dan
huruf awal tiap suku berikutnya dengan huruf
besar.
3. Sequence Diagram
Sequence diagram menggambarkan interaksi
antar objek di dalam dan di sekitar sistem
(termasuk pengguna, display, dan sebagainya)
berupa message yang digambarkan terhadap
waktu. Sequence diagram biasa digunakan untuk
menggambarkan
skenario
atau
rangkaian
langkah-langkah
yang
dilakukan
sebagai
respons dari sebuah event untuk menghasilkan
output tertentu.
Diawali
dari apa
yang
menggerakkan aktivitas tersebut, proses dan
perubahan apa saja yang terjadi secara internal dan
output apa yang dihasilkan.
Masing-masing
objek, termasuk aktor,
memiliki lifeline vertikal. Message digambarkan
sebagai garis berpanah dari satu objek ke objek
lainnya. Pada fase desain berikutnya, message
akan dipetakan menjadi operasi / metoda dari class
(Munawar, 2005).
4. Collaboration Diagram
Collaboration
diagram
menunjukkan
message-message yang dikirimkan satu sama lain.
Collaboration diagram merupakan bentuk lain dari
sequence diagram. Bila sequence diagram
diorganisir menurut waktu, maka collaboration
diagram diorganisir menurut ruang/space.
Dengan
collaboration
diagram
memungkinkan untuk memodelkan pengiriman
sebuah message kebanyak objek pada class yang
sama. Demikian juga halnya untuk menunjukkan
adanya objek aktif yang mengendalikan aliran dari
message.
5. Statechart Diagram
Statechart diagram menelusuri individuindividu objek melalui keseluruhan daur hidupnya,
menspesifikasikan semua urutan yang mungkin
dari pesan-pesan yang akan diterima objek
tersebut, bersama-sama dengan tanggapan atas
pesan-pesan tersebut (Munawar, 2005).
Secara mudahnya statechart diagram
menggambarkan tentang kelakuan (behavior)
sistem yang akan dibangun.
6. Activity Diagram
Activity diagram adalah teknik untuk
mendiskrispikan logika prosedural, proses bisnis
dan aliran kerja dalam banyak kasus. Activity
diagram mempunyai peran seprti halnya flowchart,
akan tetapi perbedaanya dengan flowchart adalah
activity diagram bisa mendukung prilaku paralel
sedangkan flowchart tidak (Munawar, 2005:109).
Activity diagram bisa digunakan untuk
menunjukkan siapa yang mengerjakan apa, dengan
teknik partision.
7. Deployment Diagram
Deployment diagram menunjukkan tata letak
sebuah sistem secara fisik, menampakkan bagianbagian software yang berjalan pada bagian
hardware.
Deployment diagram menyediakan gambaran
bagaimana sistem secara fisik akan terlihat. Sistem
terdiri dari node-node dimana setiap node diwakili
untuk sebuah kubus. Garis yang menghubungkan
antara 2 kubus menunjukkan hubungan diantara
kedua node tersebut. Tipe node bisa berupa device
yang berwujud hardware dan bisa juga processor
atau execution environment (Munawar, 2005:109).
2.3. Content Management System (CMS)
2.3.1. Definisi CMS
Content
Management
System
(CMS)
merupakan sebuah aplikasi yang dapat digunakan
untuk mengubah, mengurutkan, mengelola berbagai
jenis konten atau informasi digital baik yang berupa
teks, gambar, suara, maupun video secara mudah,
cepat dan rapi pada sebuah sistem yang berjalan di
dalam website sesuai dengan keinginan dari orang
yang akan membuat aplikasi website tersebut
(Wahana Komputer, 2011).
Content Management System (CMS) adalah
kumpulan halaman web yang berfungsi sebagai ruang
kerja bagi admin untuk memanajemen, mengendalikan
dan mengolah isi sebuah website. CMS juga
memberikan kefleksibelan dalam mengatur alur kerja
atau ‘workflow’ dan hak akses, sehingga
memperbesar kesempatan berpartisipasi dari pengguna
dalam pengembangan website. Hal ini akan sangat
menguntungkan bila website yang dikelola memiliki
kompleksitas yang tinggi dan mengalami kemajuan
yang cukup pesat (Lukmanul Hakim, 2004:64).
Jadi dapat disimpulkan bahwa,
Content
Management System (CMS) adalah sebuah sistem
yang dapat membuat, mengatur, medestribusikan,
mempublikasikan dan menjaga informasi, dimana
admin tidak harus mengetahui tag HTML untuk
menjalankanya.
2.3.2. Manfaat Penggunaan Content Management
System (CMS)
Selain dari beberapa hal yang telah disebutkan
di atas, CMS juga dapat memberikan sejumlah
manfaat kepada penggunanya yang dapat dijabarkan
sebagai berikut (Kemas Yunus Antonius, dalam
www.ilmukomputer.com, 18/09/2006) :
1. Manajemen Data
Ini merupakan fungsi utama dari CMS.
Semua data/informasi baik yang telah ditampilkan
ataupun belum dapat diorganisasi dan disimpan
secara baik. Suatu waktu data/informasi tadi dapat
dipergunakan kembali sesuai dengan kebutuhan.
2. Mengatur Siklus Hidup Website
CMS memberikan fasilitas kepada admin
untuk mengelola bagian atau isi mana saja yang
akan ditampilkan, waktu penampilan dan lokasi
penampilan di website. Sebelum ditampilkan
bagian dan isi yang akan ditampilkan di-review
terlebih dulu sehingga terjamin kevaliditasannya.
3. Mendukung web templating dan standarisasi
Setiap halaman website yang dihasilkan
berasal dari template yang telah terlebih dahulu
disediakan oleh CMS. Selain dapat menjaga
konsistensi dari tampilan secara keseluruhan,
admin dapat berkonsentrasi secara penuh dalam
melaksanakan tugasnya menyediakan isi website.
Bila isi telah tersedia, maka proses publikasi dapat
berjalan dengan mudah karena sudah ada template
sebelumnya. Beberapa bagian dari website
biasanya telah ditetapkan sedemikian rupa
sehingga tidak dapat diubah begitu saja. Hal ini
dilakukan untuk memberikan standarisasi kepada
seluruh bagian dari website.
4. Personalisasi website
Sekali sebuah isi ditempatkan ke dalam CMS,
isi tersebut dapat ditampilkan sesuai dengan
kebutuhan. Terlebih lagi dengan kelebihan CMS
yang dapat memisahkan antara desain dan isi,
menyebabkan proses personalisasi dapat berjalan
dengan mudah.
5. Sindikasi
Sindikasi memberikan kemungkinan kepada
sebuah website untuk membagi isinya kepada
website-website yang lain. Format data yang
didukung juga cukup variatif, mulai dari rss, rdf,
xml hingga ‘backend scripting’. Sama halnya
dengan personalisasi, sindikasi juga dapat
dilakukan dengan mudah karena isi dan desain
telah dibuat terpisah.
6. Akuntabilitas
CMS mendukung alur kerja dan hak akses
yang
jelas
kepada
para
penggunanya,
data/informasi
yang
disampaikan
dapat
dipertanggung jawabkan dengan baik. Admin dan
user memiliki hak akses yang berbeda-beda.
Dengan demikian setiap perubahan yang terjadi di
website dapat ditelusuri dan diperbaiki seperlunya
dengan segera.
2.4. News (Berita)
2.4.1. Definisi Berita
Menurut
Kamus
Bahasa
Indonesia
Kontemporer (dalam Ido Priyana Hadi. “Konsep
Penulisan Jurnalistik Masa Depan Dan Desain
Storyboard Untuk Online News”. Vol.5. 2003:112)
berita adalah laporan atau pemberitahuan tentang
sesuatu kejadian atau peristiwa yang disampaikan
melalui orang lain, baik secara lisan maupun tertulis.
Pengertian berita (News) yang dimaksud adalah
penyajian informasi yang sudah, sedang dan akan
terjadi.
2.4.2. Berita Elektronik (E-News)
Berita elektronik (E-News) merupakan berita
yang menggunakan perangkat komputer yang
terhubung dengan jaringan komputer global. Terdapat
juga beberapa istilah untuk berita elektronik yaitu
online news atau digital news (dalam Ido Priyana
Hadi. “Konsep Penulisan Jurnalistik Masa Depan Dan
Desain Storyboard Untuk Online News”. Vol.5.
2003:112).
2.4.3. Berita Kampus
Berita kampus merupakan suatu terbitan yang
diusahakan oleh pihak perguruan tinggi yang isinya
merupakan berita dan informasi yang diperlukan oleh
masyarakat kampus. Umumnya isi berita kampus
menyangkut peraturan-peraturan, peristiwa yang
terjadi serta kegiatan-kegiatan yang dilakukan oleh
masyarakat kampus. (dalam Siswanto.”Peranan
Majalah Kampus Dalam Peningkatan Proses Belajar
Mengajar Pada Perguruan Tinggi Masa Kini dan Masa
Akan Datang”. Vol.5. No.21 – Juli 2007 : 100).
2.5. PHP
PHP adalah bahasa scripting server side yaitu
bahasa yang digunakan pada server tanpa perlu
melakukan kompilasi tetapi cukup menuliskan tulisan
dalan bentuk ASCII-nya saja. PHP disebut juga
sebagai bahasa interpreter (Mufid D Purwanto dan
Muhammad Tito Herlambang, 2002:200, dalam Alif
Amri Suri, 2009).
PHP sangat mirip dengan bahasa C, juga
mempunyai karakteristik yang mirip dengan Perl.
Bahasa pemrograman biasanya diterjemahkan atau
dikompilasi terlebih dahulu. Interpreter adalah sebuah
program yang digunakan untuk membaca file yang
berisi kode program yang akan dijalankan, kemudian
interpreter tersebut akan meminta CPU untuk
melakukan perintah yang diterimanya.
Contoh penulisan kode PHP sebagai berikut:
2.6. JQuery
jQuery adalah Javascript Library atau kumpulan
kode/fungsi Javascript siap pakai, sehingga
mempermudah dan mempercepat kita dalam membuat
kode Javascript (Lukmanul Hakim, 2010:3).
Kesimpulannya, jQuery menyerderhanakan kode
Javascript, hal ini sesuai dengan slogannya ‘write less,
do more’ cukup tulis sedikit, tapi bisa melakukan
banyak hal.
2.7. Database
Database adalah representasi kumpulan fakta
yang saling berhubungan dan disimpan bersama
sedemikian rupa tanpa pengulangan (redudansi) yang
tidak perlu, untuk memenuhi berbagai kebutuhan.
Basis data tersusun atas bagian yang disebut field dan
record yang tersimpan dalam sebuah file. Dalam
sebuah basis data, field diartikan sebagai identitas
spesifik dari sebuah objek. Field merupakan kesatuan
terkecil dari informasi dalam sebuah basis data.
Sekumpulan field yang saling berkaitan membentuk
record (Febrian, 2007).
2.8. MySQL
MySQL adalah database engine atau server
database yang mendukung bahasa database pencarian
SQL. SQL merupakan paket standar untuk
berkomunikasi dengan basis data manapun untuk
melakukan proses pencarian, penyimpanan dan
pengambilan data (Mufid D. Purwanto, 2002:100,
dalam Alif Amri Suri, 2009).
MySQL menyimpan data dalam bentuk file-file
di harddisk. Untuk dapat berjalan dengan baik, file-file
yang berisi basis data dari MySQL ini harus dipasang
pada harddisk lokal. Dengan menghindari pembagian
basis data pada beberapa harddisk di jaringan, dapat
menghindari juga penurunan kecepatan dalam
pengelolaan basis data tersebut.
3. HASIL DAN PEMBAHASAN
3.1. Analisa dan Perancangan Sistem
3.1.1. Analisa Sistem
Tahap analisa sistem merupakan tahap awal
dalam perancangan sebuah sistem, karena pada tahap
inilah diukur kebutuhan dari sistem yang akan
dirancang, serta dilakukan evaluasi terhadap seberapa
jauh kinerja sistem yang sedang berjalan saat ini,
identifikasi terhadap permasalahan-permasalahan yang
ada, dan langkah-langkah untuk kebutuhan
perancangan yang diharapkan dan pada akhirnya akan
sampai pada kesimpulan analisis yang menentukan
apakah sebuah sistem layak atau tidak untuk
digunakan
Edit
Galeri Foto
Tambah Album
Tambah
Galeri Foto
Edit Album
Hapus
Galeri Foto
Hapus Album
Tampil Data
Album
Tampil Data
Galeri Foto
Cari Data
Galeri Foto
Cari Data
Album
Edit
Playlist Video
Tambah
Playlist Video
Tampil Data
Playlist Video
Aktif/Nonaktifkan
Album
Hapus
Playlist Video
Aktif/Nonaktifkan
Playlist Video
Cari Data
Playlist Video
Tambah Video
Tampil Data
Video
Tampil Data
Agenda/Event
>
Cari Data
Agenda/Event
Hapus
Agenda/Event
Cari Data
Video
>
>
Hapus Video
>
Tampil Data
Komentar Video
Manajemen Foto
Manajemen
Agenda/Event
Edit
Agenda/Event
>
Tambah
Tag Video
Tambah
Agenda/Event
>
Cari Data
Komentar Video
3.1.2. Perancangan Sistem Menggunakan Unified
Modelling Language (UML)
Perancangan aplikasi Content Management
System (CMS) ini dirancang menggunakan alat bantu
berupa UML (Unified Modelling Language ) agar
mempermudah memindahkan konsep sistem yang
dirancang ke dalam bentuk program, dimana
perancangannya digambarkan dalam bentuk diagramdiagram berikut :
1. Use Case Diagram
Gambar 3.1 di bawah ini menggambarkan
interaksi aktor terhadap sistem E-News Campus.
Bagian aktor yang disimbolkan dalam bentuk
orang, bagian use case yang disimbolkan dalam
bentuk lingkaran, garis yang berbentuk tanda
panah, dan stereotype yang disimbolkan dengan
tanda ”” diakhirnya
serta dihubungkan dengan tanda panah putusputus. Stereotype ada dua, stereotype yang pertama
yaitu digunakan untuk menunjukkan
bahwa satu use case merupakan tambahan
fungsional dari use case yang lain jika kondisi atau
syarat tertentu yang dipenuhi sedangkan stereotype
yang kedua yaitu digunakan untuk
menggambarkan bahwa satu use case seluruhnya
merupakan fungsionalistas dari use case lainya
Aktor baik itu administrator maupun user
administrator untuk dapat mengakses menu yang
ada dalam sistem (ditandai dengan adanya tanda
panah menuju ke use case seperti Manajemen
Berita Kampu ) maka terlebih dahulu aktor tersebut
harus melakukan login, yang ditandai dengan
adanya tanda panah putus-putus menuju ke arah
login. Setelah login barulah aktor bisa mengakses
berbagai macam menu yang ada pada sistem sesuai
dengan hak akses yang dimiliki masing-masing
aktor.
Use case diagram aplikasi web Content
Management System (CMS) E-News Campus
dapat dilihat pada gambar 3.1 berikut ini :
Edit Video
>
>
Hapus
Tag Video
Manajemen
Video
Edit
Tag Video
>
Edit
Tag Berita
Tampil Data
Tag Video
Tambah
Tag Berita
Hapus
Tag Berita
Cari Data
Tag Video
Hapus Komentar
Video
Tambah
Komentar Berita
Edit
Subkategori Berita
Tampil Data
Subkategori Berita
Tambah
Subkategori Berita
Lihat Komentar
Berita
Edit Komentar
Video
Cari Data
Tag Berita
Lihat Subkategori
Berita
Tampil Data
Komentar Berita
Tampil Data
Tag Berita
Aktif/Nonaktifkan
Subkategori Berita
Lihat
Agenda/Event
Lihat Berita
Edit
Komentar Berita
Cari Data
Subkategori Berita
>
Aktif/Nonaktifkan
Komentar Berita
Lihat
Galeri Foto
Hapus
Komentar Berita
>
Cari Data
Komentar Berita
>
Lihat
Album Foto
Manajemen Berita
Tampil Data
Kategori Berita
Cari Data
Kategori Berita
User Administrator
>
Hapus
Kategori Berita
Aktif/Nonaktifkan
Kategori Berita
Lihat
Playlist Video
Login
Edit
Kategori Berita
Tambah
Kategori Berita
Cari
Data Berita
Tampil
Data Berita
Tambah Berita
Lihat Video
Pengunjung
Lihat
komentar Video
Hapus Berita
Edit Berita
Tambah
Iklan Sidebar
Edit
Iklan Sidebar
Hapus
Iklan Sidebar
Tambah
Komentar Video
Administrator
Ganti
Iklan Home
Tampil Data
Iklan Sidebar
Cari Data
Iklan Sidebar
>
Tampil Data
Iklan Home
>
Lihat
Iklan Sidebar
>
Fasilitas & Layanan
Cari Berita
Lihat Banner
>
Tambah Banner
Lihat
Iklan Home
Hapus Banner
Tambah Poling
Lihat
Hasil Poling
Edit Banner
Cari
Data Poling
Tampil
Data Banner
Lihat
Halaman Statis
Edit Poling
Cari
Data Banner
Lakukan Poling
Edit Identitas
Website
Aktif/Nonaktifkan
Poling
Ganti Logo
Website
Tampil
Data Poling
Tambah Modul
Tambah User
Hapus Modul
Blokir User
Ganti Background
Website
Edit Modul
Edit User
>
Tambah
Halaman Statis
>
Tampil
Data Modul
Tampil
Data Users
Cari
Data User
>
Cari
Data Modul
Hapus
Halaman Statis
Manajemen Users
Edit
Halaman Statis
>
>
>
>
Cari Data
Halaman Statis
Tampil Data
Halaman Statis
>
Setting Website
Tambah Template
>
Tambah
Level User
Edit Template
Hapus Template
Hapus
Level User
Edit
Level User
Hapus
Pesan Masuk
Tambah Menu
Aktif/Nonaktifkan
Level User
Cari Data
Level User
Tampil Data
Pesan Masuk
Aktifkan Template
Tampil Data
Template
Balas
Pesan Masuk
Edit Menu
Tampil
Data Menu
Edit Profil
Lihat Profil
Cari
Data Menu
Aktif/Nonaktifkan
Menu
Gambar 3.1. Use Case Diagram
2. Class Diagram
Class diagram memberikan gambaran
hubungan antara tabel-tabel yang ada pada
database. Masing-masing class memiliki attribut
dan metoda atau fungsi yang sesuai dengan proses
yang terjadi.
Class diagram aplikasi Content Mangement
System (CMS) pada E-News Campus dapat dilihat
pada gambar 3.2 berikut ini :
Gambar 3.2. Class Diagram
3. Sequence Diagram
Gambar 3.3 di bawah ini menjelaskan
skenario / serangkaian langkah-langkah yang
dilakukan admin atau user admin terhadap berita
kampus, yakni : menambah, mengubah,
menghapus, menampilkan sejumlah data berita
serta mencari data berita kampus..
Sequence diagram Manajemen Berita pada
aplikasi Content Management System (CMS) E-
News Campus dapat dilihat pada gambar 3.3
berikut ini :
Administrator
Sistem
User Administrator
Start
Start
login
login
Cek login
entry/ username
entry/ password
do/ login
entry/ username
entry/ password
do/ login
Validasi
Gagal login
Gagal login
Sukses login
: Administrator
Halaman Admin
: login
: Berita
Menampilkan hal aman
administrator
Logout
login( )
Kilk manajemen
berita
verifikasi( )
Menampilkan sub
menu pilihan
Kilk manajemen
berita
Sub menu berita
kampus aktif
Menampilkan data
berita kampus
Sub menu berita
kampus aktif
Tambah Berita
Menampilkan form
tambah berita
Tambah Berita
Tampil
Tambah Berita( )
Input berita
Edit Berita( )
Input berita
Batal
Batal
Simpan
Hapus Berita( )
Tampil Data Berita( )
Menyimpan ke
database
Edit Berita
Menampilkan
form edit berita
Lakukan pengeditan
berita
Batal
Cari Data Berita( )
Simpan
Klik Simpan
Klik Simpan
Edit Berita
Lakukan pengeditan
berita
Batal
Simpan
Simpan
Klik Simpan
Logout
Klik Simpan
Hapus berita
Klik kategori
berita
Gambar 3.3. Sequence Diagram Manajemen Berita
Kampus
Tambah
kategori berita
Menghapus
berita
Menampilkan
data kateg...
Menampilkan form
tambah kategori
Hapus berita
Klik kategori
berita
Tambah
kategori berita
Input kategori
berita
Input kategori
berita
Batal
Batal
Simpan
Klik Simpan
4. Collaboration Diagram
Gambar 3.4 di bawah ini menjelaskan urutan
langkah-langkah/informasi
kejadian
yang
dilakukan admin atau user admin terhadap berita
kampus, yakni : menambah berita, mengubah
berita, menghapus berita, menampilkan sejumlah
data berita serta mencari data berita kampus.
Collaboration diagram Manajemen Berita
pada aplikasi Content Management System (CMS)
E-News Campus dapat dilihat pada gambar 3.4
berikut ini :
Menampilkan form
edit kategori
Lakukan pengeditan
kategori
Batal
Siman
Klik Simpan
Edit kategori
berita
Lakukan pengeditan
kategori
Batal
Simpan
Simpan
Klik Simpan
Akti fkan/nonaktifkan
kategori berita
Klik subkategori
berita
Tambah
subkategori berita
Klik Simpan
Mengaktifkan/menonaktifkan
kategori
Menampilkan data
subkategori
Menampilkan form
tambah subkategori
Akti fkan/nonaktifkan
kategori berita
Klik subkategori
berita
Tambah
subkategori berita
Input subkategori
berita
Input subkategori
berita
Batal
Batal
Simpan
Simpan
Klik Simpan
Menyimpan ke
database
Edit subkategori
berita
Menampilkan form
edit subkategori
Klik Simpan
Edit subkategori
berita
Lakukan pengeditan
subkategori berita
Lakukan pengeditan
subkategori berita
Halaman Admin
2: verifikasi( )
Edit kategori
berita
Menyimpan ke
database
Simpan
Batal
Klik Simpan
Simpan
3: Tampil
Klik Simpan
4: Tambah Berita( )
5: Edit Berita( )
6: Hapus Berita( )
7: Tampil Data Berita( )
8: Cari Data Berita( )
1: login( )
Akti fkan/nonaktifkan
subkategori berita
Akti fkan/nonaktifkan
subkategori berita
Mengaktifkan/menonaktifkan
subkategori
Klik tag/label
berita
Klik tag/label
berita
Menampilkan
data tag berita
Tambah tag
berita
Menampilkan form
tambah tag berita
9: Logout
: Administrator
: login
: Berita
Tambah tag
berita
Logout
Input tag berita
Input tag berita
Batal
Simpan
Batal
Klik Simpan
Gambar 3.4. Collaboration Diagram Manajemen
Berita Kampus
Simpan
Klik Simpan
Edit tag berita
Menyimpan ke
database
Menampilkan
form edit tag
Edit tag berita
Lakukan pengeditan
tag berita
Batal
Lakukan pengeditan
tag berita
Simpan
Batal
5. Activity Diagram
Gambar 3.5 berikut ini menggambarkan
aktivitas yang dilakukan oleh admin atau user
admin terhadap sistem Content Management
System (CMS) E-News Campus yang dimulai
dengan melakukan login, kemudian mengelola
konten berita dengan memilih menu pilihan yang
ada di halaman administrator, dimana admin
memiliki hak akses sepenuhnya terhadap sistem
dalam mengelola dan mengisi konten berita seperti
: menambah, menghapus dan mengubah berita,
menambah,
mengubah
dan
mengaktifkan/menonaktifkan
kategori
&
subkategori berita, manambah, mengubah dan
menghapus tag/label berita, serta melihat dan
menghapus komentar berita.
Activity diagramnya dapat dilihat pada
gambar 3.5 berikut ini :
Klik Simpan
Simpan
Klik Simpan
Hapus tag
berita
Menghapus tag
berita
Klik komentar
berita
Menampilkan
data komen...
Hapus tag
berita
Klik komentar
berita
Lihat komentar
berita
Hapus
komentar berita
Lihat komentar
berita
Hapus
komentar berita
Menghapus
komentar berita
Finish
Finish
Gambar 3.5. Activity Diagram Manajemen Berita
Kampus
6. Statechart Diagram
Gambar 3.6 di bawah ini menjelaskan
bagaimana proses penambahan berita kampus.
Start
No
Hari, Tanggal Bulan Tahun
Pencarian
Selamat Pagi/Siang/Sore/Malam Pengunjung
Login
Home | Menu Utama & Sub Menu
Cek Login
entry/ us ernam e
entry/ pas s word
do/ login
SubKategori 2
SubKategori 1
Yes
berita
entry/ id_berita
entry/ id_kategori
entry/ id_s ubkategori
entry/ us ernam e
entry/ judul
entry/ s ub_judul
entry/ judul_s eo
entry/ headline
entry/ is i_berita
entry/ keterangan_gam bar
entry/ hari
entry/ tanggal
entry/ jam
entry/ gam bar
entry/ dibaca
entry/ tag
do/ Sim pan
Ø
Judul Berita
Ø
Judul Berita
Ø
Judul Berita
Ø
Judul Berita
Headline News
Navigator 3
Hari, Tanggal Bulan Tahun
Ø
Hari, Tanggal Bulan Tahun
Ø
Hari, Tanggal Bulan Tahun
Judul Berita
Judul Berita
Penggalan Isi Berita [Selengkapnya]
Navigator 4
Judul Berita
Navigator 5
Hari, Tanggal Bulan Tahun
Galeri Kampus
×
Ø
Judul Foto
Judul Foto
Judul Foto
Ø
Ø
Ø
Ø
Ø
Ø
Ø
Ø
Gambar Berita
Judul Berita
Hari, Tgl Bulan Tahun
Penggalan isi berita........
Judul
Judul
Judul
Judul
Judul
Judul
Judul
Judul
Tgl Mulai – Tgl Selesai
Gambar
Tema
Gambar
Tgl Mulai – Tgl Selesai
Gambar
Tgl Mulai – Tgl Selesai
Gambar
Tgl Mulai – Tgl Selesai
Tema
Tema
Video Terbaru
Judul Berita
Hari, Tgl Bulan Tahun
Penggalan isi berita
........... [Selengkapnya]
Berita
Berita
Berita
Berita
Berita
Agenda
Tema
Berita
Berita
Berita
Berita
Berita
Berita
Berita
Berita
SubKategori 8
SubKategori 7
Judul
Judul
Judul
Judul
Judul
Judul Foto
Lihat Semua
[Selengkapnya]
Ø
Ø
Ø
Ø
Ø
Judul Foto
SubKategori 4 | SubKategori 5 | SubKategori 6
SubKategori 3
Judul Berita
exit/ logout
Navigator 2
Gambar Berita
Hari, Tanggal Bulan Tahun
Gambar
Berita
Logout
Navigator 1
Hari, Tanggal Bulan Tahun
Gambar
Berita
Ø
Ø
Ø
Ø
Ø
....
....
....
....
....
Hari, Tgl Bulan Tahun
Penggalan isi berita
Video
........... [Selengkapnya]
Judul
Judul
Judul
Judul
Judul
Berita
Berita
Berita
Berita
Berita
....
....
....
....
....
Tanggal Upload
Judul Video
Poling
SubKategori 9
Finis h
Judul Berita
Gambar
Berita
Gambar 3.6. Statechart Diagram Manajemen Berita
Kampus
SubKategori 10
Ø
Ø
Ø
Ø
Ø
Judul Berita
Hari, Tgl Bulan Tahun
Penggalan isi berita
........... [Selengkapnya]
Judul
Judul
Judul
Judul
Judul
Berita
Berita
Berita
Berita
Berita
Gambar
Berita
Ø
Ø
Ø
Ø
Ø
....
....
....
....
....
Hari, Tgl Bulan Tahun
Penggalan isi berita
........... [Selengkapnya]
Judul
Judul
Judul
Judul
Judul
Berita
Berita
Berita
Berita
Berita
....
....
....
....
....
Siapakah Dosen Favorit anda?
A. Eka Praja WM, S.Kom, M.Kom
B. Ir. Sumijan, M.Sc
C. Dr. Gunadi Nurcahyo
D. Abulwafa, S.Kom, M.Kom
E. Syafri Arlies, S.Kom, M.Kom
Pilih
Lihat
Facebook Fan Page
Iklan Tengah 1
7. Deployment Diagram
Deployment diagram menggambarkan tata
letak sebuah sistem secara fisik dengan
menampakkan bagian-bagian software yang
berjalan pada bagian-bagian hardware, dimana
komponen sistem akan terletak pada mesin server
atau piranti keras, bagaimana kemampuan jaringan
pada lokasi tersebut, spesifikasi server , dan hal-hal
lain yang bersifat fisikal.
Pada perancangan sistem ini menggunakan
webserver Apache dan database server MySQL,
sedangkan user
dapat melakukan akses
menggunakan web browser seperti Mozilla
Firefox, Internet Explorer, Safari, Opera, Google
Chrome, dan lain-lain
client browser
google chrome, opera,
mozila, internet explorer
web server dan database server
apache web server, MySQL
SubKategori 11
SubKategori 12
Judul Berita
Gambar
Berita
Ø
Ø
Ø
Ø
Ø
Judul Berita
Hari, Tgl Bulan Tahun
Penggalan isi berita
........... [Selengkapnya]
Judul
Judul
Judul
Judul
Judul
Berita
Berita
Berita
Berita
Berita
Gambar
Berita
Ø
Ø
Ø
Ø
Ø
....
....
....
....
....
Hari, Tgl Bulan Tahun
Penggalan isi berita
........... [Selengkapnya]
Judul
Judul
Judul
Judul
Judul
Berita
Berita
Berita
Berita
Berita
....
....
....
....
....
Iklan Sidebar
Iklan Tengah 2
Profil Universitas | Portal Akademik | Hubungi Kami | RSS Feeds
e-Campus. Developed by Luri Aprinaldo
Copyright. 2013 - 2014 © Universitas Putra Indonesia "YPTK" Padang, Jl. Raya Lubuk Begalung Padang - Sumatera Barat
Telp : (+62751) 776666, (+62751) 775246, Fax : (+62751) 71913
Online : 1 | Kunjungan Hari Ini : 2 / 24374
Gambar 3.8. Desain Halaman Index
2. Desain Halaman Detail Berita
Halaman ini merupakan halaman yang
menampilkan detail isi berita kampus beserta
gambar. Pada halaman ini juga terdapat daftar
berita terkait dan fasilitas komentar berita.
Desain halaman detail berita website E-News
Campus dapat dilihat pada gambar 3.9 berikut ini :
Hari, Tanggal Bulan Tahun
Pencarian
Selamat Pagi/Siang/Sore/Malam Pengunjung
Home | Menu Utama & Sub Menu
< SubKategori
Gambar 3.7. Deployment Diagram
Terpopuler
Judul Berita
Gambar
Komentar
Dibaca : .... Pembaca
Judul Berita
Gambar
3.1.3. Desain Interface
Desain interface aplikasi Content Management
System (CMS) E-News Campus adalah sebagai
berikut :
1. Desain Halaman Index Website (dengan
template semi 3 kolom)
Halaman index merupakan halaman utama
yang menampilkan seluruh isi/konten website ENews Campus, mulai dari menu utama, sub menu,
kumpulan berita kampus, agenda/event, galeri foto,
playlist video, layanan iklan, dan lain-lain.
Desain halaman index website E-News
Campus dapat dilihat pada gambar 3.8 berikut ini :
Terkini
Judul Berita
Hari, Tgl Bulan Tahun-Jam | Dibaca : .... | Komentar : ....
Dibaca : .... Pembaca
Gambar Berita
Judul Berita
Detail isi berita, detail isi berita. Detail isi berita, detail isi berita
.....................................................................................................................................................
.....................................................................................................................................................
....................................................................................................................................................
Gambar
Dibaca : .... Pembaca
Gambar
Dibaca : .... Pembaca
Judul Berita
Judul Berita
Gambar
Dibaca : .... Pembaca
Baca juga :
Ø Judul Berita Terkait ...
Ø Judul Berita Terkait ...
Ø Dan seterusnya ...
Komentar Via Facebook :
Komentar Via Website :
Nama
Text (100)
Email/Website
Poling
Siapakah Dosen Favorit anda?
A. Eka Praja WM, S.Kom, M.Kom
B. Ir. Sumijan, M.Sc
C. Dr. Gunadi Nurcahyo
D. Abulwafa, S.Kom, M.Kom
E. Syafri Arlies, S.Kom, M.Kom
Pilih
Lihat
Text (100)
Iklan Sidebar
Komentar
Text (default)
Masukan .... Kode di atas
X(6)
Kirim Komentar
Profil Universitas | Portal Akademik | Hubungi Kami | RSS Feeds
e-Campus. Developed by Luri Aprinaldo
Copyright. 2013 - 2014 © Universitas Putra Indonesia "YPTK" Padang, Jl. Raya Lubuk Begalung Padang - Sumatera Barat
Telp : (+62751) 776666, (+62751) 775246, Fax : (+62751) 71913
Online : 1 | Kunjungan Hari Ini : 2 / 24374
Gambar 3.9. Desain Halaman Detail Berita
3. Desain Halaman Administrator
Halaman ini merupakan halaman utama
setelah admin & user admin berhasil melakukan
login. Pada halaman inilah admin mengelola dan
mengoperasikan seluruh kontent website, mulai
dari menambah menu utama website, menambah
modul, menambah dan mengganti template
website, mengganti background , mengganti
identitas dan logo website, menambah berita, galeri
foto, video, iklan, dan lain-lain.
Desain halaman administrator aplikasi
Content Management System (CMS) E-News
Campus dapat dilihat pada gambar 3.10 berikut ini
:
Komentar
Berita
E-Campus
Administrator
Dashboard
Manajemen Agenda
Manajemen Berita
Manajemen Video
Manajemen Foto
Pesan
Masuk
Fasilitas & Layanan
Hi, Nama Admin
Selamat pagi/Siang/Sore/Malam
Lihat Website | Logout
Manajemen Users
1. Tampilan Halaman Index Website
Halaman index merupakan halaman utama
yang menampilkan seluruh isi/konten website ENews Campus, mulai dari menu utama, sub menu,
berita kampus, agenda/event, galeri foto, playlist
video, layanan iklan, dan lain-lain.
Tampilan halaman index website E-News
Campus dapat dilihat pada gambar 3.12 berikut ini
:
Foto
Setting Website
Hai Admin, Silahkan klik Icon Menu yang berada di atas untuk mengelola konten website anda.
Atau untuk akses tercepat pilih icon-icon pada Control Panel di bawah ini : (Klik disini untuk menutup pesan ini)
Control Panel
Tambah
Berita Kampus
Tambah Sub
Kategori Berita
Tambah
Agenda Kampus
Tambah
Galeri Kampus
Tambah
Album Kampus
Tambah
Video
Tambah
Playlist Video
Tambah
File Download
Tambah
Poling
Tambah
User Admin
Tambah
Menu Website
Tambah
Halaman Web
Tambah
Modul Website
Ganti
Template Web
Ganti
Background Web
Ganti
Logo Website
Login Hari ini : Hari, Tanggal Bulan Tahun | Jam WIB
Pengunjung Website : ....
Total Kunjungan Hari Ini : ....
Copyright © 2013-2014 © E-News Campus Administrator by Luri Aprinaldo
Gambar 3.10. Desain Halaman Administrator
4. Desain Halaman Manajemen Berita
Halaman ini memiliki beberapa buah sub
menu dengan halaman yang berguna untuk
mengelola semua konten berita, mulai dari list data
berita, kategori berita, sub kategori berita, tag/label
berita dan komentar berita.
Desain halaman manajemen berita aplikasi
Content Management System (CMS) E-News
Campus dapat dilihat pada gambar 3.11 berikut ini
:
Komentar
Berita
E-Campus
Administrator
Dashboard
Manajemen Berita
Berita Kampus
Manajemen Agenda
Kategori Berita
Manajemen Video
Manajemen Foto
SubKategori Berita
Tag Berita
Hi, Nama Admin
Selamat pagi/Siang/Sore/Malam
Lihat Website | Logout
Pesan
Masuk
Fasilitas & Layanan
Manajemen Users
Foto
Setting Website
Komentar Berita
Tambah Berita
Berita Kampus
Lihat 10
No
Data
Judul Berita
Cari Data Text(default)
Diposting Oleh
Tanggal Posting
Aksi
01
Gambar 3.12. Tampilan Halaman Index Website
2. Tampilan Halaman Detail Berita
Halaman ini merupakan halaman yang
menampilkan detail isi berita kampus beserta
gambar. Pada halaman ini juga pengunjung dapat
memberikan komentar berita.
Tampilan halaman detail berita dapat dilihat
pada Gambar 3.13 berikut ini :
02
03
04
Dan seterusnya ....
Tampil 1 sampai 10 dari .... data
Awal
Kembali
1
2
3
....
Lanjut
Akhir
Copyright © 2013-2014 © E-News Campus Administrator by Luri Aprinaldo
Gambar 3.11. Desain Halaman Manajemen Berita
3.2. Implementasi dan Pengujian
Implementasi dan pengujian sistem bertujuan
untuk melihat apakah sistem yang dirancang sudah
sesuai dengan apa yang diharapkan, setelah
melakukan pengujian dan implementasi, kualitas
sebuah sistem akan terlihat. Tampilan program yaitu
merupakan sub bab yang menjelaskan tentang proses
dimulainya sampai program ini selesai di eksekusi,
point-point pada sub bab ini akan menjelaskan tentang
bagaimana sebuah form dijalankan dan apa saja fungsi
yang terdapat pada form tersebut.
Gambar 3.13. Tampilan Halaman Index Website
3. Tampilan Halaman Administrator
Halaman ini merupakan halaman utama
setelah admin & user admin berhasil melakukan
login. Pada halaman inilah admin mengelola dan
mengoperasikan seluruh kontent website, mulai
dari menambah menu utama website, menambah
modul, menambah dan mengganti template
website, mengganti background , mengganti
identitas dan logo website, menambah berita,
galeri foto, video, iklan, dan lain-lain.
Tampilan halaman utama administrator dapat
dilihat pada Gambar 3.14 berikut ini :
semua informasi berita kampus dapat
dipublikasikan dengan baik berdasarkan
kategori yang telah ditetapkan.
2. Dengan pemanfaatan aplikasi web Content
Management System (CMS) E-News Campus,
akan mempermudah penyampaian informasi
berita kampus secara lengkap kepada segenap
civitas akademikaUniversitas Putra Indonesia
“YPTK” Padang dan masyarakat umum.
3. Aplikasi web Content Management System
(CMS) E-News Campus, dapat berfungsi
sebagai sumber/wadah informasi bagi segenap
civitas akademika Universitas Putra Indonesia
“YPTK” Padang dan masyarakat umum.
DAFTAR REFERENSI
Gambar 3.14. Tampilan Halaman Administrator
4. Tampilan Halaman Manajemen Berita
Halaman ini adalah halaman yang berisi
semua list data berita kampus yang ditampilkan
dalam bentuk tabel sehingga memberi kemudahan
bagi admin dan user admin dalam melihat semua
data berita, mulai dari mencari berita, mengubah
berita hingga menghapus data berita. Pada
halaman ini juga terdapat sub menu untuk
mengelola konten kategori & sub kategori berita,
label berita dan komentar berita.
Tampilan halaman manajemen berita kampus
dapat dilihat pada Gambar 3.15 berikut ini :
Gambar 3.15. Tampilan Halaman Manajemen Berita
4. KESIMPULAN
Berdasarkan analisa dari system yang telah
dibuat, maka dapat ditarik kesimpulan sebagai
berikut :
1. Dengan pemanfaatan aplikasi web Content
Management System (CMS) E-News Campus,
semua data informasi berita dapat tersimpan
dengan baik dan terkomputerisasi, sehingga
[1]Mulyanto, Aunur R., 2008. Rekayasa Perangkat
Lunak Jilid 1 . Jakarta : Direktorat Pembinaan
Sekolah Menengah Kejuruan.
[2]Rizky, Soetam., 2011. Konsep Dasar Rekayasa
Perangkat Lunak. Yogyakarta : Prestasi
Pustaka.
[3]Sommerville, Ian., 2003. Software Engineering
(Rekayasa Perangkat Lunak). Jakarta :
Erlangga.
[4]Munawar., 2005. Pemodelan Visual Dengan UML.
Jakarta : Graha Ilmu.
[5]Komputer, Wahana., 2011. Mastering CMS
Programming With PHP & MySQL. Jakarta :
Andi Yogyakarta.
[6]Hakim, Lukmanul., 2010. Bikin Website Super
Keren dengan PHP dan Jquery. Yogyakarta :
Lokomedia.
[7]Antonius, Kemas Yunus., 2006. Content
Management System Dalam Dunia Usaha .
Available
from
http://www.ilmukomputer.com/.
[8]Raharjo, Budi, dkk., 2010. Modul Pemrograman
Web (HTML, PHP, MYSQL). Bandung :
Modula.
[9]Wirawan, Mochamad Joko Adi., 2009. Amazing
News Website with PHP,AJAX, and MY SQL.
Yogyakarta : ANDI Offset.
[10]Kadir, Abdul., 2008. Dasar Pemrograman Web
Dinamis Menggunakan PHP. Yogyakarta :
ANDI Offset.
[11]Sibero, Alexander FK.., 2011. Kitab Suci Web
Programming . Yogyakarta : Mediakom.
[12]Widigdo, Anon Kuncoro., 2006. Dasar
Pemrogaman PHP dan MySQL. Available
from http:///www.ilmukomputer.com/.
[13]Gunawan, Gun Gun., 2006. Web Content
Management System dengan PHP dan MySQL.
Available
from
http://www.ilmukomputer.com/.
[14]Dharwiyanti, Sri. Pengantar Unified Modelling
Language
(UML).
Available
from
http://ilmukomputer.org/2006/08/25/pengantaruml.
[15]Anonymous., 2004. Content Management System.
Available : http://www.cmswatch.com/.
[16]Wirawan, Iman Satya. 2006. Pengembangan
Content Management system Untuk Web
Pendidikan Tinggi. Fakultas Ilmu Komputer,
Institut Pertanian Bogor.
[17]Umar, Rusydi, dkk. 2004. Implementasi Content
Management System (CMS) Pada Situs Portal
Berita . Program Studi Teknik Informatika,
Universitas Ahmad Dahlan Yogyakarta.
[18]Fitriani, Nurul. 2011. Rancang Bangun Sisitem
Informasi Berbasis Web . Fakultas Sains dan
Teknologi,
Universitas
Islam
Syarif
Hidayatullah Jakarta.
[19]Pratama, Gian. 2008. Membangun Koran Online
Jabar . Fakultas Teknik dan Ilmu Komputer,
Universitas Komputer Indonesia Bandung.
[20]Hadi, Ido Priyana. 2003. Konsep Penulisan
Jurnalistik Masa Depan Desain Storyboard
Untuk Online News. Vol.5, No.1, Januari 2003
: 110-122.