verifikasi sertifikat kegiatan ekstrakurikuler - e-Campus

VERIFIKASI SERTIFIKAT KEGIATAN EKSTRAKURIKULER

MAHASISWA BERBASIS QR CODE DI PROGRAM STUDI

PENDIDIKAN TEKNIK INFORMATIKA DAN KOMPUTER

IAIN BUKITIINGGI

Diajukan Sebagai Salah Satu Syarat Mendapatkan Gelar Strata Satu (S1) pada

Jurusan Pendidikan Teknik Informatika dan Komputer

SKRIPSI

MUTIA MALIDA HUSNA

NIM : 2516.009

PEMBIMBING

Dr. SUPRATMAN ZAKIR, M.Pd, M.Kom

197508192006041001

NIP. 197508192006041001

PERSETUJUAN PEMBIMBING

PROGRAM STUDI PENDIDIKAN TEKNIK INFORMATIKA DAN KOMPUTER

FALKULTAS TARBIYAH DAN ILMU KEGURUAN

INSTITUT AGAMA ISLAM NEGERI (IAIN) BUKITTINGGI

2020/1441

Skripsi dengan judul "VERIFIKASI SERTIFIKAT KEGIATAN

EKSTRAKURIKULER MAHASISWA BERBASIS R CODE DI PTIK IAIN

BUKITTINGGI " telah memenuhi persetujuan ilmiah untuk diajukan kesidang

munaqasah.

Demikian persetujuan ini diberikan untuk dapat digunakan sebagaimana

mestinya

Bukitinggi, 02 November 2020

Dr. SUPRATMAN ZAKIR, M.Pd, M.Kom

197508192006041001

SURAT PERNYATAAN

Saya yang bertanda tangan di bawah ini:

Nama / NIM : Mutia Malida Husna / 2515009

Tempat / Tanggal Lahir : Kutacane / 07 Oktober 1998

Falkultas / Jurusan : FTIK / PTIK

Judul Skripsi : "VERIFIKASIS SERTIFIKAT KEGIATAN

EKSTRAKURIKULER MAHASISWA BERBASIS

QR CODE DI PTIK IAIN BUKITTINGGI"

Menyatakan dengan sesungguhnya bahwa karya ilmiah (skripsi) saya

dengan judul diatas benar hasil karya sendiri. Apabila dikemudian terbukti bahwa

skripsi ini bukan karya penulis, maka penulis bersedia diproses sesuai humum

yang berlaku agar gelar sarjana penulis dicopot sampai batas waktu yang

ditentukan.

Demikian pernyatan ini saya buat dengan sesungguhnya untuk

dipergunakan sebagaiman mestinya.

Bukittinggi, Oktober 2020

Saya yang menyatakan

Mutia Malida Husan

NIM. 2516009

i

KATA PENGANTAR

Alhamdulillahi Robbil ' Alamin segala puji bagi Allah SWT Tuhan semesta

alam, tiada daya dan upaya terkecuali hanya dari Nya Tuhan yang kuasa, tak ada

satupun nikmat yang dapat didustakan. Salah satunya dengan selesainya penulisan

skripsi ini, serta pendidikan penulis pada Institut Agama Islam Negeri (IAIN)

Bukittinggi.

Shalawat serta salam tak lupa luputnya dimohonkan kepada Allah SWT

untuk disampaikan kepada junjungan alam nabi besar Muhammad SAW yang telah

membawa umat dan peradapan dari kegelapan menuju cahaya indahnya iman dan

ilmu pengetahuan, yang melepaskan umat dari kehinaan menuju sebaik-baiknya

ciptaan Sang Kuasa.

Penulisan skripsi ini tidak akan dapat selesai tanpa adanya bantuan dari

berbagai pahak, pada kesempatan ini penulis ingin mengucapkan terimakasi

sedalam – dalamnya kepada:

1. Ibu Dr. Ridha Ahida, M.Hum Selaku Rektor IAIN Bukittinggi, dan Bapak Dr.

Asyari, S.Ag, M.Si Selaku wakil rektor I, dan Bapak Dr. Novi Hendri, M.Ag

Selaku wakil rektor II, dan Bapak Dr. Miswardi, M.Hum Selaku wakil rektor

III.

2. Ibu Dr. Zulfani Sesmiarni, M.Pd selaku Dekan, Bapak Dr. Iswantir M, M.Ag

ii

selaku Wakil Dekan I, Bapak Charles, S.Ag, M.Pd.I selaku Wakil Dekan II,

beserta Bapak Dr. Supratman Zakir, M.Pd, M.Kom selaku Wakil Dekan III

Institut Agama Islam Negeri (IAIN) Bukittinggi.

3. Bapak Riri Okra, M.Kom selaku Ketua Program Studi Pendidikan Teknik

Informatika dan Komputer IAIN Bukittinggi.

4. Bapak Dr. Supratman Zakir, M.Pd, M.Kom selaku pembimbing dan juga

selaku dosen penasehat akademik (PA) yang telah memberikan, bimbingan,

arahan dan motivasi kepada penulis untuk menyelesaikan skripsi ini dan juga

perkuliahan di IAIN Bukittinggi.

5. Bapak dan ibu dosen PTIK yang telah ikhlas mengajarkan dan memberikan

ilmunya serta memberi motivasi kepada penulis baik selama perkulihan

maupun di luar perkulahan.

6. Bapak dan Ibu staf pengajar Fakultas Tarbiyah dan Ilmu Keguruan IAIN

Bukittinggi.

7. Teman – teman (rekan-rekan) HMPS PTIK dimana telah bersedia

memberikan izin meluangkan waktunya serta memberikan data dan informasi

yang penulis butuhkan dalam menyelesaikan skripsi ini.

Teman – teman seperjuangan yang telah memberikan waktunya, bantuan,

dukungan, motivasi dan sabar dalam menemani dalam penyelesaian skripsi ini.

Khususnya teman – teman PTIK A 16, teman sePTIK yang selalu memberikan

dorongan dan bantuan bagi penulis dalam menyelesaikan skrpsi ini. Semua pihak

iii

yang terlibat dan membantu penulis selama menyelesaikan studi di IAIN

Bukittinggi tanpa terkecuali yang tidak bisa penulis sebutkan satu persatu,

Jazakallahu Khairan semoga Allah membalas segala kebaikan dengan kebaikan

lainnya.

Penulis menyadari bahwa dalam penulisan skripsi ini masih terdapat

kekurangan dan jauh dari kesempurnaan, maka dari itu untuk kritik dan saran yang

membangun sangat diharapkan dari semua pihak untuk kesempurnaan skripsi ini

dan semoga dapat bermanfaat bagi semua terutama bagi penulis Aamiin.

Bukittinggi, Oktober 2020

Penulis

Mutia Malida Husna

NIM. 2516009

iv

ABSTRAK

Mutia Malida Husna, 2516009 "Verifikasi Sertifikat Kegiatan Ekstrakurikuler Mahasiswa Berbasis Qr Code Di Program Studi Pendidikan Teknik Informatika dan Komputer IAIN Bukittinngi"

Verifikasi sertifikat yang dilakukan masih secara manual. Dimana proses verifikasi hanya dengan memperlihatkan blanko kegiatan ekstrakurikuler mahasiswa dan proses pencocokan belum memiliki acuan yang pasti dan sesuai kondisi yang sebenarnya, hal ini dapat menyebabkan pemalsuan sertifikat oleh pihak tertentu untuk tujuan – tujun tertentu. Penelitian ini bertujuan untuk menciptakan sistem verifikasi sertifikat kegiatan ekstrakurikuler mahasiswa berbasis Qr Code di Program Studi Pendidikan Teknik Informatika dan Komputer IAIN Bukittinggi berbasis web.

Jenis penelitian yang penulis gunakan adalah penelitian Research and Development (R&D). Model yang digunakan adalaah 4D yang dikembangan oleh Thiagarajan, 4D terdiri dari Define, Design, Develop, dan Disseminate. Model pengembangan sistem menggunakan System Development LIFE Cycle (SDLC) dengan pendekatan Waterfall yang dikembangkan oleh Pressman, waterfall terdiri dari Communication, Planning, Modeling, Construction, Deployment.

Hasil uji produk yang penulis lakukan, yang pertama adalah uji validitas dilakukan oleh tiga orang dua diantaranya adalah ahli komputer dan satu ahli pendidikan di peroleh nilai 0,80 yang dinyatakan valid berdasarkan rumus Aiken's V, kedua uji praktikalitas dari empat orang praktis dengan nilai 0.86 dengan hasil sangat praktis berdasarkan rumus Momen Kappa dan yang ketiga uji efektifitas oleh 10 orang mahasiswa atau user diperoleh nilai 0.90 sangat efektif sesuai dengan rumus G score.

Berdasarkan hasil uji produk ini, dapat meningkatkan kevalitan data sertifikat kegiatan ekstrakurikuler oleh dosen PA dan stackeholder serta pihak HMPS dan Ka. Prodi dalam mendata dan memberikan informasi ke user secara cepat, tepat dan valid. Sehingga hasil yang didapatkan lebih efektif dan efesien dari segi waktu, biaya dan tenaga. Keywrod : Verifikasi, Sertifikat, Qr Code, R&D, 4D, Waterfall, Web

v

DAFTAR ISI

HALAMAN JUDUL

HALAMAN PERSEMBAHAN

HALAMAN PESERTUJUAN

HALAMAN PERNYATAAN

KATA PENGANTAR ........................................................................................... i

ABSTRAK ............................................................................................................ iv

DAFTAR ISI ......................................................................................................... v

DAFTAR TABEL ............................................................................................... vii

DAFTAR GAMBAR .......................................................................................... viii

DAFTAR LAMPIRAN ......................................................................................... x

BAB I PENDAHULUAN

A. Latar Belakang Masalah .................................................................................. 1 B. Identifikasi Masalah ........................................................................................ 4 C. Batasan Masalah .............................................................................................. 4 D. Rumusan Masaalah ......................................................................................... 5 E. Tujuan Penelitian ............................................................................................. 5 F. Manfaat Penelitian ........................................................................................... 5 G. Penjelasan Judul .............................................................................................. 6 H. Sistematika Penulisan ...................................................................................... 8

BAB II LANDASAN TEORI A. Verifikasi .......................................................................................................... 9

1. Pengertian Verifikasi .................................................................................. 9 B. Setifikat Kegiatan Ekstrakurikuler ................................................................. 10

1. Pengertian Sertifikat ................................................................................. 10 2. Pengertian Kegiatan Ekstrakurikuler ....................................................... 10 3. Pengertian Sertifikat Kegiatan Ekstrakurikuler........................................ 11

C. Qr Code .......................................................................................................... 11 1. Pengertian Qr Code .................................................................................. 11 2. Versi Qr Code .......................................................................................... 13 3. Koreksi Kesalahan Pada Qr Code ............................................................ 14 4. Manfaat Qr Code ...................................................................................... 15 5. Qr Generator ............................................................................................. 16

D. Sofware Perancangan Sistem ......................................................................... 16 1. PHP .......................................................................................................... 16

vi

2. MySQL ..................................................................................................... 17 3. Xampp ...................................................................................................... 17 4. Dreamweaver ........................................................................................... 18 5. Framewrok Bootstrap ............................................................................... 18 6. Web .......................................................................................................... 19 7. Browser .................................................................................................... 19

E. Alat Bantu Perancangan Sistem 1. UML ......................................................................................................... 20 2. Flowchart .................................................................................................. 27

BAB III METODOLOGI PENELITIAN A. Tempat dan Waktu Penelitian ........................................................................ 34 B. Jenis Penelitian ............................................................................................... 34 C. Model Pengembangan Sistem ........................................................................ 37 D. Tahapan Penelitian ......................................................................................... 40 E. Uji Produk ...................................................................................................... 44

1. Uji Validasi Produk .................................................................................. 44 2. Uji Praktikalitas Produk ........................................................................... 45 3. Uji Efektifitas Produk .............................................................................. 47

BAB IV PEMBAHASAN A. Hasil Penelitian .............................................................................................. 49

1. Define ....................................................................................................... 51 2. Design ...................................................................................................... 58 3. Develop .................................................................................................... 58 4. Disseminate ............................................................................................ 114 5. Uji Produk ....................................................................................................

a. Uji Validitas Produk ............................................................................... b. Uji Praktikalitas Produk ......................................................................... c. Uji Efektifitas Produk ............................................................................

BAB VPENUTUP A. Kesimpulan .................................................................................................. 122 B. Saran ............................................................................................................. 122 DAFTAR PUSTAKAT

LAMPIRAN

vii

DAFTAR TABEL

Tabel 2.1 Level Koreksi Kesalahan ............................................................................... 14

Tabel 2.2 Simbol – Simbol Use Case Diagram ............................................................. 20

Tabel 2.3 Simbol – Simbol Activity Diagram ................................................................ 22

Tabel 2.4 Simbol – Simbol Sequence Diagram ............................................................. 24

Tabel 2.5 Simbol – Simbol Class Diagram ................................................................... 26

Tabel 2.6 Simbol – Sombol Flowchart .......................................................................... 28

Tabel 3.1 Nilai Validitas Dengan Aiken's V .................................................................. 45

Tebel 3.2 Katagori Keputusan Berdasarkan Momen Kappa .......................................... 46

Tabel 3.3 Katagori Hasil Analisis Menggunakan Gain Score ....................................... 48

Tabel 4.1 Penjadwalan Proyek ....................................................................................... 65

Table 4.2 File Admin ..................................................................................................... 101

Table 4.3 File Data Sertifikat ........................................................................................ 102

Tabel 4.4 Hasil Uji Front-End Menggunakan Blackbox Testing ................................... 110

Tabel 4.5 Hasil Uji Front-End Untuk Membaca Qr Code Menggunakan Blackbox

Testing ............................................................................................................................ 111

Tabel 4.6 Hasil Uji Back-End Menggunakan Blackbox Testing .................................... 112

Tabel 4.7 Hasil Uji Validitas Produk ............................................................................. 117

Tabel 4.8 Hasil Uji Praktikalitas Produk ....................................................................... 119

Tabel 4.9 Hasil Uji Efektifitas Produk ........................................................................... 121

viii

DATAR GAMBAR

Gambar 2.1 Qr Code Dan Bagiannya ............................................................................ 12

Gambar 2.2 Versi Qr Code.................................................................................................. 14

Gambar 3.1 Pengembangan Model 4d Thiagarajan ............................................................ 35

Gambar 3.2 Warterfall Pressman ....................................................................................... 38

Gambar 3.3 Tahapan Penelitian .......................................................................................... 40

Gambar 4.1 Alur Akses User Ke Sistem ............................................................................ 52

Gambar 4.2 Alur Akses User Membaca Qr Code............................................................... 53

Gambar 4.3 Alur Akses Admin Ke Sistem ......................................................................... 54

Gambar 4.4 Sistem Front – End ......................................................................................... 55

Gambar 4.5 Desain Sistem Akses Front – End Membaca Qr Berbasis Android ............... 56

Gambar 4.6 Desain Web Admin ......................................................................................... 57

Gambar 4.7 User Case Diagram Admin Sistem Verifikasi Sertifikat Berbasis Qr

Code ......... .......................................................................................................................... 71

Gambar 4.8 User Case Diagram User Sistem Verifikasi Sertifikat Berbasis Qr

Code ........ .......................................................................................................................... 72

Gambar 4.9 Activity Diagram Admin ................................................................................. 75

Gambar 4.10 Activity Diagram Dosen Pa ........................................................................... 76

Gambar 4.11 Activity Diagram Dosen Pa Menscanner Qr Code Di Sertifikat ................... 77

Gambar 4.12 Activity Digram Stackeholder ....................................................................... 79

Gambar 4.13 Actvity Diagram Stackeholder Menscanner Qr Di Sertifikat ........................ 80

Gambar 4.14 Sequence Diagram Admin ............................................................................. 81

Gambar 4.15 Sequence Diagran Dosen Pa ......................................................................... 82

ix

Gambar 4.16 Sequence Diagram Dosen Pa Mensecenner Qr Code Di Sertifikat .............. 83

Gambar 4.17 Sequence Diagram Stackeholder .................................................................. 84

Gambar 4.18 Sequence Diagram Stackeholder Mensecenner Qr Di Sertifikat .................. 85

Gambar 4.19 Class Diagram............................................................................................... 86

Gambar 4.20 Desain Menu Home ....................................................................................... 88

Gambar 4.21 Desain Menu Panduan Pengguna .................................................................. 88

Gambar 4.22 Desain Data Sertifikat ................................................................................... 89

Gambar 4.23 Desain Detai Sertifikat .................................................................................. 90

Gambar 4.24 Desain Lihat Sertifikat .................................................................................. 90

Gambar 4.25 Desain Datail Data Sertifikat Berbasis Android ........................................... 91

Gambar 4.26 Desain Foto Sertifikat Berbasis Android ...................................................... 92

Gambar 4.27 Desain Unduh Foto Sertifikat Berbasis Android........................................... 93

Gambar 4.28 Desain Menu Dashboard Admin .................................................................. 93

Gambar 4.29 Desain Menu Panduan ................................................................................... 94

Gambar 4.30 Desain Menu Generate Link .......................................................................... 95

Gambar 4.31 Desain Menu Tampil Data Sertifikat ............................................................. 96

Gambar 4.32 Desain Menu Mencetak Data Sertifikat Secara Keseluruhan........................ 96

Gambar 4.33 Desain Menu Mencetak Data Sertifikat Secara Individu .............................. 97

Gambar 4.34 Desain Halaman Login Admin ...................................................................... 98

Gambar 4.35 Desain Halaman Tambah Data ...................................................................... 99

Gambar 4.46 Desain Halaman Update Data ....................................................................... 100

x

DAFTAR LAMPIRAN

Lampiran I Listing Program ........................................................................................... 124

Lampiran II Cara Penggunaan ....................................................................................... 156

Lampiran III Flowchar ................................................................................................... 171

Lampiran IV Uji Produk ................................................................................................ 177

Lampiran V Administrasi .............................................................................................. 204

1

BAB I

PENDAHULUAN

A. Latar Belakang Masalah

Pada era disruptif 4.0 saat ini teknologi informasi memberikan

pengaruh yang sangat besar pada setiap kehidupan manusia hampir di setiap

bidang kehidupan. Dengan adanya perkembangan pada bidang teknologi kini

ikut serta mempengaruhi Perguruan Tinggi dalam kegiatan pelayanan

akademik. Salah satunya bertujuan untuk meningkatkan efektifitas dan

efisiensi kerja.

Seiring perkembangan teknologi informasi yang sangat pesat maka,

cara kita dalam berkomunikasi dan menerima informasi juga berubah

mengikuti perkembangan teknologi informasi tersebut, dimana tindak

kecurangan juga dapat semakin mudah dilakukan sehingga membuat kita

susah membedakan mana informasi yang benar dan mana informasi yang

salah. Oleh karena itu perlunya melakukan pengecekan akan kebenaran

informasi yang di terima. Hal ini sejalan dengan surah Al – Hujarat Ayat 6

Allah berfirman;

لة فت ا بجه ا أن تصيبوا قوم بنبإ فتبينوا إن جاءكم فاسق أيها ٱلذين ءامنو ما ي ل وا صب

دمين ٦ فعلتم ن

Artinya : "Hai orang-orang yang beriman, jika datang kepadamu orang fasik membawa suatu berita, maka periksalah dengan teliti agar kamu tidak menimpakan suatu musibah kepada suatu

2

kaum tanpa mengetahui keadaannya yang menyebabkan kamu menyesal atas perbuatanmu itu".[1]

Dari ayat diatas kita dapat memahami pentingnya pengecekan akan

informasi yang kita dapatkan, baik dalam lingkup sosial maupun lingkup

pendidikan, dimana pada Perguruan Tinggi sertifikat menjadi sebuah

dokumen yang penting.

Sertifikat adalah tanda atau surat keterangan (pernyataan) tertulis atau

tercetak dari orang yang berwenang yang dapat digunakan sebagai bukti

pemilikan atau bukti dari suatu kejadian[2]. Sertifikat merupakan surat tanda

bukti hak yang berlaku sebagai alat pembutian yang kuat mengenai data fisik

dan data yuridis yang termuat di dalamnya[3]. Sedangkan kegiatan

Ekstrakurikuler adalah kegiatan yang dilakukan di luar program yang tertulis

di dalam kurikulum, seperti latihan kepemimpinan, kegiatan olahraga dan

lainnya[4].

Sertifikat kegiatan eksrtakurikuler adalah sertifikat yang di keluarkan

sebagai bukti atau keterangan terhadap suatu kegiatan eksrtakurikuler yang

telah di ikuti. Karena sertifkat merupakan salah satu dokumen penting bagi

Perguruan Tinggi maka perlu adanya verifikasi yang dilakukan untuk

membuktikan keaslian sertifikat tersebut, hal ini dilakukan agar tidak ada

pemalsuan dan penyalahgunaan dari sertifikat tersebut.

Verifikasi merupakan pemeriksaan tentang suatu kebenaran atas

laporan, pernyataan, perhitungan dan lain-lain, yang bertujuan untuk

membuktikan kebenaran dan keaslian[5]. Salah satu verifikasi yang dapat

3

digunakan adalah verifikasi berbasis Qr Code, dimana Qr Code adalah

sebuah kode batang dua dimensi yang ditemukan oleh sebuah perusahaan

Jepang Bernama Denso Wave dapa tahun 1994. Qr Code adalah

pengembangan dari kode batang sebelumnya. Qr code dapat menyimpan data

secara vertikal dan horizontal[6].

Permasalahan yang penulis temui di IAIN Bukittinggi khususnya di

program studi pendidikan teknik informatika dan komputer adalah belum

adanya sistem verifikasi keaslian sertifikat kegiatan ekstrakurikuler di IAIN

Bukittinggi khususnya di program studi pendidikan teknik informatika dan

komputer atau masih dilakukan secara konvensional, dimana tahapan ini

memiliki alur sebagai berikut mahasiswa mempersiapkan sertifikat kegiatan

ekstrakurikuler yang asli dan salinan sertifikat serta blanko pengajuan angka

kredit mahasiswa untuk kemudian diserahkan kepada dosen Penasehat

Akademik untuk proses pemeriksaan dan pengesahan dengan tanda tangan.

Dalam pengecekan sertifikat kegiatan ekstrakurikuler dosen penasehat

akademik masih belum mempunyai data yang dapat dijadikan sumber atau

acuan untuk memeriksa kebenaran dan keaslian sertifikat kegiatan

ekstrakurikuler maupun kesesuaian sertifikat kegiatan ekstrakurikuler dengan

blanko yang diberikan oleh mahasiswa, sehingga dapat terjadi manipulasi

data, seperti mengubah, menambah, menghapus dan mempalsukan data yang

tidak sesuai dengan fakta di lapangan. Hal ini disebabkan karena belum

adanya keamanan data yang digunakan.

4

Dari penjelasan diatas maka penulis mengangkat permasalahan

tersebut untuk diteliti dengan judul "Verifikasi Sertifikat Kegiatan

Ekstrakurikuler Mahasiswa Berbasis Qr Code Di Program Studi

Pendidikan Teknik Informatika dan Komputer IAIN Bukitiinggi".

B. Indetifikasi Masalah

Berdasarkan latar belakang masalah yang telah diuraikan diatas

penulis dapat mengidentifikasi bahwa pokok permasalahan yang dihadapi

yaitu :

1. Sering terjadi pemalsuan sertifikat kegiatan ekstrakurikuler

mahasiswa di IAIN Bukittinggi khususnya di program studi PTIK.

2. Belum adanya sistem verifikasi sertifikat kegiatan ekstrakurikuler

mahasiswa di IAIN Bukittinggi khususnya di program studi PTIK.

C. Batasan Masalah

Berdasarkan identifikasi masalah diatas maka prnulis merasa perlu

untuk membatasinya, agar pembahasan ini tidak terlalu luas, adapun batasan

masalah yaitu perancangan sisem "Verifikasi Sertifikat Kegiatan

Ekstrakurikuler Mahasiswa Berbasis Qr Code Di Program Studi Pendidikan

Teknik Informatika dan Komputer IAIN Bukittinggi" dengan tampilan Web

menggunakan bahasa Pemrograman PHP/MySQL. Tampilan sistem ini

