• Tidak ada hasil yang ditemukan

SISTEM INFORMASI AKADEMIK BERBASIS WEB DENGAN FRAMEWORK YII PADA SMK SEPULUH NOPEMBER.

N/A
N/A
Protected

Academic year: 2017

Membagikan "SISTEM INFORMASI AKADEMIK BERBASIS WEB DENGAN FRAMEWORK YII PADA SMK SEPULUH NOPEMBER."

Copied!
100
0
0

Teks penuh

(1)

SISTEM INFORMASI AKADEMIK BERBASIS WEB

DENGAN FRAMEWORK YII PADA SMK SEPULUH

NOPEMBER

SKRIPSI

Oleh :

PAULUS NIKO YANUAR

0934215076

PROGRAM STUDI TEKNIK INFORMATIKA

FAKULTAS TEKNOLOGI INDUSTRI

UNIVERSITAS PEMBANGUNAN NASIONAL

“VETERAN” J AWA TIMUR

2014

(2)

NOPEMBER

SKRIPSI

Diajukan Untuk Memenuhi Sebagai Persyaratan Dalam Memperoleh Gelar Sarjana Komputer

Program Studi Teknik Informatika

Oleh :

PAULUS NIKO YANUAR

0934215076

PROGRAM STUDI TEKNIK INFORMATIKA

FAKULTAS TEKNOLOGI INDUSTRI

UNIVERSITAS PEMBANGUNAN NASIONAL

“VETERAN” J AWA TIMUR

2014

(3)

LEMBAR PENGESAHAN

SISTEM INFORMASI AKADEMIK BERBASIS WEB

DENGAN FRAMEWORK YII PADA SMK SEPULUH

NOPEMBER

Disusun oleh :

PAULUS NIKO YANUAR

0934215076

Telah disetujui mengikuti Ujian Negara Lisan Gelombang V Tahun Akademik 2013 / 2014

Pembimbing I

Rizky Par lika, S.Kom, M.Kom NIP. 3 8405 07 0219 1

Pembimbing II

Sugiar to, S.Kom

NIP. 3 8702 13 0343 1

Mengetahui,

Ketua Program Studi Teknik Informatika Fakultas Teknologi Industri

Universitas Pembangunan Nasional ”Veteran” Jawa Timur

Dr. Ir. Ni Ketut Sari, M.T NIP. 19650731 199203 2001

(4)

SISTEM INFORMASI AKADEMIK BERBASIS WEB

DENGAN FRAMEWORK YII PADA SMK SEPULUH

NOPEMBER

Disusun Oleh :

Paulus Niko Yanuar

0934215076

Telah dipertahankan dan diterima oleh Tim Penguji Skripsi Program Studi Teknik Informatika Fakultas Teknologi Industri

Universitas Pembangunan Nasional ”Veteran” Jawa Timur Pada Tanggal 20 Desember 2013

Pembimbing :

I Gede Susrama, S.T.,M.Kom. NIP. 3 7006 060 211 1 2.

Sugiarto, S.Kom

NIP. 3 8702 13 0343 1

2.

Fetty Tri Anggraeny, S.Kom, M.Kom NIP. 3 8202 060 208 1

3.

Henni Endah Wahanani, S.T., M.Kom NIP. 071 807 7901

Mengetahui,

Dekan Fakultas Teknologi Industri

Universitas Pembangunan Nasional ”Veteran” Jawa Timur

Ir . Sutiyono, MT NIP. 19600713 198703 1001

(5)

YAYASAN KESEJ AHTERAAN PENDIDIKAN DAN PERUMAHAN UNIVERSITAS PEMBANGUNAN NASIONAL “VETERAN” J AWA TIMUR

FAKULTAS TEKNOLOGI INDUSTRI

KETERANGAN REVISI

Kami yang bertanda tangan di bawah ini menyatakan bahwa mahasiswa berikut :

Nama : PAULUS NIKO YANUAR

NPM : 0934215076

Jurusan : Teknik Informatika

Telah mengerjakan revisi / tidak ada revisi*) pra rencana (design) / skripsi ujian lisan gelombang V , TA 2013/2014 dengan judul:

“SISTEM INFORMASI AKADEMIK BERBASIS WEB DENGAN FRAMEWORK YII PADA SMK SEPULUH NOPEMBER”

Surabaya, 04 Oktober 2013 Dosen Penguji yang memeriksa revisi

1) I Gede Susrama, S.T.,M.Kom.

NIP. 3 7006 060 211 1

{ }

2) Fetty Tri Anggraeny, S.Kom, M.Kom NIP. 3 8202 060 208 1

{ }

3) Henni Endah Wahanani, S.T., M.Kom

NIP. 071 807 7901

{ }

Mengetahui, Dosen Pembimbing Pembimbing I

Rizky Par lika, S.Kom, M.Kom NIP. 3 8405 07 0219 1

Pembimbing II

Sugiar to, S.Kom

NIP. 3 8702 13 0343 1

(6)

Salam Sejaterah.

Syukur terima kasih atas segala limpahan karunia dan kasih sayang Tuhan Yang

Maha Esa, sehingga dengan segala keterbatasan waktu, tenaga, dan pikiran yang dimiliki

oleh penulis, akhirnya skripsi yang berjudul “ SISTEM INFORMASI AKADEMIK

BERBASIS WEB PADA SMK SEPULUH NOPEMBER” dapat terselesaikan sesuai

dengan waktu yang telah ditetapkan.

Melalui Skripsi ini, penulis merasa mendapat kesempatan besar untuk memperdalam

ilmu pengetahuan yang diperoleh selama di perkuliahan, terutama dengan implementasi

Teknologi Informasi dalam kehidupan sehari-hari. Namun demikian penulis menyadari

bahwa Skripsi ini masih memiliki banyak kelemahan dan kekurangan. Oleh karena itu,

kritik dan saran yang bersifat membangun sangatlah diharapkan dari berbagai pihak agar

Skripsi ini bisa lebih baik lagi, sehingga dapat userikan manfaat bagi semua pihak yang

membutuhkannya.

Dalam penyusunan Skripsi ini, banyak pihak yang telah userikan bantuan baik materiil

maupun spiritual ini, sehingga pada kesempatan ini penulis mengucapkan rasa terima

kasih yang sebesar-besarnya kepada:

1. Tuhan Yang Maha Esa. Terima kasih atas segala kelancaran dan kemudahan yang selalu

engkau limpahkan kepada penulis.

2. Ibu Dr. Ir. Ni Ketut Sari, M.T. selaku ketua jurusan Teknik Informatika, UPN “Veteran”

Jawa Timur.

(7)

3. Bapak Rizky Parlika, S.Kom, M.Kom dan Bapak Sugiarto, S.Kom. selaku dosen

pembimbing. Terimakasih banyak telah sabar membimbing dan useri saran yang sangat

bermanfaat kepada penulis.

4. Teman-teman TF-B’09, terimakasih selalu meramaikan dan useri hiburan dalam momen

menyusun laporan.

5. Albert Christian makasih banget support, waktu, dan doanya dear.

6. The last and the best, thanks to my beloved family bapak, ibu, dan adik Veronica yang

selalu menjadi motivasi untuk cepat lulus kuliah.

Serta pihak-pihak lain yang ikut userikan informasi dan data-data di dalam menyelesaikan

laporan Skripsi ini, penulis mengucapkan terima kasih.

Akhir kata penulis harap agar Skripsi yang disusun sesuai dengan kemampuan dan

pengetahuan yang sangat terbatas ini dapat bermanfaat bagi semua pihak yang

membutuhkan.

Surabaya,

Penulis

(8)

iii

Halaman LEMBAR PENGESAHAN

ABSTRAK ... i

KATA PENGANTAR ... ii

DAFTAR ISI ... iii

DAFTAR GAMBAR ... vi

DAFTAR TABEL ... ix

BAB I PENDAHULUAN ... 1

1.1.Latar Belakang ... 1

1.2.Rumusan Masalah ... 2

1.3.Batasan Masalah ... 3

1.4.Tujuan Penelitian ……….. ... 3

1.5. ManfaatPenelitian ... 4

1.6. Sistematika Penulisan ... 4

BAB II TINJAUAN PUSTAKA... 6

2.1 Pengertian Sistem Informasi ... 6

2.2. Pengertian Website ... 6

2.3. Pengertian Framework Yii ... 7

2.4. CSS ... 7

2.5. Pengertian Flowchart……….. 8

2.6.1 Cara Membuat Flowchart ... 9

2.6.2 Jenis-jenis Flowchart... 10

2.7 Unified Modeling Language (UML) ... 10

2.8 CDM dan PDM ………... 15

2.9 Validitas Tabel R ………. ... 15

(9)

iv

BAB III ANALISA DAN PERANCANGAN SISTEM ... 18

3.1 Analisa Sistem ... 18

4.1.1 Perangkat Keras (Hardware) yang digunakan ... 57

4.1.2 Perangkat Lunak (Software) yang digunakan ... 57

