SISTEM INFORMASI SMPN 4 WONOGIRI BERBASIS WEB SEBAGAI SARANA INFORMASI DAN PROMOSI SEKOLAH MENGGUNAKAN
FRAMEWORK BOOTSTRAP
NASKAH PUBLIKASI
diajukan oleh
Sanita Yuwana Septavi 10.12.5238
JURUSAN SISTEM INFORMASI SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER
AMIKOM YOGYAKARTA YOGYAKARTA
2013
ii
iii
INFORMATION SYSTEM SMPN 4 WONOGIRI WEB BASED AS INFORMATION MEANS AND SCHOOL PROMOTION USING BOOTSTRAP
FRAMEWORK
SISTEM INFORMASI SMPN 4 WONOGIRI BERBASIS WEB SEBAGAI SARANA INFORMASI DAN PROMOSI SEKOLAH MENGGUNAKAN
FRAMEWORK BOOTSTRAP
Sanita Yuwana Septavi Erik Hadi Saputra
Jurusan Sistem Informasi STMIK AMIKOM YOGYAKARTA
ABSTRACT
Internet is one of the biggest media in the world. Internet can be used as a driver of future educational advancement. It can be considered as a huge source of information. School website is an opportunity to provide the information and documentation of a school. Today, the existence of school website in education is very important and influential in advancing the quality of education. Because school website can also be used as media promotion of the fastest, accurate, inexpensive and easy.
The facilities in school is still simple, such as in SMPN 4 Wonogiri, this school is still using manual way to deliver the information, which is for the community or students who need the information about the school, they have to come and ask to the teachers directly. That is why the way to deliver the information is less of effective and efficient.
With the school website service in SMPN 4 Wonogiri, can increase the number of students, and SMPN 4 Wonogiri will be better known to the community and can facilitate the public and students in finding information about SMPN 4 Wonogiri. Keyword: Promotion, school Website
1
1. Pendahuluan Pesatnya perkembangan teknologi informasi membuat masyarakat semakin akrab
dengan dengan situs-situs website, karena berfungsi memberikan informasi dengan cepat,
lengkap dan tidak terlalu banyak mengeluarkan biaya. Internet digunakan untuk keperluan
informasi yang dikemas lebih praktis dalam pencarian sebuah informasi yang dibutuhkan.
Informasi merupakan hal yang sangat penting dan dibutuhkan di dalam suatu organisasi
maupun instansi karena merupakan kebutuhan bagi manajemen di dalam pengambilan
keputusan. Informasi yang bisa diakses dengan cepat dan mudah merupakan hal yang sangat
dibutuhkan pada masa kini.
Bidang yang mendapatkan dampak cukup berarti dari perkembangan teknologi
informasi adalah bidang pendidikan, dimana pada dasarnya pendidikan merupakan suatu
proses komunikasi dan informasi dari pendidik kepada peserta didik yang berisi informasi-
informasi pendidikan. Informasi mengenai sekolah yang dapat diakses dimana saja tanpa harus
datang ke sekolah atau bertanya kepada orang lain.
Dalam penyampaian informasi SMP Negeri 4 Wonogiri selalu memberikan informasi
tentang sekolah dan kegiatan siswa disekolah. Namun penyampaian informasi pada SMPN 4
Wonogiri masih secara manual yaitu bagi masyarakat atau siswa yang membutuhkan informasi
sekolah harus datang dan bertanya langsung ke sekolah, sehingga menyebabkan
penyampaian informasi kurang efektif dan efisien karena penyampaian informasi seperti itu
tidak akan mencapai jangkauan yang luas. Selain itu SMPN 4 Wonogiri menginformasikan
sekolah melalui brosur dan spanduk, untuk mengenalkan pada masyarakat luas. Akan tetapi
hal ini kurang optimal dalam mempromosikan sekolah untuk menjaring siswa baru dan
menginformasikan berita dan kegiatan-kegiatan yang ada disekolah. Dengan adanya website
sekolah, SMPN 4 Wonogiri dapat meningkatkan pelayanan informasi dengan baik dan untuk
mempermudah, mempercepat sekaligus menghemat biaya dalam melakukan pengaksesan
informasi oleh masyarakat dan siswa.
2. Landasan Teori 2.1 Konsep Dasar Sistem 2.1.1 Pengertian Sistem
Sistem adalah sekumpulan objek – objek yang saling berelasi dan berinteraksi serta
huungan antar objek bisa dilihat sebagai satu kestuan yang dirancang untuk mencapai satu
tujuan. Sistem terdiri dari unsur-unsur seperti masukan (Input), pengolahan (Processing), serta
keluaran (Output).
Suatu sistem mempunyai karakteristik atau sifat-sifat yang tertentu, yaitu:
1. Komponen Sistem
Suatu sistem terdiri dari sejumlah komponen (component) yang saling berinteraksi,
yang artinya saling bekerja sama membentuk satu kesatuan. Komponen-komponen
sistem atau elemen-elemen sistem dapat berupa suatu subsistem atau bagian-bagian
2
dari sistem. Setiap sistem tidak perduli betapun kecilnya, selalu mengandung
komponen-komponen atau subsistem-subsistem.
2. Batas Sistem
Batas sistem (boundary) merupakan daerah yang membatasi antara suatu sistem
dengan sistem yang lainnya atau dengan lingkungan luarnya. Batas sistem ini
memungkinkan suatu sistem dipandang sebagai satu kesatuan. Batas suatu sistem
menunjukkan ruang lingkup (scope) dari sistem tersebut.
3. Lingkungan Luar
Lingkungan luar (environment) dari suatu sistem adalah apapun diluar batas dari sistem
yang mempengaruhi operasi sistem. Lingkungan luar yang menguntungkan merupakan
energi dari sistem dan dengan demikian harus tetap dijaga dan dipelihara. Sedangkan
lingkungan luar yang merugikan harus ditahan dan dikendalikan, kalau tidak maka akan
mengganggu kelangsungan hidup dari sistem.
4. Penghubung Sistem
Penghubung (interface) merupakan media penghubung antara satu subsistem dengan
subsistem lainnya.
5. Masukan Sistem
Masukan (input) adalah energi yang dimasukkan ke dalam sistem. Masukan dapat
berupa masukan perawatan (maintenance input) dan masukan sinyal (signal input).
Maitenance input adalah energi yang dimasukan supaya sistem tersebut dapat
beroperasi. Signal input adalah energi yang diproses untuk didapatkan keluaran.
6. Keluaran Sistem
Keluaran (output) adalah hasil dari energi yang diolah dan diklasifikasikan menjadi
keluaran yang berguna dan sisa pembuangan.
7. Pengolah Sistem
Suatu sistem dapat mempunyai suatu bagian pengolah yang akan merubah masukan
menjadi keluaran.
8. Sasaran Sistem
Suatu sistem pasti mempunyai tujuan (goal) atau sasaran (objective). Suatu sistem
dikatakan berhasil bila mengenai sasaran atau tujuannya.
2.2 Konsep Dasar Sistem Informasi 2.2.1 Pengertian Sistem Informasi
Sistem informasi adalah suatu sistem di dalam suatu organisasi yang
mempertemukan kebutuhan pengolahan transaksi harian, mendukung operasi, bersifat
manajerial dan kegiatan strategi dari suatu organisasi dan menyediakan pihak luar tertentu
dengan laporan-laporan yang diperlukan. (Leitch & Davis, 1983)
2.3 Promosi Promosi merupakan aktifitas penyampaian informasi atau pesan kepada masyarakat
dan biasa dikatakan sebuah usaha untuk mengiklankan produk. Iklan atau periklanan adalah
3
pengguna media bayaran oleh seorang penjual untuk mengkomunikasikan informasi persuasif
tentang produk (ide, barang, jasa) ataupun organisasi dan merupakan alat promosi yang kuat
(Suyanto.2003).
2.4 Perangkat Lunak yang Digunakan
2.4.1 Framework Bootstrap Bootstrap merupakan sebuah framework CSS dari twitter, yang menyediakan kumpulan
komponen-komponen antarmuka dasar pada web yang telah dirancang sedemikian rupa untuk
digunakan bersama-sama. Selain komponen antarmuka, Bootstrap juga menyediakan sarana
untuk membangun layout halaman dengan mudah dan rapi, serta modifikasi pada tampilan
dasar HTML untuk membuat seluruh halaman web yang dikembangkan senada dengan
komponen-komponen lainnya.
Gambar 2.2 Struktur Bootstrap
Penjelasan :
1. Yang di dalam folder css
a. Bootstrap-responsive.css : file ini digunakan untuk mensetting layout halaman website
dan keunggulannya file ini dapat menyesuaikan sendiri ukuran website pada device
yang digunakan seperti desktop, I-phone, tablet,dan lainnya.
b. Bootstrap.css : file ini digunakan untuk mensetting keseluruhan style css di dalam
bootstrap tersebut.
c. Bootstrap-responsive.min.css dan bootstrap.min.css : merupakan file hasil compress
sehingga ukuran file lebih diperkecil, fungsi tetap sama dengan asilnya.
2. Yang di dalam folder img
a. File pertama merupakan image icon yang digunakan untuk icon – icon di bootstrap.
b. File kedua sama dengan yang sebelumnya, namun background yang digunakan
berwarna putih sedangkan yang sebelumya menggunakan background hitam.
3. Yang di dalam folder js
a. Bootstrap.js : merupakan file – file pengaturan javascript yang mengatur semua event di
dalam bootstrap.
b. Bootstrap.min.js : merupakan file – file hasil compress dari Bootstrap.js
4
c. Jquery.js : file ini digunakan untuk memberikan sumber daya script di dalam
Bootstrap.js
3. Analisis dan Perancangan 3.1 Analisis Sistem
Dalam tahap analisis sistem dalam penelitian ini terdapat langkah-langkah dasar yang
dilakukan oleh analis sistem, yaitu :
a. Identifikasi Masalah (Identify)
b. Memahami kerja sistem yang ada (Understand)
c. Menganalisis sistem (Analize)
d. Membuat laporan (Report)
3.2 Perancangan 3.2.1 DFD (Data Flow Diagram)
Data Flow Diagram (DFD) atau Diagram Alir Data dipergunakan untuk
mendokumentasikan proses aliran data sistem. Pada sistem informasi sekolah berbasis web ini
dapat digambarkan DFD sebagai berikut :
AdminWebsite SMPN 4
Wonogiri
Data sejarahData visimisi
Data guruData ekstrakulikuler
Data fasilitasData contactusData informasi
Data beritaData slideshowData download
Data albumData foto
Data siswaData bk
Guest
Informasi sejarahInformasi visimisi
Informasi guruInformasi ekstrakulikuler
Informasi fasilitasInformasi contactusInformasi informasi
Informasi beritaInformasi slideshowInformasi download
Informasi albumInformasi foto
Informasi siswaInformasi bk
Bk
Siswa
Data pesan
Data pesanData siswa
Informasi pesan
Informasi pesan
Gambar 3.1 Context Diagram
5
3.2.2 Perancangan Desain Halaman Website
HOME PROFIL PSB INFORMASI BERITA GALERI DOWNLOAD CONTACT US
Sejarah Singkat Profil
Sejarah singkat Visi dan Misi Guru Ekstrakurikuler Fasilitas
Pengumuman
6
4. Hasil Penelitian dan Pembahasan 4.1 Implementasi
Tahap implementasi sistem (system implementation) adalah tahap meletakkan sistem
supaya siap dioperasikan. (Jogiyanto, 1990) Tahap ini termasuk pembuatan database,
pembuatan program, dan pembuatan layout halaman aplikasi.
4.2 Pembahasan Database
Gambar 4.1 Tampilan Pembuatan Database
Dalam pembuatan database meliputi penentuan tipe data tiap field dan
pembuatannya. Untuk membuat database digunakan phpMyAdmin, karena phpmyadmin
memberikan kemudahan dengan tampilan grafis. Pertama kali kita buat database. Database
yang dibuat untuk sistem ini adalah smp4wonogiri. Untuk membuat database kita tinggal
mengisi textfield create new database pada phpMyAdmin dan tekan create.
4.3 Pembahasan Dan Listing Program 4.3.1 Halaman Menu Galeri
Halaman ini berisi foto yang diupload oleh admin. Pengujung dapat melihat foto
sesuai album yang dipilih dengan klik di salah satu album foto.
7
Gambar 4.2 Halaman Galeri
Script: echo ' <!--- Page ----> <div id="post"> <div class="container"> <div class="span12 post"> // mengambil data foto dari database $query = mysql_query("SELECT * FROM `foto` WHERE id_album = '" . $id . "'"); // menampilkan data foto dari database while ($baris = mysql_fetch_array($query)) { echo ' <div class="span3 box"> <img src="./assets/upload/foto/' . $baris['foto'] . '" alt="" class="img-rounded"> </div> '; } echo ' </div>
8
</div> </div> <!--- End Page ----> ';
Gambar 4.3 Kode Halaman Galeri
4.4 Pembahasan Tampilan 4.4.1 Halaman Depan Pada halaman ini pengunjung disajikan beberapa menu-menu utama,serta update berita dan
informasi terbaru.
Gambar 4.4 Halaman Depan
9
5. Penutup 5.1 Kesimpulan
Berdasarkan uraian-uraian yang telah penulis jelaskan pada bab-bab terdahulu dan
pembuatan sistem, maka penulis dapat mengambil kesimpulan sebagai berikut:
1. Penyampaian informasi di SMP Negeri 4 Wonogiri lebih cepat dan dapat dikenal oleh
masyarakat luas dikarenakan menggunakan media website sebagai media penyampaian
informasi dan promosi. Untuk menghasilkan informasi yang cepat dan akurat dengan
menggunakan website melewati proses analisis perancangan menggunakan metode
SWOT dengan analisis kebutuhan fungsional dan nonfungsional kemudian menggunakan
analisis biaya dan manfaat dengan kelayakan ekonomi, NPV (Net Present Value) ,PP
(Payback Periode), dan ROI (Return On Investment) dan dilakukan uji coba menggunakan
White box testing dan Black box Testing.
2. Kelebihan yang di peroleh dengan adaya sistem informasi berbasis website di SMPN 4
Wonogiri adalah :
Dengan adanya website sekolah, SMPN 4 Wonogiri dapat meningkatkan pelayanan
informasi dengan baik dan untuk mempermudah, mempercepat sekaligus menghemat
biaya dalam melakukan pengaksesan informasi oleh masyarakat dan siswa.
3. Situs di SMPN 4 Wonogiri mempunyai beberapa fasilitas yaitu :
a. Penambahan akses bagi guru Bimbingan konseling dan siswa digunakan untuk
mengirim pesan. Setiap guru BK dan siswa diberikan username dan password.
Sehingga ketika siswa ingin melakukan bimbingan online kepada guru BK yang dipilih
harus melakukan login terlebih dahulu.
b. Penambahan fasilitas download dan upload materi memberikan peningkatan bagi
siswa dalam mempelajari pelajaran yang telah dipelajari di sekolah. Ketika ringkasan
materi yang telah dipelajari ataupun yang belum dipelajari sudah di upload oleh
admin.
5.2 Saran
Aplikasi website SMP Negeri 4 Wonogiri ini, walaupun sudah dibuat sesuai dengan
kemampuan usaha dan upaya yang dimiliki, tentu saja ada beberapa kelemahan yang harus
diperbaiki pada masa yang akan mendatang, untuk itu ada beberapa saran yang bisa diberikan
kepada pengembang sistem informasi agar sistem yang berikutnya bisa dibuat dan dapat
berjalan lebih baik lagi antara lain:
1. Website dapat disempurnakan dengan menambahkan fasilitas sistem informasi
akademik seperti pendaftaran siswa baru secara online, nilai online, dan ujian online.
2. Website tersebut belum adanya fasilitas login akun untuk guru, maka menyarankan
nantinya pihak penelitian selanjutnya, website tersebut dikembangkan lagi dengan
10
adanya login akun untuk guru. Sehingga akan lebih meningkatkan mutu dan kualitas
tentang sekolah.
11
DAFTAR PUSTAKA
Al Fatah, H. 2007. Analisis dan perancangan Sitem Informasi untuk Keunggulan Bersaing Perusahaan & Organisasi Modern. Yogyakarta: Andi Offset.
Arief, M. R. 2011. Pemrograman Web Dinamis menggunakan PHP dan MySQL. Yogyakarta: Andi Offset.
Jogiyanto. 1990. Analisis dan Desain Sistem Informasi: pendekatan terstruktur teori dan praktik aplikasi bisnis. Yogyakarta: Andi Offset.
Komputer, W. (2008). Menguasai Adobe Photoshop CS3. Yogyakarta: Andi Offset.
Kusrini. 2007. Strategi Perancangan dan Pengelolaan Basis Data. Yogyakarta: Andi Offset.
Leitch, R. A., & Davis, K. R.1983. Accounting Information Systems. New Jersey: Prentice-Hall.
Suyanto, M. 2005. Strategi Perancangan Iklan Televisi Perusahaan Top Dunia. Yogyakarta: Andi Offset.
http://www.kresnagaluh.com/2012/08/bootstrap-mendesain-web-menjadi-lebih.html(Diakses tanggal 1 Agustus 2013)
12
Top Related