nantinya akan di buat secara sederhana namun menarik, agar mudah

digunakan.

5

D. Rumusan Masalah

Merujuk pada batasan masalah, maka masalah yang akan diteliti

adalah bagaimanakah sistem "Verifikasi Sertifikat Kegiatan Ekstrakurikuler

Mahasiswa Berbasis Qr Code Di Program Studi Pendidikan Teknik

Informatika dan Komputer Iain Bukitiinggi" dengan tampilan Web

menggunakan bahasa pemrograman PHP/MySQL ?

E. Tujuan Penelitian

Penelitian ini bertujuan untuk menghasilkan sistem "Verifikasi

Sertifikat Kegiatan Ekstrakurikuler Mahasiswa Berbasis Qr Code Di Program

Studi Pendidikan Teknik Informatika dan Komputer Iain Bukitiinggi" dengan

tampilan Web menggunakan bahasa pemrograman PHP/MySQL.

F. Manfaat Penelitian

Adapun manfaat penelitian ini adalah :

1. Bagi Penulis

Manfaatnya bagi Penulis, adalah:

a. Untuk menyelesaikan studi pada Fakultas Tarbiyah dan Ilmu

Keguruan, Program Studi Pendidikan Teknik Informatika dan

Komputer dan memenui salah satu syarat guna memproleh gelar

S.Pd di IAIN Bukittinggi.

b. Menambah pengetahuan dan kemampuan penulis.

c. Mengaplikasikan ilmu yang didapatkan selama Studi.

6

2. Bagi Tempat Penelitian

Adapun manfaatnya bagi Tempat Penelitian adalah :

a. Sistem Verifikasi Sertifikat Menggunakan Qr code di PTIK

IAIN Bukitiinggi akan mempercept proses pemeriksaan data

sertifikat.

b. Sistem Verifikasi Sertifikat Menggunakan Qr code di PTIK

IAIN Bukitiinggi akan memberikan keamanan dan keakuratan

data sertifikat tersebut.

c. Sistem Verifikasi Sertifikat Menggunakan Qr code di PTIK

IAIN Bukitiinggi juga lebih efektif dan efesien dalam

penerapannnya.

3. Bagi Pembaca

Adapun manfaatnya bagi Pembaca, adalah:

Dapat menembah pengetahuan dan wawasan pembaca mengenai "

Verifikasi Sertifikat Kegiatan Ekstrakurikuler Mahasiswa Berbasis Qr code

Di Program Studi Pendidikan Teknik Informatika dan Komputer Iain

Bukitiinggi" dengan tampilan Web menggunakan bahasa pemrograman

PHP/MySQL.

G. Penjelasan Judul

Untuk memudahkan dalam membaca Skripsi ini dan menghindari

kesalahpahamanan terhadap judul Skripsi ini, maka Penulis perlu

menjelsakan beberapa istilah yang terdapat dalam judul tersebut yaitu :

7

Verifikasi : Pemeriksaan tentang suatu kebenaran atas

laporan, pernyataan, perhitungan dan lain-lain[5].

Sertifikat : Sertifikat adalah tanda atau surat keterangan

(pernyataan) tertulis atau tercetak dari orang yang

berwenang yang dapat digunakan sebagai bukti

pemilikan atau bukti dari suatu kejadian[2].

Qr Code : Qr Code atau Quick Response Code adalah kode

batang dua dimensi yang dapat menyimpan data

secara vertikal dan horizontal[6].

PHP : Bahasa script server-side dalam pengembangan

web yang disisipkan pada dokumen HTML[7].

MySQL : Program database server yang mampu menerima

dan mengirimkan data dengan sangat cepat, multi

user serta menggunakan perintah standar SQL

(Structured Query Language) dan baik digunakan

sebagai client maupun server[8].

Web : Kumpulan halaman-halaman yang berisi

informasi yang disimpan diinternet yang bisa

diakses atau dilihat melalui jaringan internet pada

perangkat yang bisa mengakses internet yaitu

komputer[9].

8

H. Sistematika Penulisan

Penyusunan proposal ini terbagi menjadi 3 bab, uraian dan penjelasan

secara singkat adalah sebagai berikut:

1. Bab I Pendahuluan berisi latar belakang masalah, identifikasi

masalah, batasan masalah, rumusan masalah, tujuan penelitian,

manfaat penelitiam, penjelasan judul, dan sistematika penulisan.

2. Bab II Landasan Teori, berisikan teori-teori yang mendukung

penelitian meliputi verifikasi, sertifikat, web, PHP/MySQL, alat

bantu perancangan, software perancangan, Qr code, dan penelitian

relevan.

3. Bab III Metode Penelitian, yang merupakan penjelasan mengenai

metode penulisan yang digunakan dalam penelitian, meliputi

diantaranya tempat penelitian, metode yang digunakan, model

pengembangan, tahapan penelitian dan uji coba produk.

4. Bab IV Hasil dan Penelitian, yang merupakan penjelasan tentang

hasil dan pembahasan yang didapatkan dari penelitian,

pengembangan sistem, define, desing, develop, dan dessiminate.

5. Bab V Penutup, yang merupakan penjelasan tentang kesimpulan

dan sarang mengenai penelitian.

9

9

BAB II

LANDASAN TEORI

A. Verifikasi

1. Pengertian Verifikasi

Verifikasi berasal dari bahasa Inggris, yakni ‘Verification’, yang

artinya pemeriksaan tentang suatu kebenaran atas laporan, pernyataan, dan

lain-lain. Verifikasi merupakan salah satu cara pengujian hipotesis yang

tujuan utamanya adalah untuk menemukan teori-teori, prinsip-prinsip,

generalisasi, dan hukum-hukum. Verifikasi adalah pandangan yang

dikembangkan oleh Neo-Positivisme atau yang di kenal Positivisme Logis.

Pandangan ini dipengaruhi oleh Auguste Comte tentang pengetahuan yang

berlandaskan pada pendekatan logis dan pasti (positif).

Menurut Moritz Sclick, Verifikasi merupakan pengamatan empiris

secara langsung, artinya pernyataan yang diambil langsung dari objek yng

diamati itulah yang benar-benar mengandung makna. Oleh karenanya,

pengetahuan di mulai dari suatu pengamatan peristiwa. dalam hal ini Alfred

Jules Ayer menegaskan bahwa Verifikasi merupakan suatu cara untuk

merumuskan suatu proposisi (pernyataan) jika pernyataan yang diungkapkan

itu dapat di analisis atau dapat di verifikasi secara empiris[10].

Sedangkan menurut Law dan Kelton 1991 verifikasi merupakan suatu

proses untuk memeriksa kesesuaian jalannya program komputer simulasi

dengan yang diinginkan dengan cara melakukan pemeriksaan program

10

komputer, selain itu verifikasi dapat diartikan sebagai proses penerjemahan

model simulasi konseptual kedalam bahasa pemrograman secara benar[11].

B. Sertifikat Kegiatan Ekstrakurikuler

1. Pengertian Sertifikat

Sertifikat adalah tanda atau surat keterangan (pernyataan) tertulis atau

tercetak dari orang yang berwenang yang dapat digunakan sebagai bukti

pemilikan atau bukti dari suatu kejadian[2]. Sertifikat merupakan surat tanda

bukti hak yang berlaku sebagai alat pembutian yang kuat mengenai data fisik

dan data yuridis yang termuat di dalamnya[3]. Sertifikat juga diartikan

sebagai suatu bukti pengakuan terhadap pengetahuan, kemampuan, dan

keterampilan, yang sesuai dengan syarat dan ketentuan yang berlaku[12].

2. Pengertian Kegiatan Ekstrakurikuler

kegiatan Ekstrakurikuler adalah kegiatan yang dilakukan di luar

program yang tertulis di dalam kurikulum, seperti latihan kepemimpinan,

kegiatan olahraga dan lainnya[4]. Kegiatan ekstrakurikuler juga diartikan

sebagai kegiatan pendidikan yang dilakukan diluar jam pelajaran tatap muka

yang dapat dilakukan di dalam maupun di luar lingkungan pendidikan.

Adapun kegiatan ekstrakurikuler yang penulis amati adalah kegitan

ekstrakurikuler yang dilakukan oleh mahasiswa, khususnya mahasiswa di

program studi pendidikan teknik informatika dan komputer yang

diselegarakan oleh pihak HMPS PTIK (himpunan mahasiswa program studi).

Kegiatan ekstrakurikuler yang di maksud adalah seperti kegitan pelantikan

11

anggota pengurus, latihan dasar kepemimpinan (LDK), seminar, pengadaan

dan mengikuti perlombaan, workshop dan lainnya.

3. Pengertian Sertifikat Kegiatan Ekstrakurikuler

Sertifikat kegiatan eksrtakurikuler adalah sertifikat yang di keluarkan

sebagai bukti atau keterangan terhadap suatu kegiatan eksrtakurikuler yang

telah diikuti. Sertifikat kegiatan eksrtakurikuler juga diartikan sebagai surat

atau tanda bukti tercetak yang dikeluarkan oleh pihak yang berwenang

sebagai bentuk penghargaan dari kegiatan ekstrakurikuler yang telah diikuti.

C. QR CODE

1. Pengertian Qr Code

Qr Code merupakan suatu jenis matriks kode atau barcode dua

dimensi yang dibuat dan dikembangkan oleh Denzo Wave yang pada waktu

itu merupakan sebuah divisi Denso Corporation, sebuah perusahaan Jepang

yang masih bagian dari Toyota Group. QR disini merupakan kependekan dari

Qick Respon, sebuah harapan dari pembuatnya bahwa kode ini akan cepat di-

decode. Awalnya, Qr Code digunakan untuk mendata sparepart kendaraan

dalam perusahaan, namun kini penggunaannya semakin luas, apalagi setelah

spesifikasi Qr Code dilepas ke publik[13].

12

Gambar 2.1 Qr Code dan Bagiannya

Tidak seperti barcode yang satu sisi saja yang mengandung data, Qr

Code mempunyai dua sisi yang berisi data. Hal ini membuat Qr Code dapat

lebih banyak memuat informasi dibandingkan barcode. Qr Code, misalnya,

dapat menampung informasi berupa URL suatu website yang nantinya dapat

digunakan pada majalah, iklan, atau media lainnya, sehingga ketika seorang

pengguna handphone berkamera dan mempunyai aplikasi pembaca, Qr Code

dapat langsung men-scan dan masuk ke website yang dimaksud tanpa perlu

mengetikkan alamatnya. Kegunaan lain, misalnya Qr Code digunakan untuk

menyimpan data teks mengenai informasi produk dan hal lain, SMS, atau

informasi kontak yang mengandung nama, nomor telepon, dan

alamatnya[13].

Kapasistas data untuk Qr Code dibandingkan matriks kode yang lain

dapat dikatakan cukup besar, yaitu menampung 7.089 data numerik, 4.296

data alfanumerik, 2.953 data biner, atau 1.817 karakter kanji, dengan

dukungan kecepatan pengkodean dan ukuran cetak yang kecil. Hasil cetakan

Qr Code juga tahan terhadap kerusakan sampai dengan 30% agar tetap dapat

Position detection pattern

Margin

Timing pattern

Format information

13

dibaca. Selain itu, Qr Code dapat dibaca dari segala arah dengan hasil yang

sama sehingga meminimalkan kesalahan baca akibat salah posisi Qr Code

[13].

2. Versi Qr Code

QR Code dapat menghasilkan 40 versi yang berbeda dari versi 1 (21 x

21 modul) sampai versi 40 (177 x 177 modul). Tingkatan versi QR Code 1

dan 2 berbeda 4 modul berlaku sampai dengan versi 40. Setiap versi memiliki

konfigurasi atau jumlah modul yang berbeda. Modul ini mengacu pada titik

hitam dan putih yang membentuk suatu QR Code. Setiap versi QR Code

memiliki kapasitas maksimum data, jenis karakter dan tingkat koreksi

kesalahan. Jika Jumlah data yang ditampung banyak maka modul yang yang

akan diperlukan dan menjadikan QR Code menjadi lebih besar (Denso,

2011)[14].

14

Gambar 2.2 Versi QR CODE

3. Koreksi Kesalahan pada Qr Code

Qr Code mampu mengoreksi kesalahan dan pengembalian data dalam

pembacaan kode apabila Qr Code kotor atau rusak. Menurut Denso (2011),

Ada 4 tingkatan koreksi kesalahan dalam Qr Code :

Tabel 2.1 Level Koreksi Kesalahan

Level Koreksi

Kesalahan

Jumlah

Perkiraan

Koreksi

L 7%

M 15%

15

Q 25%

H 30%

Semakin tinggi tingkat koreksi kesalahan maka semakin besar juga

versi QR Code. Faktor lokasi dan lingkungan operasi perlu dipertimbangkan

dalam menentukan level QR Code. Level Q dan H baik digunakan di pabrik

yang kotor, sedangkan L untuk tempat yang bersih. Level yang sering

digunakan adalah level M dengan perkiraan koreksi mencapai 15%[14].

4. Manfaat QR Code

Beberapa manfaat yang terdapat pada QR Code menurut Denso (2011)

antara lain :

a. Kapasitas tinggi dalam menyimpan data. Sebuah QR Code

tunggal dapat menyimpan data sampai 7.089 angka.

b. Ukuran yang kecil. Sebuah QR Code dapat menyimpan jumlah

data yang sama dengan barcode 1D dan tidak memerlukan

ruang besar.

c. Dapat mengoreksi kesalahan. Tergantung pada tingkat koreksi

kesalahan yang dipilih, data pada QR Code yang kotor atau

rusak sampai 30% dapat diterjemahkan dengan baik.

d. Banyak jenis data. QR Code dapat menangani angka, abjad,

simbol, karakter bahasa Jepang, Cina atau Korea dan data

biner.

16

e. Kompensasi distorsi QR Code tetap dapat dibaca pada

permukaan melengkung atau terdistorsi.

f. Kemampuan menghubungkan. Sebuah QR Code dapat dibagi

hingga 16 simbol yang lebih kecil agar sesuai dengan ruang.

Simbol-simbol kecil yang dibaca sebagai kode tunggal apabila

di scan menurut urutan[14].

5. QR CODE Generator

Program pembangkit Qr Code bisa memanfaatkan fasilitas situs web

gratis seperti Generator, Qr Code Generator dan situs gratis lainnya. Selain

memanfaatkan situs pembangkit Qr Code bisa menggunakan koding

program[15].

D. Software Perancangan Sistem

1. PHP

PHP singkatan Hypertext Preprocessor yang digunakan sebagai

bahasa script server-side dalam pengembangan web yang disisipkan pada

dokumen HTML[7]. PHP (Hypertext Preprocessor), adalah bahasa

pemrograman pada sisi server yang memperbolehkan programmer

menyisipkan perintah-perintah perangkat lunak web server (Apache, IIS, atau

apapun) akan dieksekusi sebelum perintah dikirim ke halaman browser yang

me-request. PHP digunakan untuk membangun web application dan aplikasi

grafis[16].

17

Pembuatan web dan aplikasi grafis pada PHP merupakan kombinasi

antara PHP sendiri sebagai bahasa pe-mrograman dan HTML sebagai

pembangun halaman web. Ketika seorang pengguna internet akan membuka

suatu situs yang menggunakan fasilitas server-side scripting PHP, maka

terlebih dahulu server yang bersangkutan akan memproses semua perintah

PHP di server lalu mengirimkan hasilnya dalam format HTML ke web

browser pengguna internet tadi. Dengan demikian seorang peng-guna internet

tidak dapat melihat kode program yang ditulis dalam PHP sehingga

keamanan dari halaman web menjadi lebih terjamin[17]. Selain itu PHP juga

dapat mengolah data secara dinamis[18].

2. MySQL

MySQL merupakan program database server yang mampu menerima

dan mengirimkan data dengan sangat cepat, multi user serta menggunakan

perintah dasar SQL (Structured Query Lnguage) dan baik digunakan sebagai

client maupun server[8]. MySQL adalah turunan konsep dalam basis data

yakni SQL. SQL adalah konsep pengoperasian basis data, dalam pemilihan

atau seleksi dan pemasukan data yang memungkinkan pengoperasian data

yang dikerjakan dengan mudah secara otomatis[19].

3. Xampp

Xampp singkatan dari X (empat sistem operasi apapun), Apache,

MySQL, PHP, dan Perl. Xampp merupakan perangkat lunak bebas, yang

mendukung banyak sistem operasi. Fungsinya sebagai server yang berdiri

18

sendiri (localhost), yang terdiri atas program Apache HTTP Server, MySQL

database, dan penerjemah bahasa yang ditulis dalam bahasa pemrograman

PHP dan Perl[20].

4. Dreamweaver

Dreamweaver merupakan HTML editor profesional untuk mendesain

web secara visual dan mengelola situs atau web[21]. Dreamweaver dilengkapi

kemampuan manajemen situs, yang memudahkan mengelola keseluruhan

elemen dalam sebuah situs, juga dapat melakukan pengecekan broken link,

kompatibilitas browser, termasuk validasi tag-tag HTML dan CSS yang

tidak sesuai dengan pedoman secara otomatis serta perkiraan waktu download

pada sebuah halaman web[22].

Dreamweaver tidak hanya mempermudahkan dalam pembuatan

halaman website, tetapi juga dalam mengelolanya. Setiap peluncuran software

baru pasti juga diwarnai dengan wajah baru[23].

5. Framework Bootstrap

Menurut Husein Bootstrap adalah framework ataupun tools untuk

membuat aplikasi web ataupun website yang bersifat responsive secara cepat,

mudah dan gratis. Kata responsive berarti bahwa tampilan web (lebar dan

susunan isinya dapat berubah secara otomatis sesuai dengan lebar layar yang

menampilkannya)[24].

19

Bootstrap adalah sebuah framework yang dapat menyelesaikan

permasalahan mendesain web. Slogan dari framework ini adalah “Sleek,

intuitive and powerfull front-end framework for faster and easier web

development”, yang berarti kita dapat mendesain sebuah website lebih rapi,

cepat dan mudah. Dan Bootstrap responsive terhadap berbagai jenis platform,

artinya tampilan halaman website yang menggunakan Bootstrap akan tampak

lebih rapi, baik versi mobile maupun desktop[25].

6. Web

Kumpulan halaman-halaman yang berisi informasi yang disimpan

diinternet yang bisa diakses atau dilihat melalui jaringan internet pada

perangkat yang bisa mengakses internet yaitu komputer[9].

Halaman Web merupakan file teks murni (plain text) yang berisi

sintaks-sintaks HTML yang dapat dibuka, dilihat, diterjemahkan dengan

Internet Browser. Sintaks HTML mampu memuat konten text, gambar, audio,

video dan animasi[26].

7. Browser

Browser adalah program komputer untuk menerjemahkan kode-kode

perintah HTML menjadi tampilan web di komputer pengguna berisi teks,

gambar, dan multimedia yang dapat dinilai dan dinikmati langsung. Tujuan

browser dibangun untuk mengeksplorasi web server namun dengan batasan

yang sudah ditentukan[27].

20

E. Alat Bantu Perancangan Sistem

1. UML

a) Pengertian UML

Menurut Windu Gata, Grace, Unified Modeling Language (UML)

merupakan bahasa standar untuk mendokumentasikan, menspesifikasi dan

membangun perangkat lunak. UML juga dikatakan sebagai alat mendukung

sistem[28]. Pada penelitin ini UML yang digunakan adalah :

1) Use Case Diagram

Use case diagram adalah model dari kelakuan (behavior) sistem

informasi yang dibuat. Fungsi dari use case diagram adalah untuk mengetahui

siapa saja yang berhak menggunakan fungsi dari sistem[28].

Tabel 2.2 Simbol-simbol Use Case Diagram

No. Simbol Nama Fungsi

1 2 3 4

1

Use Case Menggambarkan fungsional

yang disediakan sistem

sebagai unit-unit yang

bertukar pesan antar unit

dengan aktor, biasanya

dinyatakan dengan

menggunakan kata kerja di

21

awal nama use case.

1 2 3 4

2

Actor Abstraction dari orang atau

sistem yang lain yang

mengaktifkan fungsi dari

target

3

Asosiasi

antara

aktor dan

use case

Digambarkan dengan garis

tanpa panah yang

mengindikasikan siapa atau

apa yang meminta interaksi

secara langsung dan

bukannya mengindikasikan

aliran data

4

Asosiasi

aktor dan

use case

dengan

panah

terbuka

Mengindikasikan bila aktor

berinteraksi secara pasif

dengan sistem

5 Include Pemanggilan use case oleh

use case lain

22

1 2 3 4

6

Extend Perluasan use case lain jika

kondisi atau syarat

terpenuhi

2) Activity Diagram

Activity diagram adalah pemodelan aktivitas atau workflow

(aliran kerja) dari sebuah proses bisnis atau sistem[28].

Tabel 2.3 Simbol-simbol Activity Diagram


1 2 3 4

1

Start Point Diletakkan pada pojok kiri

atas dan merupakan awal

aktivitas

2

End Point Akhir aktivitas

3

Activities Menggambarkan proses atau

kegiatan bisnis

23

4

Fork atau

percabang

an

Menunjukkan kegiatan yang

dilakukan secara paralel

atau untuk menggabungkan

dua kegiatan paralel

menjadi satu

5

Join atau

penggabun

gan atau

rake

Menunjukkan adanya

dekomposisi

1 2 3 4

6

Desition

Points

Menggambarkan pilihan

untuk pengambilan

keputusan, true atau false

7 Swimlane Menunjukkan siapa

melakukan apa

3) Sequence Diagram

Diagram yang menggambarkan perilaku objek pada use case

yang mendeskripsikan waktu hidup objek dan pesan yang dikirim dan

diterima objek[28].

Tabel 2.4 Simbol-simbol Sequence Diagram

24


1 2 3 4

1

Entity

Class

Bagian dari sistem yang

berisi kumpulan kelas

berupa entitas-entitas yang

membentuk gambaran awal

sistem dan menjadi landasan

untuk menyusun basis data

2

Boundary

Class

Berisi kumpulan kelas yang

menjadi interface atau

interakasi antara satu atau

lebih aktor dengan sistem,

seperti tampilan formentry

dan form cetak

3

Control

Class

suatu objek yang berisi

logika aplikasi yang tidak

memiliki tanggung jawab

kepada entitas

4

Message Menggambarkan mengirim

pesan antar class

25

1 2 3 4

5

Recursive Menggambarkan

pengiriman pesan yang

dikirim untuk dirinya

sendiri

6

Activation Mewakili sebuah eksekusi

operasi dari objek, panjang

kotak ini berbanding lurus

dengan durasi aktivitas

sebuah operasi

7

Lifeline Garis titik-titik yang

terhubung dengan objek,

sepanjang lifeline terdapat

activation

4) Class Diagram

Merupakan hubungan antar kelas dan penjelasan detail tiap-tiap

kelas didalam model desain dari suatu sistem, juga memperlihatkan

aturan-aturan dan tanggung jawab entitas yang menentukan[28].

26

Tabel 2.5 Simbol-simbol Class Diagram

No Simbol Nama Fungsi

1 2 3 4

1

Kelas

Kelas pada struktur

sistem

2

Antarmuka

/ interface

Sama dengan konsep

interface dalam

Pemrograman

berorientasi objek.

3 Association

Relasi antarkelas

dengan makna umum

4

Asosiasi

berarah

Relasi antarkelas

dengan makna kelas

yang satu digunakan

oleh kelas yang lain.

5

Generalisasi

Relasi antarkelas

dengan makna

generalisasi-spesialisasi

(umum khusus).

6 Kebergantu

ngan

Relasi antarkelas

dengan makna

kebergantungan

27

1 2 3 4

antarkelas.

7

Agregasi

Relasi antarkelas

dengan makna semua-

bagian (whole-part)

1. Flowchart

a) Pengertian Flowchart

Untuk menggambarkan sebuah algoritma yang terstruktur dan

mudah dipahami orang lain (khususnya programmer yang bertugas

mengimplementasikan program), maka dibutuhkan alat bantu yang

berbentuk diagram alir (flowchart). Flowchart menggambarkan urutan

logika dari suatu prosedur pemecahan masalah, sehingga flowchart

merupakan langkah-langkah penyelesaian masalah yang dituliskan