4.2 Implementasi Proses ... 57

4.2.1 Halaman Menu Utama ………. 58

4.2.2 Halaman Admin ……….. 67

(10)

4.5.5 Uji Coba Mengisi Data Nilai ……….. ... 81

4.5.6 Uji CobaMengisi Data Tagihan ……….. .. 81

4.5.7 Uji Coba Menulis Pesan ... 82

4.6 SPSS ... 83

BAB VI PENUTUP ... 87

5.1 Kesimpulan ... 87

5.2 Saran ... 88 DAFTAR PUSTAKA

(11)

SISTEM INFORMASI AKADEMIK PADA SMK SEPULUH NOPEMBER BERBASIS WEB DENGAN FRAMEWORK YI

PENYUSUN : PAULUS NIKO YANUAR

DOSEN PEMBIMBING I : RIZKY PARLIKA, S.Kom, S.Kom DOSEN PEMBIMBING II : SUGIARTO, S.Kom.

i ABSTRAK

Sistem Informasi Akademik adalah aplikasi yang dirancang dan dibuat untuk mengolah data-data yang berhubungan dengan informasi akademik, meliputi data siswa, guru, nilai, dan tagihan. Setiap siswa mempunyai data yang berbeda-beda.

Dalam perkembangannya, kebutuhan akademik menjadi lebih kompleks karena kebijakan akademik di tiap pendidikan sering mengalami perubahan. Pada pendidikan sekolah menegah kejuruan perubahan ini tidak berlangsung secara keseluruhan sistem, tapi perubahannya hanya berkisar pada data siswa, data guru, bobot nilai dan tagihan pada siswa.

Pada tugas akhir “Sistem Informasi Akademik Berbasis Web Studi Kasus di SMK Sepuluh Nopember terletak di siwalan panji, Buduran” akan merancang dan membuat sistem informasi akademik menggunakan Framework Yii.

Pengujian tugas akhir ini menggunakan data dari sekolah menengah kejuruan sebagai representasi dari berbagai permasalahan yang sering timbul dalam Sistem informasi akademik. Hasil pengujian dari sistem yang dibuat telah dapat mengakomodasi kebutuhan akademik sebagian besar sekolah menengah kejuruan.

Keyword: Sistem Informasi Akademik, Framework Yii.

(12)

1

PENDAHULUAN

1.1 Latar Bela kang

perkembangan teknologi informasi dan komunikasi menjadi sebuah ajang persaingan dalam banyak bidang, salah satunya dalam dunia pendidikan. Saat ini telah banyak sekolahan yang menerapkan teknologi informasi dan komunikasi, terutama yang berkaitan dengan proses peningkatan mutu pelayanan pada siswa dan wali murid, namun proses tersebut masih belum berjalan secara baik, karena masih banyak proses yang masih dilakukan secara manual, yang seharusnya proses tersebut bisa dijalankan menggunakan sistem yang baik, menggunakan teknologi informasi yang ada, sehingga akan diperoleh peningkatan mutu pelayanan yang baik kepada siswa.

Seperti halnya sebuah pelayanan dalam sebuah sekolahan, yang memiliki masalah dalam informasi sekolahan pada siswa, ataupun masalah yang lebih komplek lagi, yang dikarenakan dampak buruk dari berita mulut ke mulut antar siswa. Salah satu metode yang mampu meningkatkan pelayanan adalah dengan sistem informasi hubungan dengan siswa dan wali murid. Sistem informasi akademik merupakan metodologi, strategi, perangkat lunak (software) dan atau aplikasi berbasis web yang mampu membantu sebuah sekolahan untuk mengelola hubungannya dengan para siswa. Metode ini dikenal dan banyak digunakan untuk meningkatkan pelayanan sekolah pada siswa, guru atau wali murid.

Memang secara langsung tidak ada hubungannya, dan tidak akan membawa tambahan keuntungan yang signifikan apabila mereka memiliki website, tapi perlu

(13)

2

dilihat kembali kalimat pertama ini, pertumbuhan media ini begitu cepat, dan banyak yang yakin, internet akan mendominasi sebagai media informasi dan komunikasi umat manusia, dan cepat atau lambat sebuah sistem informasi pasti akan tergantung pada media ini.

Sekian banyak manfaat dalam penerapan website belum dioptimalkan pada Sistem Informasi Akademik SMK Sepuluh Nopember yang berlokasi di Jl. Siwalan Panji, Buduran. Selama ini di SMK Sepuluh Nopember Belum mempunyai sistem informasi seperti website yang dapat membagi informasi tentang Sekolah tersebut..

1.2 Perumusan Masalah

Berdasarkan latar belakang yang sudah diuraikan di atas, maka di dapatkan rumusan sebagai berikut.

1) Bagaimana membuat aplikasi Sistem Informasi Akademik online berbasis Framework yii?

2) Bagaimana membuat fitur SMS Gateway sebagai fitur penunjang Sistem Informasi Akademik online?

1.3 Batasan Masalah

Sehubungan dengan besar dan luasnya permasalahan yang terdapat pada sistem ini, maka akan dibuat batasan permasalahan yang akan dibahas sebagai berikut :

1) Aplikasi desain website ini dibuat dengan menggunakan PHP Framework Yii.

2) Pengolahan database hanya menggunakan database dari MySQL 5.0.

(14)

3) Aplikasi web yang dibuat menampilkan informasi Sekolahan yang ada. 4) Siswa hanya mendapatkan informasi dari aplikasi ini dan tidak berhak

akses untuk merubah data aplikasi web Sistem informasi Akademik. 5) Aplikasi hanya bisa dua arah antara user dan admin.

1.4 Tujuan

Tujuan dalam menciptakan Sistem Informasi Akademik pada SMK Sepuluh Nopember adalah :

1) Memperluas informasi sekolahan yang ada SMK Sepuluh Nopember. 2) Ikut serta dalam mengembangkan Sistem informasi akademik untuk

dijadikan publikasi dalam bentuk website di SMK Sepuluh Nopember 3) Membantu memberikan kemudahan kepada Siswa untuk mendapatkan

informasi akademik dengan mudah dan praktis.

1.5 Manfaat

Manfaat yang diperoleh dalam Sistem Informasi Akademik di SMK Sepuluh Nopember adalah :

1) Aplikasi web Sistem informasi akademik ini dibuat secara dinamis, sehingga SMK Sepuluh Nopember dapat mempublikasikan segala bentuk informasi akademik dengan aplikasi ini dan siswa tidak kesulitan untuk mendapatkan informasi sekolahan.

(15)

4

1.6 Sistematika Penulisan

Dalam penyusunan tugas akhir, sistematika pembahasan diatur dan disusun dalam lima bab, dan tiap-tiap bab terdiri dari sub-sub bab. Untuk memberikan gambaran yang lebih jelas, maka diuraikan secara singkat mengenai materi dari bab-bab dalam penulisan tugas akhir ini sebagai berikut:

BAB I PENDAHULUAN

Bab ini berisi latar belakang, perumusan masalah, batasan masalah, tujuan penelitian, manfaat penelitian, dan sistematika penulisan pembuatan tugas akhir ini.

BAB II TINJ AUAN PUSTAKA

Pada bab ini menjelaskan tentang teori-teori pemecahan masalah yang berhubungan dan digunakan untuk mendukung dalam pembuatan tugas akhir ini.

BAB III ANALISIS DAN PERANCANGAN SISTEM

Bab ini menjelaskan tentang tata cara metode perancangan sistem yang digunakan untuk mengolah sumber data yang dibutuhkan sistem antara lain: Flowcahart, Document Flow, UML, CDM dan PDM, perancangan database, dan desain antarmuka

BAB IV HASIL DAN PEMBAHASAN

Pada bab ini akan dibahas mengenai hasil dan pembahasan dari rancangan sistem website yang telah dibuat pada bab sebelumnya. Bagian implementasi sistem website ini meliputi: implementasi data,

(16)

implementasi proses, dan implementasi antarmuka, serta uji coba program yang telah dibuat.

BAB V PENUTUP

Bab ini berisi kesimpulan dan saran dari penulis untuk pengembangan sistem.

DAFTAR PUSTAKA

Pada bagian ini akan dipaparkan tentang sumber-sumber literatur yang digunakan dalam pembuatan laporan tugas akhir ini.

(17)

6 BAB II

TINJ AUAN PUSTAKA

2.1 Pengertian Sistem Infor masi

Sistem berasal dari bahasa Latin (systēma) dan bahasa Yunani (sustēma) adalah suatu kesatuan yang terdiri komponen atau elemen yang dihubungkan bersama untuk memudahkan aliran informasi, materi atau energi untuk mencapai suatu tujuan. Istilah ini sering dipergunakan untuk menggambarkan suatu set entitas yang berinteraksi, di mana suatu model matematika seringkali bisa dibuat. Sistem juga merupakan kesatuan bagian-bagian yang saling berhubungan yang berada dalam suatu wilayah serta memiliki item-item penggerak, contoh umum misalnya seperti negara. Negara merupakan suatu kumpulan dari beberapa elemen kesatuan lain seperti provinsi yang saling berhubungan sehingga membentuk suatu negara dimana yang berperan sebagai penggeraknya yaitu rakyat yang berada dinegara tersebut.