dalam simbol-simbol tertentu. Diagram alir ini akan menunjukkan alur

didalam program secara logika. Diagram alir ini selain dibutuhkan

sebagai alat komunikasi, juga diperlukan sebagai dokumentasi[29].

Dan sebelum lebih jauh memahami komponen-komponen diagram

alir, maka perlu kiranya disampaikan aturan-aturan dalam

perancangan diagram alir tersebut, yaitu[30]:

1) Diagram alir digambarkan dengan orientasi dari atas ke bawah dan

dari kiri ke kanan.

28

2) Setiap kegiatan/proses dalam diagram alir harus dinyatakan secara

eksplisit.

3) Setiap diagram alir harus dimulai dari satu start state dan berakhir

pada satu atau lebih terminal akhir atau terminator atau halt state.

4) Gunakan connector dan off-page connector state dengan label yang

sama untuk menunjukkan keterhubungan antarpath algoritma yang

terputus atau terpotong misalnya sebagai akibat pindah atau ganti

halaman.

Tujuan dari flowchart adalah untuk menggambarkan suatu

tahapan penyelesaian masalah secara sederhana, terurai, rapi dan jelas

menggunakan simbol-simbol yang standar[30].

b) Simbol-simbol Flowchart

Tabel 2.6 Simbol-simbol Flowchart.


1 2 3 4

1

Terminal Menyatakan permulaan atau

akhir suatu program

2

Input atau

Output

Menyatakan proses input

atau output tanpa

tergantung jenis

peralatannya

Process Menyatakan suatu tindakan

29

3 (proses) yang dilakukan

oleh komputer

4

Decision Menunjukkan suatu kondisi

tertentu yang akan

menghasilkan dan

kemungkinan jawaban ya

atau tidak

5

Connector Menyatakan sambungan

dari proses ke proses

lainnya dalam halaman yang

1 2 3 4

Sama

6

Offline

Connector

Menyatakan sambungan

dari proses ke proses

lainnya dalam halaman yang

berbeda

7

Predefined

Process

Menyatakan penyediaan

tempat penyimpanan suatu

pengolahan untuk memberi

harga awal

Punched Card Menyatakan input berasal

30

8 dari kartu atau output ditulis

ke kartu

9

Punch Tape

10

Document Mencetak keluaran dalam

bentuk dokumen (melalui

printer)

11

Flow Menyatakan jalannya arus

suatu proses

F. Penelitian Relevan

Sebagai bahan acuan penelitian ini yaitu hasil penelitian yang

relevan:

1. Penelitian Sistem Verifikasi Sertifikat Menggunakan QR CODE Pada

Center Event Informasi oleh Erick Febriyanto, Untung Rahardja,

Adam Faturahman dan Ninda Luftiani. Penelitian ini dilakukan di

STMIK Rahardja, Banten yang masih melakukan verifikasi sertifikat

secara konvensional dengan keamanan yang masih rendah. Penelitian

ini bertujuan untuk menyelesaikan permasalahan tersebut dengan cara

adanya QR CODE pada sertifikat. Dengan menggunakan metode

penelitian pengembangan perangkat lunak dengan model prototype dan

5 studi pustaka. Dari pelaksanaan penelitian ini diharapkan dapat

31

menghasilkan sistem keamanan sertifikat dengan QR CODE bagi

sistem CIE dengan sistem keamanan yang tinggi dan terhindar dari

pengadaan data serta kecurangan – kecurangan lainnya[31].

2. Implementasi QR CODE Pada Berkas Kelulusan Mahasiswa Berbasis

PDF WEB oleh Albertur Dwi Yoga Widiantoro, dimana penelitian ini

dilakukan di jurusan Sistem Informasi Universitas Katolik

Soegljarpanata, Semarang. Yang menjadi permasalahan pada

penelitian ini adalah maraknya terjadi pemalsuan berkas – berkas

kelulusan, seperti Ijazah, Transkrip hasil studi, Sertifikat dan berkas

lainnya, baik di sekolah menengah atas maupun di Perguruan Tinggi.

Dengan adanya Teknologi berbasis Web dan QR CODE diharapkan

dapat menyelesaikan permasalahan ini, dengan proses pengecekan

keaslian berkas – berkas kelulusan yang dilakukan secara online

menggunakan HP atau Smartphone yang memdukung pembacaan QR

CODE[32].

3. Sistem Keamanan Keaslian Ijazah Menggunakan QR CODE dan

Algoritma Base64. Untuk menghindari praktek pemalsuan ijazah maka

harus dilakukan sistem pengamanan ijazah. LPK Aksmi Gajahmada

memberikan pengamanan dengan memberi kode pengamanan pada

lembar ijazah yang diberi nomor. No ijazah berisi 27 karakter yang

terdiri dari numeric, alphanumeric dan symbol. Teknologi untuk

keaslian ijazah dengan menggunakan teknik QR CODE yang mampu

menampung data, kode dienkripsi terlebih dahulu dengan metode

32

Algoritma Base64 sebelum diamankan menggunakan QR CODE[33].

4. Pengembangan Metode Otentikasi Keaslian Ijazah dengan

Memanfaatkan Gambar QR CODE oleh Eka Ardhianto dan Nur

Wakhidah. Ijazah merupakan bukti autentikasi bahwa seseorang telah

menjalani tahap pendidikan secara formal dan berhasil lulus ujian.

Ijazah konvensional rentan terhadap kerusakan ataupun hilang. Untuk

mengetahui keaslian ijazah adalah dengan melakukan kontak langsung,

serta legalisir tandatangan dari pembuat ijazah. QR CODE adalah salah

satu metode autentikasi yang mampu menampung data dalam jumlah

besar dan dapat membaca kode yang memiliki kerusakan hampir

30%[15].

5. Penerapan Central Event Information Untuk Mencetak Sertifikat Dan

Verifikasi Dengan QR CODE Menggunakan Global Extreme

Progremming oleh Untung Rahardja, Erick Febriyanto dan Much

Alvin Aldiya. Penelitian ini dilakukan di STMIK Rahardja,

Tangerang. Sertifikat adalah dokumen yang menyatakan bahwa

seseorang telah memenuhi persyaratan tertentu dan dapat berlatih di

suatu bidang. Prosedur verifikasi sertifikat pada perguruan tinggi

masih banyak dilakukan secara manual dan terkadang tidak

dilakukannya verifikasi sertifikat tersebut. Hal ini, mengakibatkan

banyaknya sertifikat yang palsu. Untuk mengatasi masalah tersebut,

maka dibuatlah website yang memanfaatkan QR Code dengan tujua

akses cepat verifikasi data sebuah sertifikat. Dengan teknologi

33

pemindaian QR Code penipuan berbasis dokumen berbasis kertas dapat

dengan mudah dilakukan tanpa biaya tinggi. Oleh karena itu

perancangan sistem informasi atau pembuatan aplikasi berbasis web

adalah solusi untuk memberikan kemudahan kepada pengguna dalam

proses pengolahan data, pengambilan data hingga pembuatan

laporan[34].

34

BAB III

METODE PENELITIAN

A. Waktu dan Tempat Penelitian

Penelitian ini akan dilaksanakan mulai bulan juni 2020, dimana

penulis mengumpulkan data yang terkait dengan verifikasi sertifikat kegiatan

ekstrekurikuler mahasiswa. Kemudian data diolah dan dilakukan perancangan

sebuah verifikasi sertifikat kegiatan ekstrekurikuler mahasiswa.

Penelitian ini bertempat di Program Studi Pendidikan Teknik

Informatika dan Komputer IAIN Bukittinggi. Pemilihan tempat penelitian

didasarkan atas pertimbangan sebagaimana yang telah diuraikan dalam latar

belakang masalah.

B. Jenis Penelitian

Jenis penelitian yang digunakan pada skripsi ini adalah penelitian dan

Pengembangan (Research and Development). Penelitian dan pengembangan

atau dalam bahasa Inggrisnya Research and Development adalah metode

penelitian yang digunakan untuk menghasilkan produk tertentu, dan menguji

keefektifan produk tersebut[35].

Model yang digunakan adalah pengembangan model 4D. Tahapan

penelitian pengembangan model 4D (Four-D model) dikembangkan

Thiagarajan. Four-D model ini terdiri dari pendefinisian (define), tahap

perancangan (design), tahap pengembangan (develop), dan tahap uji coba

35

(disseminate)[36]. Alasan penulis memilih model 4D karena model ini jelas

langkah disetiap tahapannya, sederhana dan tidak memerlukan waktu yang

lama.

Gambar 3.1 Pengembangan Model 4D Thiagarajan

Kegiatan-kegiatan yang dilakukan pada setiap tahap pengembangan

dapat dijelaskan sebagai berikut[37] :

1. Define (Pendefenisian)

Kegiatan pada tahap ini dilakukan untuk menetapkan dan

mendefinisikan syarat-syarat pengembangan. Dalam model lain, tahap ini

sering dinamakan analisis kebutuhan. Tiap-tiap produk tentu membutuhkan

analisis yang berbeda-beda. Secara umum, dalam pendefinisian ini dilakukan

kegiatan analisis kebutuhan pengembangan, syarat-syarat pengembangan

produk yang sesuai dengan kebutuhan pengguna serta model penelitian dan

pengembangan (R & D) yang cocok digunakan untuk pengembangaan

produk.

R & D didefenisikan sebagai metode penelitian yang secara sengaja,

sistematis, digunakan untuk menemukan, merumuskan, memperbaiki,

mengembangkan, menghasilkan, menguji validitas, efektifitas dan

36

praktikalitas dari produk, model, metode, cara, jasa, prosedur tertentu yang

lebih unggul. Model R & D yang digunakan dalam penelitian ini adalah

model 4 D. Analisis bisa dilakukan melalui studi literature atau penelitian

pendahuluan[38].

2. Design (Perancangan)

Tahapan kedua adalah design atau perancangan. Tahapan ini berisi

kegianan perancangan produk yang akan dibuat. Tahap perancangan

bertujuan untuk merancang produk yang akan dibuat setelah melakukan

observasi[23].

3. Develop (Pengembangan)

Thiagarajan membagi tahap pengembangan dalam dua kegiatan yaitu;

expert apprasial dan development testing. Expert appraisal merupakan teknik

untuk memvalidasi atau menilai kelayakan rancangan produk. Dalam

kegiatan ini dilakukan evaluasi oleh ahli dalam bidangnya. Development

testing merupakan kegiatan uji coba rancangan produk pada sasaran subjek

yang sesungguhnya. Pada saat uji coba dicari data respon, reaksi atau

komentar dari sasaran pengguna model. Hasil uji coba digunakan

memperbaiki produk. Setelah produk deperbaiki kemudian diujikan kembali

sampai memperoleh hasil yang efektif.

37

4. Disseminate (Uji Coba)

Thiagarajan membagi tahap disseminate dalam tiga kegiatan yaitu;

validating testing, packaging, diffusion and adoption. Pada tahap validating

testing, produk yang sudah direvisi pada tahap pengembangan kemudian

diimplementasikan pada sasaran yang sesungguhnya. Pada saat implementasi

dilakukan pengukuran ketercapaian tujuan. Pengukuran ini dilakukan untuk

mengetahui efektivitas produk yang dikembangkan.

Setelah produk diimplementasikan, pengembang perlu melihat hasil

pencapaian tujuan. Tujuan yang belum dapat tercapai perlu dijelaskan

solusinya sehingga tidak terulang kesalahan yang sama setelah produk

disebarluaskan. Kegiatan terkhir dari tahap pengembangan adalah packaging

(pengemasan), diffusion and adopsion. Tahap ini dilakukan supaya produk

dapat dimanfaatkan oleh orang lain.

C. Model Pengembangan Sistem

Dalam penelitian ini penulis menggunakan model sistem yang

diadaptasi dari siklus hidup sistem SDLC (System Development Life Cycle,

Siklus Hidup Pengembanagn Sistem) atau System Life Cycle (Siklus Hidup

Sistem), dalam rekayasa sistem dan rekayasa perangkat lunak, adalah proses

pembuatan dan pengubahan sistem serta model dan metodologi yang

digunakan untuk mengembangkan sistem-sistem tersebut. Konsep ini

umumnya merujuk pada sistem komputer atau informasi[39].

38

Pendekatan pengembangan sistem yang digunakan adalah waterfall.

Model pertama yang diterbitkan untuk proses pengembangan perangkat lunak

diambil dari proses rekayasa lain. Model ini diilustrasikan pada gambar 3.2,

berkat penurunan satu fase ke fase yang lainnya, model ini dikenal sebagai

‘model air terjun’ atau siklus hidup perangkat lunak.

Alasan penulis mengambil model waterfall karena model waterfall

berurutan dan sistematis. Dapat dilihat bahwa tahap demi tahap yang dilalui

harus menunggu selesainya tahap sebelumnya dan berjalan berurutan. Fase-

fase dalam Waterfall Model menurut Pressman sebagai berikut[40] :

Gambar 3.2 Waterfall Pressman

Berikut adalah penjelasan dari tahap-tahap yang dilakukan dalam

model Waterfall oleh Presman, 2015[41] :

1. Communication

Langkah pertama diawali dengan komunikasi kepada konsumen atau

pengguna. Langkah awal ini merupakan langkah penting karena menyangkut

pengumpulan informasi tentang kebutuhan konsumen atau pengguna.

39

2. Planning

Setelah pross communication, kemudian menetapkan rencana untuk

pengerjaan software yang meliputi tugas tugas teknis yang akan dilakukan,

risiko yang mungkin terjadi, sumber yang dibutuhkan, hasil yang akan dibuat,

dan jadwal pengerjaan.

3. Modeling

Pada proses modeling ini menerjemahkan syarat kebutuhan ke sebuah

perancangan perangkat lunak yang dapat diperkirakan sebelum dibuat coding.

Proses ini berfokus pada rancangan struktur data, arsitektur software,

refresentasi interface, dan detail (algoritma) prosedural.

4. Construction

Construction merupakan proses membuat kode (code generation).

Coding atau pengkodean merupakan penerjemahan desain dalam Bahasa

yang bisa dikenali oleh komputer. Programmer akan menerjemahkan

transaksi yang diminta oleh user. Tahapan inilah yang merupakan tahapan

secara nyata dalam mengerjakan suatu software, artinya penggunaan

komputer akan dimaksimalkan dalam tahapan ini.

Setelah pengkodean selesai maka akan dilakukan testing terhadap

sistem yang telah dibuat. Tujuan testing adalah menemukan kesalahan-

kesalahan terhadap sistem tersebut untuk kemudian bisa diperbaiki. Pengujian

40

sistem dengan black box testing. Black box testing adalah pengujian

perangkat lunak dari segi spesifikasi fungsional tanpa menguji desain dan

kode program untuk mengetaui apakah fungsi, masukan dan keluran dari

perangkat lunak sesuai degan spesifikasi yang dibutuhkan[42].

5. Deployment

Tahapan ini bisa dikatakan final dalam pembuatan sebuah software

atau sistem. Setelah melakukan analisis, desain dan pengkodean maka sistem

yang sudah jadi akan digunakan oleh user. Kemudian software yang telah

dibuat harus dilakukan pemeliharaan secara berkala.

D. Tahapan Penelitian

Dalam penelitian ini ada beberapa tahapan yang harus dilakukan

penulis diantaranya:

Define

Communication

Planning

Modeling

Constraction

Design

Develop

Studi Lapangan

Studi Literatur

Draf rancangan produk secara umum

Disseminate Penyebaran produk/sistem di lokasi penelitian

Deployment

Gambar 3.3 Tahapan Penelitian

41

Dari gambar skema tahapan penelitian di atas, penulis merincikan

yaitu:

1. Define

Pada tahap ini penulis melakukan studi lapangan dan studi literatur.

Studi lapangan dilakukan untuk memperoleh informasi mengenai sistem lama

yang sedang berjalan, dan mencari serta menentukan potensi dan masalah

yang terjadi di lokasi penelitian. Untuk menemukan potensi dan masalah

dilakukan dengan metode kualitatif. Studi literatur yang dipelajari adalah

yang terkait dengan sistem. Melalui studi literatur diharapkan dapat diperoleh

pemahaman secara teoretis tentang sistem. Sebelum dikembangkan literature

tersebut dapat menjadi jembatan peneliti dalam merancang akan konsep

desain dengan rancangan produk yang cocok sesuai kebutuhan.

2. Design

Hasil dari studi lapangan dan studi literatur digunakan untuk membuat

perancangan website. Secara garis besar pembuatan rancangan aplikasi

diawali dengan :

a. Mencari aplikasi yang relevan

b. Menyusun spesifikasi desain produk

c. Melakukan evaluasi konsep-konsep yang ditawarkan

d. Menggambarkan wujud desain produk.

42

3. Develop

Dalam tahap ini penulis melakukan pengembangan aplikasi dengan

menggunakan model pengembangkan waterfall model, yaitu:

a. Communication

Tahap ini merupakan langkah untuk mendefinisikan tujuan, ruang

lingkup, waktu pengerjaan, serta biaya yang dibutuhkan. Pada tahap ini

dilakukan komunikasi kepada pihak yang bertanggung jawab. Sehingga bias

didapatkan informasi tentang kebutuhan pengguna sistem. Dilakukan

kegiatan spesifikasi kebutuhan dari semua pihak yang terlibat. Pada tahap ini

pengumpulan data dilakukan dengan wawancara dan studi dokumentasi. Pada

tahap ini dilakukan analisis permasalahan yang dihadapi dan mengumpulkan

data-data yang disertakan, serta mendefinisikan fitur dan fungsi software.

b. Planning (Estimating, Schedulling, Tracking)

Tahap planning merupakan langkah untuk menentukan perencanaan

yang menjelaskan tentang estimasi tugas-tugas teknisi yang akan dilakukan

resiko-resiko yang dapat terjadi, sumber daya yang diperlukan dalam

membuat sistem, produk kerja yang ingin dihasilkan, penjadwalan kerja yang

akan dilaksanakan, dan tracking proses pengerjaan sistem (pekerjaan

mengikuti jalan atau tahapan).

43

c. Modeling

Tahapan ini merupakan tahap perancangan dan pemodelan arsitektur

system yang terfokus pada perancangan struktur dan arsitektur software,

tampilan interface, dan algoritma program. Tujuannya untuk lebih memahami

gambaran besar dari apa yang dikerjakan.

d. Contruction

Tahapan ini merupakan proses penerjemahan bentuk desain menjadi

kode atau bentuk Bahasa yang bisa dikenali oleh komputer atau mesin.

Setelah pengkodean selesai, dilakukan pengujian terhadap sistem dan juga

kode yang sudah dibuat tujuannya untuk menemukan kesalahan (error)

sehingga bisa diperbaiki. Pengujian menggunakan metode black box testing.

e. Deployment

Tahapan ini merupakan tahapan implementasi software ke custumer,

perbaikan software, evaluasi software, dan pengembang software berdasarkan

umpan balik yang diberikan agar sistem dapat tetap berjalan dan berkembang

sesuai dengan fungsinya.

3. Disseminate

Yaitu penulis melakukan penyebarluasan sistem yang telah dihasilkan

di lokasi penelitian.

44

E. Uji Produk

Uji produk pada skripsi ini terdiri dari uji validitas, uji efektivitas, dan

uji praktikalitas. Instrument yang digunakan untuk pengujian adalah angket

lembar uji produk. Angket terdiri dari angket uji validitas produk, angket uji

efektivitas produk, angket uji praktikalitas produk.

1. Uji Validitas

Validitas berasal dari kata validity yang mempunyai arti sejauh mana

ketetapan dan kecermatan suatu alat ukur dalam melakukan suatu fungsi

ukurnya. Suatu tes atau instrument pengukur dapat dikatakan mempunyai

validitas yang tinggi apabila alat tersebut menjalankan fungsi ukurnya, atau

memberikan hasil ukur yang sesuai dengan maksud pengukurannya tersebut.

Tes yang menghasilkan data yang tidak relevan dengan tujuan pengukuran

dikatakan sebagai tes yang memiliki validitas rendah[43].

Untuk menghasilkan produk yang berkualitas dan siap diuji cobakan

perlu adanya validitas produk dalam penelitian ini, uji validitas beberapa ahli

(expert), pengujian dilakukan dengan membandingkan angket tentang

penelitian dari produk

Uji validtias mengacu pada rumus Statistik Aiken’V sebagai

berikut[44]:

V=∑S / [n(c-1)]……..[Aiken’s V]

45

Keterangan :

S : r-lo

Lo : Angka penelitian validitas terendah

c : Angka penelitian validitas tertinggi

r : Angka yang diberikan oleh seorang penilaian

n : Jumlah Penilai

Tabel 3.1 Nilai Validitas Berdasarkan Aiken's V[45]

No Nilai VnNi Kriteria

1 ≥ 0,6 Valid

2 < 0,6 Tidak Valid

2. Uji Praktikalitas

Menurut Kamus Besar Bahasa Indonesia didefinisikan bahwa

“praktikalitas adalah sesuatu yang bersifat praktis dengan maksud mudah dan

senang menggunakannya”. Suharsimi menyatakan bahwa sebuah produk

dikatakan praktis apabila memenuhi syarat sebagai berikut[46]:

46

a. Mudah dilaksanakan

b. Mudah pemeriksaannya

c. Dilengkapi dengan petunjuk-petunjuk yang jelas

Untuk uji Praktifitas penulis menggunakan formula kappa Cohen di

bawah ini (referensi kappa)[47].

Momen kappa (K) = ρ0 - ρe

1 – ρe

Keterangan:

K = Momen kappa

ρ0 = Proporsi yang terealisasi

ρe = Proporsi yang tidak terealisasi

Tabel 3.2 Kategoi Keputusan berdasarkan Moment Kappa (K)

[41]

Interval Kategori Keterangan

0,81 – 1,00 Sangat Tinggi ST

0,61 – 0,80 Tinggi T

0,41 – 0,60 Sedang S

47

0,21 – 0,40 Rendah R

0,01 – 0,20 Sangat Rendah SR

< 0,00 Tidak Praktis TP

3. Uji Keefektifan

Aspek keefektifan dalam pengembangan, sangat penting untuk

mengetahui tingkat atau derajat penerapan teori, atau model dalam suatu

situasi tertentu. Instrumen pengumpulan data penelitian yang digunakan

adalah angket validasi dan prktikalitas. Data yang diperoleh dianalisa

menggunakan rumus normalized gain atau sering disebut gain score

ternormalisasi[48].

< 𝑔 > = Skor Akhir (%) − Skor Awal (%)

100 − Skor Awal (%)

Keterangan:

< g > = Nilai gain score

Skor akhir (%) = Persentase nilai akhir (post-test)

Skor awal (%) = Persentase nilai awal (pre-test)

Terdapat tiga kategori hasil analisis gain score. Kategori tersebut

ditunjukkan dalam Tabel.

48

Tabel 3.3 Kategori Hasil Analisis Menggunakan

Gain Score[48]

Nilai < g > Kategori

> 0.7 Tinggi

0.3 < 0.7 Sedang

< 0.3 Rendah

49

BAB IV

PEMBAHASAN

A. Hasil Penelitian

Berdasarkan penelitian mengenai sistem verifikasi sertifikat kegiatan

ekstrakurikuler mahasiswa berbasis QR Code di PTIK IAIN Bukitinggi

menggunakan PHP MySql yang telah dilaksanakan, dengan menggunakan

jenis penelitian dan Pengembangan (Research and Development) dan model

yang digunakan adalah pengembangan model 4D, maka diperoleh hasil

penelitian serta pembahasannya pada masing – masing tahapan Define,

Desain, Develop, dan Disseminate adalah sebagai berikut :

1. Define

Menetapkan dan mendefenisikan prosedur Sistem Verifikasi Sertifikat

Kegiatan Ekstrakurikuler mahasiswa bebasis QR Code yang digunakan

sebelum melakukan perangcangan sistem. Pendefenisian bertujuan untuk

mengetahui bagaiman bentuk prosedur verifikasi yang selama ini digunakan.

Dari hasil wawancara yang penulis lakukan penulis mendapatkan

beberapa permasalahan yang terjadi dalam proses verifikasi sertifikat

kegiatan ekstrakurikuler mahasiswa di IAIN Bukittinggi khususnya di

program studi PTIK yakni, dimana proses verifikasi sertifikat kegiatan

ekstrakurikuler masih dilakukan secara manual dengan melampirkan blanko

pengajuan angket kredit oleh mahasiswa yang bersangkutan kepada dosen

50

dalam hal ini dosen penasehat akademik kemudian dilakukannya proses

pengecekan dan pemeriksaan oleh dosen penasehat akademik.

Dalam proses pengecekan dan pemeriksaan sertifikat kegiatan

ekstrakurikuler tersebut dosen penasehat akademik belum memiliki data yang

dapat dijadikan sebagai sumber acuan dalam proses pengecekan tersebut. Hal

ini dapat menyebabkan terjadinya manipulasi data seperti, mengubah,

menambah, menghapus dan memalsukan data.

Studi literatur yang didapat peran dan fungsi verifikasi sertifikat

kegiatan ekstrakurikuler merupakan salah satu cara untuk mengetahui dan

membuktikan keaslian dari sertfikat kegitan ekstrakurikuler, dalam hal ini

pihak Program Studi Pendidikan Teknik Informatika dan Komputer IAIN

Bukittinggi membutuhkan alay yang dapat membantu proses verifikasi

sertifikat krgiatan ekstrakurikuler tersebut secara valid, praktis dan efektif.

Pendefenisian merupakan kegiatan yang dilakukan untuk mencari

informasi data dari perguruan tinggi yang digunakan sebagai tempat

penelitian, sehingga memudahkan dalam memahami dan menerjemahkan

masalah yang ada, sebagaimana yang telah dijelaskan dilatar belakang

masalah. Manfaat dari sistem verifikasi sertifikat kegiatan ekstrakurikuler

mahasiswa berbasis QR Code adalah sebagai alat yang dapat membantu

sistem verifikasi online yang diharapkan dapat mempercepat proses

pengecekan dan pencocokan data dan juga sebagai sistem yang memberikan

informasi tentang keakuratan, keaslian data sertifikat kegiatan ekstrakurikuler

51

yang tersedia dengan cepat, tepat, dan valid di Program Studi Pendidikan

Teknik Informatika dan Komputer IAIN Bukittinggi. Pembuatan sistem

verifikasi sertifikat kegiatan ekstrakurikuler mahasiswa berbasis QR Code ini

dibuat dan disesuaikan dengan kebutuhan yang ada.

Dengan adanya sistem verifikasi sertifikat kegiatan ekstrakurikule

mahasiswa berbasis QR Code ini dapat mempermudah tugas yang dilakukan

oleh dosen penasehat akademik, dimana tugasnya adalah memverifikasi

sertifikat kegiatan ekstrakulrikuler yang di berikanoleh mahasiswa dan

melihat keakuratan dan kevalidan data yang tersedia di sistem.

2. Design

Dalam tahap desain ini penulis merancang sebuah sistem berdasarkan

kebutuhn dari Program Studi Pendidikan Teknik Informatika dan Komputer

khususnya HMPS PTIK, untuk memudahkan dosen pembimbing akademik,

pihak HMPS PTIK dan stakeholder menggunakan sistem, adapun desain dari

sistem ini mencangkup design input, design output, design database, design

teknologi dan design control. Berikut alur akses user ke sistem sebagai

berikut :

52

User Mengakses web Verifikasi Sertifikat

Melihat tampilan dashboard

Melihat panduan penggunaan

Melihat data sertifikat

Melihat detail data sertifikat

Melihat preview foto sertifikat

Melihat download foto sertifikat Selesai

Alur Akses User ke Sistem

Gambar 4.1 Alur Akses User ke Sistem

Gambar 4.1 diatas merupakan alur akses user ke sistem, dimana user

mengakses browser kemudian mengetikan url di addres bar, kemudian user

akan melihat tampilan dashboard, setelah itu dapat melihat panduan

penggunaan, lalu melihat data sertifikat yang tersedia, kemudian melihat

detail data sertifikat. Lalu pilih tombol lihat sertifikat untuk melihat sertifikat,

pilih close untuk menutup pop up yang muncul. Lalu pilih tombol download

sertifikat untuk mengunduh sertifikat, jika unduhan sudah selesai maka user

dapat melihat hasilnya dibagian unduhan.

53

Gambar 4.2 Alur Akses User Membaca Qr Code

Gambar 4.2 merupakan alur akses user membaca Qr Code berbasis

android, dimana user membuka Aplikasi Qr Code Reader, lalu memilih menu

scan, arahkan kamera smartphone ke Qr Code yang ada di foto sertifikat,

maka akan muncul url dan klik pilih browser untuk membukanya dan url

tersebut akan menuju detail data serttifkat, lalu pilih tombol lihat sertifikat

untuk melihat sertifikatnya, pilih close untuk menutup pop up yang muncul,

lalu pilih tombol download sertifikat jika ingin mengunduh sertifikat dan jika

unduhan sudah selesai maka klik bagian unduhan dan user dapat melihat foto

sertifikat.

User Mengakses Apk QR CODE Reader

Pilih menu scan, dan scan sertifikat

Klik link, dan menuju detail sertifikat

Tampil detail data sertifikat

Klik lihat sertifikat untuk melihat foto sertifikat

Klik download untuk download foto sertifikat Selesai

54

Gambar 4.3 Alur Akses Admin ke Sistem

Gambar 4.3 adalah gambar alur akses admin ke sistem, admin

membuka browser dan mengetikan url di addres bar, kemudian menuju menu

tampilan dashboard, kemudian pilih menu panduan untuk melihat tata cara

penggunaan sistem. Setalah itu untuk mengubah URL menggunakan menu

generate link, lalu memlilih menu data sertifikat utuk melihat data sertifkat

yang tersedia di sistem. Setelah itu, klik tombol print unttuk mencetak data

secara keseluruhan, sedangkan untuk mencetak data perindividu gunakan

tombol print di bagian aksi table, lalu klik tombol scarch untuk mencari data

sertifikaat berdasarkan nama atau liannya. Kemudian klik tombol data untuk

menambah data sertifikat. Untuk mengupdate data sertifikat bisa mmilih

Melihat Panduan

Pilih Menu Generate Link

Menambah Data Sertifikat

Mengubah Data Sertifiikat

Menghapus Data Sertifikat

Mencetak Data Sertifikat Keseluruhan

Menghapus Data Sertifikat Perindividu

Logout

Mengakses Web Verifikasi Sertifikat

Memilih Menu Login Admin

Melihat Dashboard

55

tombol update dan untuk menghapus data sertifikat pilih tombol hapus. Jika

sudah selesai maka pilih menu logout untuk keluar dari menu admin.

Desain sistem front-end sebagai beriut :

Gambar 4.4 Desain Sistem Front-End

Gambar 4.4 merupakan desain sistem front-end, menu yang tersedia

untuk user yakni menu dashboard, menu panduan, menu data sertifikat dan

menu login admin. Di dalam menu data sertifikat terdapat tampilan data

sertifikat, memiliki tombol search untuk mencari data sertifikat berdasarkan

nama dan lainnya, juga memiliki tombol detail untuk melihat detail data

sertifikat, dimana dalam detail sertifikat terdapat tombol lihat sertifikat untuk

melihat foto sertifikat dan tombol download untuk mengundah foto sertifikat.

Berikut merupakan desain sistem front-end untuk membanca Qr Code

berbasis android :

Dashboard

Panduan

Data Sertifika sSertifikat

Login Admin

Tampil data

Detail data

Lihat foto Sertifika

Download Setifikat

Mencari data

56

Gambar 4.5 Desain Sistem Akses Front-End Membaca Qr Code Berbasis

Android

Gambar 4.5 merupakan desain sistem akses front-end membaca Qr

Code berbasis android, user membuka Aplikasi Qr Code Reades, pilih menu

scan, setalah kamera membaca Qr Code yang ada di sertifikat, maka muncul

link web, klik link web dan buka di browser, kemudian mencul detail

sertifikat, dimana di dalam detail data sertifikat terdapat tombol lihat sertifikat

untuk mrlihat foto sertifikat dan tombol download untuk mengunduh foto

sertifikat.

Home Apk QR CODE Reader

Scan

Link Web

Browser

Detail Data Sertifikat

Lihat foto Sertifikat

Download Sertifikat

57

Desain web admin untuk back-end sebagai berikut :

Gambar 4.6 Desain Web Admin (Back-End)

Gambar 4.6 merupakan desain web admin atau back-end, admin

mengakses web url dan menuju ke home, pilih menu login admin, admin akan

di arahkan ke form login, jika username dan password benar maka akan di

arahkan ke tampilan dashboard. Kemudian pilih menu generate link untuk

mengubah link menjadi gambar Qr Code. Lalu pilih menu data sertifikat

untuk melihat data sertifikat. Di dalam data sertifikat tersedia enam tombol,

yang pertama tombol tambah data untuk menambah data sertifikat. Yang

kedua tombol print untuk mencetak data sertifikat secara keseluruhan. Yang

ketiga tombol print di bagian Aksi table untuk mencetak data sertifikat

perindividu. Yang empat tombol update untuk mengubah data sertifikat dan

Home Login

Dashboard

Generate Link

Logout

Detail Data Sertifikat

Tampil data

Tambah data

Update data

Delete Data

Cetak data

Mencari data

58

yang kelima tombol delete untuk menghapus data sertifikat. Yang keenam

tombol search untuk mencari data sertifikat berdasarkan nama dan lainnya.

Dan pilih menu logout untuk keluar dari akses admin.

3. Develop

a. Communication (Project Innitiation, Requirements Ghatering)

1) Projek Innitiation (Inisiasi Proyek)

Pada tahapan ini, penulis melakukan kegitan wawancara di IAIN

Bukitinggi, diman penulis mendapatkan data dari pihak Program Studi PTIK

dan juga dari Pihak HMPS PTIK (himpunan mahasiswa program studi) dari

saudara Fikri selaku ketua dari HMPS PTIK bahwa untuk Program Studi

PTIK sendiri belum memiliki fasilitas secara khusus untuk menyampaikan

informasi verifikasi sertifikat kegiatan ekstrakurikuler secara mandiri. Data

yang didapat adalah sebagai berikut :

a) Verifikasi hanya dilakukuan dengan melampirkan blanko

satuan kredit kegiatan mahasiswa tanpa adanya acuan untuk

pencocokan dan pengecekan kebenaran data sertifikat

kegiatan ektrakurikuler tersebut.

b) Terjadinya kasus manipulasi sertifikat kegiatan

ekstrakurikuler di IAIN Bukittinggi.

c) Belum adanya verifikasi secara online yang dapat

mempermudah dan mempercepat proses verifikasi sertifikat

kegiatan ekstrakurikuler di IAIN Bukitting khusunya di

59

Program Studi Pendidikan Teknik Informatika dan

Komputer.

Sistem yang dibuat untuk penyelesaian dari permasalahan ini adalah

sistem verifikasi sertifikat kegiatan ekstrakurikuler mahasiswa berbasis QR

Code menggunakan bahasa pemograman PHP dan database MySQL. Dimana

sistem ini mencangkup data kegiatan ekstrakurikuler mahasiswa Prodi PTIK

IAIN Bukittinggi, yang proses pengerjaan sistem dilakukan selama tiga

minggu dengan biaya Rp. 65.000.

2) Requirements Ghatering (Pengumpulan Kebutuhan)

a) Kebutuan user

Yang dimaksud user pada perancangan sistem ini terdiri dari :

1. Dosen penasehat akademik (dosen PA) dan stakeholder

adalah yang megakses sistem verifikasi sertifikat kegiatan

ekstrakurikuler mahasiswa berbasis QR Code.

2. Adapun kebutuhan yang diperlukan oleh dosen penasehat

akademik adalah handphone android yang digunakan untuk

mengakses sistem verifikasi sertifikat kegiatan

ekstrakurikuler mahasiswa berbasis QR Code dan sudah

terinstal aplikasi QR Code Scanner.

3. Admin adalah yang mengelola data sertifikat kegiatan

ektrakurikuler mahasiswa dan memasukan informasi

sertifikat kegiatan ekstrakurikuler tersebut ke sistem.

60

b) Kebutuhan Sistem

Untuk tugas-tugas sistem secara lengkap, maka akan dibagi

menjadi dua sub pembahasan yaitu kebutuhan fungsional dan

kebutuhan nonfunsional.

1. Kebutuhan Fungsional

Kebutuhan fungsional adalah kebutuhan yanng berisi proses-

proses serta informasi-informasi yang akan dihasilkan oleh

sistem.

Kebutuhan fungsional tersebut adalah :

a. Menangani validasi login admin ke web, sedangkan untuk

dosen penasehat akademik dan stakeholder tidak ada

validasi login.

b. Untuk sistem dosen penasehan akedemik dan stakeholder

dapat melihat data sertifikat kegiatan ekstrakurikuler

secara detail, sedangkan admin dapat menggenerate link,

mencari, mencetak, menambah, mengubah, menghapus

data sertifikat kegiatan ekstrakurikuler.

c. Untuk sistem yang digunakan dosen penasehat akademik

dan stakeholder dapat melihat informasi yang tersedia

secara detail, sedangkan web admin digunakan untuk

memasukan data sertifikat kegiatan ekstrakurikuler seperti

tambah, ubah, hapus data yang tersedia.

61

2. Kebutuhan Non-Fungsional

Kebutuhan non-fungsional yang dibutuhkan untuk

menjalankan sistem verifikasi sertifikat kegiatan

ekstrakurikuler mahasiswa berbasis QR Code dan web

admin yang dirancang adalah kebutuhan komponen

teknologi informasi yaitu hardware dan software.

a. Hardware

Hardware yang dibutuhkan aplikasi dan web admin

adalah :

1) Laptop Acer dengan Processor Intel Core I3 Ram 2

GB

2) Monitor

3) Mouse '

4) Keyboard

5) Scanner

6) Smartphone

7) Media penyimpanan

b. Software

Software yang digunakan untuk dapat menjalankan

sistem verifikasis sertifikat kegitan ekstrakurikuler

berbasis QR Code dan web admin adalah sebagai berikut

:

1) Microsoft Windows 7 Ultimate

62

2) Dreamweaver CS6

3) Photoshop CS 6

4) Browser

5) Xampp 3.2.2

6) Database MySQL

c. Kebutuhan SDM (sumber daya manusia)

Tenaga yang dibutuhkan seperti :

1. Dosen Penasehat Akademik

a. Memahami cara mengoperasikan android secara aktif.

b. Mengerti dan memahami cara penggunaan sistem

verifikasi sertifikat kegiatan ekstrakurikuler

mahasiswa berbasis QR Code.

2. Stakeholder

a. Memahami cara mengoperasikan android secara aktif.

b. Mengerti dan memahami cara penggunaan sistem



3. Admin

a. Memahami pengoprasian komputer secra aktif.

b. Mengerti dan memahami cara penggunaan web admin



63

d. Kebutuhan Teknologi

Kebutuhan teknologi adalah kebutuhan yang mencangkup

alat juga sepesifikasi teknologi yang digunakan. Adapun

peralatan sepesifikasinya adalah sebagai berikut :

1. Aplikasi Qr Code Scanner

a. Handphone android

b. RAM 2 GB

2. Web admin

a. Komputer atau laptop

b. Intel Dual Core

c. Memori 2 GB

d. Hardisk 320 GB

3. Jaringan

Sistem verifikasi sertifikat kegiatan ekstrakurikuler

mahasiswa berbasis QR Code adalah front-end web admin

back-end menggunakan jaringan, bisa diakses di dalam

maupun di luar lingkungan Perguruan Tinggi.

b. Planning (Estimating, Shedulling, Tracking)

1) Estimating (Perkiraan Tugas)

a. Tugas Dosen Penasehat Akademik

1. Melihat informasi sertifikat yang tersedia.

2. Mendownload foto sertifikat.

64

b. Tugas stakeholder

1. Melihat informasi sertifikat yang tersedia.

2. Mendownload foto sertifikat.

c. Admin

1. Login ke sistem

2. Menggenerate link data sertifikat.

3. Memasukan, mengecek, merubah, menghapus data

sertifikat yag tersedia.

65

2) Schedulling (Penjadwalan)

Berikut ini adalah jadwal pembuatan sistem

Tabel 4.1 Penjadwala Proyek

Jadwal Proyek Nama Proyek : Verifikasi Sertifikat Kegiatan Ekstrakurikuler Mahasiswa Berbasis Qr Code di Program Studi Pendidikan Teknik

Informatik dan Komputer IAIN Bukittinggi

Manager proyek

: Mutia Malida Husna 2516009

Dibuat Oleh : Mutia Malida Husna 2516009

Tanggal : 11 September s/d 8 oktober

No Proses / Task

Bulan / Tanggl

September – Oktober

11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 1 2 3 4 5 6 7 8

1

Perancangan Sistem dan Sumber Daya

2

Penentuan Platform kerja yang akan dilakukan

3

Penentuan Framework

4 Coding

5

Pengembangan Sistem Lanjutan

6 Testing

7 Maintenance

66

3) Tracking

Pelacakan untuk melakukan otomatisasi pengujian dan

interaksi aplikasi web penulis menggunakan Selenium IDE,

yang membuat skrip langsung melalui peremban web tanpa

coding. Selenium IDE di tambahkan di browser, setelah itu

jalankan selenium IDE masukan nama folder, masukan link

URL web produk setelah itu rekam dan jalankan sistem.

c. Modeling (Struktur Data, Desain)

1) Struktur Data

Struktur data yang penulis rancang menggunkan tipe array

dan perulangan, untuk penulisannya sebagai berikut :

a) Array dan Looping di Data Sertifikat User

<?php

$no = 1;

$sql_data = mysqli_query($con, "SELECT * FROM tb_mhs ORDER

BY

id ASC") or die (mysqli_error($con));

if(mysqli_num_rows($sql_data) > 0) {

while($data = mysqli_fetch_array($sql_data)) { ?>

<tr>

<td><?=$no++?></td>

<td><?=$data['nim']?></td>

<td><?=$data['nama']?></td>

<td><?=$data['jns_k']?></td>

<td><?=$data['prodi']?></td>

<td><?=$data['jns_kegiatan']?></td>

<td><?=$data['tgl_kegiatan']?></td>

<td><?=$data['no_sertifikat']?></td>

<td><?=$data['id_sertifikat']?></td>

67

<td><?=$data['ft_sertifikat']?></td>

<td>

<a class="btn btn-primary btn-sm" href="detailmhs.php?nim=<?=

$data['nim']; ?>">Detail</a>

</td>

</tr>

<?php

}

}else {

echo "<tr><td colspan=\"4\" align=\"center\">Data tidak

ditemukan</td></tr>";

}

?>

b) Array di Detail Data Sertifikat User

<?php

require_once "../_config/config.php";

$nim = $_GET['nim'];

$sql = "SELECT * FROM tb_mhs WHERE nim='$nim'";

$ambil = mysqli_query($con, $sql);

$data = mysqli_fetch_array($ambil);

?>

c) Array di Download Foto Sertifikat

$sql = mysqli_query($con,"SELECT ft_sertifikat FROM tb_mhs

WHERE nim='$nim'");

$data = mysqli_fetch_array($sql);

$filename = $data['ft_sertifikat'];

$back_dir = "../images/sertifikat/";

$file = $back_dir.$filename;

if (file_exists($file)) {

header('Content-Description: File Transfer');

header('Content-Type: application/octet-stream');

header('Content-Disposition: attachment; filename='.basename($file));

header('Content-Transfer-Encoding: binary');

header('Expires: 0');

68

header('Cache-Control: private');

header('Pragma: private');

header('Content-Length: ' . filesize($file));

ob_clean();

flush();

readfile($file);

exit;

}

d) Array di Data Sertifikat Admin

<?php

$no = 1;


BY id ASC") or die (mysqli_error($con));



<tr>

<td><?=$no++?></td>








<td><?=$data['id_sertifikat']?></td>


<td width="180px">

<a class="btn btn-primary btn-sm" href="edit.php?nim=<?=

$data['nim']; ?>">Update</a>

<a class="btn btn-danger btn-sm" href="delete.php?nim=<?=

$data['nim']; ?>">Delete</a>

</td>

</tr>

<?php

}

}else {

69

echo "<tr><td colspan=\"4\" align=\"center\">Data tidak

ditemukan</td></tr>";

}

?>

e) Array di Hapus Data Sertifikat

<?php

// koneksi database


// menangkap data id yang di kirim dari url


$select = mysqli_query($con, "SELECT * FROM tb_mhs WHERE

nim='$nim'");

$data = mysqli_fetch_array($select);

// menghapus data dari database

mysqli_query($con,"DELETE FROM tb_mhs WHERE nim='$nim'");

if(file_exists('../images/'.$data['foto']) ||

file_exists('../images/sertifikat/'.$data['ft_sertifikat'])) {

unlink('../images/'.$data['foto']);

unlink('../images/sertifikat/'.$data['sertifikat']);

}

// mengalihkan halaman kembali ke index.php

header("location:data.php");

?>

f) Array dan Looping di Print Data Sertifikat

$no = 1;


BY id ASC") or die (mysqli_error($con));



<tr>

<td><?=$no++?></td>






71

2) Design

1. Desain Sistem Secara Umum

a. Use case Diagram

Use case diagram Rancangan sistem verifikasi sertifikat

kegiatan ekstrakurikuler mahasiswa berbasis QR Code

menggambarkan fungsionalitas yang diharapkan dari sebuah

sistem. Use case digunakan untuk mempresentasikan sebuah

interaksi antara aktor dengan sistem. Berikut use diagram

dari Sistem Verifikasi Sertifikat Kegiatan Ekstrakurikuler

Mahasiswa berbasis Qr Code.

72

Gambar 4.7 Use Case Diagram Sistem Verifikasi Sertifikat Kegiatan

Ekstrakurikuler Mahasiswa Berbasis Qr Code

73

Berdasarkan diagram use case di atas pada gambar 4.7 dapat dilihat

terdapat tiga aktor yaitu admin pengelola sistem verifikasi sertifikat

kegiatan ekstrakurikuler mahasiswa berbasis QR Code, yaitu login,

melihat home, melihat panduan, melihat data sertifikat, menggenarete link,

mencetak data sertifikat, menambah data sertifikat, mengubah data

sertifikat, menghapus data sertifikat dan logout, pengguna (dosen

penasehat akademik dan stakeholder) dapat melihat home, melihat data

sertifikat, melihat panduan, melihat detail data sertifikat, mempreview foto

sertifikat, mendownload foto sertifikat dan menscanner sertifikat.

a) Administrator

Administrator adalah Staff Ka.Prodi PTIK maupun

Pihak HMPS PTIK yang mengelola sistem verifikasi

sertifika berbasis QR Code. akses yang dimiliki adalah

dapat menggunakan case login, case home, case

panduan, case menggenerate link, case mencetak data

sertifikat, case melihat data sertifikat, case menambah

data sertifikat, case mengedit data sertifikat, case

menghapus data sertifikat dan case logout dalam sistem.

Admin juga bertanggung jawab untuk mengontrol sistem

yang sedang berjalan agar dapat berjalan dengan baik dan

sebagaiman mestinya.

74

b) Dosen penasehat akademik

Dosen penasehat akademik dapat menggunakan

case home, case panduan penggunaan, case data

sertifikat, case detail sertifikat, case preview sertifikat,

dan mendownload sertifikat.

c) Stakeholder

Stakeholder dapat menggunakan case home, case

panduan penggunaan, case data sertifikat, case detail

sertifikat, case preview sertifikat, dan mendownload

sertifikat.

b. Actvity Diagram

Activity diagram mendeskripsikan seluruh aktivitas

dalam sistem yang sedang dirancang, bagaimana aktivitas

berawal, decision yang mungkin terjadi, dan bagaimana

mereka berakhir. Berikut adalah activity diagram dari sistem

verifikasi sertifikat kegiatan ekstrakurikuler berbasis QR

Code.

75

1) Activity Diagram Admin

Gambar 4.9 Activity Diagram Admin

Pada gambar 4.8 dapat dilihat aktifitas yang dilakukan

oleh admin melalui Actifity Diagram admin. Jika login

sebagai administrator, maka aktifitas yang dilakukan yang

76

pertama kali adalah melihat tampilan home, lalu melihat