Kata “sistem” banyak sekali digunakan dalam percakapan sehari-hari, dalam forum diskusi maupun dokumen ilmiah. Kata ini digunakan untuk banyak hal, dan pada banyak bidang pula, sehingga maknanya menjadi beragam. Dalam pengertian yang paling umum, sebuah sistem adalah sekumpulan benda yang memiliki hubungan di antara mereka.[http://npermana.mhs.uksw.edu/2012] 2.2 Pengertian Website

Website adalah suatu ruang informasi dimana sumber-sumber daya yang berguna diidentifikasi oleh pengenal global yang disebut Uniform Resource Identifier (URI) atau juga lebih dikenal dengan istilah yang lebih populer yaitu

(18)

Uniform Resource Locator (URL). Dengan kata lain, website adalah suatu ruang informasi di dalam Internet yang dapat diakses atau dilihat dari berbagai penjuru dunia, kapanpun dan dimanapun mereka berada, selama mempunyai koneksi Internet. Dengan website, kita dapat mempromosikan diri kita, Perusahaan, Sekolahan, dan lain sebagainya. Dengan website kita dapat membangun sebuah brand image yang positif dari sebuah Perusahaan dengan biaya yang cukup murah, dengan ruang lingkup yang lebih besar.[http://www.proweb.co.id/articles] 2.3 Pengertian Framework Yii

Yii adalah framework (kerangka kerja) PHP berbasis-komponen, berkinerja tinggi untuk pengembangan aplikasi Web berskala-besar. Yii menyediakan reusability maksimumdalam pemrograman Web dan mampu meningkatkan kecepatan pengembangan secarasignifikan. Yii sendiri merupakan kepanjangan dari “Yes It Is”. Yes It Is sendiri memiliki makna kalo Yii mampu dan tepat anda pilih untuk mengerjakan project.

Yii merupakan free open source PHP framework terbaru berbasis komponen denganperformasi tinggi untuk mengembangkan aplikasi web bersekala besar .Ia menyediakanresuabilitas maksimum dalam pemrograman Web dan bisa mengakselerasi prosespengembangan secara signifikan. Nama Yii (dieja

sebagai/i:/) singkatan darieasy,efficient dan extensible(mudah, efis ien, danbisa

diperluas). (Sabit Huraira,2012) 2.4 CSS

CSS (Cascading Style Sheets) digunakan dalam kode HTML (Hypertext Markup Language) untuk menciptakan suatu kumpulan Style yang terkadang

(19)

8

dapat digunakan untuk memperluas kemampuan HTML (Hypertext Markup Language).

CSS (Cascading Style Sheet) adalah bahasa yang digunakan untuk format tampilan HTML (Hypertext Markup Language), bahasa yang direkomendasikan W3C (World Wide Web Consortium) untuk melukiskan gaya seperti huruf, warna, ukuran, jarak, posisi pada dokumen-dokumen web. CSS (Cascading Style Sheet) sangat membantu para web designer untuk memperindah halaman web template.

CSS (Cascading Style Sheet) sama fungsinya dengan cara format HTML (Hypertext Markup Language) biasa, namun CSS mempunyai lebih banyak elemen yang bisa kita atur. Contoh : Tag table punya elemen border, CSS (Cascading Style Sheet) juga punya format untuk border namun lebih detail lagi seperti : border-top, border-right, border-bottom, border-left. artinya lebih kompleks karena memungkinkan kita membuat sisi border yang berbeda. [syafii,2004]

2.5 Pengertian Flowchart

Salah satu alternatif dari Stratification Diagram adalah Flow Chart. Flow Chart merupakan gambaran atau bagan yang memperlihatkan urutan dan hubungan antar proses berserta instansinya.Gambaran ini dinyatakan dengan simbol. Dengan demikian setiap simbol menggambarkan proses tertentu, sedangkan hubungan antara proses digambarkan dengan garis pendukung. Flow Chart juga didefinisikan sebagai penyajian yang sistematis tentang proses dan logika dari kegiatan penanganan informasi atau penggambaran secara grafik dari langkah-langkah dan urut-urutan prosedur. Flow Chart menolong untuk memecahkan masalah kedalam segmen-segmen yang lebih kecil dan menolong

(20)

dalam menganalisis alternatif-alternatif lain dalam pengoperasian.[Hendra Purwanto,2008]

2.5.1 Cara Membuat Flow Char t

Jika akan membuat flow Chart, ada beberapa petunjuk yang harus diperhatikan, seperti :

1) Flow Chart digambarkan dari halaman atas ke bawah dan dari kiri ke kanan.

2) Aktivitas yang digambarkan harus didefinisikan secara hati-hati dan definisi ini harus dapat dimengerti oleh pembacanya.

3) Kapan aktivitas dimulai dan berakhir harus ditentukan secara jelas.

4) Setiap langkah dari aktivitas harus diuraikan dengan menggunakan deskripsi kata kerja, misalkan Melakukan penggandaan.

5) Setiap langkah dari aktivitas harus berada pada urutan yang benar.

6) Lingkup dan range dari aktifitas yang sedang digambarkan harus ditelusuri dengan hati-hati. Percabangan-percabangan yang memotong aktivitas yang sedang digambarkan tidak perlu digambarkan pada flowchart yang sama. Simbol konektor harus digunakan dan percabangannya diletakan pada halaman yang terpisah atau hilangkan seluruhnya bila percabangannya tidak berkaitan dengan sistem.

7) Gunakan simbol-simbol flowchart yang standar.

(21)

10

2.5.2 J enis-jenis Flowchart

Ada lima macam bagan alir yang akan dibahas di modul ini, yaitu sebagai berikut:

1. Bagan alir sistem (systems flowchart).

Merupakan bagan yang menunjukkan alur kerja atau apa yang sedang dikerjakan di dalam system secara keseluruhan dan menjelaskan urutan dari prosedur-prosedur yang ada dalam system.

2. Bagan alir dokumen (document flowchart).

Menelusuri alur dari data yang ditulis melalui system. Fungsi utamanya untuk menelusuri alur form dan laporan system dari satu bagian ke bagian yang lain. 3. Bagan alir proses (process flowchart).

Merupakan teknik penggambaran rekayasa industrial yang memecah dan menganalisis langkah selanjutnya dari sebuah sistem.

2.6 Unified Modeling Language (UML)

adalah sebuah bahasa untuk menetukan, visualisasi, kontruksi, dan

mendokumentasikan artifact (bagian dari informasi yang digunakan atau

dihasilkan dalam suatu proses pembuatan perangkat lunak. Artifact dapat berupa

model, deskripsi atau perangkat lunak) dari system perangkat lunak, seperti pada

pemodelan bisnis dan system non perangkat lunak lainnya.

UML merupakan suatu kumpulan teknik terbaik yang telah terbukti sukses dalam

memodelkan system yang besar dan kompleks. UML tidak hanya digunakan

dalam proses pemodelan perangkat lunak, namun hampir dalam semua bidang

yang membutuhkan pemodelan.

(22)

BAGIAN-BAGIAN UML

Bagian-bagian utama dari UML adalah view, diagram, model element, dan

general mechanism.

a. View

View digunakan untuk melihat sistem yang dimodelkan dari beberapa

aspek yang berbeda. View bukan melihat grafik, tapi merupakan suatu abstraksi

yang berisi sejumlah diagram.

Beberapa jenis view dalam UML antara lain: use case view, logical view,

component view, concurrency view,dan deployment view.

b. Use case view

Mendeskripsikan fungsionalitas sistem yang seharusnya dilakukan sesuai

yang diinginkan external actors. Actor yang berinteraksi dengan sistem dapat

berupa user atau sistem lainnya.

View ini digambarkan dalam use case diagramsdan kadang-kadang

dengan activity diagrams. Viewini digunakan terutama untuk pelanggan,

perancang (designer), pengembang (developer), dan penguji sistem (tester).

c. Logical view

Mendeskripsikan bagaimana fungsionalitas dari sistem, struktur statis

(class, object,danrelationship ) dan kolaborasi dinamis yang terjadi

ketika object mengirim pesan ke object lain dalam suatu fungsi tertentu.

View ini digambarkan dalam class diagrams untuk struktur statis dan dalam state,

sequence, collaboration, dan activity diagram untuk model dinamisnya. View ini

digunakan untuk perancang (designer) dan pengembang (developer).

d. Component view

(23)

12

Mendeskripsikan implementasi dan ketergantungan modul. Komponen

yang merupakan tipe lainnya dari code module diperlihatkan dengan struktur dan

ketergantungannya juga alokasi sumber daya komponen dan informasi

administrative lainnya.

View ini digambarkan dalam component view dan digunakan untuk pengembang

(developer).

e. Concurr ency view