panduan admin, kemudian menggenerate link, lalu kemudian

dilanjutkan dengan mengelola data mahasiswa dimana

aktivitas ini meliputi input data sertifikat kedalam database,

mencetak data sertifikat serta mengedit dan menghapus data

sertifikat ke dalam database.

2) Activity diagram Dosen Penasehat Akademik

Gambar 4.10 Activity Diagram Dosen PA (Penasehat Akademik)

77

Dari Activity Diagram Dosen penasehat akademik di

atas dapat dilihat aktivitas yang dilakukan oleh Dosen

penasehat akademik yaitu melihat home, melihat panduan

penggunaan, melihat data sertifikat, melihat detail sertifikat,

mempreview sertifikat dan mendownload sertifikat.

Activity diagram Dosen penasehat akademik membaca QR Code

Gambar 4.11 Activity Diagram Dosen penasehat akademik Menscanner QR

Code di Sertifikat.

78

Dari Activity Diagram dosen penasehat akademik

Menscanner Qr Code di Sertifikat di atas dapat dilihat

aktivitas yang dilakukan oleh dosen penasehat akademik

yaitu melihat home, melihat panduan penggunaan, melihat

data sertifikat, melihat detail sertifikat, mempreview sertifikat

dan mendownload sertifikat.

79

3) Activity diagram Stakeholder

Gambar 4.12 Activity Diagram Stakeholder

Dari Activity Diagram Stakeholder pada gambar di atas

dapat dilihat aktivitas yang dilakukan oleh Stakeholder yaitu

melihat home, melihat paduan penggunaan, melihat data

sertifikat, melihat detail sertifikat, mempreview sertifikat dan

mendownload sertifikat.

80

Activity diagram Stakeholder membaca Qr Code

Gambar 4.13 Activity Diagram Stakeholder Menscanner QR Code di

Sertifikat

Dari Activity Diagram Stackeholder Menscanner QR

Code di Sertifikat di atas dapat dilihat aktivitas yang

dilakukan oleh Stakeholder yaitu melihat home, melihat

panduan penggunaan, melihat data sertifikat, melihat detail

sertifikat, mempreview sertifikat dan mendownload sertifikat.

81

c. Sequence Diagram

1) Sequence Diagram Admin

Gambar 4.14 Sequence Diagram Admin

Gambar Sequence Diagram Admin, pada gambar di

atas berupa interaksi yang dilakukan oleh admin dengan

82

sistem yang digunakan dan terjadi interaksi timbal balik yang

dilakukan oleh admin terhadap sistem tersebut.

2) Sequence Diagram Dosen Penasehat Akademik

Gambar 4.15 Sequence Diagram Dosen Penasehat Akademi

Gambar Sequence Diagram Dosen penasehat akademik

pada gambar di atas berupa interaksi yang dilakukan oleh

83

dosen penasehat akademik dengan sistem yang digunakan dan

terjadi interaksi timbal balik yang dilakukan oleh dosen

penasehat akademik terhadap sistem tersebut.

Sequence Diagram Dosen penasehat akademik Membaca QR Code

Gambar 4.16 Sequence Diagram Dosen penasehat akademik Menscanner QR

Code Di Sertifikat

84

Pada gambar 4.16 di atas berupa interaksi yang

dilakukan oleh dosen penasehat akademik dengan sistem

yang digunakan dan terjadi interaksi timbal balik yang

dilakukan oleh dosen penasehat akademik terhadap sistem

tersebut.

3) Sequence Diagram Stakeholder

Gambar Sequence Diagram Stakeholder

Gambar 4.17 Sequence Diagram Stakeholder

85

Gambar di atas merupakan interaksi yang dilakukan

oleh Stakeholder dengan sistem yang digunakan dan terjadi

interaksi timbal balik yang dilakukan oleh Stakeholder

terhadap sistem tersebut.

Sequence Diagram Stakeholder Membaca QR Code

Gambar 4.18 Sequence Diagram Stakeholder Menscanner QR Code Di Sertifikat

86

Gambar Sequence Diagram Stackeholder Menscanner

QR Code di Sertifikat pada gambar di atas berupa interaksi

yang dilakukan oleh Stackeholder dengan sistem yang

digunakan dan terjadi interaksi timbal balik yang dilakukan

oleh Stakeholder terhadap sistem tersebut.

d. Class Diagram

Gambar 4.19 Class Diagram

Gambar Class Diagram pada gambar di atas berupa

atribut-atribut dan actions yang ada pada sistem tersebut.

87

c) Desain Sistem Front-End

a. Design Output User

Desain keluaran (output) pada umumnya merupakan

hasil dari proses yang dapat disajikan dalam bentuk foto

sertifikat. Dengan melalui intruksi, komputer akan

mengeluarkan hasil pengolahan data ke suatu media output

seperti printer, disket atau screen. Dimana data-datanya

dibaca dari media penyimpanan seperti disket dan hardisk.

Tujuan desain output adalah untuk memahami dan

mengerti tentang segala sesuatu yang berhubungan dengan

format output dan menghasilkan keluaran yang efektif dan

dapat dimengerti. Untuk lebih jelasnya dapat dilihat pada

tabel di bawah ini :

1) Design Menu Home

Halaman ini merupakan tampilan awal setelah user

melakukan mengakses link sistem, berisi tombol home,

data sertifikat, detail sertifikat, lihat sertifikat, download

sertifikat dan tombol login admin, tampilan dari menu

home sebagai berikut :

88

Gambar 4.20 Desain Menu Home

2) Design Menu Panduan Pengguna

Halaman ini merupakan tampilan yang berisi tata cara

memverifikasi sertifikat menggunakan smartphone,

tampilan dari menu panduan sebagai berikut :

Gambar 4.21 Desain Menu Panduan Pengguna

Sistem Verifikasi Sertifikat

Dashboard

Panduan Pengguna

Data Sertifikat

Login admin

Verifikasi Sertifikat

2020 © Mutia Malida Husna 2516009

Home / Dashboard

Selamat Datang Di

Sistem Verifikasi Sertifikat Kegiatan Ekstrakurikuler Mahasiswa Berbasis Qr Code Di Program Srudi Pendidikan Teknik Informatika dan Komputer

IAIN Bukittinggi


Dashboard

Panduan Pengguna

Data Sertifikat

Login admin



Home / Panduan Pengguna

Alat

1. Smartphone

2. Jaringan Atau Paket Dara

3. Aplikasi QR CODE Reader

4.Sertifikat yang Akan dii Scanner

Langkah-langkah

1. Pastikan Jaringan Atau paket Data Telah Hidup

2. Download dan Instal Aplikasi QR CODE Reader di Smartphone

3. Buka Aplikasi QR CODE Reader

4. Pilih Menu Scan

5. Arahkan ke QR CODE yang Ada di Sertifikat

89

3) Design Data Sertifikat

Halaman ini merupakan tampilan data sertifikat,

tampilan dari halaman data sertifikat sebagai berikut :

Gambar 4.22 Desain Data Sertifikat

4) Design Detail Data Sertifikat

Halaman ini merupakan tampilan informasi sesuai yang diinput oleh

admin. Tampilan detail data Sertifikat sebagai berikut :

90

Gambar 4.23 Desain Detail Sertifikat

5) Design Lihat Foto Sertifikat

Halaman ini tampilan melihat foto sertifikat sesuai

yang diinput oleh admin. Tampilan preview sertifikat

sebagai berikut :

Foto / Tampilan Sertifikat


Dashboard

Panduan Pengguna

Data Sertifikat

Login admin


X

Close

Home / Data Sertifikat / Detail Data Sertifikat


Foto

Nim*X(7)

Nama*X(30)

Jenis kelamin*X(20)

Prodi*X(30)

Tgl kegiatan*X(20)

Jns kegiatan*X(50)

No sertifikat *X(30)

Foto

Cancel Lihat Sertifikat Download

Gambar 4.24 Desain lihat Sertifikat

91

6) Design output Download Sertifikat

Halaman ini merupakan tampilan melihat foto sertifikat

yang sudah diunduh, sesuai yang diinput oleh admin.

Tampilan download sertifikat sebagai berikut :

Foto / Tampilan Sertifikat

4.25 Desain output Download Sertifikat

b. Design Output User Membaca QR Code Berbasis

Android

1) Design Output Detail Data Sertifikat

Halaman ini merupakan untuk melihat detail data

sertifikat setelah discan dengan Aplikasi QR Code

Reader. Tampilan detail data sertifikat sebagai berikut :

92

Gambar 4.26 Desain Detail Data Sertifikat berbasis Android

2) Design Lihat Sertifikat

Halaman ini untuk melihat foto sertifikat sertifikat

setelah diklik tombol lihat sertifikat. Tampilan foto

sertifikat sebagai berikut :

Home / Data Sertifikat / Detail Data Sertifikat

Detail Data

Foto

Foto

Nim*X(7)

Nama*X(20)

Jenis Kelamin*(20)

Prodi*(30)

Jns_Kegiatan*(50)

Tgl_Kegiatans*X(20)

No_Sertifikat(50)

Lihat Sertifikat Download


93

Gambar 4.27 Desain Foto Sertifikat berbasis Android

3) Design Download Foto Sertifikat

Halaman ini untuk melihat hasil unduhan foto

sertifikat setelah diklik tombol download. Tampilan

unduhan foto sertifikat sebagai berikut :

X

Close

Foto Sertifikat

QR CODE

X

Foto Sertifikat

QR CODE

Gambar 4.28 Desain Unduhan Foto Sertifikat berbasis

Android

94

d) Design Sistem Admin

a. Design Output Sistem Admin

1) Design Menu Dashboard

Design menu dashboard ini menunjukan halaman

utama saat admin telah berhasil login yang terdiri dari lima

menu yakni, dashboard, panduan, generate link, data

sertifikat serta logout. Pada awal ini kita dapat melihat

informasi mengenai sistem yang ada. Desain sebagai

berikut :

Gambar 4.29 Design Menu dashboard


Dashboard

Panduan

Data Sertifikat

Generate

Profil

Logout Admin



Home / Dashboard

Selamat Datang Di

Sistem Verifikasi Sertifikat Kegiatan Ekstrakurikuler Mahasiswa Berbasis Qr Code Di Program Srudi Pendidikan Teknik Informatika dan Komputer IAIN

Bukittinggi

95

2) Design Tampilan Panduan

Halaman ini merupakan desain tampilan panduan

admin mengenai tata cara penggunaan sistem. Desain

tampilan informasi panduan sebagai berikut :

Gambar 4.30 Design Menu Panduan

3) Design Tampilan Generate Link

Halaman ini merupakan desain tampilan megubah link

detail data sertifikat user menjadi gambar QR Code. Desain

tampilan generate link sebagai berikut :


Dashboard

Panduan

Data Sertifikat

Generate

Profil

Logout Admin



Home / Panduan

Alat

1. Laptop

2. Jaringan atau Peket Data

3. Sertifikat yang Sudah di Scan

Langkah-langkah Generate Link

1. Pilih Menu Generate Link

2. Isi Link yang akan di Generate

4. Pilih Besar QR CODE

5. Klik Generate

2. Download dan Instal Aplikasi QR CODE Reader di Smartphone

3. Buka Aplikasi QR CODE Reader

4. Pilih Menu Scan

5. Arahkan ke QR CODE yang Ada di Sertifikat

96

Gambar 4.31 Design Menu Generate Link

4) Design Tampilan Data Sertifikat

Halaman ini merupakan desain tampilan data

sertifikat berisi data informasi sertifikat Program Studi

Pendidikan Teknik Informatika dan Komputer. Desain

tampilan informasi data sertifikat sebagai berikut :


Dashboard

Panduan

Data Sertifikat

Generate

Profil

Logout Admin



Home / Generate

Gambar QR CODE

URL

Kualitas

Size

Generate Link

Gambar 4.32 Desain Tampilan Data Sertifikat

97

5) Design Cetak Sertifikat Secara Keseluruhan

Halaman ini merupakan desain tampilan cetak data

sertifikat secara keseluruhan. Desain tampilan cetak data

secara keseluruhan sebagai berikut :

Gambar 4.33 Design Menu Mencetak Data Sertifikat

Secara Keseluruhan

6) Design Cetak Sertifikat Perindividu

Halaman ini merupakan desain tampilan cetak data sertifikat perindividu.

Desain tampilan sebagai berikut :

REKAP DATA PESERTA KEGIATAN EKSTRAKURIKULER

KaProdi PTIK

Tanda tangan

NIM

Nama Jenis Kelamin

Prodi

Jns Kegiatan

Tgl Kegiatan

No Sertifikat

Gambar 4.34 Design Menu Cetak Data Sertifikat Perindividu

IAIN Bukittinggi Jl. Raya Gurun Aur, Banuhampu Kab. Agam, Sumatera Barat, 26181 Nomor telp ((0752) 33136 DETAIL DATA PESERTA Nama : Jenis Kelamin : : Prodi : Jenis Kegiatan : Tanggal Kegiatan : No. Sertifikat :

Peserta Kegiatan

NIM :

Dicetak Pada Tanggal

98

b. Desain Input Sistem Admin

1) Design Halaman Login

Halaman ini merupakan halaman yang harus di

isi oleh admin. Admin harus memasukkan username

dan password untuk masuk kedalam sistem

verifikasi srtifikat kegiatan ekstrakurikuler berbasis

QR Code. Jika valid, maka sistem akan masuk

kehalaman khusus hak akses admin yang

merupakan menu utama. Jika tidak valid, maka

user akan diminta untuk mengisikan kembali user

ID dan password yang benar. Berikut desain form

login :

Gambar 4.35 Desain Halaman Login

Username*X(20)

Enter Username and Passwrod

Password*X(50)

Login

Login Admin

99

2) Design Input Data Sertifikat

Halaman ini merupakan pengelolaan data

sertifikat yang tersedia di Program Studi

Pendidikan Teknik Informatika dan Komputer

yang di inputkan oleh admin. Desain input data

sertifikat sebagai berikut :

Gambar 4.36 Desain Halaman Tambah Data

Sertifikat


Dashboard

Panduan

Data Sertifikat

Generate

Profil

Logout Admin


Home / Data Peserta / Tambah Data Peserta

2020© Mutia Malida Husna 2516009

Nama*X(20)

NIM*X(7)

Jns Kelamin*X(20)

Prodi*X(30)

Jns_Kegiatan*X(50)

Tgl_Kegiatan*X(20)

No_Sertifikat*X(50)

Tambah Data Cancel

Tambah Data

Foto *X(100)

Foto_Sertifikath*X(100)

100

3) Design Update Data Sertifikat

Halaman ini merupakan pengeditan data

sertifikat yang tersedia di Program Studi

Pendidikan Teknik Informatika dan Komputer

yang di updatekan oleh admin. Desain update

data sertifikat sebagai berikut :

Gambar 4.37 Desain Halaman Update Data

Sertifikat


Dashboard

Panduan

Data Sertifikat

Generate

Profil

Logout Admin


Home / Data Peserta / Edit Data Peserta

2020 Mutia Malida Husna 2516009

Update Data Cancel

Edit Data

Foto*X(100)

Foto_Sertifikat*X(100)

Choose File

Choose File

Foto Foto Sertifikat

Abaikan juka tidak merubah

gambar

Nama*X(20)

NIM*X(7)

Jns Kelamin*X(20)

Prodi*X(30)

Jns_Kegiatan*X(50)

Tgl_Kegiatan*X(20)

No_Sertifikat*X(50)

101

4. Desain Database

a) File Admin

File ini berisi data tentang id_user, nama_user,

username, password dan level yang akan digunakan pengguna

untuk melengkapi data admin. File admin ini berisikan field-

field sebagai berikut:

Nama Database : sertifikat

Namatabel : tb_user

Field key : id_user

Tabel 4.2 File Admin

No Field Name Tipe Width Ket

1. id_user Varchar 50 Kode admin

2. nama_user Varchar 30 Nama admin

3. Username Varchar 20 Pengguna

4. Password Varchar 50 Kata sandi

5. Level Enum 1, 2 Tingkatan pengguna

b) File Sertifikat

File ini berisi data tentang id, nim, nama, yang

digunakan admin untuk menampilkan data sertifikat kepada

102

alumni dan stakeholder. File data sertifikat ini berisikan field-

field sebagai berikut :

Nama Database : sertifikat

Namatabel : tb_mhs

Field key : nim

Tabel 4.3 File Data Sertifikat

No Field Name Tipe Width Ket

1. Nim Varchar 7 Nomor induk mahasiswa

2. Nama Varchar 30 Nama mahasiswa

3. jns_kel Varchar 20 Jenis Kelamin atau Gender

4. prodi Varchar 30 Nama program studi

5. jns_kegiatan Varchar 50 Nama atau jenis kegiatan

yang dilaksanakan

6. tgl_kegiatan Date Tanggal pelaksanaan

kegiatan

7. no_sertifikat Varchar 50 Kode atau nomor yang ada di

sertifikat

8. foto Varchar 100 Foto

9. ft_sertifikat Varchar 100 Foto sertifikat

103

c. Contruction

1. Sintak Program

Berikut adalah sintak program yang digunakan

pada sistem verifikasi sertifikat kegiatan ekstrakurikuler

mahasiswa berbasis Qr Code di Prodi PTIK IAIn

Bukitinggi.

a. Tombol Login

<?php

if(isset($_POST['login'])) {

$user = trim(mysqli_real_escape_string($con, $_POST['user']));

$pass = sha1(trim(mysqli_real_escape_string($con, $_POST['pass'])));

$sql_login = mysqli_query($con, "SELECT * FROM tb_user WHERE username = '$user' AND password = '$pass'") or die (mysqli_error($con));

if(mysqli_num_rows($sql_login) > 0) {

$_SESSION['user'] = $user;

echo "<script>window.location='".base_url()."';</script>";

}else { ?>

<div class="row">

<div class="col-lg-25 col-lg-offset-5">

<div class="alert alert-danger alert-dismissable" role="alert">

<a href="#" class="close" data-dismiss="alert" aria-label="close">×</a>

<span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>

<strong>Login Gagal!</strong> Username / Password Salah

</div>

</div>

</div>

104

<?php

}

}

?>

b. Tombol Logout

<?php


unset($_SESSION['user']);

echo "<script>window.location='".base_url('user/home.php')."';</script>";

?>

c. Tompbol Tambah Data Sertifikat

<?php


if(!isset($_SESSION['user'])){

echo "<script>window.location='".base_url('auth/login')."';</script>";

}

if(isset($_GET['act'])){

//proses simpan data

if($_GET['act']=='insert'){

//variabel dari elemen form

$nim = $_POST['nim'];

$nama = $_POST['nama'];

$jns_k = $_POST['jns_k'];

$prodi = $_POST['prodi'];

$jns_kegiatan = $_POST['jns_kegiatan'];

$tgl_kegiatan = $_POST['tgl_kegiatan'];

$no_sertifikat = $_POST['no_sertifikat'];

105

$foto = $_FILES['foto']['name'];

$tmp_foto = $_FILES['foto']['tmp_name'];

$ft_sertifikat = $_FILES['ft_sertifikat']['name'];

$tmp_ft_sertifikat = $_FILES['ft_sertifikat']['tmp_name'];

$ext_dibolehkan = array('jpg','jpeg','png');

$x = explode('.', $foto);

$y = explode('.', $ft_sertifikat);

$ext1 = strtolower(end($x));

$ext2 = strtolower(end($y));

$loc_foto = './images';

$loc_ft_sertifikat = './images/sertifikat';

if($nim=='' || $nama=='' || $jns_k=='' || $prodi=='' || $jns_kegiatan=='' || $tgl_kegiatan=='' || $no_sertifikat==''|| $foto=='') {

header('location:data.php');

} else {

//proses simpan data admin

if(in_array($ext1, $ext_dibolehkan) && in_array($ext2, $ext_dibolehkan) === true) {

if(move_uploaded_file($tmp_foto, '../images/'.$foto) && move_uploaded_file($tmp_ft_sertifikat, '../images/sertifikat/'.$ft_sertifikat)) {

$tambah = mysqli_query($con, "INSERT INTO tb_mhs (nim,nama,jns_k,prodi,jns_kegiatan,tgl_kegiatan,no_sertifikat,ft_sertifikat)

VALUES ('$nim','$nama','$jns_k','$prodi','$jns_kegiatan','$tgl_kegiatan','$no_sertifikat','$ft_sertifikat')");

if($tambah) {

echo "<script>alert('Data dengan Nim $nim dan Nama $nama berhasil ditambah');</script>";

echo "<script>window.location='data.php';</script>";

} else {

echo "<script>alert('Tambah data dengan Nim $nim dan Nama $nama gagal ');</script>";

106

echo "<script>window.location='add.php';</script>";

}

} else {

echo "<script>alert('Foto gagal diupload');</script>";


}

} else {

echo "<script>alert('Ekstensi yang dibolehkan hanya jpg, jpeg, png');</script>";


}

}

} else {


}

} else {


}

?>

d. Tombol hapus data sertifikat

<?php // koneksi database require_once "../_config/config.php"; // menangkap data id yang di kirim dari url $nim = $_GET['nim']; $select = mysqli_query($con, "SELECT * FROM tb_mhs WHERE nim='$nim'"); $data = mysqli_fetch_array($select); // menghapus data dari database mysqli_query($con,"DELETE FROM tb_mhs WHERE nim='$nim'"); if(file_exists('../images/'.$data['foto']) || file_exists('../images/sertifikat/'.$data['ft_srtifikat'])) { unlink('../images/'.$data['foto']); unlink('../images/sertifikat/'.$data['ft_sertifikat']); } // mengalihkan halaman kembali ke index.php header("location:data.php");

107

?>

e. Tombol cetak data sertifikat keseluruhan

<?php require_once "../_config/config.php"; ?> <title>VerTif</title> <h1>Rekap Data Peserta Kegiatan Ekstrakurikuler</h1> <div class="table-responsive"> <table id="datatables" class="table table-bordered table-striped"> <thead> <tr> <th width="20">No</th> <th width="34">NIM</th> <th width="40">Nama</th> <th width="68">Jenis Kelamin</th> <th width="42">Prodi</th> <th width="61">Jns Kegiatan</th> <th width="69">Tgl Kegiatan</th> <th width="64">No Sertifikat</th> </tr> </thead> <tbody> <?php $no = 1; $sql_data = mysqli_query($con, "SELECT * FROM tb_mhs ORDER BY id ASC") or die (mysqli_error($con)); if(mysqli_num_rows($sql_data) > 0) { while($data = mysqli_fetch_array($sql_data)) { ?> <tr> <td><?=$no++?></td> <td><?=$data['nim']?></td> <td><?=$data['nama']?></td> <td><?=$data['jns_k']?></td> <td><?=$data['prodi']?></td> <td><?=$data['jns_kegiatan']?></td> <td><?=$data['tgl_kegiatan']?></td> <td><?=$data['no_sertifikat']?></td> </tr> <?php } }else { echo "<tr><td colspan=\"4\" align=\"center\">Data tidak ditemukan</td></tr>"; } ?> </tbody> </table> </div> <h4>Ketua Program Studi</h4> <br>

108

<h4>Riri Okra</h4> <script> window.print(); </script>

f. Tombol generate link

<title>VerTif</title> <?php if(isset($_POST) && !empty($_POST)) { include('../library/phpqrcode/qrlib.php'); $image_location = "temp/"; $image_name = date('d-m-Y-h-i-s').'.png'; $dataContent = $_POST['dataContent']; $ecc = $_POST['ecc']; $size = $_POST['size']; // generating the QR code QRcode::png($dataContent, $image_location.$image_name, $ecc, $size); // displaying the QR code on the web page echo '<img class="img-thumbnail" src="'.$image_location.$image_name.'" />'; } else { header('location:./'); } ?>

g. Tombol download sertifikat

<title>VerTif</title> <?php if(isset($_POST) && !empty($_POST)) { include('../library/phpqrcode/qrlib.php'); $image_location = "temp/"; $image_name = date('d-m-Y-h-i-s').'.png'; $dataContent = $_POST['dataContent']; $ecc = $_POST['ecc']; $size = $_POST['size']; // generating the QR code

109

QRcode::png($dataContent, $image_location.$image_name, $ecc, $size); // displaying the QR code on the web page echo '<img class="img-thumbnail" src="'.$image_location.$image_name.'" />'; } else { header('location:./'); } ?>

2. Pengujian Sistem

a) Testing

Testing adalah tahap pengujian, testing akan

dilakukan apabila pembuatan program dan seluruh data

dimasukkan. setelah program diujikan apabila terdapat

kesalahan maka program akan diperbaiki, apabila sudah

berjalan dengan baik maka program akan diterjunkan ke

lapangan (distribution).

b) Pengujian dengan metode Blackbox

Pengujian dengan metode blackbox adalah

pengujian yang dilakukan untuk antarmuka perangkat

lunak, pengujian ini dilakukan untuk memperlihatkan

bahwa fungsi-fungsi bekerja dengan baik.

Tabel identifikasi dan rencana pengujian untuk

sistem verifikasi serrtifikat kegiatan ekstrakurikuler

mahasiswa berbasis Qr Code atau front-end sebagai

berikut :

110

Tabel 4.4 Tabel Hasil Uji Front-End menggunakan Blackbox

Testing

Kasus dan Hasil Uji

Data

Inputan

Reaksi yang

Diharapkan Pengamatan Kesimpulan

1 2 3 4

Menu halaman

utama

Halaman utama dapat

diakses

Tampil halaman

utama / Home

Diterima

Menu panduan

Pengguna

Menampilkan panduan

penggunaan sistem

Tampil panduan Diterima

Menu melihat

data sertifikat

Menampilkan informasi

data sertifikat yang

tersedia

Tampil halaman

data sertifikat

Diterima

Menu mencari

data sertifikat


data sertifikat yang

dicari

Tampil data

sertifikat

Diterima

Menu melihat

detail data

sertifikat


tentang detail data

sertifikat

Tampil informasi

detai data sertifikat

Diterima

Menu melihat

foto sertifikat

Menampilkan foto

sertifikat

Tampil foto

sertifikat

Diterima

Menu

mendownload

Menampilkan jendela

download foto

Tampil jendela

untuk mengecek

Diterima

111

sertifiikat

Foto sertifikat Sertifikat download

Foto

Tabel 4.5 Tabel Hasil Uji Front-End untuk Membaca Qr Code

Menggunakan Blackbox Testing

Kasus dan Hasil Uji

Data

Inputan

Reaksi yang


1 2 3 4

Menu halaman

utama Apk Qr

Code Scanner

Menampilkan halaman

utama

Tampil halaman

utama / Home

Diterima

Menu Scan Qr

Code

Menampilkan kamera

untuk menscanner

Tampil kamera Diterima

Menu Link

Web verifikasi

sertfikat

Menampilkan Link

Web verifikasi sertfikat

Tampil Link Web

verifikasi sertfikat

Diterima

Menu Open

Browser

Menampilkan web di

Browser

Tampil halaman

web di Browser

Diterima

Menu melihat

detail data

sertifikat


tentang detail data

sertifikat

Tampil informasi

detai data sertifikat

Diterima

112

Menu melihat Menampilkan foto

sertifikat

Tampil foto

sertifikat

Diterima

Menu

mendownload

foto sertifikat

Menampilkan jendela

download foto sertifikat

Tampil jendela

untuk mengecek

download foto

sertifikat

Diterima

Tabel identifikasi dan rencana pengujian untuk web admin atau back-

end sebagai berikut:

Tabel 4.6 Tabel Hasil Uji Back-End menggunakan Blackbox Testing

Kasus dan Hasil Uji

Data

Inputan

Reaksi yang


1 2 3 4

Menu halaman

utama

Halaman utama dapat

diakses

Tampil halaman

utama / Home

Diterima

Menu login Menampilkan halaman

login langsung menuju

halaman utama admin

Tampil halaman

menuju halaman

utama

Diterima

Menu Panduan Menampilkan halaman

panduan

Tampil halaman

panduan

Diterima

Menu Menampilkan generate Tampil halaman Diterima

Generate Link link data sertifikat generate link

113

Menu

Mencetak Data

sertifikat

keseluruhan

Menampilkan data

sertifikat keseluruhan

yang akan dicetak

Tampil halaman

cetak data sertifikat

Diterima

Menu

mencetak data

sertifikat

perindividu

Menampilkan data

sertifikat perindividu

yang akan dicetak

Tampil halaman

cetak data sertifikat

Diterima

Menu data

sertifikat

Menampilka data

sertifikat yang tersedia

Tampil data

sertifikat

Diterima

Menu

menambah

data sertifikat

Menampilkan form

input data

Tampil form input

data

Diterima

Menu ubah

data sertifikat

Menampilkan data

sertifikat ulang yang

akan diubah

Tampil edit data

sertifikat

Diterima

Menu hapus

data sertifikat

Menghapus data

sertifikat yang dipilih

Tampil data

sertifikat sesudah

dihapus

Diterima

Menu logout Menampilkan jendela

konfirmasi untuk keluar

Tampil jendela ke

home user

Diterima

d. Deployment (Delivery, Support, Feedback)

114

1) Delivery

Pengiriman produk ke user menggunakan

pemanfaatan media sosial yakni, group WhatsApp

angkatan dan pesan person melalui WhatApp maupun

sosial media lainnya.

2) Support

Memiliki manfaat untuk prodi PTIK maupun pihak

HMPS PTIK, sistem berjalan dengan baik, sistem mudah

digunakan, efesien dan efektif.

3) Feedback

Dalam tahap ini penulis telah melakukan

pembaharuan terhadap sistem dan koreksi dari berbagai

kekurangan yang telah melalui tahap pengujian dan

pengujian sistem.

3. Dessiminate

Proses diseminasi merupakan suatu tahap akhir

pengembangan. Tahap diseminasi dilakukan untuk

mempromosikan produk pengembangan agar diterima

pengguna, baik individu, suatu kelompok, atau sistem.

Tahapan diseminasi merupakan tahap penggunaan produk

final yang dihasilkan berupa sistem verifikasi sertifikat

mahasiswa berbasis Qr Code. Dalam penyebaran penelitian

ini hanya menggunakan group Whatsapp, pesan person dan

115

komputer atau perangkat yang digunakan oleh dosen PA

dan stakeholder.

Untuk mengetahui kevalidan, kepraktisan dan

keefektifan penggunaan sistem verifikasi sertifikat

mahasiswa berbasis Qr Code ini dengan cara

memperlihatkan produk, kepada tim penguji yang terdiri

dari dosen, pihak prodi, pihak HMPS dan mahasiswa,

sehingga dapat memberikan saran atau komentar untuk

melengkapi pengembangan produk yang dihasilkan.

4. Uji Produk

a. Uji Validitas

Untuk memperoleh produk yang berkualitas

dan siap pakai maka perlu dilakukan uji

validitas produk. Tujuan uji validitas ini

dilakukan adalah untuk melihat isi dari produk

yang telah dirancang dengan tujuan untuk

mengukur ketepatan isi produk. Uji validitas

produk dilakukan dengan konsultasi dan

meminta penilaian kepada para ahli di

bidang sistem komputer. Tahap pengujian

validitas ini peneliti tujukan kepada ahli

pendidikan yaitu Bapak Dr. Iswantir M, M.Ag

dan ahli bidang komputer yaitu ibuk Liza

116

Efriyanti, S. Si, M. Kom dan ibuk Rina Novita,

S.Pd, M.Kom. Berikut ini adalah tabel pengujian

validitas produk dari beberapa ahli yang memberi

penilaian, adapun aspek - aspek yang dinilai

adalah sebagai berikut :

117

Tabel 4.7 hasil Uji Validitas Produk

No Aspek yang

dinilai Validator Skala Rater

∑S n (c-1) V Rina Novita, S.Pd,

M.Kom Liza Efriyanti, S. Si., M.

Kom Dr. Iswantir M,

M.Ag S1 S2 S3

1

Validitas Isi

4 4 4 3 3 3 9 12 0,75

2 4 4 4 3 3 3 9 12 0,8

3 4 4 5 3 3 4 10 12 0,83

4 3 5 4 2 4 3 9 12 0,8

1

Intruksional Desain

3 5 5 3 4 4 11 12 0,92

2 4 4 4 2 3 3 8 12 0,67

3 4 4 5 3 3 4 10 12 0,83

4 4 5 5 3 4 4 11 12 0,92

5 3 5 5 3 4 4 11 12 0,92

1

Tampilan

4 4 4 2 3 3 8 12 0,7

2 3 5 4 3 3 3 9 12 0,75

118

3 4 5 5 2 4 3 9 12 0,75

4 4 4 4 3 4 4 11 12 0,92

5 4 4 4 3 3 3 9 12 0,75

1

Kebahasaan

4 5 5 3 3 3 9 12 0,83

2 4 5 4 3 4 3 10 12 0,83

3 4 4 4 3 4 3 10 12 0,83

4 4 4 5 3 3 4 10 12 0,83

Rata – Rata 3,8 4,4 4,4 3 3,4 3,4 9,6 12 0,80

Dari hasil uji validitas yang peneliti lakukan dengan tiga orang dosen, dari bidang masing-masing

dengan menggunakan rumus Aikens ' V maka diperoleh rata-rata 0,80. Dengan demikian hasil uji validitas

sistem Verifikasi Sertifikat Kegiatan Ekstrakurikuler Mahasiswa Berbasis Qr Code di PTIK IAIN Bukittinggi

menggunakan rumus Statistik Aikens’V mendapatkan hasil yang Valid.

119

b. Uji Praktikalitas

Profesional ini diperoleh berdasarkan angket yang dibuat dan disebar secara online yang diisioleh

dosen dan pihak HMPS sebagai praktikalitas yang nantinya akan menggunakan dan mengelola sistem

Verifikasi Sertifikat kegiatan Ekstrakurikuler Mahasiswa Berbasis Qr Code di PTIK IAIN Bukittinggi yaitu,

Bapak dan

Adapun asepek-aspek yang dinilai adalah sebagai berikut :

Tabel 4.8 Hasil Uji Praktikalitas Produk

Penguji

Nilai Pernyataan

p pe k Rata

seluruhnya 1 2 3 4 5

Kiki Kirany (Anggota HMPS

PTIK) 4 4 4 5 4 0,84 0,16 0,8 0,86 Rafi Thahir (Anggota HMPS

PTIK) 4 5 5 4 4 0,88 0,12 0,9 Fikria Aikal (Anggota HMPS

PTIK) 4 5 4 5 5 0,92 0,08 0,9

120

Jadi, nilai praktikalitas yang didapat dengan menggunakan rumus Momen Kappa berada pada rentang

0,81 – 1,00 maka, hasilnya Sangat Praktis.

c. Uji Efektivitas

Uji efektifitas sistem Vverifikasi Sertifikat Kegiatan Ekstrakurikuler Mahasiswa Berbasis Qr Code Di

PTIK IAIN Bukitinggi diperoleh berdasarkan angket efektifitas yang di sebar dan diisi oleh 10 orang

mahasiswa PTIK dan alumi sebagai stakeholder. Adapun asepek-aspek yang dinilai adalah tampilan

produk, isi dan manfaat produk, cara penggunaan produk dan lainnya.

Berikut adalah tabel uji efektifitas produk :

121

Tabel 4.9 hasil Uji Efektifitas Produk

Nilai tersebut telah diterapkan kedalam tabel patokan kesapakatan rumus G-Score maka berada

pada interval 0,81 – 1,00. Jadi kriteria dari sistem Verifikasi Sertifikat Kegiatan Ekstrakurikuler

Mahasiswa Berbasis Qr Code di PTIK IAIN Bukittinggi adalah Sangat Efektif.

Penguji Nilai Sebelum Nilai Sesudah Total

Sebelum Total

Sesudah G-Score Rata

seluruhnya 1 2 3 4 5 1 2 3 4 5 Weni sarma fitri 2 3 2 3 2 5 5 4 5 4 12 23 0,85

0,9

Wina Gusniati 3 2 2 3 3 5 5 4 5 5 13 24 0,92 Marwan Efendi 2 3 3 3 2 5 5 5 5 5 13 25 1,00

Fitria Sovia 3 3 3 3 2 5 4 5 4 5 14 23 0,82 Mira Sartika 3 2 3 3 2 5 4 4 5 5 13 23 0,83 Eni Elfina 2 3 2 2 3 4 5 5 5 4 12 23 0,85 Rovi Fricia

Yunisa 3 2 3 2 3 4 5 5 5 4

13 23 0,83 Fikri Aikal 2 3 2 3 3 5 4 4 5 5 13 23 0,83

Aulia Rahmi 3 3 2 3 2 4 4 4 5 5 13 22 0,75 Rahmadhani 3 2 2 3 2 5 4 5 5 5 12 24 0,92

122

BAB V

PENUTUP

A. Kesimpulan

Berdasarkan hasil penelitian yang telah penulis lakukan dan uraian

yang telah penulis kemukakan pada bab-bab sebelumnya mengenai rancangan

sistem Verifikasi Sertifikat kegiatan Ekstrakurikuler Mahasiswa Berbasis Qr

Code di PTIK IAIN Bukittinggi menggunakan bahasa pemograman

PHP/MySql. Menghasilkan sebuah web dengan URL

http://sifertif.000webhostapp.com//user/ home.php sebagai front-end bagi

user, dan web dengan URL http://sifertif.000webhostapp.com sebagi back-

end bagi admin.

B. Saran

1. Adim

Kepada admin memiliki harapan semoga kedapannyanuntuk dapat

mengunakan dan mengembangkan sistem Verifikasi Sertifikat Kegiatan

Ekstrakurikuler Mahasiswa Berbasis Qr Code di PTIK IAIN dengan baik,

serta diharapkan sistem yang dibuat dapat membantu dan mempermudah

dalam pendataan sertifikat kegiatan ekstrakurikuler mahasiswa.

123

2. User

Kepada user semoga dengan adanya sistem verifikasi Sertfikat Kegiatan

Ekstrakurikuler Mahasiswa Berbasis Qr Code ini dapat membantu memberi

kemudahan dan ketepatan informasi yang berhubungan dengan pencocokan

data Sertifikat Ekgiatan Ekstrakurikuler Mahasiswa.

3. Penulis

Kepada penulis sendiri diharapkan dapat mengembangkan sistem yang telah

dibuat agar lebih menarik, lebih memberi informasidan maanfaat serta

memberi kemudahan guna bagi user maupun admin.

Daftar Pusaka

[1] Al-Jumanatul ’Ali, “al-qur’an-converted.pdf.” Cv Penerbit jamanatul ’ Ali -

Art (J-ART), Bandung, 2004. [2] Sugiyono, “Kamus Bahasa Indonesia.” Pusat Bahasa, Jakarta, p. 1335,

2008. [3] D. A. Kusuma, Rodliyah, and Sahnan, “Sertifikat Hak Milik Atas Tanah

Sebagai Alat Bukti Hak Yang Kuat Certificate of the Property Right As an Evidence of Powerfull Right,” J. IuS, vol. 5, no. 24, pp. 312–321, 2017.

[4] Sugiyono and Y. Maryani, “Kamus Bahasa Indonesia Sugiyono.” Pusat

Bahasa, Jakarta, p. 380, 2008. [5] H. Alwi, “Kamus Besar Bahasa Indonesia.” Balai Pustaka, Jakarta, pp. 1,

418, 651, 1260, 2007. [6] Q. Aini, U. Rahardja, and A. Fatillah, “Penerapan Qrcode Sebagai Media

Pelayanan Untuk Absensi Pada Website Berbasis Php Native,” Sisfotenika, vol. 8, no. 1, p. 47, 2018.

[7] M. Muslihudin and A. Larasat, “Perancangan Sistem Aplikasi Penerimaan

Mahasiswa Baru Di Stmik Pringsewu Menggunakan Php Dan Mysql,” J. TAM, vol. 3, no. 2, pp. 1–8, 2016.

[8] ElisaUsada, YanaYuniarsyah, and N. Rifani, “Rancang bangun sistem

informasi Jadwal perkuliahan berbasis jquery mobile dengan menggunakan php dan mysql Elisausada,” J. Infotel, vol. 4, no. November, 2012.

[9] I. U. W. Rulia Puji Hastanti, Bambang Eka Purnama, “Sistem Penjualan

Berbasis Web ( E-Commerce ) Pada Tata Distro Kabupaten Pacitan,”

Bianglala Inform., vol. 3, no. 2, pp. 1–9, 2015. [10] S. Mohammad, Yusuf, S. Sholahuddin, and D. Tjahjanulin, “Implementasi

Kebijakan Verifikasi Perizinan Usaha Guna Peningkatan Pendapatan Asli Daerah Kabupaten Gresik (Studi Pada Badan Penanaman Modal Dan Perizinan Kabupaten Gresik),” J. Adm. Publik Mhs. Univ. Brawijaya, vol. 2, no. 3, pp. 550–556, 2014.

[11] J. Paune and M. Arwadi, “Evaluasi Dan Usulan Perbaikan Kapasitas

Produksi Untuk Mencapai Target Produksi Menggunakan Metode Theory of Constraints Dan Simulasi,” J. Tek. Ind., vol. 6, no. 2, pp. 113–127, 2016.

[12] Nurniah, N. Sukriah, and H. Dahsan, “Analisis Manfaat Sertifikat

Kompetensi Terhadap Peluang Kerja Alumni Jurusan Akuntansi Politeknik Negeri Ujung Padang,” Pros. Semin. Has. Penelit., vol. 2018, pp. 149–154, 2018.

[13] J. Wijaya and R. Taufiq, “Implementasi Teknologi Barcode dalam Dunia

Bisnis.” CV Andi, Yogyakarta, pp. 38–41, 2010. [14] M. L. Ali, “Penerapan Model Presensi Ujian Semester Berbasis Quick

Response Code ( QR Code ) di Universitas Muhammadiyah Jember,” J. Sitem Teknol. Inf. Indones., vol. 1, pp. 113–122, 2016.

[15] E. Ardhianto et al., “Dengan Memanfaatkan Gambar Qr Code,” Pengemb. Metod. OTENTIKASI KEASLIAN IJASAH DENGAN MEMANFAATKAN GAMBAR QR CODE Eka, vol. 13, pp. 35–41, 2016.

[16] E. Z. Henry Februariyanti, “Rancang Bangun Sistem Perpustakaan untuk

Jurnal Elektronik,” J. Teknol. Inf. Din., vol. 17, no. 2, pp. 124–132, 2012. [17] M. Dr. Supratman Zakir, S. Kom., M. K. Pd., and M. K. Amrizal, S.Kom,

“Kupas Tuntas Pemograman Berbasis Web, HTML, PHP, Java + MySQL,”

p. 35, 2019. [18] S. Zakir, “Aplikasi Sistem Pakar Pengihutangan Zakat Maal (2),” Phys.

Rev. E, vol. 5, no. Sistem Pakar, PHP (HyperText Preprocessor), Zakat Maal, 2011.

[19] A. S. Putra, O. M. Febriani, and B. Bachry, “Implementasi Genetic Fuzzy

System Untuk Mengidentifikasi Hasil Curian Kendaraan Bermotor Di Polda Lampung,” SIMADA (Jurnal Sist. Inf. Manaj. Basis Data), vol. 1, no. 1, p. 21, 2018.

[20] A. Hendini, “Pemodelan uml sistem informasi monitoring penjualan dan

stok barang (studi kasus: distro zhezha pontianak),” J. Chem. Inf. Model., vol. 53, no. 9, pp. 1689–1699, 2013.

[21] T. V. N. Megarian, “Aplikasi Forum Pajak Menggunakan Framework

Bootstrap,” Technol. J. Ilm., vol. 8, no. 2, p. 97, 2017. [22] A. Suryanto, “Pembangunan Aplikasi Piket Pada Sekolah Menengah Atas

Satu Kudus Berbasis Web Angga,” J. Speed Sentra Penelit. Eng. dan Edukasi, vol. 4, no. 1, pp. 63–72, 2012.

[23] S. Zakir, “Modernisasi Administrasi Usaha Kecil Menengah (Ukm) Melalui Pemanfaatan Sistem Informasi,” Proseding Semin. Nas. Asos. Perguru. Tinggi Ilmu Komput., vol. 1, no. 1, p. 9, 2016.

[24] D. Priyanti and S. Iriani, “Sistem Informasi Data Penduduk Pada Desa

Bogoharjo Kecamatan Ngadirojo Kabupaten Pacitan,” IJNS - Indones. J. Netw. Secur., vol. 2, no. 4, p. 56, 2013.

[25] J. Ahmat, “Implementasi Framwork Boostrap Pada Website Stmik

Prabumulih,” J. Mantik Penus, vol. 20, no. 1, pp. 1–4, 2016. [26] E. Maiyana and T. Mengkasrinal, “Pengembangan Sistem Informasi Surat

Keterangan Pendamping Ijazah Berbasis Web dan Mobile Android,” Pros. SISFOTEK 2017, vol. 1, no. 1, p. 4, 2017.

[27] S. Lestanti and S. A. Desi, “Sistem Pengarsipan Dokumen Guru Dan

Pegawai Menggunakan Metode Mixture Modelling Berbasis Web,” J. Antivirus, vol. 10, no. 2, pp. 69–77, 2016.

[28] R. A. . S, “Rekayasa Perangkat Lunak.” Penerbit Informatika, Bandung,

2014. [29] R. Sovia and J. Febio, “Membangun Aplikasi E-Library Menggunakan

Html, Php Script, Dan Mysql Database,” Processor, vol. 6, no. 2, pp. 38–

54, 2011. [30] L. Storus, “Algoritma dan Pemrograman.” CV Andi, Yogyakarta, pp. 14–

16, 2015. [31] E. Febriyanto, U. Rahardja, A. Faturahman, and N. Lutfiani, “Sistem

Verifikasi Sertifikat Menggunakan Qrcode pada Central Event Information,” Techno.Com, vol. 18, no. 1, pp. 50–63, 2019.

[32] Y. Widiantoro, “Implementasi qrcode pada berkas kelulusan mahasiswa

berbasis pdf web,” Semin. Nas. Ilmu Komput. (SNIK 2015), no. Snik, pp. 15–20, 2015.

[33] R. Anita and R. Arif, “Sistem Pengamanan Keaslian Ijasah Menggunakan

QR-Code dan Algoritma,” Seminar, vol. 1, no. 2, pp. 105–112, 2011. [34] U. Rahardja, E. Febriyanto2, and M. A. Aldiya, “Penerapan Central Event

Information Untuk Mencetak Sertifikat dan Verifikasi Dengan QR Code Menggunakan Global Extreme Programming,” J. Inform. Upgris, vol. 4, no. 2, pp. 2–7, 2019.

[35] Sugiyono, “Metode Penelitian Pendidikan Pendekatan Kuantitatif,

Kualitatif, dan R&D.” Alfabeta, pp. 407–445, 2015. [36] T. Surtarti and E. Irawan, “Kiat Sukses Meraih Hibah Penelitian

Pengembangan.” CV Budi Utama, Yogyakarta, pp. 12–15, 2017. [37] E. Mulyatiningsih, “Riset Terapan Bidang Pendidikan Dan Tekni,” pp. 50–

56, 2011. [38] R. Okra, “Pengembangan Media Pembelajaran Digital IPA Di SMP N 3

Kecamatan Pangkalan Riri Okra,” vol. 4, no. 2, pp. 123–124, 2019. [39] M. Muslihudin and Oktafianto, “Perancangan Sistem Informasi

Menggunakan Model Terstruktur dan UML.” CV Andi Offset, Yogyakarta, pp. 33–34, 2016.

[40] D. Febriyanti and Anita, “Website Cv Cahaya Motor Sebagai Media

Promosi,” Konf. Nas. Sist. Inf., vol. 8, no. 2015, pp. 8–9, 2018. [41] P. Setiawan, Sulistiowati, and J. Lemantara, “Rancang Bangun Aplikasi

Pengolahan Data Evaluasi Proses Belajar Mengajar Berbasis Web,” Jsika, vol. 4, no. 2, pp. 1–6, 2015.

[42] W. N. Cholifah, Yulianingsih, and S. M. Sagita, “Pengujian Black Box