Membagi sistem ke dalam proses dan prosesor.View ini digambarkan

dalam diagram dinamis (state, sequence, collaboration, dan activity diagrams) dan

diagram implementasi (component dan deployment diagrams) serta digunakan

untuk pengembang (developer), pengintegrasi (integrator), dan penguji (tester).

f. Deployment view

Mendeskripsikan fisik dari sistem seperti komputer dan perangkat (nodes)

dan bagaimana hubungannya dengan lainnya.

View ini digambarkan dalam deployment diagramsdan digunakan untuk

pengembang (developer), pengintegrasi (integrator), dan penguji (tester).

g. Diagram

Diagram berbentuk grafik yang menunjukkan simbol elemen model yang

disusun untuk mengilustrasikan bagian atau aspek tertentu dari sistem. Sebuah

diagram merupakan bagian dari suatu view tertentu dan ketika digambarkan

biasanya dialokasikan untuk view tertentu. Adapun jenis diagram antara lain :

1. Use Case Diagram

Use case adalah abstraksi dari interaksi antara system dan actor. Use case

bekerja dengan cara mendeskripsikan tipe interaksi antara user sebuah system

(24)

dengan sistemnya sendiri melalui sebuah cerita bagaimana sebuah system

dipakai. Use casemerupakan konstruksi untuk mendeskripsikan bagaimana system

akan terlihat di mata user. Sedangkan use case diagram memfasilitasi komunikasi

diantara analis dan pengguna serta antara analis dan client.

2. Class Diagram

Class adalah dekripsi kelompok obyek-obyek dengan property, perilaku

(operasi) dan relasi yang sama. Sehingga dengan adanya class diagram dapat

memberikan pandangan global atas sebuah system. Hal tersebut tercermin dari

class- class yang ada dan relasinya satu dengan yang lainnya. Sebuah sistem

biasanya mempunyai beberapa class diagram. Class diagram sangat membantu

dalam visualisasi struktur kelas dari suatu system.

3. Component Diagr am

Component software merupakan bagian fisik dari sebuah system, karena

menetap di komputer tidak berada di benak para analis. Komponent merupakan

implementasi software dari sebuah atau lebih class. Komponent dapat

berupa source code, komponent biner, atau executable component. Sebuah

komponent berisi informasi tentang logic class atau class yang diimplementasikan

sehingga membuat pemetaan dari logical view ke component view.Sehingga

component diagram merepresentasikan dunia riil yaitu component software yang

mengandung component, interface dan relationship.

4. Deployment Diagram

Menggambarkan tata letak sebuah system secara fisik, menampakkan

bagian-bagian software yang berjalan pada bagian-bagian hardware, menunjukkan

hubungan komputer dengan perangkat (nodes) satu sama lain dan jenis

(25)

14

hubungannya. Di dalam nodes,executeable component dan object yang

dialokasikan untuk memperlihatkan unit perangkat lunak yang dieksekusi

oleh node tertentu dan ketergantungan komponen.

5. State Diagr am

Menggambarkan semua state (kondisi) yang dimiliki oleh suatu object dari

suatu class dan keadaan yang menyebabkan state berubah. Kejadian dapat

berupa object lain yang mengirim pesan. State class tidak digambarkan untuk

semua class, hanya yang mempunyai sejumlah state yang terdefinisi dengan baik

dan kondisi class berubah oleh stateyang berbeda.

6. Sequence Diagr am

Sequence Diagram digunakan untuk menggambarkan perilaku pada

sebuah scenario. Kegunaannya untuk menunjukkan rangkaian pesan yang dikirim

antara object juga interaksi antaraobject, sesuatu yang terjadi pada titik tertentu

dalam eksekusi sistem.

7. Collaboration Diagram

Menggambarkan kolaborasi dinamis sepertisequence diagrams. Dalam

menunjukkan pertukaran pesan, collaboration

diagrams menggambarkan objectdan hubungannya (mengacu ke konteks). Jika

penekannya pada waktu atau urutan gunakansequencediagrams, tapi jika

penekanannya pada konteks gunakan collaboration diagram.

8. Activity Diagram

Menggambarkan rangkaian aliran dari aktivitas, digunakan untuk

mendeskripsikan aktifitas yang dibentuk dalam suatu operasi sehingga dapat juga

digunakan untuk aktifitas lainnya seperti use caseatau interaksi.

(26)

2.7 CDM dan PDM

CDM (Conseptual Data Model). CDM dipakai untuk menggambarkan secara detail struktur basis data dalam bentuk logik. Struktur ini independen terhadap semua software maupun struktur data storage tertentu yang digunakan dalam aplikasi ini. CDM terdiri dari objek yang tidak diimplementasikan secara langsung kedalam basis data yang sesungguhnya. PDM (Physical Data Model). PDM merupakan gambaran secara detail basis data dalam bentuk fisik. Penggambaran rancangan PDM memperlihatkan struktur penyimpanan data yang benar pada basis data yang digunakan sesungguhnya. [Didik,2003].

2.8 Validitas Korelasi Tabel R

Validitas adalah tingkat keandalah dan kesahihan alat ukur yang digunakan. Intrumen dikatakan valid berarti menunjukkan alat ukur yang dipergunakan untuk mendapatkan data itu valid atau dapat digunakan untuk mengukur apa yang seharusnya di ukur (Sugiyono, 2004:137). Dengan demikian, instrumen yang valid merupakan instrumen yang benar-benar tepat untuk mengukur apa yang hendak di ukur.

Penggaris dinyatakan valid jika digunakan untuk mengukur panjang, namun tidak valid jika digunakan untuk mengukur berat. Artinya, penggaris memang tepat digunakan untuk mengukur panjang, namun menjadi tidak valid jika penggaris digunakan untuk mengukur berat.

(27)

16

Uji reliabilitas berguna untuk menetapkan apakah instrumen yang dalam hal ini kuesioner dapat digunakan lebih dari satu kali, paling tidak oleh responden yang sama akan menghasilkan data yang konsisten. Dengan kata lain, reliabilitas instrumen mencirikan tingkat konsistensi. Banyak rumus yang dapat digunakan untuk mengukur reliabilitas diantaranya adalah rumus Spearman Brown

Ket :

R 11 adalah nilai reliabilitas

R b adalah nilai koefisien korelasi

Nilai koefisien reliabilitas yang baik adalah diatas 0,7 (cukup baik), di atas 0,8 (baik).

Pengukuran validitas dan reliabilitas mutlak dilakukan, karena jika instrument yang digunakan sudah tidak valid dan reliable maka dipastikan hasil penelitiannya pun tidak akan valid dan reliable. Sugiyono (2007: 137) menjelaskan perbedaan antara penelitian yang valid dan reliable dengan instrument yang valid dan reliable sebagai berikut :

Penelitian yang valid artinya bila terdapat kesamaan antara data yang terkumpul dengan data yang sesungguhnya terjadi pada objek yang diteliti. Artinya, jika objek berwarna merah, sedangkan data yang terkumpul berwarna putih maka hasil penelitian tidak valid. Sedangkan penelitian yang reliable bila

(28)

terdapat kesamaan data dalam waktu yang berbeda. Kalau dalam objek kemarin berwarna merah, maka sekarang dan besok tetap berwarna merah.[http://rumushitung.com/2013/06/08]

(29)

18 BAB III

ANALISIS DAN PERANCANGAN SISTEM

Pada bab ini dijelaskan mengenai rancangan penelitian untuk pembuatan sistem informasi akademik pada SMK Sepuluh Nopember. Rancangan penelitian pada bab ini akan dibagi dalam dua pokok bahasan yaitu : analisa sistem, dan perancangan sistem.

3.1 Analisis Sistem

Perancangan Aplikasi Teknologi Framework Yii pada website dinamis untuk Sistem informasi akademik SMK Sepuluh Nopember, pada penelitian ini dirancang untuk menyediakan sarana informasi profil murid, profil guru, nilai, dan tagihan.

SMS Gateway pada informasi tagihan ini merupakan sistem yang mempermudah dalam pemberitahuan informasi baru kepada wali murid yang saling bersangkutan pada murid. Dengan menggunakan media transmisi seperti modem, sebagai perantara sms gateway ini bisa diakses menggunakan layanan web. Dengan begitu wali murid dapat mudah mengetahui tentang tagihan seperti SPP dan tagihan buku.

(30)

3.2 Perancangan Sistem

Sub-bab ini akan menjelaskan mengenai proses desain sistem yang akan dibuat. Proses desain sistem penilaian dalam sub-bab ini akan dibagi menjadi 3 tahapan penting, yaitu: perancangan proses, perancangan database, dan perancangan antarmuka. Adapun kebutuhan-kebutuhan yang dapat diberikan oleh sistem yang tentunya dapat menunjang sistem yang dibuat, antara lain :

1. Siswa dalam hal ini adalah registrasi untuk mendapatkan username dan password melalui sistem aplikasi yang dibuat, sesuai dengan username dan password.

2. Sistem dapat menampilkan informasi sekolah yang tentunya memberikan informasi terhadap siswa.

3. Sistem memberikan informasi tentang profil siswa agar siswa mudah mendapatkan biodata siswa.

4. Sistem memberikan informasi tentang profil guru agar siswa mudah mendapatkan biodata guru

5. Sistem juga memberikan informasi nilai dan tagihan supaya siswa mudah melihat nilai dan tagihan tanpa harus ke sekolah.

6. Admin dapat melakukan pengolahan data, menambah, memperbaharui, dan menghapus data.

3.3 Perancangan Pr oses

Sistem perancangan proses yang ada pada aplikasi ini 2 entitas luar yang terdapat dalam sistem ini, yaitu :

a) Admin

Entitas admin sebagai administrator memiliki hak akses penuh terhadap sistem. Input data yang dibutuhkan dalam sistem ini seperti data profil siswa, data profil guru, data nilai, data tagihan,.

(31)

20

b) Users (Siswa dan guru)

Dalam kasus ini entitas siswa hanya dapat register untuk mendapatkan username dan password untuk melihat data yang di inputkan oleh admin

3.3.1 Flowchart Alur Pr ogram

Gambar 3.1 Alur Program SMK Sepuluh Nopember

Ketika sistem informasi akademik di eksekusi, hanya bisa melihat halaman utama dari website SMK Sepuluh Nopember. Hal pertama yang dilakukan harus login agar bisa mengakses website, dengan cara memasukan username dan

start

Tampilan Web

Menu

Beranda Profil SIswa Tagihan SMS Gateway

Data Profil

(32)

create

password. Sistem akan mengecek username dan password tersebut, jika username dan password benar maka dapat mengakses website, sedangkan bila username dan password salah maka akan kembali untuk login ulang. Setelah berhasil melakukan login user dapat mengakses dan dapat melihat data yang di inputkan oleh admin di menu profil siswa, profil guru, nilai, tagihan.

3.3.2 Use Case Diagram

Gambar 3.2 Use Case Diagram Program

Pada use case diagram diatas dijelaskan bahwa terdapat 2 actor, yaitu admin dan siswa . Actor admin memiliki beberapa fungsi yaitu Create, update, delete yang dimana untuk dapat create update, delete harus melakukan login terlebih dahulu. Sedangkan siswa yaitu lihat beranda, profil, pengumuman, tagihan, nilai dan download harus melakukan login terlebih dahulu.

(33)

22

menampilkan halaman utama Memasukan username

dan password

cek username dan password

validasi

tidak

ya

Sis tem Admin,s is w a dan guru

3.3.3 Activity Diagram

a) Activity diagram pada login

Gambar 3.3 Activity Diagram Pada login

Activity diagram login diatas menerangkan bagaimana alur kerja aktivitas login yang dilakukan antara admin,siswa dan guru dan sistem, dimulai dengan membuka halaman login kemudian sistem merespon dengan meakukan load halaman login, setelah halaman login ditampilkan oleh sistem, admin, siswa dan guru dapat melakukan pengisian username dan password yang terdapat dalam form tersebut, kemudian sistem melakukan pencarian data dan verifikasi data, apabila data ditemukan dan cocok maka sistem akan load halaman utama dari web, jika data nama dan password tidak cocok maka sistem akan kembali menampilkan halaman login dan diminta untuk mengisi data lagi.

(34)

klik menu beranda

mengelola data beranda

menapilkan halaman beranda

simpan data beranda

lihat data beranda

Sistem Siswa d an Gu r u

b) Activity diagram mengelola beranda

Gambar 3.4 Activity Diagram Pada mengelola beranda

Didalam activity diagram mengelola beranda langkah pertama Admin memilih menu beranda, setelah itu admin dapat mengelola data isi beranda dengan keinginan. Kemudian Admin menyimpan data beranda dan sistem dapat menampilkan hasil yang di inputkan oleh admin.

(35)

24

c) Activity diagram pada mengelola pr ofil siswa

Gambar 3.5 Activity Diagram pada mengelola profil siswa

Didalam activity diagram mengelola profil siswa yang pertama harus dilakukan oleh admin yaitu terlebih dahulu melakukan login. Saat membuka aplikasi sistem akan menampilkan halaman login. Masukan username dan password, jika salah sistem akan menampilkan pesan kesalahan dan kembali ke menu login untuk memasukan username dan password dengan benar. Jika benar maka sistem akan menampilkan halaman utama. Admin bisa memilih menu profil siswa siswa, setelah itu admin dapat mengelola isi profil siswa dengan keinginan. Admin bisa menyimpan data profil siswa dan sistem dapat menampilkan hasil perubahan dari admin. Kemudian logout untuk keluar dari sistem.

(36)

simpan data profil guru Login

klik menu profil guru

mengelola data profil guru

Cek username dan password

menampilkan halaman utama

lihat data profil guru tidak

ya

Sis tem Adm i n

d) Activity diagram pada mengelola pr ofil gu ru

Gambar 3.6 Activity Diagram pada mengelola profil guru

Didalam activity diagram mengelola profil guru yang pertama harus dilakukan oleh admin yaitu terlebih dahulu melakukan login. Saat membuka aplikasi sistem akan menampilkan halaman login. Masukan username dan password, jika salah sistem akan menampilkan pesan kesalahan dan kembali ke menu login untuk memasukan username dan password dengan benar. Jika benar maka sistem akan menampilkan halaman utama. Admin bisa memilih menu profil siswa guru, setelah itu admin dapat mengelola isi profil guru dengan keinginan. Admin bisa menyimpan data profil guru dan sistem dapat menampilkan hasil perubahan dari admin. Kemudian logout untuk keluar dari sistem.

(37)

26

e) Activity diagram pada mengelola nilai

Gambar 3.7 Activity Diagram pada mengelola nilai

Didalam activity diagram mengelola nilai yang pertama harus dilakukan oleh admin yaitu terlebih dahulu melakukan login. Saat membuka aplikasi sistem akan menampilkan halaman login. Masukan username dan password, jika salah sistem akan menampilkan pesan kesalahan dan kembali ke menu login untuk memasukan username dan password dengan benar. Jika benar maka sistem akan menampilkan halaman utama. Admin bisa memilih menu nilai , setelah itu admin dapat mengelola isi nilai dengan keinginan. Admin bisa menyimpan data nilai dan sistem dapat menampilkan hasil perubahan dari admin. Kemudian logout untuk keluar dari sistem.

(38)

Menampilkan

f) Activity diagram pada mengelola tagihan

Gambar 3.8 Activity Diagram pada mengelola tagihan

Didalam activity diagram mengelola tagihan yang pertama harus dilakukan oleh admin yaitu terlebih dahulu melakukan login. Saat membuka aplikasi sistem akan menampilkan halaman login. Masukan username dan password, jika salah sistem akan menampilkan pesan kesalahan dan kembali ke menu login untuk memasukan username dan password dengan benar. Jika benar maka sistem akan menampilkan halaman utama. Admin bisa memilih menu tagihan, setelah itu admin dapat mengelola isi nilai dengan keinginan. Admin bisa menyimpan tagihan dan sistem dapat menampilkan hasil perubahan dari admin. Kemudian logout untuk keluar dari sistem.

(39)

28

Login

klik menu sms gateway

mengelola data sms gateway

Cek username dan password

menampilkan halaman utama

simpan data sms gateway

lihat data sms gateway tidak

ya Sis tem Admi n

g) Activity diagram pada mengelola sms gateway

Gambar 3.9 Activity Diagram pada mengelola sms gateway

Didalam activity diagram mengelola sms gateway yang pertama harus dilakukan oleh admin yaitu terlebih dahulu melakukan login. Saat membuka aplikasi sistem akan menampilkan halaman login. Masukan username dan password, jika salah sistem akan menampilkan pesan kesalahan dan kembali ke menu login untuk memasukan username dan password dengan benar. Jika benar maka sistem akan menampilkan halaman utama. Admin bisa memilih menu sms gateway, setelah itu admin dapat mengelola isi nilai dengan keinginan. Admin

(40)

login menu profil s is wa

validas i

bisa menyimpan sms gateway dan sistem dapat menampilkan hasil perubahan dari admin. Kemudian logout untuk keluar dari sistem.

h) Activity diagram pada lihat Beranda

Gambar 3.10 Activity Diagram pada lihat beranda

Didalam activity diagram lihat beranda siswa dan guru hanya bisa melihat isi data dari menu beranda yang di inputkan oleh admin yang di dalamnya berisi informasi tentang sekolah SMK Sepuluh Nopember.

i) Activity diagram pada lihat profil siswa

Gambar 3.11 Activity Diagram pada lihat profil siswa

(41)

30

Didalam activity diagram lihat profil siswa yang pertama harus dilakukan oleh siswa dan guru yaitu terlebih dahulu melakukan login. Saat membuka aplikasi sistem akan menampilkan halaman login. Masukan username dan password, jika salah sistem akan menampilkan pesan kesalahan dan kembali ke menu login untuk memasukan username dan password dengan benar. Jika benar maka sistem akan menampilkan halaman utama. Siswa dan guru bisa memilih menu profil siswa untuk melihat isi dari menu profil siswa. Maka sistem akan menampilkan menu profil siswa. kemudian logout untuk keluar dari sistem.