Testing pada Aplikasi Action & Strategy Berbasis Android dengan Teknologi Phonegap,” STRING (Satuan Tulisan Ris. dan Inov. Teknol., vol. 3, no. 2, p. 206, 2018.

[43] H. Retnawati, Analisis Kuantitatif Instrumen Penelitian, Parama Pub. Yogyakarta, 2016.

[44] L. R. Aiken, “Three Coeficients For Analyzing The Realibility And

Validity Of Ratings,” Hisp. J. Behav. Sci., vol. 9, no. 2, pp. 183–205, 2001. [45] F. Eliza and M. D. Elvanny, “Trainer Pada Pembelajaran Dasar Dan

Pengukuran Listrik,” J. Teknol. Inf. Pendidik., vol. 10, no. 1, pp. 72–83, 2017.

[46] Z. M. Agni, E. W. Rizky, S. Islami, and P. Doni, “Perancangan Media Pembelajaran Listrik Statis dan Dinamis Berbasis Android,” INTECOMS J. Inf. Technol. Comput. Sci., vol. 1, no. 1, pp. 1–7, 2018.

[47] F. T and Suryelita, “Pengembangan Lkpd Berbasis Problem Based

Learning Pada Materi Asam Karboksilat Dan Ester Untuk Kelas Xii Sma/Ma,” Edukimia J., vol. 1, no. 4, pp. 118–123, 2019.

[48] P. A. Dina, “Efektifitas Pembelajaran Berbasis Guided Inquiry untuk

Meningkatkan Literasi Sains Siswa,” J. Fis. dan Pendidik. Fis., vol. 1, no. 2, pp. 1–5, 2015.

124

LAMPIRAN I

125

LISTING PROGRAM

Berikut adalah listing program dari sistem verifikasi sertifikat

kegiatan ekstrakurikuler mahasiswa berbasis Qr Code (front-end) :

6. Koneksi

<?php

date_default_timezone_set('Asia/Jakarta');

session_start();

$con = mysqli_connect('localhost', 'root', '', 'sertifikat');

if(mysqli_connect_errno()) {

echo mysqli_connect_error();

}

function base_url($url = null) {

$base_url = "http://localhost/vertif";

if($url != null) {

return $base_url."/".$url;

}else {

return $base_url;

}

}

?>

7. Topmenu User

<?php


?>

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<title>VerTif</title>



<meta name="viewport" content="width=device-width, initial-scale=1">



<link rel="stylesheet" href="<?=base_url()?>/_assets/plugins/fontawesome-free/css/all.min.css">



<link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">



<link rel="stylesheet" href="<?=base_url()?>/_assets/plugins/tempusdominus-bootstrap-4/css/tempusdominus-bootstrap-4.min.css">



<link rel="stylesheet" href="<?=base_url()?>/_assets/plugins/icheck-bootstrap/icheck-bootstrap.min.css">



<link rel="stylesheet" href="<?=base_url()?>/_assets/plugins/jqvmap/jqvmap.min.css">

126

<link rel="stylesheet" href="<?=base_url()?>/_assets/dist/css/adminlte.min.css">



<link rel="stylesheet" href="<?=base_url()?>/_assets/plugins/overlayScrollbars/css/OverlayScrollbars.min.css">



<link rel="stylesheet" href="<?=base_url()?>/_assets/plugins/daterangepicker/daterangepicker.css">



<link rel="stylesheet" href="<?=base_url()?>/_assets/plugins/summernote/summernote-bs4.css">



<link rel="stylesheet" href="<?=base_url()?>/_assets/datatables/css/bootstrap.min.css"/>

<link rel="stylesheet" href="<?=base_url()?>/_assets/datatables/datatables.min.css"/>



<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet">

</head>

<body class="hold-transition sidebar-mini layout-fixed">

<div class="wrapper">



<nav class="main-header navbar navbar-expand navbar-white navbar-light">



<ul class="navbar-nav">

<li class="nav-item">

<a class="nav-link" data-widget="pushmenu" href=""><i class="fas fa-bars"></i></a>

</li>

<li class="nav-item d-none d-sm-inline-block">

<a class="nav-link" href="<?=base_url('user/home.php')?>">Verifikasi Sertifikat</a>

</li>

</ul>

</nav>



8. Sidebar




<aside class="main-sidebar sidebar-dark-primary elevation-4">





<div class="sidebar">



<div class="user-panel mt-3 pb-3 mb-3 d-flex">

<div class="image"></div>

<div class="info"></div>

<font color='#CCCCCC'>Sistem Verifikasi Sertifikat</b></font>

</div>




<nav class="mt-2">

127

<ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu" data-accordion="false">



<li class="nav-item has-treeview">

<a href="<?=base_url('user/home.php')?>" class="nav-link">

<i class="nav-icon fas fa-chart-pie"></i>

<p>Dashboard</p>

</a>

</li>


<a href="<?=base_url('user/panduan.php')?>" class="nav-link">

<i class="nav-icon fas fa-book"></i>

<p>Panduan Pengguna</p>

</a>

</li>


<a href="<?=base_url('data_user/datamhs.php')?>" class=

"nav-link">

<i class="nav-icon fas fa-table"></i>

<p>Data Sertifikat</p>

</a>

</li>


<a href="<?=base_url('auth/login.php')?>" class="nav-link">

<i class="far fa-circle nav-icon"></i>

<p>Login Admin</p>

</a>

</li>

</ul>

</nav>



</div>



</aside>

9. Footer



<footer class="main-footer">

<strong> 2020 © Mutia <b>Malida</b> Husna </strong>

<div class="float-right d-none d-sm-inline-block">

<b>2516009</b>

</div>

</footer>



<aside class="control-sidebar control-sidebar-dark">



</aside>



</div>





<script src="<?=base_url()?>/_assets/plugins/jquery/jquery.min.js"></script>

128

<script src="<?=base_url()?>/_assets/plugins/jquery-ui/jquery-ui.min.js"></script>



<script>

$.widget.bridge('uibutton', $.ui.button)

</script>



<script src="<?=base_url()?>/_assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>



<script src="<?=base_url()?>/_assets/plugins/chart.js/Chart.min.js"></script>



<script src="<?=base_url()?>/_assets/plugins/sparklines/sparkline.js"></script>



<script src="<?=base_url()?>/_assets/plugins/jqvmap/jquery.vmap.min.js"></script>

<script src="<?=base_url()?>/_assets/lugins/jqvmap/maps/jquery.vmap.usa.js"></script>



<script src="<?=base_url()?>/_assets/plugins/jquery-knob/jquery.knob.min.js"></script>



<script src="<?=base_url()?>/_assets/plugins/moment/moment.min.js"></script>

<script src="<?=base_url()?>/_assets/plugins/daterangepicker/daterangepicker.js"></script>



<script src="<?=base_url()?>/_assets/plugins/tempusdominus-bootstrap-4/js/tempusdominus-bootstrap-4.min.js"></script>



<script src="<?=base_url()?>/_assets/plugins/summernote/summernote-bs4.min.js"></script>


<script src="<?=base_url()?>/_assets/plugins/overlayScrollbars/js/jquery.overlayScrollbars.min.js"></script>



<script src="<?=base_url()?>/_assets/dist/js/adminlte.js"></script>



<script src="<?=base_url()?>/_assets/dist/js/pages/dashboard.js"></script>



<script src="<?=base_url()?>/_assets/dist/js/demo.js"></script>

<script src="<?=base_url()?>/_assets/datatables/datatables.min.js"></script>

<script type="text/javascript">

$(document).ready(function() {

$('#datatables').DataTable();

} );

</script>

</body>

</html>

10. Home

<?php

129

include_once('topmenu.php');

include_once('sidebar.php');

?>




<div class="content-wrapper">



<div class="content-header">

<div class="container-fluid">

<div class="row mb-2">

<div class="col-sm-6">

</div>


<ol class="breadcrumb float-sm-right">

<li class="breadcrumb-item active">Home</li>

<li class="breadcrumb-item active">Dashbord</li>

</ol>

</div>

</div>

</div>

</div>





<section class="content">




<center>

<font color="#008080">

<h4>Selamat Datang Di</h4>

<h4>Sistem Verifikasi Sertifikat Kegiatan Ekstrakurikuler Mahasiswa Bebasis QR CODE</h4>

<h4>Di Program Studi Pendidikan Teknik Informatika dan Komputer</h4>

<h4>Institut Agaman Islam Negeri Buittinggi </h4>

<p> </p>

</font>

</center>

</div>

<div class="icon">

</div>

</div>

</div>

</section>



</div>

<?php

include_once('footer.php');

?>

11. Pandun Pegguna

<?php

include_once('topmenu.php');

include_once('sidebar.php');

?>

130






</div>




<li class="breadcrumb-item active">Panduan Pengguna</li>

</ol>

</div>

</div>


</div>




<div class="container-fluid"



<div class="inner">

<center>

<font color="#008080"><h4>Panduan Pengguna</h4></font>

</center>

<font color="#008080"><h4>Alat</h4></font>

<p>1. Smartphone</p>

<p>2. Jaringan Atau Paket Dara</p>

<p>3. Aplikasi QR CODE Reader</p>

<p>4.Sertifikat yang Akan dii Scanner</p><br>

<h4><font color="#008080">Langkah-langkah</font></h4>

<p>1. Pastikan Jaringan Atau paket Data Telah Hidup</p>

<p>2. Download dan Instal Aplikasi QR CODE Reader di Smartphone</p>

<p>3. Buka Aplikasi QR CODE Reader</p>

<p>4. Pilih Menu Scan</p>

<p>5. Arahkan ke QR CODE yang Ada di Sertifikat</p>

<p>6. Muncul Link Web</p>

<p>7. KLik link Web Tersebut</p>

<p>8. Muncul Halaman Web berisi Detail Data Sertifikat</p>

<p>9. Klik Tombol Lihat Sertifikat Untuk Melihat Sertifikat</p>

<p>10. Tombol Download untuk Mendownload Sertifikat</p>

<p>11. Selesai</p>

</div>

<div class="icon">

</div>

</div>

</div>

</section>



</div>

<?php

include_once('footer.php');

?>

12. Data Sertifikat

<?php

131

include_once('../user/topmenu.php');

include_once('../user/sidebar.php');

?>





<div class="col-md-20">

<div class="card card-info">







</div>




<li class="breadcrumb-item active">Data Sertifikat Kegiatan Ekstrakurikuler</li>

</ol>

</div>

</div>


</div>

<div class="card">

<div class="card-header">

<a href="" class="btn btn-default"><i class="nav-icon fas fa-sync"></i></a>

</div>



<div class="table-responsive">

<table id="datatables" class="table table-bordered table-striped">

<thead>

<tr>

<th>No</th>

<th>NIM</th>

<th>Nama</th>

<th>Jenis Kelamin</th>

<th>Prodi</th>

<th>Jns Kegiatan</th>

<th>Tgl Kegiatan</th>

<th>No Sertifikat</th>

<th>Foto Sertifikat</th>

<th>Aksi</th>

</tr>

</thead>

<tbody>

<?php

$no = 1;

$sql_data = mysqli_query($con, "SELECT * FROM tb_mhs ORDER BY id ASC") or die (mysqli_error($con));



<tr>

<td><?=$no++?></td>

132






<td>

<a class="btn btn-primary btn-sm" href="detailmhs.php?nim=<?= $data['nim']; ?>">Detail</a>

</td>

</tr>

<?php

}

}else {

echo "<tr><td colspan=\"4\" align=\"center\">Data tidak ditemukan</td></tr>";

}

?>

</tbody>

</table>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</section>








<script src="<?=base_url()?>/_assets/plugins/datatables/jquery.dataTables.js"></script>

<script src="<?=base_url()?>/_assets/plugins/datatables-bs4/js/dataTables.bootstrap4.js"></script>


<script src="<?=base_url()?>/_assets/dist/js/adminlte.min.js"></script>





<?php

include_once('../user/footer.php');

?>

13. Detail Data Sertifikat

<?php

include_once('../user/topmenu.php');

include_once('../user/sidebar.php');

?>

<?php




$ambil = mysqli_query($con, $sql);

133


?>







<h1 class="m-0 text-dark"> </h1>

</div>




<li class="breadcrumb-item active">Data Sertifikat </li>

<li class="breadcrumb-item active">Detail Data Sertifikat </li>

</ol>

</div>

</div>


</div>








<h3 class="card-title">Detail Data</h3>

</div>




<form class="form-horizontal" method="post" action="" enctype="multipart/form-data">

<div class="card-body">

<div class="form-group row">

<label for="foto" class="col-sm-2 col-form-label">Foto</label>


<img src="../images/<?php echo $data['foto']; ?>" height="100px" >

</div>

</div>


<label for="nim" class="col-sm-2 col-form-label">NIM</label>


<input type="text" class="form-control" name="nim" value="<?php echo $data['nim']; ?>" disabled>

</div>

</div>


<label for="nama" class="col-sm-2 col-form-label">Nama</label>


<input type="text" class="form-control" name="nama" value="<?php echo $data['nama']; ?>" disabled>

</div>

</div>

134

<label for="jns_k" class="col-sm-2 col-form-label">Jenis Kelamin</label>


<input type="text" class="form-control" name="jns_k" value="<?php echo $data['jns_k']; ?>" disabled>

</div>

</div>


<label for="prodi" class="col-sm-2 col-form-label">Prodi</label>


<input type="text" class="form-control" name="prodi" value="<?php echo $data['prodi']; ?>" disabled>

</div>

</div>


<label for="jns_kegiatan" class="col-sm-2 col-form-label">Jns Kegiatan</label>


<input type="text" class="form-control" name="jns_kegiatan" value="<?php echo $data['jns_kegiatan']; ?>" disabled>

</div>

</div>


<label for="tgl_kegiatan" class="col-sm-2 col-form-label">Tgl Kegiatan</label>


<input type="date" class="form-control" name="tgl_kegiatan" value="<?php echo $data['tgl_kegiatan']; ?>" disabled>

</div>

</div>


<label for="no_sertifikat" class="col-sm-2 col-form-label">No Sertifikat</label>


<input type="text" class="form-control" name="no_sertifikat" value="<?php echo $data['no_sertifikat']; ?>" disabled>

</div>

</div>



<div class="card-footer">

<button type="button" class="view_data btn btn-primary" onclick="viewSertifikat('<?=$data['ft_sertifikat'];?>');">Lihat Sertifikat</button>

<a href="download.php?nim=<?php echo $data['nim']; ?>" class="btn btn-primary">Download</a>

<a href="<?=base_url('data_user/datamhs.php')?>" class="btn btn-primary">Cancel</a>

</div>



</form>

</div>

</div>

</div>

</div>

</section>

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">

<div class="modal-dialog modal-lg" role="document">

<div class="modal-content">

<div class="modal-header">

135

<h4 class="modal-title" id="myModalLabel">Foto Sertifikat</h4>

<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>

</div>

<div class="modal-body" id="ft_Sertifikat">

<br>

<img name="ft_sertifikat" id="ft_sertifikat" style="width:100%"><br>

</div>



<div class="modal-footer">

<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>

</div>

</div>

</div>

</div>

<script src="../_assets/plugins/jquery/jquery.min.js"></script>

<script src="../_assets/plugins/bootstrap/js/bootstrap.min.js"></script>

<script>

function viewSertifikat(objNim) {

$('#myModal').modal('show');

document.getElementById('ft_sertifikat').src='../images/sertifikat/'+objNim;

}

</script>

<?php

include_once('../user/footer.php');

?>

14. Unduh Foto Sertifikat


<?php


if (isset($_GET['nim'])) {


$sql = mysqli_query($con, "SELECT ft_sertifikat FROM tb_mhs WHERE nim='$nim'");

$data = mysqli_fetch_array($sql);

$filename = $data['ft_sertifikat'];

$back_dir = "../images/sertifikat/";

$file = $back_dir.$filename;

if (file_exists($file)) {

header('Content-Description: File Transfer');

header('Content-Type: application/octet-stream');

header('Content-Disposition: attachment; filename='.basename($file));

header('Content-Transfer-Encoding: binary');

header('Expires: 0');

header('Cache-Control: private');

header('Pragma: private');

header('Content-Length: ' . filesize($file));

ob_clean();

flush();

readfile($file);

exit;

136

}

}

?>

Dan berikut adalah listing program admin (back-end) :

3. Koneksi

<?php

date_default_timezone_set('Asia/Jakarta');

session_start();

$con = mysqli_connect('localhost', 'root', '', 'sertifikat');

if(mysqli_connect_errno()) {

echo mysqli_connect_error();

}

function base_url($url = null) {

$base_url = "http://localhost/vertif";

if($url != null) {

return $base_url."/".$url;

}else {

return $base_url;

}

}

?>

4. Topmenu Admin

<?php

require_once "_config/config.php";

if(!isset($_SESSION['user'])) {

echo "<script>window.location='".base_url('auth/login.php')."';</script>";

}?>

<!DOCTYPE html>

<html>

<head>



<title>Login Admin</title>










<link rel="stylesheet" href="<?=base_url()?>/_assets/plugins/tempusdominus-bootstrap-4/css/tempusdominus-bootstrap-4.min.css">






<link rel="stylesheet" href="<?=base_url()?>/_assets/plugins/jqvmap/jqvmap.min.css">

137



<link rel="stylesheet" href="<?=base_url()?>/_assets/plugins/overlayScrollbars/css/OverlayScrollbars.min.css">



<link rel="stylesheet" href="<?=base_url()?>/_assets/plugins/daterangepicker/daterangepicker.css">



<link rel="stylesheet" href="<?=base_url()?>/_assets/plugins/summernote/summernote-bs4.css">



<link rel="stylesheet" href="<?=base_url()?>/_assets/datatables/datatables.min.css"/>



<style>

.wrapper{

overflow-x: scroll;

}

</style>

<script>

</script>

</head>

<body class="hold-transition sidebar-mini layout-fixed">

<div class="wrapper">



<nav class="main-header navbar navbar-expand navbar-white navbar-light">



<ul class="navbar-nav">

<li class="nav-item">

<a class="nav-link" data-widget="pushmenu" href=""><i class="fas fa-bars"></i></a>

</li>

<li class="nav-item d-none d-sm-inline-block">

<a class="nav-link" href = "<?=base_url('dashboard/index.php')?>">Verifikasi Sertifikat </a>

</li>

</ul>

</nav>



5. Sidebar




<aside class="main-sidebar sidebar-dark-primary elevation-4">



<div class="sidebar">



<div class="user-panel mt-3 pb-3 mb-3 d-flex">

<div class="image"></div>

<div class="info"></div>

<font color='#CCCCCC'>Sistem Verifikasi Sertifikat</b></font>

</div>

138


<nav class="mt-2">

<ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu" data-accordion="false">




<a href="<?=base_url('dashboard/index.php')?>" class="nav-link">

<i class="nav-icon fas fa-chart-pie"></i>

<p>Dashboard</p>

</a>

</li>


<a href="<?=base_url('panduan.php')?>" class="nav-link">

<i class="nav-icon fas fa-book"></i>

<p>Panduan</p>

</a>

</li>


<a href="<?=base_url('data/data.php')?>" class="nav-link">

<i class="nav-icon fas fa-table"></i>

<p>Data Sertifikat</p>

</a>

</li>

<li classs="nav-item has-treeview">

<a href="<?=base_url('generate/generate.php')?>" class="nav-link">

<i class="navicon fas fa-edit"></i>

<p>Generate</p>

</a>

</li>


<a href="<?=base_url('profil.php')?>" class="nav-link">

<i class="nav-icon fas fa-copy"></i>

<p>Profil</p>

</a>

</li>


<a href="<?=base_url('auth/logout.php')?>" class="nav-link">

<i class="far fa-circle nav-icon"></i>

<p>Logout</p>

</a>

</li>

</ul>

</nav>



</div>



</aside>

6. Footer




<footer class="main-footer">

<strong> 2020 © Mutia <b>Malida</b> Husna </strong>

139

<div class="float-right d-none d-sm-inline-block">

<b>2516009</b>

</div>

</footer>



<aside class="control-sidebar control-sidebar-dark">



</aside>



</div>








<script src="<?=base_url()?>/_assets/plugins/jquery-ui/jquery-ui.min.js"></script>



<script>

$.widget.bridge('uibutton', $.ui.button)

</script>





<script src="<?=base_url()?>/_assets/plugins/chart.js/Chart.min.js"></script>



<script src="<?=base_url()?>/_assets/plugins/sparklines/sparkline.js"></script>



<script src="<?=base_url()?>/_assets/plugins/jqvmap/jquery.vmap.min.js"></script>

<script src="<?=base_url()?>/_assets/lugins/jqvmap/maps/jquery.vmap.usa.js"></script>



<script src="<?=base_url()?>/_assets/plugins/jquery-knob/jquery.knob.min.js"></script>



<script src="<?=base_url()?>/_assets/plugins/moment/moment.min.js"></script>

<script src="<?=base_url()?>/_assets/plugins/daterangepicker/daterangepicker.js"></script>



<script src="<?=base_url()?>/_assets/plugins/tempusdominus-bootstrap-4/js/tempusdominus-bootstrap-4.min.js"></script>



<script src="<?=base_url()?>/_assets/plugins/summernote/summernote-bs4.min.js"></script>


<script src="<?=base_url()?>/_assets/plugins/overlayScrollbars/js/jquery.overlayScrollbars.min.js"></script>


<script src="<?=base_url()?>/_assets/dist/js/adminlte.js"></script>

140

<script src="<?=base_url()?>/_assets/dist/js/pages/dashboard.js"></script>



<script src="<?=base_url()?>/_assets/datatables/datatables.min.js"></script>

<script type="text/javascript">

$(document).ready(function() {

$('#datatables').DataTable();

} );

</script>

</body>

</html>

7. Index


<?php

require_once "_config/config.php";

if(isset($_SESSION['user'])) {

echo "<script>window.location='".base_url('dashboard')."';</script>";

}else {


}

?>

8. Dashboard

<?php

include_once('../topmenuuser.php');

include_once('../sidebaruser.php');

?>








<div class="col-sm-6"></div>




<li class="breadcrumb-item active">Dashbord</li>

</ol>

</div>

</div>

</div>

</div>







<center>

<font color="#008080"><h4>Selamat Datang Di</h4>

<h4>Sistem Verifikasi Sertifikat Kegiatan Ekstrakurikuler Mahasiswa Bebasis QR CODE</h4>

141

<h4>Di Program Studi Pendidikan Teknik Informatika dan Komputer</h4>

<h4>Institut Agaman Islam Negeri Buittinggi </h4></font>

</center>

</div>

</div>

</div>

</section>



</div>

<?php

include_once('../footeruser.php');

?>

9. Data Sertfikat

<?php



?>














</div>



<li class="breadcrumb-item"><a href="#">Home</a></li>

<li class="breadcrumb-item active">Data Peserta</li>

</ol>

</div>

</div>


<div class="card">


<a href="" class="btn btn-default"><i class="nav-icon fas fa-sync"></i></a>

<a href="<?=base_url('data/add.php')?>" class="btn btn-primary"><i class="nav-icon fas fa-plus"> Tambah Data Peserta </i></a>

<a href="<?=base_url('data/print_all.php')?>" class="btn btn-default" target="_blank"><i class="nav-icon fas fa-print"> Print</i></a>

</div>




<thead>

<tr>

<th>No</th>

<th>NIM</th>

<th>Nama</th>

<th>Jenis Kelamin</th>

142

<th>Prodi</th>

<th>Jns Kegiatan</th>

<th>Tgl Kegiatan</th>

<th>No Sertifikat</th>

<th>Foto Sertifikat</th>

<th>Aksi</th>

</tr>

</thead>

<tbody>

<?php

$no = 1;




<tr>

<td><?=$no++?></td>









<td width="180px">

<a class="btn btn-primary btn-sm" href="edit.php?nim=<?= $data['nim']; ?>"><i class="fa fa-edit"></i></a>

<a class="btn btn-danger btn-sm" href="delete.php?nim=<?= $data['nim']; ?>"><i class="fa fa-trash"></i></a>

<a href="print.php?nim=<?php echo htmlentities($data['nim']);?>" target="_blank"><button type="button" class="btn btn-default"><i class="fa fa-print"></i></button></a>

</td>

</td>

</tr>

<?php

}

}else {


}

?>

</tbody>

</table>

</div>

</div>

</div>

</div>

</divv>

</div>

</div>

</section>

<?php


?>

10. Generate Link


143

<?php