j) Activity diagram pada lihat profil gu ru

Gambar 3.12 Activity Diagram pada lihat profil guru

Didalam activity diagram lihat profil guru yang pertama harus dilakukan oleh siswa dan guru yaitu terlebih dahulu melakukan login. Saat membuka aplikasi sistem akan menampilkan halaman login. Masukan username dan password, jika

(42)

Menampilkan menu Nilai Login

Memilih Menu Nilai

masukan Username dan pass word

validas i

Menam pilkan halaman utama Tidak

Ya Sistem Siswa d an Gu r u

salah sistem akan menampilkan pesan kesalahan dan kembali ke menu login untuk memasukan username dan password dengan benar. Jika benar maka sistem akan menampilkan halaman utama. Siswa dan guru bisa memilih menu profil guru untuk melihat isi dari menu profil guru. Maka sistem akan menampilkan menu profil guru. kemudian logout untuk keluar dari sistem.

k) Activity diagram pada lihat nilai

Gambar 3.13 Activity Diagram pada lihat nilai

Didalam activity diagram lihat nilai yang pertama harus dilakukan oleh siswa dan guru yaitu terlebih dahulu melakukan login. Saat membuka aplikasi sistem akan menampilkan halaman login. Masukan username dan password, jika salah sistem akan menampilkan pesan kesalahan dan kembali ke menu login untuk memasukan username dan password dengan benar. Jika benar maka sistem

(43)

32

masukan Username dan password Login

Memilih Menu Tagihan

validas i

Menam pilkan halaman utama

Menam pilkan menu Tagihan Tidak

Ya

Si stem Siswa d an Gu r u

akan menampilkan halaman utama. Siswa dan guru bisa memilih menu nilaiuntuk melihat isi dari menu nilai. Maka sistem akan menampilkan menu nilai. kemudian logout untuk keluar dari sistem.

l) Activity diagram pada lihat tagihan

Gambar 3.13 Activity Diagram pada lihat tagihan

Didalam activity diagram lihat tagihan yang pertama harus dilakukan oleh siswa dan guru yaitu terlebih dahulu melakukan login. Saat membuka aplikasi sistem akan menampilkan halaman login. Masukan username dan password, jika salah sistem akan menampilkan pesan kesalahan dan kembali ke menu login

(44)

Nilai

untuk memasukan username dan password dengan benar. Jika benar maka sistem akan menampilkan halaman utama. Siswa dan guru bisa memilih menu tagihan untuk melihat isi dari menu tagihan. Maka sistem akan menampilkan menu tagihan. kemudian logout untuk keluar dari sistem.

3.3.4 Class Diagram

Gambar 3.14 Class Diagram alur program

Class diagram diatas menunjukan dimana terdapat 7 macam class, yaitu main sebagai utama, controller untuk mengatur dengan operation view, create, read, update, delete. Pada siswa, guru, nilai dan tagihan hanya menampilkan saja dan memiliki masing- masing attribute.tagihan memiliki class pencarian yaitu mencari dari tanggal ke tanggal.

(45)

34

admin

admin Form loginForm login : c_login: c_login : m_login: m_login

1: Action view()

2:

3: insert username()

4: insert password()

5: action login()

6: read()

7:

8:

3.3.5 Sequence Diagram

a) Sequence diagr an pada login

Gambar 3.15 Sequence Diagram pada login

Sequence diatas menjelaskan tentang langkah urutan proses login. Saat actor membuka halaman login maka actionView akan berjalan mengirim pesan ke control login untuk membuka form login, kemudian form login terbuka dan actor dapat mengisi username dan password login setelah itu actionLogin berjalan mengirim pesan ke control login kemudian diteruskan ke model login untuk dibaca, pesan dikirim kembali ke control kemudian diteruskan ke form, proses login selesai.

(46)

admin

admin : form beranda: form beranda : c_beranda: c_beranda : m_beranda: m_beranda 1: action_view()

b) Sequence diagr am pada mengelola beranda

Gambar 3.16 Sequence Diagram pada mengelola beranda

Sequence diagram diatas menjelaskan dimana admin dapat mengelola isi halaman beranda, pertama actor admin memberi pesan ke control beranda kemudian direspon dengan membuka form beranda, kemudian admin dapat mengisi data, dan memberi command ok, setelah itu dari form beranda akan mengirim actionSave ke control yang diteruskan ke model untuk melakukan create model, kemudian kembali ke control dan diteruskan ke form beranda, begitu juga untuk update dan delete, memiliki proses yang sama.

(47)

36

c) Sequence diagr am pada mengelola profil siswa

Gambar 3.17 Sequence Diagram pada mengelola profil siswa

Sequence diagram diatas menjelaskan dimana admin dapat mengelola isi halaman profil siswa, pertama actor admin memberi pesan ke control profil siswa kemudian direspon dengan membuka form profil siswa, kemudian admin dapat mengisi data, dan memberi command ok, setelah itu dari form profil siswa akan mengirim actionSave ke control yang diteruskan ke model untuk melakukan create model, kemudian kembali ke control dan diteruskan ke form profil siswa, begitu juga untuk update dan delete, memiliki proses yang sama.

(48)

: form profil guru : form profil guru admin

admin : c_profil guru: c_profil guru : m_profil guru: m_profil guru

1: action_view()

d) Sequence diagr am pada mengelola profil gu ru

Gambar 3.18 Sequence Diagram pada mengelola profil guru

Sequence diagram diatas menjelaskan dimana admin dapat mengelola isi halaman profil guru, pertama actor admin memberi pesan ke control profil guru kemudian direspon dengan membuka form profil guru, kemudian admin dapat mengisi data, dan memberi command ok, setelah itu dari form profil guru akan mengirim actionSave ke control yang diteruskan ke model untuk melakukan create model, kemudian kembali ke control dan diteruskan ke form profil guru, begitu juga untuk update dan delete, memiliki proses yang sama

(49)

38

admin

admin : form nilai: form nilai : c_nilai: c_nilai : m_n ilai: m_n ilai

1: action_view()

d) Sequence diagr am pada mengelola nilai

Gambar 3.19 Sequence Diagram pada mengelola nilai

Sequence diagram diatas menjelaskan dimana admin dapat mengelola isi halaman nilai, pertama actor admin memberi pesan ke control nilai kemudian direspon dengan membuka form nilai, kemudian admin dapat mengisi data, dan memberi command ok, setelah itu dari form nilai akan mengirim actionSave ke control yang diteruskan ke model untuk melakukan create model, kemudian kembali ke control dan diteruskan ke form nilai, begitu juga untuk update dan delete, memiliki proses yang sama

(50)

adm in

adm in : form Tagihan: form Tagihan : c_Tagihan: c_Tagihan : m_Tagihan: m_Tagihan

1: action_view()

e) Sequence diagr am pada mengelola tagihan

Gambar 3.20 Sequence Diagram pada mengelola tagihan

Sequence diagram diatas menjelaskan dimana admin dapat mengelola isi halaman tagihan, pertama actor admin memberi pesan ke control nilai kemudian direspon dengan membuka form tagihan, kemudian admin dapat mengisi data, dan memberi command ok, setelah itu dari form tagihan akan mengirim actionSave ke control yang diteruskan ke model untuk melakukan create model, kemudian kembali ke control dan diteruskan ke form tagihan, begitu juga untuk update dan delete, memiliki proses yang sama

(51)

40

f) Sequence diagr am pada mengelola sms gateway

Gambar 3.21 Sequence Diagram pada mengelola sms gateway

Sequence diagram diatas menjelaskan dimana admin dapat mengelola isi halaman sms gateway, pertama actor admin memberi pesan ke control sms gateway kemudian direspon dengan membuka form sms gateway, kemudian admin dapat mengisi data, dan memberi command ok, setelah itu dari form sms gateway akan mengirim actionSave ke control yang diteruskan ke model untuk melakukan create model, kemudian kembali ke control dan diteruskan ke form sms gateway, begitu juga untuk update dan delete, memiliki proses yang sama

(52)

: form beranda

: form beranda :siswa

:siswa

: c_beranda

: c_beranda : m_beranda: m_beranda 1: action view()

5:

3: read()

4: 2:

g) Sequence diagr am pada lihat beranda

Gambar 3.22 Sequence Diagram pada lihat beranda

Sequence diagram diatas adalah urutan proses siswa dan guru untuk dapat melihat halaman beranda. dimuai dengan siswa dan guru membuka form login, dengan mengirim perintah actionView ke control beranda, yang kemudian oleh control diteruskan ke model beranda dengan read, respon tersebut dikembalikan ke control beranda dan diteruskan ke form beranda, terbuka halaman beranda, proses view halaman beranda selesai.

(53)

42

: form siswa : form siswa :siswa

:siswa

: c_siswa

: c_siswa : m_siswa: m_siswa

1: action view()

5:

3: read()

4: 2:

h) Sequence diagr am pada lihat profil siswa

Gambar 3.23 Sequence Diagram pada profil siswa

Sequence diagram diatas adalah urutan proses siswa dan guru untuk dapat melihat halaman profil siswa. dimuai dengan siswa dan guru membuka form login, dengan mengirim perintah actionView ke control profil siswa, yang kemudian oleh control diteruskan ke model profil siswa dengan read, respon tersebut dikembalikan ke control profil siswa dan diteruskan ke form profil siswa, terbuka halaman profil siswa, proses view halaman profil siswa selesai.

(54)

:siswa :siswa

: form guru

: form guru : c_guru : c_guru : m_guru: m_guru 1: action view()

5:

3: read()

4: 2:

i) Sequence diagr am pada lihat profil guru

Gambar 3.24 Sequence Diagram pada profil guru

Sequence diagram diatas adalah urutan proses siswa dan guru untuk dapat melihat halaman profil guru. dimulai dengan siswa dan guru membuka form login, dengan mengirim perintah actionView ke control profil guru, yang kemudian oleh control diteruskan ke model profil guru dengan read, respon tersebut dikembalikan ke control profil guru dan diteruskan ke form profil guru, terbuka halaman profil guru, proses view halaman profil guru selesai.

(55)

44

: form nilai : form nilai :siswa

:siswa

: c_nilai

: c_nilai : m_nilai: m_nilai 1: action view()

5:

3: read() 4: 2:

j) Sequence diagr am pada lihat nilai

Gambar 3.25 Sequence Diagram pada nilai

Sequence diagram diatas adalah urutan proses siswa dan guru untuk dapat melihat halaman nilai. dimuai dengan siswa dan guru membuka form login, dengan mengirim perintah actionView ke control nilai, yang kemudian oleh control diteruskan ke model nilai dengan read, respon tersebut dikembalikan ke control nilai dan diteruskan ke form beranda, terbuka halaman nilai, proses view halaman nilai selesai.

(56)

: form tagihan : form tagihan :siswa

:siswa

: c_tagihan

: c_tagihan : m_tagihan: m_tagihan

1: action view()

5:

3: read()

4: 2:

k) Sequence diagr am pada lihat tagihan

Gambar 3.26 Sequence Diagram pada tagihan

Sequence diagram diatas adalah urutan proses siswa dan guru untuk dapat melihat halaman tagihan. dimuai dengan siswa dan guru membuka form login, dengan mengirim perintah actionView ke control tagihan, yang kemudian oleh control diteruskan ke model tagihan dengan read, respon tersebut dikembalikan ke control tagihan dan diteruskan ke form tagihan, terbuka halaman tagihan, proses view halaman tagihan selesai.

(57)

46

3.4 Perancangan Database

Sebuah system aplikasi yang bersifat dinamis harus memiliki sebuah database atau sekumpulan data yang dapat di-input, diedit, dan dihapus oleh administrator. Sebelum membuat database, maka dibuatlah perancangan database yang terstruktur dengan CDM (Conceptual Data Model) dan PDM (Physical Data Model).

3.4.1 Conceptual Data Model (CDM)

CDM merupakan implementasi sistem untuk membuat database. Entity merupakan objek yang terlibat di dalam sistem. Untuk menghubungkan antar entitas dibutuhkan relationship. Selain itu, CDM dipakai utuk menggambarkan secara detail struktur basis data dalam bentuk logik. Struktur ini independen terhadap semua software maupun struktur data storage tertentu yang digunakan dalam aplikasi ini. CDM terdiri dari objek yang tidak diimplementasikan secara langsung kedalam basis data yang sesungguhnya.Dijelaskan pada gambar 3.27. Dalam perancangan database sistem penilaian artikel ilmiah dibawah ini memiliki sembilan entitas dan atribut sesuai dengan kebutuhannya yang saling berelasi antara entitas satu dengan entitas lainnya. Pada gambar 3.28 terdapat entitas dan atributnya antara lain tbsiswa, tbguru, tbnilai, tbtagihan, tbdiagram, tboutbox, tbsentitem, tbuser_admin, tblevel_admin, untuk dapatkan username dan password untuk login. Tbsiswa memiliki tiga relasi yaitu dengan tbnilai untuk mengisi nilai, tbtagihan untuk mengisi menu tagihan, dan tbuser_admin untuk mendapatkan username dan password untuk mengisi form login. Tbuser_admin berelasi dengan tblevel_user untuk mendapatkan level akses user dan admin. Tbguru berisikan

(58)

menempuh Vari abl e characters (20) Vari abl e characters (160) Vari abl e characters (2)

<M> Identi fi er_1 <pi >

data tentang guru dan tb diagram berisikan tentang diagram nilai dan mata pelajaran.tboutbox berelasi dengan tbsentitem untuk mengisi pada sms gateway.

Gambar 3.27 Conceptual Data Model (CDM)

3.4.2 Physical Data Model (PDM)

PDM adalah hasil generate dari CDM. Sebelum di generate, programmer bisa melakukan check model, untuk mengetahui apakah ada relasi yang error. Apabila error maka harus di ulangi proses relasinya, apabila sekedar warning maka masih bisa ditoleransi untuk melakukan generate.

(59)

48

Gambar 3.28 Physical Data Model (PDM)

Hasil PDM pada gambar 3.28 ini masih bisa di generate menjadi file database. Sehingga memudahkan programmer dalam aplikasi ke dalam sistem. Tabel – tabel database secara otomatis akan di import ke dalam phpmyadmin database. Hal ini mencegah terjadinya kesalahan dalam membuat field dan relasi di dalam sistem.

3.5 Perancangan Tabel

Dari CDM (Conceptual Data Model) dan PDM (Physical Data Model) sebelumnya, maka dapat dibuat tabel-tabel yang akan menjadi acuan dari pembuatan sebuah database.

Berikut ini adalah detail masing-masing tabel pada subbab berikut ini:

(60)

1) Tabel user_admin dan level_admin

Tabel tbuser_admin akan menyimpan username dan password login yang berhak mengakses pada halaman administrator dan halaman user. Dimana dalam tabel tbuser_admin ini nantinya menyimpan data masing- masing sebagai hak akses untuk masuk kedalam sistem. Selain itu tbuseradmin juga menyimpan username dan password yang bersangkutan untuk mengetahui hak akses sebagai admin dan user(siswa dan guru).

Tabel 3.1 tbuser_admin

FieldName Data Type Size Keterangan

Id_user Int 11

username Varchar 30 latin1_general_ci password Varchar 50 latin1_general_ci enkripsi Varchar 50 latin1_general_ci

Id_level int 11 latin1_general_ci

Tabel 3.2 tblevel_admin

FieldName Data Type Size Keterangan

Id_level Int 11

level Varchar 20 latin1_swedish_ci

2) Tabel Siswa

Tabel tbsiswa menyimpan data-data siswa mulai gambar, no induk, username siswa, password siswa, nama siswa, kelas, jurusan, alamat siswa, no telepon.

(61)

50

Tabel 3.3 tbsiswa

FieldName Data Type Size Keterangan

gambar Varchar 100

No_induk Varchar 10 latin1_swedish_ci username Varchar 10 lat in1_sw edish_ci password Varchar 10 lat in1_sw edish_ci Nama_siswa Varchar 20 lat in1_sw edish_ci kelas Varchar 5 lat in1_sw edish_ci jurusan Varchar 20 lat in1_sw edish_ci Alamat_siswa Varchar 50 lat in1_sw edish_ci No_telepon Varchar 12 lat in1_sw edish_ci 3) Tabel Guru

Tabel tbguru menyimpan data gambar, nip, nama guru, tanggal lahir, no telp, pendidikan terakhir, alamat guru.

Tabel 3.4 tbguru

FieldName Data Type Size Keterangan

gambar Varchar 100

Nip Varchar 20 latin1_swedish_ci

Nama guru Varchar 50 lat in1_sw edish_ci Tanggal lahir Varchar 60 lat in1_sw edish_ci No_telp Varchar 12 lat in1_sw edish_ci Pend terakhir Varchar 30 lat in1_sw edish_ci Alamat_guru Varchar 100 lat in1_sw edish_ci

(62)

4) Tabel Nilai

Tabel tbnilai menyimpan data id nilai, no induk, mata pelajaaran, nilai uts, nilai uas, KKM.

Tabel 3.5 tbnilai

FieldName Data Type Size Keterangan

Id_nilai int 11

No induk Varchar 10 latin1_swedish_ci Mata pelajaran Varchar 50 lat in1_sw edish_ci

Nilai uts int 11

Nilai uas int 11

KKM int 11

5) Tabel Tagihan

Tabel tbnilai menyimpan data id tagihan, no induk, tanggal, jenis tagihan, jumlah, denda, keterangan.

Tabel 3.6 tbtagihan

FieldName Data Type Size Keterangan