if(isset($_POST) && !empty($_POST)) {

include('../library/phpqrcode/qrlib.php');

$image_location = "temp/";

$image_name = date('d-m-Y-h-i-s').'.png';

$dataContent = $_POST['dataContent'];

$ecc = $_POST['ecc'];

$size = $_POST['sizes'];

// generating the QR code

QRcode::png($dataContent, $image_location.$image_name, $acc, $size);

// displaying the QR code on the web page

echo '<img class="img-thumbnail" src="'.$image_location.$image_name.'" />'

} else {

header('location:./');

}

?>

11. Cetak Data Perindividu


<?php

if(isset($_POST) && !empty($_POST)) {

incluude('../library/phpqrcode/qrlib.php');

$image_location = "temp/";

$image_name = date('d-m-Y-h-i-s').'.png';

$dataContent = $_POST['dataContent'];

$ecc = $_POST['ecc'];

$size = $_POST['size'];

// generating the QR code

QRcode::png($dataContent, $image_location.$image_name, $ecc, $size);

// displlaying the QR code on the web page

echo '<img class="img-thumbnail" src="'.$image_location.$image_name.'" />';

} else {

header('location:./');

}

?>

12. Cetak Data Keseluruhan

<?php


?>


<h1>Rekap Data Peserta Kegiatan Ekstrakurikuler</h1>



<thead>

<tr>

<th width="20">No</th>

<th width="34">NIM</th>

<th width="40">Nama</th>

<th width="68">Jenis Kelamin</th>

<th width="42">Prodi</th>

<th width="61">Jns Kegiatan</th>

<th width="69">Tgl Kegiatan</th>

<th width="64">No Sertifikat</th>

</tr>

</thead>

<tbody>

144

<?php

$no = 1;




<tr>

<td><?=$no++?></td>








</tr>

<?php

}

}else {


}

?>

</tbody>

</table>

</div>

<h4>Ketua Program Studi</h4> <br>

<h4>Riri Okra</h4>

<script>

window.print();

</script>

13. Tambah Data Sertifikat

<?php



?>









</div>




<li class="breadcrumb-item active">Data Peserta</li>

<li class="breadcrumb-item active">Tambah Data Peserta</li>

</ol>

</div>

</div>


</div>

145









<h3 class="card-title">Tambah Data</h3>

</div>




<form class="form-horizontal" method="post" action="aksi_tambah.php?act=insert" id="form1" enctype="multipart/form-data">





<input type="text" class="form-control" name="nim" placeholder="NIM" required autofocus>

</div>

</div>




<input type="text" class="form-control" name="nama" placeholder="Nama" required>

</div>

</div>




<select name="jns_k" size="1" class="form-control" id="Jenis Kelamin" onchange="tampilkan()">

<option>Laki-laki</option>

<option>Perempuan</option>

</select>

</div>

</div>




<input type="text" class="form-control" name="prodi" placeholder="Prodi" required>

</div>

</div>


<label for="jns_kegiatan" class="col-sm-2 col-form-label">Jns Kegiatan</label>


<input type="text" class="form-control" name="jns_kegiatan" placeholder="Jns Kegiatan" required>

</div>

</div>


<label for="tgl_kegiiatan" class="col-sm-2 col-form-label">Tgl Kegiatan</label>

146

<input type="date" class="form-control" name="tgl_kegiatan" placeholder="Tanggal Kegiatan" required>

</div>

</div>




<input type="text" class="form-control" name="no_Sertifikat" placeholder="No Sertifikat" required>

</div>

</div>


<label for="ft_sertifikat" class="col-sm-2 col-form-label">Foto Sertifikat</label>


<input type="file" class="form-control" name="ft_sertifikat" placeholder="Foto Sertifikat" required>

</div>

</div>


<div class="offset-sm-2 col-sm-10">

</div>

</div>

</div>



<button type="submit" name="tambah" class="btn btn-info">Tambah Data</button>

<a href="<?=base_url('data/data.php')?>" class="btn btn-primary">Cancel</a>

</div>


</form>

</div>

</div>

</div>

</div>

</div>

</section>

</div>

<?php


?>

14. Aksi Tambah Data

<?php


if(!isset($_SESSION['user'])){

echo "<script>window.location='".base_url('auth/login')."';</script>";

}

// jika ada gett act

if(isset($_GET['act'])){

//proses simpan data

if($_GET['act']=='insert'){

//variabel dari elemen forrm

$nim = $_POST['nim'];

$nama = $_POST['nama'];

$jns_k= $_POST['jns_k'];

$prodi = $_POST['prodi'];

$jns_kegiatan= $_POST['jns_kegiatan'];

147

$tgl_kegiatan= $_POST['tgl_kegiatan'];

$no_sertifikat = $_POST['no_sertifikat'];

//Setting Foto

$foto= $_FILES['foto']['name'];




exxt_dibolehkan = array('jpg','jpeg','png');







if($nim=='' || $nama=='' || $jns_k=='' || $prodi=='' || $jns_kegiatan=='' || $tgl_kegiatan=='' || $no_sertifikat==''|| $foto=='') {


} else {//proses simpan data admin



$tambah = mysqli_query($con, "INSERT INTO tb_mhs (nim,nama,jns_k,prodi,jns_kegiatan,tgl_kegiatan,no_sertifikat,ft_sertifikat)

VALUES ('$nim','$nama','$jns_k','$prodi','$jns_kegiata

n','$tgl_kegiatan','$no_sertifikat','$ft_sertifikat')");

if($tambah) {

echo "<script>alert('Data dengan Nim $nim dan Nama $nama berhasil ditambah');</script>";


} else {

echo "<script>alert('Tambah data dengan Nim $nim dan Nama $nama gagal ');</script>";


} else {



}

} else {



}

}

} else {


}

} else {


}

148

?>

15. Edit Data Sertifikat

<?php



?>

<?php




$ambil = mysqli_querya($con, $sql);


?>







</div>




<li class="breadcrumb-item active">Data Peserta </li>

<li class="breadcrumb-item active">Edit Data Peserta </li>

</ol>

</div>

</div>


</div>








<h3 class="card-title">Edit Data</h3>

</div>




<form class="form-horizontal" method="post" action="" id="form2" enctype="multipart/form-data">

<input type="hidden" name="foto_lama" value="<?php echo $data['foto']; ?>">

<input type="hidden" name="ft_sertifikat_lama" value="<?php echo $data['ft_sertifikat']; ?>">





<input type="text" class="form-control" name="nim" value="<?php echo $data['nim']; ?>" disabled>

</div>

</div>

149


<input type="text" class="form-control" name="nama" value="<?php echo $data['nama']; ?>" >

</div>

</div>




<select id="jns_k"

class="form-control" name="jns_k" onchange="tampilkann()">

<option><?php echo $data['jns_k']; ?></option>

<option selected="selected">Laki - laki</option>

<option>Perempuan</option>

</select>

</div>

</div>




<input type="text" class="form-control" name="prodi" value="<?php echo $data['prodi']; ?>" >

</div>

</div>


<label fomr="jns_kegiatan" class="col-sm-2 col-form-label">Jns Kegiatan</label>


<input type="text" class="form-control" name="jns_kegiatan" value="<?php echo $data['jns_kegiatan']; ?>" >

</div>

</div>


<label for="tgl_kegiatan" class="col-sm-2 col-form-label">Tgl Kegiatan</label>


<input type="date" class="form-control" name="tgl_kegiatan" value="<?php echo $data['tgl_kegiatan']; ?>" >

</div>

</div>




<input type="text" class="form-control" name="no_sertifikat" value="<?php echo $data['no_sertifikat']; ?>" >

</div>

</div>


<label for="foto" class="col-sm-2 col-form-label">Foto</label>


<input type="file" class="form-control" name="foto" value="<?php echo $data['foto']; ?>" >

</div>

<i style="float: left;font-size: 11px;color: red">Abaikan jika tidak merubah gambar</i>

</div>

="form-group row">

150

<label for="foto" class="col-sm-2 col-form-label">Foto Sertifikat</label>


<input type="file" class="form-control" name="ft_sertifikat" value="<?php echo $data['ft_sertifikat']; ?>" >

</div>

<i style="float: left;font-size: 11px;color: red">Abaikan jika tidak merubah gambar</i>

</div>


<label for="foto" class="col-sm-2 col-form-label">Gambar</label>


<img src="../images/<?php echo $data['foto']; ?>" height="100px" >

</div>


<img src="../images/sertifikat/<?php echo $data['ft_sertifikat']; ?>" height="100px" >

</div>

</div>

</div>



<button type="submit" name="edit" class="btn btn-info">Update Data</button>

<a href="<?=base_url('data/data.php')?>" class="btn btn-primary">Cancel</a>

</div>


</form>

<?php

if(isset($_POST['edit'])){

$nama2 = $_POST['nama'];

$jns_k2 = $_POST['jns_k'];

$prodi2 = $_POST['prodi'];

$jns_kegiatan2 = $_POST['jns_kegiatan'];

$tgl_kegiatan2 = $_POST['tgl_kegiatan'];

$no_sertifikat2 = $_POST['no_sertifikat']

// Setting Foto

$foto = $_FILES['foto']['name'];




$ext_dibolehkan = array('jpg','jpeg','png');







$foto_lama = $_POST['foto_lama'];

$ft_sertifikat_lama = $_POST['ft_sertifikat_lama'];

if($foto != "" && $ft_sertifikat != "") {



$update = mysqli_query($con, "UPDATE tb_mhs SET nama='$nama2',jns_k='$jns_k2',prodi='$prodi2',jns_kegiatan='$jns_kegiatan2',tgl_kegiat

151

an='$tgl_kegiatan2', no_sertifikat='$no_sertifikat2',foto='$foto', ft_sertifikat='$ft_sertifikat' WHERE nim='$nim'");

if(file_exists('../images/'.$foto_lama) || file_exists('../images/sertifikat/'.$ft_sertifikat_lama)) {

unlink('../images/'.$foto_lama);

unlink('../images/ijazah/'.$ft_sertifikat_lama);

}

if($update) {

echo "<script>alert('Data dengan Nim $nim dan Nama $nama2 berhasil diupdate');</script>";


}

} else {



}

} else {



}

}

else if($foto != "") {

if(in_array($ext1, $ext_dibolehkan) === true) {

if(move_uploaded_file($tmp_foto, '../images/'.$foto)) {

$update = mysqli_query($con, "UPDATE tb_mhs SET nama='$nama2',jns_k='$jns_k2',prodi='$prodi2',jns_kegiatan='$jns_kegiatan2',tgl_kegiatan='$tgl_kegiatan2', no_sertifikat='$no_sertifikat2',foto='$foto', ft_sertifikat='$ft_sertifikat' WHERE nim='$nim'");

if(file_exists('../images/'.$foto_lama)) {

unlink('../images/'.$foto_lama);

}

if($update) {



}

} else {



}

} else {


// echo "<script>window.location='data.php';</script>";

}

}

152

elsse if($ft_sertifikat != "") {

if(in_array($ext2, $ext_dibolehkan) === true) {

if(move_uploaded_file($tmp_ft_sertifikat, '../images/sertifikat/'.$ft_sertifikat)) {


if(file_exists('../images/sertifikat/'.$ft_sertifikat_lama)) {

unlink('../images/sertifikat/'.$ft_sertifikat_lama);

}

if($update) {



}

} else {



}

} else {



}

}

else {


if($update) {

echoo "<script>alert('Data dengan Nim $nim dan Nama $nama2 berhasil diupdate');</script>";


}

}

}

?>

</div>

</div>

</div>

</div>

</div>

</section>

</div>

<?php


?>

153

16. Hapus Data Sertifikat

<?php

// koneksi database


// menangkap data id yang di kirim dari url


$select = mysqli_query($con, "SELECT * FROM tb_mhs WHERE nim='$nim'");

$data = mysqli_fetch_array($select);

// menghapus data dari database

mysqli_query($con,"DELETE FROM tb_mhs WHERE nim='$nim'");

if(file_exists('../images/'.$data['foto']) || file_exists('../images/sertifikat/'.$data['ft_srtifikat'])) {

unlink('../images/'.$data['foto']);

unlink('../images/sertifikat/'.$data['ft_sertifikat']);

}

// mengalihkan halaman kembali ke index.php

header("location:data.php");

?>

17. Login

<?php


if(isset($_SESSION['user'])) {


}else {

?>

<!DOCTYPE html>

<html>

<head>



<title>Halaman Admin</title>















</head>

<body class="hold-transition login-page">

<div class="login-box">

<div class="login-logo">

154

<a href="../../index2.html">Login Admin</a>

</div>



<?php

if(isset($_POST['login'])) {

$user = trim(mysqli_real_escape_string($con, $_POST['user']));

$pass = sha1(trim(mysqli_real_escape_string($con, $_POST['pass'])));

$sql_login = mysqli_query($con, "SELECT * FROM tb_user WHERE username = '$user' AND password = '$pass'") or die (mysqli_error($con));

if(mysqli_num_rows($sql_login) > 0) {

$_SESSION['user'] = $user;


}else { ?>

<div class="row">

<div class="col-lg-25 col-lg-offset-5">

<div class="alert alert-danger alert-dismissable" role="alert">

<a href="#" class="close" data-dismiss="alert" aria-label="close">×</a>

<span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>

<strong>Login Gagal!</strong> Username / Password Salah

</div>

</div>

</div>

<?php

}

}

?>

<div class="card">

<div class="card-body login-card-body">

<p class="login-box-msg">Enter User And Passwrod</p>

<form action="" method="post">

<div class="input-group mb-3">

<input type="text" name="user" class="form-control" placeholder="Username" required autofocus>

<div class="input-group-append">

<div class="input-group-text">

<span class="fas fa-envelope"></span>

</div>

</div>

</div>

<div class="input-group mb-3">

<input type="password" name="pass" class="form-control" placeholder="Password" required>

<div class="input-group-append">

<div class="input-group-text">

<span class="fas fa-lock"></span>

</div>

</div>

</div>

<div class="row">

<div class="col-8">

155

</div>



<div class="col-4">

<input type="submit" name="login" class="btn btn-primary" value="Login">

</div>



</div>

</form>

</div>



</div>

</div>









<script src="<?=base_url()?>/_assets/dist/js/adminlte.min.js"></script>

<script src="<?=base_url()?>/_assets/plugins/jquery/jquery.js"></script>


<script src="<?=base_url()?>/_assets/plugins/jquery/jquery.slim.js"></script>

<script src="<?=base_url()?>/_assets/plugins/jquery/jquery.slim.min.js"></script>

</body>

</html>

<?php

}

?>

18. Logout

<?php


unset($_SESSION['user']);


?>

156

LAMPIRAN II

171

LAMPIRAN

III

172

FLOWCHART

Flowchart Sistem (Front – End)

1. Flowchar kegiatan user

Y

Y

Y

Y

T T

T T

T T

T T

Y

T T

Mulai

Pil

Pil 1 Menu Panduan

Tampilan home

Pil 2

Pil 3

Pil 4

Pil 5

Selesai

Menu Detail Data Sertifikat

Menu Foto Sertifikat

Menu Download Foto Sertifikat

Menu Data Sertifikat

173

2. Flowchar Kegiatan User Menscanner Qr Code Sertifikat Berbasis Android

Y

T T

Y

T T

Y

T T

Pil

Pil 2

Pil 3 Menu Download Foto Sertifikat

Pil 1 Menu Detail Data

Sertifikat

Menu Foto Sertifikat

Selesai

Mulai

Tampilan home Apk QR CODE

Reader

Tampilan Link Web

Scanner QR CODE di Sertifikat

174

Flowchar Web Admin (Back – End )

1. Flowchar Login Admin

Y

Y

T

Mulai

Masukkan Username Password

Mengecek Username Password

Menampilkan Dashboard

Selesai

175

Y

Y

T

Y

Y

Y

Y

T T

T T

T T

T T

Pil

Pil 1 Menu Panduan

Mulai

Masukkan Username, Password

Mengecek Username, Password

Menampilkan Dashboard

Pil 2

Pil 3

Pil 4

Menu Generate Link

Menu Tampil Data Sertifikat

Menu Edit Data Sertifikat

2. Flowchar Kegiatan Admin

176

Pil 5

Pil 6

Pil 7

Menu Hapus Data

Menu Cetak Keseluruhan

Menu Cetak Data Perindividu

Selesai

177

LAMPIRAN

IV

178

UJI PRODUK

1. UJI VALIDITAS

ANGKET VALIDITAS SISTEM VERIFIKASI SERTIFIKAT KEGIATAN EKSTRAKURIKULER MAHASISWA BERBASIS QR CODE DI

PROGRAM STUDI PENDIDIKAN TEKNIK INFORMATIKA DAN KOMPUTER IAIN BUKITTINGGI

Nama Penulis :

Mutia Malida Husna

NIM : 2516009

Fakultas/Jurusan :

FTIK / Pendidikan Teknik Informatika dan Komputer

Judul Penelitian :

VERIFIKASI SERTIFIKAT KEGIATAN EKSTRAKURIKULER MAHASISWA BERBASIS QR CODE DI PROGRAM STUDI PENDIDIKAN TEKNIK INFORMATIKA DAN KOMPUTER IAIN BUKITTINGGI

Petunjuk :

Berikut ini dikeluarkan sejumlah pernyataan sehubungan dengan tanggapan praktis terhadap VERIFIKASI SERTIFIKAT KEGIATAN EKSTRAKURIKULER MAHASISWA BERBASIS QR CODE DI PROGRAM STUDI PENDIDIKAN TEKNIK INFORMATIKA DAN KOMPUTER IAIN BUKITTINGGI untuk itu kepada Bapak/Ibu sebagai praktisi dapat memberikan tanda ceklist ( √ ) pada kolom

yang sesuai dengan pendapat Bapak/Ibu untuk beberapa pilihan, yaitu :

KOMPONEN VALIDASI

Skala Keterangan

5 Sangat Setuju (SS)

4 Setuju (S)

3 Netral (N)

2 Tidak Setuju (TS)

179

1 Sangat Tidak Setuju (STS)

FORMAT PENILAIAN VALIDITAS PRODUK

No

Aspek yang dievaluasi

Skala

STS TS N S SS

A ASPEK VALIDITAS ISI

1 Kejelasan tujuan program

2 Program sudah berjalan dengan benar

3 Kesesuaian program dengan tujuan yang dicapai

4 Kelengkapan komposisi program

5 Kejelasan output program

B ASPEK INSTRUKSIONAL DESAIN

1 Urutan penggunaan program sistematis

2 Cara penggunaan program mudah dipahami

3 Mudah digunakan dan sederhana dalam pengoperasiannya

4 Dapat digunakan berulang-ulang

5 Kelengkapan informasi program

C TAMPILAN

1 Background sederhana, konsisten dan jelas

2 Warna sederhana dan jelas

3 Ukuran font profesional dan konsisten

4 Layout menarik dan proporsional

5 Gambar seseuai dengan program

D ASPEK KEBAHASAAN

1 Sederhana dan mudah

180

dimengerti 2 Ketepatan penggunaan tanda

baca

3 Cara membangun kalimat dalam tulisan

4 Menggunakan bahasa indonesia yang baik dan benar

TANGGAPAN DAN SARAN

1. Tanggapan Kemukakanlah tanggapan Bapak/Ibu setelah mengamati dan menganalisis produk ini. I. Titik kekuatan

......................................................................................................... ......................................................................................................... ......................................................................................................... ......................................................................................................... .........................................................................................................

II.Titik kelemahan ......................................................................................................... ......................................................................................................... ......................................................................................................... .........................................................................................................

2. Saran-saran Kemukakanlah saran-saran Bapak/Ibu yang dapat digunakan untuk perbaikan dan penyempurnaan produk ini.

......................................................................................................... ......................................................................................................... ......................................................................................................... ......................................................................................................... .........................................................................................................

Bukittinggi, 2020

Validator

193

2. UJI PRATIKALITAS

ANGKET PRAKTIKALITAS SISTEM VERIFIKASI SERTIFIKAT KEGIATAN EKSTRAKURIKULER MAHASISWA BERBASIS QR CODE

DI PROGRAM STUDI PENDIDIKAN TEKNIK INFORMATIKA DAN KOMPUTER IAIN BUKITTINGGI

Nama Penulis :

Mutia Malida Husna

NIM : 2516009

Fakultas/Jurusan :

FTIK / Pendidikan Teknik Informatika dan Komputer

Judul Penelitian :

VERIFIKASI SERTIFIKAT KEGIATAN EKSTRAKURIKULER MAHASISWA BERBASIS QR CODE DI PROGRAM STUDI PENDIDIKAN TEKNIK INFORMATIKA DAN KOMPUTER IAIN BUKITTINGGI

Petunjuk :

Berikut ini dikeluarkan sejumlah pernyataan sehubungan dengan tanggapan praktis terhadap VERIFIKASI SERTIFIKAT KEGIATAN EKSTRAKURIKULER MAHASISWA BERBASIS QR CODE DI PROGRAM STUDI PENDIDIKAN TEKNIK INFORMATIKA DAN KOMPUTER IAIN BUKITTINGGI untuk itu kepada Bapak/Ibu sebagai praktisi dapat memberikan tanda ceklist ( √ ) pada kolom

yang sesuai dengan pendapat Bapak/Ibu untuk beberapa pilihan, yaitu :

KOMPONEN PRAKTIKALITAS

Skala Keterangan

5 Sangat Setuju (SS)

4 Setuju (S)

3 Netral (N)

2 Tidak Setuju (TS)

1 Sangat Tidak Setuju (STS)

197

3. UJI EFEKTIFITAS

ANGKET EFEKTIVITAS SISTEM VERIFIKASI SERTIFIKAT KEGIATAN EKSTRAKURIKULER MAHASISWA BERBASIS QR CODE

DI PROGRAM STUDI PENDIDIKAN TEKNIK INFORMATIKA DAN KOMPUTER IAIN BUKITTINGGI

Nama Peneliti : Mutia Malida Husna

Nim : 2516009

Fakultas / Prodi : Tarbiyah dan Ilmu Keguruan / PTIK

Judul Penilitian : VERIFIKASI SERTIFIKAT KEGIATAN

EKSTRAKURIKULER MAHASISWA BERBASIS QR

CODE DI PROGRAM STUDI PENDIDIKAN TEKNIK

INFORMATIKA KOMPUTER IAIN BUKITTINGGI

Petunjuk : Berikut ini dikemukakan sejumlah pertanyaan sehubungan

dengan tanggapan Bapak / Ibuk terhadap VERIFIKASI

SERTIFIKAT KEGIATAN EKSTRAKURIKULER

MAHASISWA BERBASIS QR CODE DI PROGRAM

STUDI PENDIDIKAN TEKNIK INFORMATIKA

KOMPUTER IAIN BUKITTINGGI. Untuk itu diharap

Bapak / Ibuk sebagai penilai dapat memberikan tanda pada

kolom yang sesuai dengan pilihan Bapak / Ibuk untuk

beberapa pilihan, yaitu :

B. SesudahPerancangan

1. Komponen Efektivitas

Skala Keterangan

1 STS (Sangat Tidak Setuju)

2 TS (Tidak Setuju)

3 BS (Biasa Saja)

4 S (Setuju)

5 SS (Sangat Setuju)

198

2. Format Penilaian Efektivitas Produk

Kriteria

Skala

STS TS BS S SS

A ASPEK EFEKTIVITAS

1 Produk memiliki tampilan menarik

2 Komposisi tulisan dan warna yang digunakan pada produk sesuai dan dapat dibaca

3 Penggunaan produk Mudah

4 Penyajian isi dalam produk lebih praktis dan dapat digunakan berulangkali

5 Pengguna dapat menggunakan produk ini secara mandiri

Jumlah

3. Komentar dan Saran

a. Komentar

Kemukakanlah komentar saudara/saudari setelah melihat dan

menganalisis produk ini :

...............................................................................................................

...............................................................................................................

b. Saran

Kemukakanlah saran saudara/saudari setelah melihat dan menganalisis

produk ini :

...............................................................................................................

...............................................................................................................

Bukittinggi, 2020

204

Lampiran V

verifikasi sertifikat kegiatan ekstrakurikuler - e-Campus

Documents

Transcript of verifikasi sertifikat kegiatan ekstrakurikuler - e-Campus