Id_tagihan int 11

tanggal date

Jenis tagihan Varchar 10 lat in1_sw edish_ci jumlah Varchar 20 lat in1_sw edish_ci denda Varchar 10 lat in1_sw edish_ci keterangan Varchar 20 lat in1_sw edish_ci

(63)

52

6) Tabel Outbox

Tabel tboutbox menyimpan data id, sending date time, destination number, text decoded.tb outbox ini digunakan utuk sms gateway untuk pesan keluar dan membuat form sent sms

Tabel 3.7 tboutbox

FieldName Data Type Size Keterangan

id Int 11

Sendingdatetime Timestamp Destination

number Varchar 20

lat in1_general_ci

Text decoded Varchar 160 lat in1_general_ci

7) Tabel Sentitems

Tabel tbsentitems menyimpan data id, deliverydatetime, destination number, text decoded, status. tb sentitems ini digunakan untuk sms gateway untuk pesan yang sudah terkirim.

Tabel 3.8 tbsentitems

FieldName Data Type Size Keterangan

id Int 11

deliverydatetime Timestamp Destination

number Varchar 20

lat in1_general_ci

Text decoded Varchar 160 lat in1_general_ci status enum(‘sendin

g ok’’sending ok no report’)

latin1_general_ci

(64)

8) Tabel Diagram

Tabel tbdiagram menyimpan data id,matapelajaran .tbdiagram ini digunakan diagram sebuah nilai.

Tabel 3.9 tbdiagram

FieldName Data Type Size Keterangan

Id Int 11

matapelajaran Varchar 20 latin1_swedish_ci

3.6 Perancangan Antar Muka

Perancangan Antar Muka (interface) yang dibuat pada website dan telah ter-design dengan teratur sebagai berikut :

1) Tampilan awal website

Untuk perkiraan tampilan awal website seperti pada gambar dibawah ini. Terdapat logo dan gambar dibagian baris atas, menu atas, contents dan contents samping kanan.

Gambar 3.29 Tampilan Awal website

(65)

54

2) Tampilan Halaman Login

Pada gambar dibawah ini menjelaskan tentang untuk pengisian form login yang terdapat di menu akun.

Gambar 3.30 Tampilan Halaman login

3) Tampilan Halaman profil siswa

Halaman profil siswa ini di gunakan untuk siswa dan guru melihat tentang informasi siswa yang berisi gambar, username,password, nama, kelas, jurusan,alamat dan nomer telepon

Gambar 3.31 Tampilan Halaman Siswa

(66)

4) Tampilan Halaman Profil guru

Halaman profil guru ini di gunakan untuk siswa dan guru melihat tentang informasi guru yang berisi gambar, nip, nama guru, tanggal lahir, no telp,pendidikan terakhir dan alamat.

Gambar 3.32 Tampilan Halaman Profil Guru

5) Tampilan Halaman Nilai

Halaman nilai ini di gunakan untuk siswa dan guru melihat tentang informasi nilai yang diinputkan oleh admin yang berisi nilai yang berupa tabel.

Gambar 3.34 Tampilan Halaman Nilai

(67)

56

6) Tampilan Halaman Tagihan

Halaman tagihan ini di gunakan untuk siswa dan guru tentang informasi tagihan yang di inputkan oleh admin yang berisi tagihan siswa yang berupa tabel dan guru akan tau mana siswa yang sudah membayar dan belum membayar

Gambar 3.35 Tampilan Halaman Tagihan 7) Tampilan Halaman Register

Halaman register ini di gunakan untuk siswa dan guru melakukan pengisian agar dapat masuk ke halaman yang di buat oleh admin dan untuk mendapatkan username dan password.

Gambar 3.6 Tampilan halaman Register

(68)

57 BAB IV

HASIL DAN PEMBAHASAN

Pada bab ini akan dibahas mengenai hasil dan pembahasan dari perancangan sistem website yang telah dibuat pada bab sebelumnya. Bagian implementasi sistem website ini meliputi: implementasi proses, implementasi database, dan uji coba .

4.1 Spesifikasi Sistem

Peralatan yang digunakan untuk semua proses dari keseluruhan transaksi yang ada termasuk pembuatan laporan adalah menggunakan perangkat keras dan perangkat lunak. Pada proses pengujian ini dibutuhkan beberapa peralatan-peralatan baik berupa perangkat keras dan perangkat lunak.

4.1.1 Perangkat Keras (Hardware) yang Digunakan

Laptop acer, Type Aspire 4736, Memori RAM 1GB, Intel® Core™2 Duo Processor T6600(2,2GHz, 800 MHz FSB, 2MB L2 Cache) Intel® GMA 4500MHD, HDD 320GB.

4.1.2 Perangkat Lunak (Software) yang Digunakan 1) Sistem Operasi Microsoft Windows 7 Ultimate 2) Microsoft Visio

3) Rasional Rose 4) Adobe Photoshop

(69)

58

5) Xampp

6) Microsoft office 2007 7) NotePad C++

8) Mozilla Firefox 4.2 Implementasi Pr oses

Pada perancangan proses dijelaskan pembuatan proses bagaimana sistem aplikasi website ini diatur dan ditata sehingga setiap entitas saling ber-relasi dengan baik.

4.2.1 Halaman Menu Utama

Pada gambar 4.1 merupakan tampilan pada saat akses halaman utama dari Sistem Informasi Akademik Di SMK Sepuluh Nopember. Terdapat menu beranda, Profil Siswa, Profil Guru, Nilai, Tagihan, SMS dan Akun. Menu samping dari halaman utama ini terdapat Koneksi ke facebook, twetter

Gambar 4.1 halaman utama Web SMK Sepuluh Nopember

(70)

1) Menu Login

Pada Gambar 4.2 merupakan tampilan halaman menu login siswa dan admin untuk masuk ke halaman menu selanjutnya.halaman login ini di kelola oleh admin.

Gambar 4.2 halaman menu login

Dibawah ini merupakan syntax menampilkan halaman login yang sudah tersimpan di dalam database.

<h1>Login</h1>

<p>Silakan mengisi username dan password dibawah ini:</p>

<div class="form">

<?php $form=$this->beginWidget('CActiveForm', array(

'id'=>'login-form',

'enableClientValidation'=>true,

'clientOptions'=>array(

'validateOnSubmit'=>true,

),

)); ?>

<p class="note">Fields with <span class="required">*</span> are required.</p>

<div class="row">

<?php echo $form->labelEx($model,'username'); ?>

(71)

60

<?php echo $form->textField($model,'username'); ?>

<?php echo $form->error($model,'username'); ?>

</div>

<div class="row">

<?php echo $form->labelEx($model,'password'); ?>

<?php echo $form->passwordField($model,'password'); ?>

<?php echo $form->error($model,'password'); ?>

</div>

<div class="row rememberMe">

<?php echo $form->checkBox($model,'rememberMe'); ?>

<?php echo $form->label($model,'rememberMe'); ?>

<?php echo $form->error($model,'rememberMe'); ?>

</div>

<div class="row buttons">

<?php echo CHtml::submitButton('Login'); ?>

</div>

2) Menu r egister

Pada Gambar 4.3 merupakan tampilan halaman register bagi user yang belum terdaftar. siswa wajib mengisi semua data yang terdapat pada form ini, data yang di masukkan adalah username da password .

Gambar 4.3 halaman menu register

Gambar

Gambar 3.1 Alur Program SMK Sepuluh Nopember
Gambar 3.2 Use Case Diagram Program
Gambar 3.3 Activity Diagram Pada login
Gambar 3.4 Activity Diagram Pada mengelola beranda
+7

Referensi

Dokumen terkait

Acitivy diagram maintenance artikel berawal dari admin mengakses page admin pada website , kemudian admin harus melakukan verifikasi login terlebih dahulu yang

Activity diagram supervisor menggambarkan segala aktivitas yang bisa dilakukan oleh supervisor terhadap sistem yang dimulai dengan melakukan login terlebih dahulu

admin harus login terlebih dahulu sebelum mengakses sistem informasi akademik pada SMPIT Thariq Bin Ziyad (Boarding School) bagian admin bisa mengelola data siswa, data

Pada activity diagram, admin harus melakukan login terlebih dahulu dengan memasukan username dan password yang benar dengan hak akses dapat menginput, melihat, menyimpan

Yang pertama adalah tampilan halaman login admin, halaman login merupakan halaman awal yang akan muncul ketika admin membuka web Sistem Informasi Geografis Pencarian Rute

Activity diagram pada admin ini menggambarkan pegawai kantor camat dapat melakukan login terlebih dahulu, apabila telah login dengan benar maka akan masuk kedalam

Mengelola Halaman Admin Admin Login Login Input username, password, captcha Input username, password, captcha Mengelola data member Mengelola data member Halaman admin Halaman

Gambar 3.11 Activity Diagram Halaman Login 10.Activity Diagram Halaman Profil PMI Admin Activity Diagram dibawah ini menggambarkan aktivitas admin ketika proses melihat halaman stok