14 0 6 MB
UNIVERSITAS GUNADARMA FAKULTAS TEKNOLOGI INDUSTRI
PENULISAN ILMIAH
IMPLEMENTASI OPTICAL CHARACTER RECOGNITION (OCR) DAN SCREENSHOT PADA APLIKASI BLOKIR SITUS PORNOGRAFI BERBASIS DESKTOP Nama
:
Dimas Chandra Widya Pratama
NPM
:
51417708
Fakultas
:
Teknologi Industri
Jurusan : Teknik Informatika Diajukan Guna Melengkapi Sebagian Syarat Untuk Mencapai Jenjang Pembimbing : Dr. D. L. Crispina Pardede, DEA. Setara Sarjana Muda Jakarta 2020
PERNYATAAN ORIGINALITAS DAN PUBLIKASI Saya yang bertanda tangan di bawah ini, Nama : Dimas Chandra Widya Pratama NPM
: 51417708
Judul PI
: Implementasi Optical Character Recognition (OCR) dan
IIIIIIIJIJIIJ
Screenshot pada Aplikasi Blokir Situs Pornografi Berbasis
FFFF DDDDDDDDD Desktop Tanggal Sidang
:
Tanggal Lulus
:
Menyatakan bahwa tulisan ini adalah merupakan hasil karya saya sendiri dan dapat dipulikasikan sepenuhnya oleh Universitas Gunadarma. Segala kutipan dalam bentuk apa pun telah mengikuti etika yang berlaku. Mengenai isi dan tulisan adalah merupakan tanggung jawab penulis, bukan Universitas Gunadarma. Demikian pernyataan ini dibuat dengan sebenarnya dan dengan penuh kesadaran.
Bekasi, 10 Januari 2021
Dimas Chandra Widya Pratama
ii
LEMBAR PENGESAHAN
Judul Penulisan Ilimiah
: IMPLEMENTASI OPTICAL CHARACTER
AAAAAAAAAAAAAAAAAAA RECOGNITION (OCR) DAN SCREENSHOT AAAAAAAAAAAAAAAAA
PADA
APLIKASI
BLOKIR
AAAAAAAAAAAAAAAAAA
PORNOGRAFI BERBASIS DESKOP
Nama
: Dimas Chandra Widya Pratama
NPM
: 51417708
Tanggal Sidang
:
Tanggal Lulus
:
SITUS
Menyetujui, Pembimbing
Koordinator PI
(Dr. D. L. Crispina Pardede, D.E.A.)
(Dr. Achmad Fahrurozi, S.Si., M.Si.)
Ketua Jurusan
(Dr. Lintang Yuniar Banowosari, S.Kom., M.Sc.)
iii
ABSTRAKSI Dimas Chandra Widya Pratama, 51417708 IMPLEMENTASI OPTICAL CHARACTER RECOGNITION (OCR) DAN SCREENSHOT PADA APLIKASI BLOKIR SITUS PORNOGRAFI BERBASIS DESKTOP Penulisan Ilmiah, Jurusan Teknik Informatika, Fakultas Teknologi Industri, Universitas Gunadarma, 2020 Kata Kunci : OCR, Screenshot, Pornografi (xiii + 79 + lampiran) Penyebaran aplikasi Virtual Private Network (VPN) gratis membantu masyarakat yang memerlukan akses internet tanpa menggunakan penyedia layanan internet. Namun, sering terjadi penyalahgunaan penggunaan VPN oleh masyarakat, khususnya anak dan remaja, yaitu masyarakat mengakses pornografi tanpa terkena pemblokiran oleh Internet Service Provider (ISP). Tulisan ini membahas implementasi Optical Character Recognition (OCR) dan Screenshot pada aplikasi blokir situs pornografi berbasis desktop yang diharapkan dapat membantu melindungi anak dan remaja dari akses pornografi yang dilakukan menggunakan VPN maupun tanpa VPN. Aplikasi ini mendeteksi kata kunci yang tedapat pada halaman situs yang diakses. Isi kata kunci pada aplikasi ini dapat dimodifikasi sesuai dengan keinginan user. Pembangunan aplikasi ini menggunakan metode SDLC model waterfall. Tahap–tahap yang dilakukan adalah analisis kebutuhan, perancangan, implementasi, dan pengujian. Pembangunan aplikasi dilakukan menggunakan perangkat lunak code editor bernama Visual Studio Code dan bahasa pemrograman Python. Tahap pengujian dilakukan menggunakan metode Black box yang digunakan untuk menguji keberhasilan fungsional dari aplikasi. Hasil pengujian menunjukkan bahwa aplikasi yang dibangun berjalan dengan hasil yang diharapkan. Daftar Pustaka (2015 – 2020)
iv
KATA PENGANTAR Puji syukur kehadirat Tuhan Yang Maha Esa, yang telah memberikan rahmat dan karunia sehingga penulis dapat menyelesaikan penulisan karya ilmiah yang berjudul “IMPLEMENTASI OPTICAL CHARACTER RECOGNITION (OCR)
DAN
SCREENSHOT
PADA
APLIKASI
BLOKIR
SITUS
PORNOGRAFI BERBASIS DESKTOP”. Keberhasilan penyusunan tulisan ilmiah ini tidak lepas dari bantuan dan dukungan berbagai pihak, dan dorongan niat pada penulis. Perkenankan penulis memberikan ucapan terima kasih kepada: 1. Prof. Dr. E. S. Margianti, S.E., M.M., selaku Rektor Universitas Gunadarma. 2. Prof. Dr. Ing. Adang Suhendra, S.Si., S.Kom., M.Sc., selaku Dekan Fakultas Teknologi Industri, Universitas Gunadarma. 3. Dr. Lintang Yuniar Banowosari, S.Kom., M.Sc., selaku Ketua Jurusan Teknik Informatika. 4. Dr. Achmad Fahrurozi, S.Si., M.Si., selaku Koordinator Penulisan Ilmiah FTI. 5. Dr. D. L. Crispina Pardede, D.E.A., selaku Dosen Pembimbing yang telah dengan sabar memberikan bimbingan serta masukan sehingga penulis dapat menyelesaikan penulisan ini dengan baik. 6. Orang Tua penulis yang telah banyak memberikan bantuan baik itu moril maupun materil serta dorongan semangat yang tak ternilai, dan berkat doa serta restu mereka jugalah terlaksananya penulisan ini. 7. Teman–teman kelas yang tidak dapat disebutkan satu persatu telah memberikan banyak nasihat dan saran selama menyelesaikan penulisan ilmiah ini. Penulis menyadari masih terdapat kekurangan pada tulisan ilmiah ini. Penulis berharap kritik dan saran yang membangun sebagai masukan bagi penulisan karya ilmiah berikutnya. Semoga karya ilmiah ini bermanfaat bagi para pembaca. Bekasi, 29 Januari 2020
v
Dimas Chandra Widya Pratama
DAFTAR ISI Halaman HALAMAN JUDUL........................................................................................ i PERNYATAAN ORIGINALITAS DAN PUBLIKASI.................................. ii LEMBAR PENGESAHAN.............................................................................. iii ABSTRAKSI.................................................................................................... iv KATA PENGANTAR...................................................................................... v DAFTAR ISI.................................................................................................... vi DAFTAR TABEL............................................................................................ viii DAFTAR GAMBAR........................................................................................ ix DAFTAR LAMPIRAN.................................................................................... xii 1. PENDAHULUAN................................................................................... 1 1.1. Latar Belakang................................................................................... 1 1.2. Batasan Masalah .............................................................................. 2 1.3. Tujuan .............................................................................................. 2 1.4. Metode Penelitian ............................................................................ 3 1.5. Sistematika Penulisan ...................................................................... 3 2. LANDASAN TEORI............................................................................... 5 2.1. Virtual Private Network (VPN) ....................................................... 5 2.2. Screenshot ........................................................................................ 7 2.3. Optical Character Recognition (OCR) ............................................ 8 2.3.1. Tesseract OCR................................................................................... 10 2.4. Pornografi.......................................................................................... 12 2.5. Python................................................................................................ 13 2.5.1. Indentasi............................................................................................. 15 2.5.2. Operator............................................................................................. 15 2.5.3. Struktur Kontrol................................................................................. 17 2.5.4. List, Tuple, dan Dictionary................................................................ 18 2.5.5. Function dan Method......................................................................... 19 2.5.6. Library............................................................................................... 20 2.5.6.1. Pytesseract......................................................................................... 21 2.5.6.2. Multiple Screen Shots (MSS) dan Pillow (PIL)................................. 22 2.5.6.3. Tkinter................................................................................................ 22 2.5.6.4. Pyinstaller.......................................................................................... 24 2.5.6.5. Pyrebase4........................................................................................... 24 2.5.6.6. Sqlite3................................................................................................ 25 2.5.6.7. Pyautogui........................................................................................... 26 2.5.7. Kelas.................................................................................................. 27 2.5.8. Konstruktor........................................................................................ 27 2.5.9. Inheritance......................................................................................... 28 2.6. Sqlite.................................................................................................. 30
vi
2.7. Firebase Authentication..................................................................... 2.8. Thread................................................................................................ 2.9. Microsoft Visual Studio Code............................................................ 2.10. Figma................................................................................................. 2.11. Algoritma........................................................................................... 2.12. Unified Modelling Language (UML)................................................. 2.13. Struktur Navigasi............................................................................... 2.14. Metode Black Box.............................................................................. 2.15. Systems Development Life Cycle (SDLC).......................................... 3. PERANCANGAN DAN IMPLEMENTASI.......................................... 3.1. Analisis Kebutuhan............................................................................. 3.2. Perancangan........................................................................................ 3.2.1. Perancangan Arsitektur Program........................................................ 3.2.2. Perancangan Interaksi Antar Pengguna.............................................. 3.2.3. Perancangan Algoritma...................................................................... 3.2.4. Perancangan Struktur Navigasi........................................................... 3.2.5. Perancangan Basis Data Sqlite............................................................ 3.2.6. Perancangan Antar Muka Aplikasi..................................................... 3.3. Implementasi....................................................................................... 3.3.1. Implementasi Rancangan Sistem........................................................ 3.3.2. Implementasi Desain.......................................................................... 3.3.3. Implementasi Program........................................................................ 3.3.3.1. Implementasi Basis Data Pada Program............................................. 3.3.3.2. Implementasi Firebase Pada Program................................................ 3.3.3.3. Implementasi Pembuatan Class GUI.................................................. 3.3.3.4. Implementasi Class Halaman Splash Screen...................................... 3.3.3.5. Implementasi Class Halaman Login................................................... 3.3.3.6. Implementasi Class Halaman Register............................................... 3.3.3.7. Implementasi Class Halaman Tentang............................................... 3.3.3.8. Implementasi Class Halaman Ganti Password.................................. 3.3.3.9. Implementasi Class Halaman Sukses Ganti Password....................... 3.3.3.10.Implementasi Class Halaman Sukses Register................................... 3.3.3.11.Implementasi Class Halaman Main.................................................... 3.3.3.12.Implementasi Class Halaman Modifikasi Kata Kunci........................ 3.3.3.13.Implementasi Pada Modul protection dan TestGUI2......................... 3.3.3.14.Implementasi Pada Modul Main dan Function Lainnya.................... 3.4. Pengujian............................................................................................ 4. PENUTUP............................................................................................... 4.1 Kesimpulan......................................................................................... 4.2 Saran................................................................................................... DAFTAR PUSTAKA.......................................................................................
vii
30 31 31 34 36 42 43 45 46 49 49 53 53 55 56 62 64 64 70 70 74 75 76 77 81 82 84 86 88 89 90 91 92 95 97 99 100 118 118 118 119
DAFTAR TABEL
Tabel 2.1. Tabel 3.1. Tabel 3.2. Tabel 3.3. Tabel 3.4. Tabel 3.5. Tabel 3.6. Tabel 3.7. Tabel 3.8. Tabel 3.9. Tabel 3.10. Tabel 3.11. Tabel 3.12. Tabel 3.13. Tabel 3.14.
Halaman Deskripsi Sub Proses Tahap Preprocessing................................ 8 Daftar Kata Kunci Mengandung Arti Pornografi........................ 50 Hasil Pengujian Pada Halaman Splash Screen............................ 101 Hasil Pengujian Pada Halaman Register..................................... 103 Hasil Pengujian Pada Halaman Login......................................... 105 Hasil Pengujian Pada Halaman Tentang..................................... 106 Hasil Pengujian Pada Halaman Sukses Register.......................... 107 Hasil Pengujian Pada Halaman Ganti Password......................... 108 Hasil Pengujian Pada Halaman Sukses Ganti Password............. 110 Hasil Pengujian Kesesuaian Fungsi Button Halaman Main........ 111 Hasil Pengujian Kesesuaian Asset dan widget Halaman Main.... 112 Hasil Pengujian Pada Halaman Modifikasi Kata Kunci.............. 113 Hasil Pengujian Fitur Pemblokiran Pada Website....................... 116 Hasil Pengujian Berdasarkan Kata Kunci Pada Situs.................. 116 Hasil Pengujian Berdasarkan Alamat Situs................................. 117
viii
ix
DAFTAR GAMBAR
Gambar 2.1. Gambar 2.2. Gambar 2.3. Gambar 2.4. Gambar 2.5. Gambar 2.6. Gambar 2.7. Gambar 2.8. Gambar 2.9. Gambar 2.10. Gambar 2.11. Gambar 2.12. Gambar 2.13. Gambar 2.14. Gambar 2.15. Gambar 2.16. Gambar 2.17. Gambar 2.18. Gambar 2.19. Gambar 2.20. Gambar 2.21. Gambar 2.22. Gambar 2.23. Gambar 2.24. Gambar 2.25. Gambar 2.26. Gambar 2.27. Gambar 2.28. Gambar 2.29. Gambar 2.30. Gambar 2.31. Gambar 2.32. Gambar 2.33. Gambar 2.34. Gambar 2.35. Gambar 2.36. Gambar 2.37. Gambar 2.38. Gambar 2.39. Gambar 2.40. Gambar 2.41. Gambar 2.42.
Halaman Akses Situs Pornografi Tanpa Koneksi VPN......................... 6 Akses Situs Pornografi Menggunakan Koneksi VPN............ 6 Hasil Screenshot pada Web Browser...................................... 8 Arsitektur Tesseract OCR....................................................... 10 Adaptive Thresholding............................................................ 11 Operator Aritmatika pada Python........................................... 16 Operator Perbandingan pada Python...................................... 17 Operator Boolean pada Python............................................... 17 Contoh Program Menggunakan Pytesseract........................... 21 Input Hasil Gambar Screenshot Sebuah Situs Web................ 21 Output Program....................................................................... 21 Konsep Inheritance pada Class Diagram............................... 28 Fitur IntelliSense pada Microsoft Visual Studio Code............ 32 Tampilan Outline pada Microsoft Visual Studio Code........... 32 Tampilan Explorer pada Microsoft Visual Studio Code......... 33 Tampilan Terminal pada Microsoft Visual Studio Code........ 33 Tampilan Split pada Microsoft Visual Studio Code................ 34 Tampilan Pengaturan Layer pada Figma................................ 35 Tampilan Pengaturan Design pada Figma.............................. 35 Tampilan Pengaturan Prototype pada Figma......................... 36 Tampilan Pengaturan Code pada Figma................................. 36 Simbol Titik Terminal............................................................ 38 Simbol Arus............................................................................ 38 Simbol Proses......................................................................... 38 Simbol Keputusan................................................................... 38 Simbol Proses Terdefinisi....................................................... 38 Simbol Konektor (On-Page)................................................... 38 Simbol Konektor (Off-Page).................................................. 38 Contoh Penyajian Algoritma Menggunakan Pseudocode...... 39 Algoritma Sekuensial.............................................................. 40 Algoritma Percabangan........................................................... 40 Algoritma Perulangan............................................................. 41 Simbol Use Case..................................................................... 42 Simbol Aktor........................................................................... 42 Simbol Asosiasi...................................................................... 42 Simbol Ekstensi...................................................................... 43 Simbol Include........................................................................ 43 Simbol Generalisasi................................................................ 43 Struktur Navigasi Linier......................................................... 43 Struktur Navigasi Non-Linier................................................. 44 Struktur Navigasi Hirarki........................................................ 44 Struktur Navigasi Campuran.................................................. 45
x
Gambar 2.43. Gambar 2.44. Gambar 2.45. Gambar 2.46. Gambar 3.1. Gambar 3.2. Gambar 3.3. Gambar 3.4. Gambar 3.5. Gambar 3.6. Gambar 3.7. Gambar 3.8. Gambar 3.9. Gambar 3.10. Gambar 3.11. Gambar 3.12. Gambar 3.13. Gambar 3.14. Gambar 3.15. Gambar 3.16. Gambar 3.17. Gambar 3.18. Gambar 3.19. Gambar 3.20. Gambar 3.21. Gambar 3.22. Gambar 3.23. Gambar 3.24. Gambar 3.25. Gambar 3.26. Gambar 3.27. Gambar 3.28. Gambar 3.29. Gambar 3.30. Gambar 3.31. Gambar 3.32. Gambar 3.33. Gambar 3.34. Gambar 3.35. Gambar 3.36. Gambar 3.37. Gambar 3.38. Gambar 3.39. Gambar 3.40. Gambar 3.41. Gambar 3.42.
Contoh Tabel Uji Coba Metode Black Box............................ Model Waterfall...................................................................... Model V–Shaped..................................................................... Model Iterative....................................................................... Konten Pornografi pada Sosial Media Twitter....................... Konten Pornografi pada Sosial Media Facebook................... Konten Pornografi pada Sosial Media Youtube...................... Arsitektur Program Aplikasi “Bad Keywords Detector“........ Use Case Diagram Aplikasi “Bad Keywords Detector“........ Flowchart Algoritma Register................................................ Flowchart Algoritma Login.................................................... Flowchart Algoritma Ganti Password.................................... Flowchart Algoritma Pemblokiran Situs Pornografi.............. Struktur Navigasi Aplikasi “Bad Keywords Detector”........... Struktur Tabel keyword........................................................... Sketsa Halaman Splash Screen............................................... Sketsa Pada Halaman Register............................................... Sketsa Pada Halaman Login................................................... Sketsa Pada Halaman Tentang................................................ Sketsa Pada Halaman Sukses Register.................................... Sketsa Pada Halaman Ganti Password................................... Sketsa Halaman Sukses Ganti Password................................ Sketsa Halaman Main............................................................. Sketsa Halaman Modifikasi Kata Kunci................................. Daftar Akun Terdaftar Pada Firebase.................................... Pengaturan Metode Autentikasi Firebase............................... Template Pada Email Verifikasi............................................. Template Email Pergantian Password.................................... Hasil Desain Halaman Register Pada Figma.......................... Desain Tombol (Button)......................................................... Pembuatan Direktori Virtual Environment Pada CMD.......... Aktivasi Mode Virtual Environment....................................... Proses Instalasi Pyautogui...................................................... Kode Program Untuk Menghubukan Sqlite............................ Konfigurasi Projek Firebase Berbentuk Kode JSON............. Kode Program Menghubungkan Autentikasi Firebase.......... Fungsi create_user.................................................................. Fungsi send_ver...................................................................... Fungsi check_email_ver......................................................... Fungsi reset_pass.................................................................... Class GUI............................................................................... Class Halaman splash_screen................................................ Output dari Class Halaman splash_screen............................. Class Halaman Login.............................................................. Method to_login Pada Class Halaman Login......................... Output Pada Class Halaman Login.........................................
xi
45 47 48 48 49 50 50 54 55 58 59 60 61 63 64 65 65 66 67 67 68 68 69 70 70 71 73 74 75 75 76 76 76 77 78 79 79 80 80 80 82 83 83 84 85 85
Gambar 3.43. Gambar 3.44. Gambar 3.45. Gambar 3.46. Gambar 3.47. Gambar 3.48. Gambar 3.49. Gambar 3.50. Gambar 3.51. Gambar 3.52. Gambar 3.53. Gambar 3.54. Gambar 3.55. Gambar 3.56. Gambar 3.57. Gambar 3.58. Gambar 3.59. Gambar 3.60. Gambar 3.61. Gambar 3.62. Gambar 3.63. Gambar 3.64. Gambar 3.65.
Class Halaman Register.......................................................... Beberapa Method Pada Class Halaman Register.................... Output Pada Class Halaman Register..................................... Class Halaman Tentang.......................................................... Output Pada Class Halaman Tentang..................................... Class Halaman Ganti Password............................................. Output Pada Class Halaman Ganti Password........................ Class Halaman Sukses Ganti Password.................................. Output Pada Class Halaman Sukses Ganti Password............. Class Halaman Sukses Register.............................................. Output Pada Class Halaman Sukses Register......................... Class Halaman Main............................................................... Output Pada Class Halaman Main.......................................... Class Halaman Modifikasi Kata Kunci................................... Output Pada Class Halaman Modifikasi Kata Kunci.............. Modul protection.................................................................... Modul testGUI2...................................................................... Modul Main............................................................................ Function initmain dan close_window_logout......................... Proses Verifikasi Melalui Email Verifikasi Firebase............. Proses Mengganti Password Melalui Email Firebase............ Proses Penambahan Kata Kunci Pada Kamus Kata Kunci..... Kata Kunci Untuk Pengujian Aplikasi....................................
xii
86 87 88 88 89 89 90 91 91 92 92 94 94 96 96 98 98 99 100 102 109 114 115
DAFTAR LAMPIRAN
Halaman LAMPIRAN LISTING ................................................................................. 121 LAMPIRAN OUTPUT .................................................................................. 138
xiii
1. PENDAHULUAN 1.1.
Latar Belakang Kementrian Komunikasi dan Informatika (KOMINFO) telah memblokir
banyak situs berkonten pornografi di internet. KOMINFO menggunakan alat bernama Ais, yaitu alat yang digunakan untuk mengklasifikasi situs pornografi secara cepat dan dikelola oleh Tim Ais. Tim Ais bekerja sebagai patroli siber yang akan melakukan pemblokiran situs melalui laporan kepada Internet Service Provider (ISP) dan pengelolaan laporan aduan konten dari masyarakat dan instansi. Sistem blokir konten negatif/pornografi yang diterapkan KOMINFO belum mampu memblokir akses situs pornografi yang dibantu menggunakan koneksi Virtual Private Network (VPN). Virtual Private Network (VPN) adalah suatu teknologi yang digunakan untuk melakukan pertukaran data melalui jalur khusus yang terenkripsi. Maraknya peredaran penyedia VPN gratis di internet pada desktop memungkinkan anak– anak dan remaja yang menggunakan desktop memiliki resiko untuk mengakses pornografi secara bebas. Hal ini kurang mendapatkan pengawasan dari orang tua maupun pemerintah mengingat desktop masih dibutuhkan oleh pelajar untuk melakukan pembelajaran online dan sarana hiburan selama pandemi COVID - 19 ini. Aplikasi blokir akses pornografi untuk desktop banyak tersedia di internet baik secara gratis maupun berbayar. Banyak metode yang diterapkan aplikasi tersebut untuk mendeteksi situs pornografi seperti pendeteksi warna gambar, pendeteksi bentuk gambar, pendeteksi kata kunci situs web, dan penyaringan menggunakan Domain Name System (DNS). Pendeteksian situs pornografi menggunakan
deteksi
kata
kunci
pada
isi
situs
web
lebih
mudah
diimplementasikan karena tidak membutuhkan server tambahan untuk mengelola DNS. Kata kunci
pada halaman situs web mewakili isi konten pada situs web
1
sehingga melakukan pemblokiran situs web berdasarkan kata kunci dapat dilakukan.
2
2
Teknologi Screenshot dan Optical Character Recognition (OCR) dapat dimanfaat untuk membuat aplikasi blokir pornografi dengan cara mendeteksi kata kunci pada isi situs web. Teknologi screenshot digunakan untuk menangkap isi konten termasuk kata kunci pada situs web yang sedang dibuka. Optical Character Recognition (OCR) merupakan teknologi yang digunakan untuk mengkonversi gambar menjadi teks sehingga dapat dimanfaatkan untuk mengkonversi gambar hasil screenshot menjadi teks agar mudah mengidentifikasi kata kunci yang terdapat pada isi situs web tersebut. Latar belakang tersebut mendorong penulis untuk membuat aplikasi blokir akses situs pornografi menggunakan teknologi screenshot dan OCR. 1.2.
Batasan Masalah Penulis menetapkan beberapa batasan–batasan pada topik yang dibahas:
1. Aplikasi, secara otomatis, merekam gambar layar yang dibuka. 2. Aplikasi, secara otomatis, menutup laman situs web yang terindikasi memuat konten pronografi. 3. User wajib memiliki akun gmail. 4. User wajib memasukkan user id dan password. 5. User dapat menambahkan kata kunci. 6. Aplikasi ini menggunakan Bahasa Indonesia. 1.3.
Tujuan Tujuan yang akan dicapai adalah membangun aplikasi berbasis desktop
yang berfungsi memblokir akses situs yang memiliki konten pornografi menggunakan teknologi screenshot dan OCR. Aplikasi ini diharapkan dapat membantu orang tua dalam melindungi anak dan remaja dari paparan situs pornografi yang dapat diakses melalui VPN maupun tanpa VPN.
3
1.4.
Metode Penelitian Pengembangan aplikasi dilakukan menggunakan metode Software
Development Life Cycle (SDLC) dengan model waterfall. Tahap yang dilakukan: 1.
Analisis Kebutuhan Pada tahap ini dilakukan observasi masalah mengenai masalah konten pornografi yang ditemukan di internet, menentukan fungsi aplikasi yang ingin diterapkan, dan menentukan unsur–unsur yang diperlukan untuk membangun aplikasi.
2.
Perancangan Pada tahap ini dilakukan perancangan arsitektur program, perancangan fungsionalitas sistem, perancangan Use Case Diagram, perancangan alur program
menggunakan
flowchart,
perancangan
struktur
navigasi,
perancangan storyboard, dan perancangan basis data. 3.
Implementasi Tahap ini merupakan tahap pengerjaan projek berdasarkan hasil tahap perancangan. Tahap ini mencakup pembangunan sistem autentikasi Firebase, pembangunan basis data Sqlite, dan proses penyusunan kode program pada Visual Studio Code.
4.
Pengujian Pada tahap ini dilakukan uji coba program yang telah disusun pada tahap implementasi. Pengujian ini dilakukan menggunakan metode Black Box.
1.5.
Sistematika Penulisan Tulisan ilmiah ini dibagi menjadi 4 bab. Bab pertama menguraikan Latar
Belakang, Batasan Masalah, Tujuan, Metode Penelitian, dan Sistematika Penulisan. Bab kedua menguraikan Virtual Private Network (VPN), Screenshot, Optical Character Recognition (OCR), Pornografi, Python, Sqlite, Firebase Authentication, Thread, Visual Studio Code, Figma, Algoritma, Unified Modeling Language (UML), Struktur Navigasi, Metode Black Box, dan System Development Life Cycle (SDLC). Bab ketiga menguraikan pelaksanaan penelitian
4
yang mencakup tahap Analisis Kebutuhan, Perancangan, Implementasi, dan Pengujian. Bab keempat menguraikan Kesimpulan dan Saran.
2. LANDASAN TEORI 2.1.
Virtual Private Network Virtual Private Network (VPN) adalah suatu teknologi yang digunakan
untuk mengakses Local Area Network (LAN) menggunakan server pihak ketiga melalui jaringan publik (internet). Teknologi VPN akan menyediakan jaringan yang bersifat private dan terenkripsi untuk menghubungkan user dengan alamat IP Server tujuan sehingga aliran data pada jaringan tersebut dapat terlindungi dari gangguan pihak ketiga seperti hacker. VPN memiliki 3 fungsi utama yaitu (Kurniadi, 2015): 1. Remote Access Remote Access merupakan kemampuan VPN untuk terhubung pada sebuah resource dari satu tempat ke tempat yang lain. VPN dapat terhubung sebuah resource melalui Internet Service Protocol (ISP) dari berbagai negara yang memungkinkan user terhubung situs yang tidak dapat diakses melalui ISP lokal. ISP adalah sebuah penyedia layanan internet yang digunakan untuk menyediakan akses jaringan internet untuk user. 2. Security VPN memiliki keamanan untuk melakukan otentikasi terhadap sumbersumber pengirim data yang akan diterimanya. VPN berguna untuk menganalisis sumber transaksi data yang mencegah masuknya data – data yang mencurigakan seperti malware dan program jahat lainnya. 3. Saving Cost Jalur transmisi data yang dilakukan VPN melalui jaringan internet. VPN menjamin keamanan melakukan transmisi data menggunakan jaringan internet tanpa perlu membangun jaringan privat sendiri.
5
6
Fungsi–fungsi VPN tersebut digunakan oleh sebuah perusahaan untuk mengirimkan data dari satu cabang kantor ke cabang kantor lainnya agar data yang dikirim terhindar dari pembajakan pihak luar dan menjamin keutuhan data hingga sampai ke tujuan. Selain perusahaan, masyarakat dapat menggunakan VPN gratis maupun berbayar melalui aplikasi VPN berbasis desktop maupun aplikasi VPN berekstensi yang digunakan oleh beberapa browser seperti Chrome, Opera, Mozilla, dan lain - lain. Beberapa dampak buruk penggunaan VPN yaitu mudahnya mengakses situs pornografi tanpa melalui pemblokiran. VPN menyebabkan user dapat mengakses situs pornografi melalui server pihak ketiga tanpa diketahui aturan ISP asal. ISP di beberapa negara memiliki hak untuk memblokir akses situs yang tidak diinginkan. Namun, VPN memberikan pilihan jalur ISP dari negara yang diinginkan. Cara kerja VPN yaitu melakukan enkripsi pada jaringan yang menyebabkan ISP tidak mengetahui permintaan (request) user oleh ISP. Gambar 2.1 dan Gambar 2.2 menggambarkan perbedaan akses situs pornografi tanpa VPN dan menggunakan VPN. Pada kasus ini, user berada di Indonesia menggunakan ISP Indonesia.
Gambar 2.1. Akses Situs Pornografi Tanpa Koneksi VPN
Gambar 2.2. Akses Situs Pornografi Menggunakan Koneksi VPN
7
Pada Gambar 2.1, user mengakses situs pornografi tanpa menggunakan VPN. Akses jaringan dimulai dari perangkat user menuju ISP Indonesia menggunakan jaringan yang tidak terenkripsi dan melakukan permintaan (request) menuju ke alamat server situs pornografi yang dituju. Akibatnya, ISP akan memblokir akses tersebut berdasarkan ketentuan dari ISP yang digunakan. Pemblokiran akses oleh ISP ini disebabkan karena tim KOMINFO telah menerapkan aturan pemblokiran situs pada setiap ISP di Indonesia. Pada Gambar 2. 2, user mengakses situs pornografi menggunakan koneksi VPN. Akses jaringan dimulai dari perangkat user menuju ISP Indonesia menggunakan jaringan yang terenkripsi VPN dan melakukan request menuju ke alamat server VPN yang dituju. Akibatnya, ISP akan meneruskan akses jaringan menuju server VPN di negara lain. Server VPN tersebut akan mengirimkan request kepada ISP yang digunakan oleh server VPN tersebut untuk mengakses alamat server pornografi yang dituju. 2.2.
Screenshot Screenshot adalah sebuah fungsi untuk menangkap tampilan layar
komputer dan mengonversi hasil tangkapan ke dalam file gambar. Pada penerapannya, user menggunakan fungsi screenshot untuk menampilkan kesalahan yang terjadi pada lembar kerja, melaporkan perkembangan hasil pekerjaan, dan mengambil isi konten dari suatu situs web. Fungsi screenshot dapat digunakan pada sistem operasi Windows dengan cara menggunakan tombol print screen atau menggunakan aplikasi pihak ketiga seperti Snipping Tools.
8
Gambar 2.3. Hasil Screenshot pada Web Browser 2.3.
Optical Character Recognition Optical Character Recognition atau (OCR) adalah cabang dari Ilmu
Komputer yang melibatkan sistem pembacaan teks dari kertas maupun gambar ke dalam bentuk yang dapat dimanipulasi oleh komputer (contohnya, format kode ASCII). Teknologi OCR memungkinkan untuk menerjemahkan atau mendapatkan isi teks yang terdapat pada artikel maupun kertas yang memiliki karakter yang dikenali oleh komputer. Contoh perangkat lunak OCR atau dikenal sebagai OCR engine yaitu Tesseract, GOCR, ABBY FineReader, dan HOCR. Alur proses pada OCR dibagi menjadi beberapa tahap (Isheawy dan Hasan, 2015): 1. Preprocessing Pada
tahap
ini
dilakukan
perbaikan
kualitas
pada
gambar
tanpa
menghilangkan beberapa informasi di dalamnya. Tujuannya agar karakter yang terdapat di dalam gambar mudah dikenali dan meningkatkan keakuratan dalam pengenalan karakter. Tahap preprocessing terdiri dari beberapa sub proses seperti Binarization/Thresholding, Noise Reduction, Skew Correction, Morphological Operations, dan Thinning/Skeletonisation (Tabel 2.1). Tabel 2.1 Deskripsi Sub Proses Tahap Preprocessing Proses Binarization / Thresholding Noise Reduction
Deskripsi Memisahkan objek foreground dan background dengan mengubah gambar menjadi hitam putih. Mengurangi noise untuk meningkatkan kualitas gambar.
9
Skew Correction Morphological Operations Thinning/ Skeletonization
Perbaikan pada tingkat kemiringan gambar atau rotation. Menambahkan atau menghapus piksel pada karakter yang memiliki lubang atau kelebihan piksel. Proses menipiskan ukuran lebar sebuah teks.
2. Segmentation Tahap ini dibagi menjadi 2 macam yaitu tahap document segmentation dan text segmentation. Pada tahap document segmentation dilakukan proses klasifikasi gambar menjadi bagian–bagian yang homogen. Proses klasifikasi yang terdapat pada document segmentation membagi informasi–informasi yang terdapat pada gambar seperti gambar, teks, dan tabel. Sedangkan pada tahap text segmentation, teks pada gambar dipisahkan berdasarkan antar baris, kemudian berdasarkan kata, dan kemudian berdasarkan karakter sehingga masing–masing objek pada teks menjadi terisolasi. 3. Normalization Tahap segmentation menghasilkan matriks m * n dari gambar yang diproses. Kemudian pada tahap normalization matriks tersebut akan dilakukan normalisasi dengan cara mengecilkan ukuran matriks dan menghilangkan beberapa informasi yang tidak dibutuhkan tanpa menghilangkan informasi penting (Isheawy dan Hasan, 2015). 4. Feature Extraction Tahap ini digunakan untuk mengidentifikasi fitur-fitur pada karakter seperti komponen garis dan sudut. Tujuan tahap ini yaitu memudahkan untuk membedakan antar karakter sehingga memudahkan dalam proses klasifikasi. Proses ini akan membedakan apakah karakter tersebut adalah angka, simbol, atau huruf. 5. Classification Pada tahap ini dilakukan proses klasifikasi model dari setiap karakter secara spesifik. Tahap klasifikasi ini akan mencocokan model karakter yang di dapat dengan model karakter pada dataset. 6. Postprocessing
10
Pada tahap ini dilakukan koreksi ejaan bahasa pada hasil karakter yang telah dihasilkan oleh OCR dan memberikan opsi untuk memperbaiki ejaan karakter hasil OCR dengan daftar kamus bahasa yang tersedia. 2.3.1. Tesseract OCR Tesseract OCR adalah sebuah OCR engine yang bersifat open source. Tesseract OCR dapat diimplementasikan di berbagai platform seperti web, Android, IOS, dan desktop. Tesseract OCR mendukung lebih dari 100 bahasa manusia dari berbagai negara. Gambar 2.4 menampilkan arsitektur pada Tesseract OCR.
Gambar 2.4. Arsitektur Tesseract OCR (Sumber : Ch, Manha, dan Kashyap, 2015) 1. Adaptive Thresholding Adaptive Thresholding pada Tesseract OCR adalah tahap konversi gambar menjadi format binary image. Binary image akan menghasilkan gambar berwarna hitam dan putih. Tahap ini merupakan bagian dari proses Binarization.
11
(a) Sebelum Adaptive Thresholding
(b) Setelah Adaptive Thresholding
Gambar 2.5. Adaptive Thresholding 2. Connected Component Analysis Connected Component Analysis merupakan tahap ekstraksi teks pada dokumen atau gambar. Tahap ini bertujuan untuk mendapatkan komponen yang berisi teks dan memisahkan komponen teks dengan komponen lainnya yang terdapat pada dokumen atau gambar. Hasil output pada tahap ini akan menghasilkan format Binary Large Object (BLOB) yang menyimpan banyak data dari teks yang dikenali. 3. Find Text Lines and Words Tahap ini akan memisahkan beberapa kata dan baris pada isi teks. Baris pada teks akan dipecah menjadi beberapa kata dengan menganalisis jarak spasi pada karakter. 4. Recognize Word Pass 1 Tahap ini akan mengenali bentuk karakter pada kata dengan model data yang terdapat pada Tesseract OCR. Karakter yang berhasil dikenali pada tahap ini akan menjadi training set dan masuk pada tahap Adaptive Classifier. Tahap Adaptive Classifier akan mengenali beberapa kata pada isi teks di bagian paling bawah dokumen atau gambar.
12
5. Recognize Word Pass 2 Tahap ini bertujuan untuk meningkatkan akurasi hasil pada proses pembacaan karakter. Beberapa karakter yang tidak dapat dikenali atau tidak dikenali secara sempurna akan diproses pada tahap ini untuk dikenali secara ulang. 2.4.
Pornografi Pornografi menurut Undang–Undang RI Nomor 44 Tahun 2008 adalah
gambar, sketsa, ilustrasi, foto, tulisan, suara, bunyi, gambar bergerak, animasi, kartun, percakapan, gerak tubuh, atau bentuk pesan lainnya melalui berbagai bentuk media komunikasi dan/atau pertunjukan di muka umum, yang memuat kecabulan atau eksploitasi seksual yang melanggar norma kesusilaan dalam masyarakat. (Kementerian Hukum dan Hak Azasi Manusia, 2008). Pornografi memuat konten yang bermuatan seksual yang dapat membangkitkan nafsu birahi seperti adegan aktivitas seksual, alat seksual, dan aktivitas penyimpangan seksual. Penyebaran muatan pornografi saat ini dilakukan melalui berbagai media, seperti buku, musik, cerita, dan internet. Muatan pornografi dapat memberikan dampak negatif karena dapat menyebabkan kecanduan. Hal ini disebabkan efek pornografi yang merusak bagian otak yang bernama prefontal cortex (PFC) yang berfungsi sebagai pusat pengendalian diri (Muller, 2018). Pornografi akan merangsang zat dopamine secara berlebihan pada pusat limbik sehingga memberikan efek kepuasan berlebihan sehingga otak tidak diberikan kesempatan untuk berpikir pada hal–hal lainnya selain pornografi (Muller, 2018). Efek kecanduan ini mirip seperti kecanduan kokain, alcohol, dan nikotin (Kimball dan Salber, 2020). Dampak lainnya yang diakibatkan oleh pornografi yaitu dapat meningkatkan keinginan untuk melakukan penyimpangan seksual dan pelecehan seksual (Anggraini dan Maulidya, 2020). Sebuah situs dapat diketahui isi kontennya berdasarkan kata kuncinya. User dapat mengakses situs yang bermuatan pornografi jika user mengakses kata kunci yang mengandung pornografi pada mesin pencari dengan domain luar negeri (contoh: google.co.uk) dan mengakses alamat domain atau IP address situs
13
web pada address bar dengan bantuan Virtual Private Network (VPN). Beberapa contoh kata kunci yang dapat mewakili isi konten pornografi adalah ‘Sex, ‘Porn’, ‘Bokep’, ‘Memek’, ‘Toket’, ‘Meki’, ‘Jav’. Beberapa contoh situs web yang memiliki
konten
pornografi
adalah
www.xnxx.com,
www.xvideos.com,
www.pornhub.com, www.javhihi.com. 2.5.
Python Python merupakan bahasa pemrograman tingkat tinggi yang bersifat open
source, artinya user memiliki kebebasan untuk melakukan modifikasi pada bahasa Python untuk berbagai keperluan. Bahasa pemrograman Python dapat membuat aplikasi web, desktop, mobile programming, image processing, IOT, dan lain – lain sehingga bahasa ini bersifat general purpose. Keunggulan dari bahasa ini adalah sifat Imperative Programming, Functional Programming dan Object Oriented Programming (OOP) (Grover, 2019). 1. Imperative Programming Paradigma ini memungkinkan user untuk mendeskripsikan logika secara terurut untuk mencapai suatu tujuan. Sebagai contoh, program untuk menjumlahkan bilangan di dalam suatu array bernama “angka” dengan menggunakan paradigma imperative programming: angka = [10, 20, 30, 40] total = 0 for angka in angka: total += angka print(total)
Untuk menjumlahkan bilangan pada array bernama “angka“, user harus mendeklarasikan terlebih dahulu isi anggota pada array “angka“ dan mendeklarasikan variabel “total“ untuk menampung hasil penjumlahan. Kemudian user harus membuat perulangan untuk menjumlahkan tiap anggota array “angka“. Pada langkah terakhir, user harus membuat fungsi untuk mencetak isi variabel “total“ agar dapat ditampilkan pada layar. 2. Functional Programming
14
Paradigma ini memungkinkan user memanggil sebuah fungsi dari modul Python atau fungsi yang dibangun user untuk mencapai suatu tujuan. Sebagai contoh, program untuk menjumlahkan bilangan di dalam suatu array bernama “ angka ” dengan menggunakan paradigma functional programming: angka = [10, 20, 30, 40] print(sum(angka))
Pada paradigma ini, user tidak perlu menjabarkan langkah–langkah penyelesaian secara terurut untuk menjumlahkan anggota pada array “angka“. User cukup memanggil fungsi print yang diberi parameter pemanggilan fungsi “sum“ yang memiliki parameter variabel array “angka“ untuk mencetak hasil ahkir yang diproses oleh fungsi asli dari modul Python. 3. Object Oriented Programming Paradigma ini membawa konsep class dan object nyata ke dalam logika pemrograman. Class merupakan sebuah blueprint atau kerangka dari sebuah object yang memuat atribute dan behavior. Object merupakan hasil instansiasi dari class yang nantinya dapat memanggil isi dari class tersebut seperti attribute dan behavior. Sebagai contoh, program untuk mengurangkan bilangan di dalam suatu array bernama “angka” dengan menggunakan paradigma OOP: class kalkulator : angka2 = [1,2,3,4] def kurang(self, arr): total = 0 for angka in arr: total -= angka return total kalk = kalkulator() angka = [10, 20, 30, 40] print(kalk.kurang(angka)) print(kalk.kurang(kalk.angka2))
Pada penggalan program di atas, variabel “kalk” merupakan variabel object dari class bernama “kalkulator”. Pada kelas yang bernama “kalkulator“ terdapat variabel attribute yang ditunjukan oleh variabel “angka2“ dan behavior yang ditujukkan pada fungsi bernama “kurang“. Paradigma OOP
15
memudahkan user dalam membangun aplikasi yang cukup besar karena konsep OOP memudahkan untuk mengelompokan masalah–masalah besar pada aplikasi yang ingin dibangun. 2.5.1. Indentasi Indentasi adalah sebuah penulisan dengan bentuk tulisan yang menjorok ke arah kanan. Penulisan program pada Python harus memperhatikan indentasi sebagai pembeda antara isi sub program dengan sub program lainnya. Setiap sub program dapat berisi kumpulan statement program yang berisi instruksi – instruksi tertentu. Identasi akan membedakan antara statement program yang berada di dalam kelas dengan statement yang berada di luar kelas. Identasi pada Python dapat digunakan dengan cara menekan tombol tab atau menekan tombol spasi. Contoh penggunaan identasi pada Python adalah sebagai berikut. Class A :
Def __init__ (self) :
2.5.2. Operator Operator adalah simbol atau tanda yang digunakan untuk menghasilkan sebuah hasil dari kedua operand (data) atau lebih. Operator diletakan diantara 2 operand sehingga operator digunakan sebagai penghubung operand. Operator dapat digunakan untuk menghubungkan beberapa teks yang terpisah. Penjelasan operator pada Python akan dijabarkan sebagai berikut: 1. Operator Aritmatika Operator aritmatika digunakan untuk mengoperasikan operasi matematika seperti penjumlahan, pengurangan, perkalian, dan pembagian. Operator aritmatika diterapkan pada operand yang dapat menghasilkan perhitungan matematis (Gambar 2.6).
16
Gambar 2.6. Operator Aritmatika pada Python (Sumber: Shovic dan Simpson, 2019) 2. Operator Perbandingan Operator perbandingan digunakan untuk membandingkan nilai operand yang menghasilkan nilai ahkir berupa True atau False. Operator ini digunakan pada struktur kontrol seperti percabangan dan perulangan (Gambar 2.7). 3. Operator Boolean Operator boolean digunakan untuk membandingkan nilai True atau False yang akan menghasilkan nilai ahkir berupa True atau False. Operator boolean digunakan untuk membandingkan banyak nilai True atau False yang dihasilkan dari operasi perbandingan sehingga akan tercipta sebuah keputusan pada struktur kontrol (Gambar 2.8).
17
Gambar 2.7. Operator Perbandingan pada Python (Sumber: Shovic dan Simpson, 2019)
Gambar 2.8. Operator Boolean pada Python (Sumber: Shovic dan Simpson, 2019) 2.5.3. Struktur Kontrol Struktur kontrol merupakan kumpulan blok program yang digunakan sebagai pengambilan keputusan dasar pada komputasi pada aplikasi. Strukur kontrol menentukan alur aplikasi ketika aplikasi sedang dijalankan. Python memiliki 2 macam struktur kontrol dasar yaitu percabangan dan perulangan. 1. Percabangan digunakan untuk menentukan alur program berdasarkan hasil kondisi yang diberikan pada percabangan tersebut. Hasil kondisi dapat memiliki nilai True atau False. Percabangan pada Python memiliki sintaks dasar seperti berikut: If < kondisi > :
Elif < kondisi > :
Else :
18
2. Perulangan Perulangan digunakan untuk mengeksekusi perintah pada kode program secara berulang – ulang sesuai dengan kondisi yang telah ditentukan. Perulangan dapat menghemat waktu dalam pembuatan aplikasi karena user tidak perlu membuat perintah aplikasi secara berulang – ulang. Perulangan Python terdiri dari 2 macam yaitu perulangan For dan perulangan While. a. Perulangan For Perulangan ini digunakan untuk mengulang blok program atau statement program sebanyak batas jumlah perulangan yang telah ditentukan sebelumnya. Perulangan ini dapat digunakan ketika
user ingin
memasukkan atau menjabarkan nilai array secara terurut. Perulangan For Percabangan pada Python memiliki sintaks dasar seperti dibawah ini. For < variabel_iterasi > in range (< banyak_perulangan >) :
b. Perulangan While Perulangan ini digunakan untuk mengulang blok program atau statement program selama kondisi yang ditentukan bernilai benar atau True. Perulangan ini dapat digunakan ketika user ingin menggunakan infinite loop atau perulangan tanpa batas. Perulangan While Percabangan pada Python memiliki sintaks dasar seperti dibawah ini. While < kondisi > : < statement_program >
2.5.4. List, Tuple, dan Dictionary List, Tuple, dan Dictionary merupakan tipe data yang digunakan untuk menyimpan lebih dari 1 nilai pada entitas yang sama. List dan Dictionary memiliki sifat mutable, artinya nilainya dapat dimodifikasi oleh user. Dictionary memiliki sifat immutable, artinya nilainya tidak dapat dimodifikasi oleh user. 1. Bentuk umum List pada Python adalah sebagai berikut : < Variabel_List > = [< nilai ke 0 >, < nilai ke 1 >,…., < nilai ke n >]
19
2. Bentuk umum Tuple pada Python adalah sebagai berikut : < Variabel_Tuple > = (< nilai ke 0 >, < nilai ke 1 >,…., < nilai ke n >)
3. Bentuk umum Dictionary pada Python adalah sebagai berikut : < Variabel_Dictionary > = {< kata_kunci > : < nilai ke 0 >, < kata_kunci > : < nilai ke 1 >,…., {< kata_kunci > : < nilai ke n >}
2.5.5. Function dan Method Function (fungsi) dan method pada Python digunakan untuk memisahkan blok perintah yang terdapat pada aplikasi sehingga membuat struktur kode menjadi lebih rapih. Function dapat didefinisikan di dalam kelas maupun di luar kelas. Function di dalam kelas akan berubah istilahnya menjadi method. Method di dalam kelas disebut sebagai behavior objek pada konsep pemrograman berbasis objek. Perbedaan dari function dan method terletak pada namanya saja. Sifat Function dibagi menjadi 2 jenis yaitu function yang dapat mengembalikan nilai dan tidak dapat mengembalikan nilai. Function yang dapat mengembalikan nilai ditandai dengan adanya perintah return. Sedangkan untuk function yang tidak mengembalikan nilai tidak terdapat kata kunci return. Function dapat diberi variabel parameter yang digunakan untuk mengoper nilai data dari luar function ke dalam function. Method pada kelas wajib mengoper kata kunci self pada parameter nya yang berfungsi sebagai identitas bahwa method tersebut merupakan anggota dari kelas. 1. Bentuk umum Function yang mengembalikan nilai adalah sebagai berikut: Def < nama_function > ( ) : < statement_program > Return nama_variabel
2. Bentuk umum Function yang tidak dapat mengembalikan nilai adalah sebagai berikut: Def < nama_function > ( ) : < statement_program >
20
2.5.6. Library Library merupakan kumpulan modul – modul berisi function dan variabel program yang terpisah. Library digunakan untuk membantu user untuk mengembangkan sebuah aplikasi secara cepat dan mudah. Python memiliki 2 jenis library yaitu standard library dan external library. Standard library merupakan library yang telah disediakan oleh Python tanpa harus mengunduhnya terlebih dahulu. Sedangkan external library merupakan library yang tidak disediakan oleh Python dan harus diunduh terlebih dahulu. 1. Bentuk umum pemanggilan modul library untuk semua modul adalah sebagai berikut: Import < nama_library >
2. Bentuk umum pemanggilan modul pada library adalah sebagai berikut: From < nama_modul > import < nama_kelas >
Atau: Import < nama_folder >.< nama_modul >
3. Bentuk umum pemanggilan library dengan pembungkusan nama identifier untuk pemanggilan modul. Identifier adalah sebuah nama identitas yang dapat didefinisikan oleh user sebagai bentuk pembeda dengan statement program lain. Import < nama_modul > as < nama_identifier >
4. Bentuk umum perintah Command Prompt (CMD) untuk menginstal External library pada Python adalah sebagai berikut. Pip install < nama_library >
2.5.6.1. Pytesseract Pytesseract
merupakan
sebuah
external
library
Python
yang
menyediakan fasilitas Google’s Tesseract OCR Engine pada pengembangan aplikasi menggunakan bahasa Python. Pytesseract mendukung pembacaan file gambar yang didukung oleh image processing library seperti Pillow dan
21
Leptonica. Jenis-jenis format gambar yang dapat dibaca yaitu JPEG, PNG, GIF, BMP, TIFF, dan lain-lain. Gambar 2.9. menggambarkan contoh kode program yang menggunakan Pytesseract untuk mendapatkan teks pada Gambar 2.10. Teks yang merupakan output digambarkan pada Gambar 2.11. 1. Bentuk umum perintah untuk menginstal Pytesseract pada Python adalah sebagai berikut: Pip Install Pytesseract
2. Bentuk umum pemanggilan Pytesseract pada Python adalah sebagai berikut: Import Pytesseract
Gambar 2.9. Contoh Program Menggunakan Pytesseract
Gambar 2.10. Input Hasil Gambar Screenshot Sebuah Situs Web
Gambar 2.11. Output Program 2.5.6.2. Multiple Screen Shots dan Pillow Multiple Screen Shots (MSS) merupakan sebuah external library Python yang menyediakan fasilitas screenshot pada tampilan layar secara berulang – ulang. MSS menyimpan hasil screenshot dengan tipe data PNG. MSS dapat digunakan pada aplikasi games dan aplikasi lain yang membutuhkan fitur
22
screenshot yang cepat dan teroptimisasi. MSS dapat terintegrasi dengan external library lainnya seperti PIL yang bertugas untuk menangkap piksel gambar pada layar tanpa harus menyimpan file gambarnya terlebih dahulu. Pillow (PIL) merupakan sebuah library bahasa Python yang menyediakan fasilitas image processing yaitu sebuah kegiatan memanipulasi gambar. PIL mendukung pemrosesan data gambar berupa format JPEG, PNG, BMP, GIF, PPM, dan TIFF. 1. Bentuk umum perintah untuk menginstal MSS pada Python adalah: Pip install mss
2. Bentuk umum pemanggilan library MSS pada Python adalah: Import mss
3. Contoh penggalan program penggunaan library MSS dan library PIL: From PIL import Image Import mss With mss.mss () as sct : for num, monitor in enumerate(sct.monitors[1:], 1) : sct_img = sct.grab(monitor) img = Image.frombytes("RGB", sct_img.size, sct_img.bgra, "raw", "BGR X") text = test.image_to_string (img).lower ()
2.5.6.3. Tkinter Tkinter merupakan sebuah standard library Python yang digunakan untuk membangun sebuah aplikasi berbasis Graphical User Interface (GUI) berbasis desktop. Tkinter mendukung berbagai macam platform seperti Windows, macOS, dan Linux. Elemen – elemen visual pada Tkinter ditampilkan berdasarkan dari tampilan platform dari sistem operasi yang digunakan. Tkinter memiliki modul yang bernama ttk yang berisi sekumpulan komponen–komponen widget untuk membangun aplikasi berbasis GUI. Modul ini berisi 19 komponen widget yang terdiri dari: 1. Button: Komponen yang memberikan aksi pada aplikasi. 2. Checkbutton: Komponen yang memberikan opsi data lebih dari satu kepada user. User diperbolehkan memilih opsi data lebih dari satu pada aplikasi.
23
3. Entry: Komponen yang menerima masukkan user pada aplikasi. 4. Frame: Komponen yang memisahkan sekumpulan widget agar menjadi lebih terorganisasi. 5. Label: Komponen yang menampilkan suatu informasi pada aplikasi. 6. LabelFrame: Komponen yang berisi frame yang memiliki label. 7. Menubutton: Komponen button yang memiliki drop-down menu. 8. PanedWindow: Komponen window yang dapat penampung banyak panel dan dapat diatur dengan cara melakukan drag secara vertikal dan horizontal. 9. Radiobutton: Komponen yang memberikan opsi data lebih dari satu. 10. Scale: Komponen yang mengizinkan user mengatur sebuah nilai pada aplikasi. 11. Scrollbar: Komponen yang memiliki kemampuan untuk menampilkan tampilan bagian bawah halaman. 12. Spinbox: Komponen yang mengatur besaran nilai dengan melakukan klik pada button kecil atas dan bawah di sebelah kanan. 13. Combobox: Komponen yang memberikan opsi data lebih dari satu kepada user. Komponen ini menampilkan opsi data dengan tampilan menu dropdown. 14. Notebook: Komponen yang menampung beberapa panel yang dibungkus sebuah tombol untuk mengaksesnya. 15. Progressbar: Komponen yang digunakan untuk menampilkan perkembangan proses yang dilakukan pada aplikasi. 16. Separator: Komponen yang digunakan untuk memisahkan beberapa komponen dari komponen lainnya. 17. Sizegrip: Komponen yang digunakan untuk mengatur ukuran top - level window pada aplikasi. 18. TreeView: Komponen yang menampilkan data secara hirarki. 19. Canvas: Komponen yang digunakan untuk menampilkan gambar. Bentuk umum pemanggilan library Tkinter adalah: from tkinter import *
Bentuk umum pembuatan window menggunakan library Tkinter adalah:
24
from tkinter import * variabel_tk = Tk () variabel_tk.mainloop ()
2.5.6.4. Pyinstaller Pyinstaller adalah sebuah external library Python yang digunakan untuk melakukan konversi dari modul Python atau Python file (.py atau .pyw) menjadi executable file. Executable file tidak perlu diterjemahkan melalui interpreter atau compiler ketika dijalankan. Sedangkan Python file harus melakukan terjemahan melalui interpreter dari Python terlebih dahulu. 1. Bentuk umum perintah pada Command Prompt untuk menginstal Pyinstaller adalah: Pip install Pyinstaller
2. Bentuk umum perintah pada Command Prompt untuk mengubah modul Python menjadi executable file adalah: Pyinstaller
2.5.6.5. Pyrebase4 Pyrebase4 merupakan sebuah external library Python yang digunakan untuk menghubungkan aplikasi dengan layanan Firebase. Pyrebase mendukung semua fasilitas pada Firebase seperti authentication, realtime database, dan cloud storage. 1. Perintah untuk menginstal Pyrebase4 pada Command Prompt adalah: Pip Install Pyrebase4
2. Perintah untuk memanggil Pyrebase4 pada aplikasi adalah: Import Pyrebase
3. Contoh program untuk menghubungkan aplikasi dengan layanan Firebase menggunakan Pyrebase4.
25
Import Pyrebase = { "apiKey": "AIzaSyB-Hk41XUd8KT8WqUMkpvEih91rVBekMc0", "authDomain": "bkd2020-89e7d.firebaseapp.com", "databaseURL": "https://bkd2020-89e7d.firebaseio.com", "projectId": "bkd2020-89e7d", "storageBucket": "bkd2020-89e7d.appspot.com", "messagingSenderId": "42323350809", "appId": "1:42323350809:web:aacffc1dbf513100ede188", "measurementId": "G-BCNTHQB382" } = pyrebase.initialize_app ()
4. Bentuk
umum
pemanggilan
fasilitas
Authentication
pada
Firebase
menggunakan Pyrebase4 adalah: = firebase.auth ()
5. Bentuk umum pemanggilan fasilitas Realtime Database pada Firebase menggunakan Pyrebase4 adalah: = firebase.database ()
6. Bentuk umum pemanggilan fasilitas Cloud Storage pada Firebase menggunakan Pyrebase4 adalah: = firebase.storage ()
2.5.6.6. Sqlite3 Sqlite3 merupakan sebuah standard library Python yang digunakan untuk menghubungkan aplikasi dengan layanan Sqlite. Sqlite3 mendukung perintah Sqlite seperti Data Manipulation Language (DML) dan Data Definition Language (DDL). Sqlite memiliki dari 2 function penting yang wajib dipanggil yaitu connect dan cursor. Connect merupakan function yang digunakan untuk mengkoneksikan file basis data yang telah dibuat menggunakan Sqlite3. Sedangkan cursor merupakan function yang digunakan untuk memanggil perintah DML dan DDL pada Sqlite3. 1. Contoh kode program pemanggilan connect dan cursor pada library sqlite3:
26
Import sqlite3 = sqlite3.connect ('app.db') = .cursor()
2. Contoh kode program pemanggilan perintah DML dan DDL: Import sqlite3 = sqlite3.connect ('app.db') = .cursor () .execute('''CREATE TABLE stocks (date text, trans text, symbol text, qty real, price real)''') .execute("INSERT INTO stocks VALUES ('2006-0105','BUY','RHAT',100,35.14)") conn.commit() conn.close()
2.5.6.7. Pyautogui Pyautogui merupakan sebuah external library Python yang digunakan untuk menyediakan fasilitas kontrol otomatis berupa perintah keyboard atau mouse pada aplikasi desktop. Pyautogui dapat digunakan untuk membuat aplikasi desktop yang dapat berinteraksi dengan aplikasi desktop lain. Pyautogui mendukung sistem operasi Windows, macOS, dan Linux. Beberapa fitur yang ditawarkan oleh Pyautogui yaitu menggerakan pointer mouse, melakukan klik, mengambil Screenshot, dan mengetikan input pada keyboard secara otomatis. 1. Perintah untuk menginstal Pyautogui pada Command Prompt: Pip Install Pyautogui
2. Perintah untuk memanggil library Pyautogui pada aplikasi: Import Pyautogui
3. Contoh program sederhana untuk mengaktifkan perintah tutup aplikasi setiap aplikasi desktop lain ingin dibuka. Import Pyautogui While True : pyautogui.FAILSAFE = False pyautogui.hotkey(alt,'f4') pyautogui.keyUp('alt') pyautogui.keyUp('f4')
27
2.5.7. Kelas Kelas (class) merupakan sebuah blueprint / rancangan sebuah dari sebuah objek pada konsep pemrograman berbasis objek (OOP). Kelas terdiri dari komponen penyusun pembentuk objek seperti attribute dan behavior. Attribute dan Behavior pada suatu kelas dapat diakses oleh kelas lain dengan membuat instansiasi objek kelas yang ingin diakses. Python mengizinkan user membuat kelas lebih dari satu pada satu skrip program Python dan memanggilnya pada modul Python lain menggunakan perintah import dan from. Sistem kelas ini akan memudahkan user dalam membagi masalah program menjadi lebih sederhana. 1. Bentuk umum pembuatan kelas: Class < nama_kelas> :
2. Bentuk umum instansiasi objek dari kelas: Class < nama_kelas> :
< nama_objek > = < nama_kelas > ()
2.5.8. Konstruktor Konstruktor adalah sebuah method yang dijalankan ketika sebuah objek dari suatu kelas diinstansiasi. Kegunaan dari konstruktor adalah menginisialisasi attribute pada kelas ketika objek terbentuk. Konstruktor ditandai dengan penggunaan kata kunci init dan memilki parameter self. Setiap kelas hanya memiliki 1 konstruktor saja dan konstruktor tidak memiliki identifier sendiri. Bentuk pemanggilan method konstruktor menggunakan identifier dari nama kelas itu sendiri. 1. Bentuk umum pembuatan method konstuktor adalah sebagai berikut. Class < nama_kelas> : Def __init__ (self) :
2. Contoh program yang menggunakan method konstruktor adalah sebagai berikut.
28
Class Tes : Def __init__ (self) : self.nama = ‘Dimas’ print (self.nama) obj = Tes ()
Output dari program ini : Dimas
2.5.9. Inheritance Inheritance merupakan sebuah sub konsep yang terdapat pada konsep pemrograman berbasis objek yang mengizinkan kelas turunannya menerima properti (attribute dan behavior) dari kelas yang menurunkannya. Konsep inheritance ini terdapat 2 macam kedudukan kelas yaitu parent class dan child class. Parent class adalah kelas yang mewarisi propertinya kepada child class, sedangkan child class merupakan sebuah kelas yang menerima pewarisan properti dari parent class. Penjelasan inheritance dapat dijelaskan pada gambar dibawah ini.
Gambar 2.12. Konsep Inheritance pada Class Diagram Pada gambar 2.12, terdapat kelas “ Mamalia “ yang terhubung pada 2 kelas dibawahnya yaitu kelas “ Kuda “ dan “ Paus “. Kelas “ Mamalia “ disebut sebagai parent class karena kelas tersebut menurunkan propertinya pada kelas “
29
Kuda “ dan “ Paus “. Sedangkan kelas “ Kuda “ dan “ Paus “ disebut sebagai child class menerima sifat properti dari kelas “ Mamalia “. Konsep inheritance pada gambar 2.12. menggambarkan bahwa hewan mamalia memiliki sifat yang dapat diturunkan pada Kuda dan Paus karena kedua hewan tersebut termasuk hewan vertebrata (bertulang belakang), memilki paru – paru, umur, berat, dan jenis makan. Method atau behavior yang diturunkan antara lain bernafas, melahirkan, dan makan. Konsep inheritance akan memudahkan user dalam membuat aplikasi karena ketika user membuat kelas “ Kuda “ atau “ Paus “, user tidak perlu menginisialisasi properti dasar dari hewan mamalia secara keseluruhan. Contoh penerapan inheritance pada program Python dengan konsep class diagram seperti pada gambar adalah sebagai berikut : Class Mamalia : Def __init__ (self) : self.Vertebrata = True self.Paru_paru = True self.Umur = 0 self.Berat = 0 self.Jenis_makan = “” Def Bernafas (self) :
Def Melahirkan (self) :
Def Makan (self) :
Class Kuda (Mamalia) : Def __init__ (self) : self.Umur = 3 self.Berat = 49.9 self.kaki = 4 self.Kec_lari = 45 Def Berlari (self) :
30
Class Paus (Mamalia) : Def __init__ (self) : self.Umur = 24 self.Berat = 1000 self.sirip = True self.Kec_berenang = 60 Def Berenang (self) :
2.6.
Sqlite Sqlite adalah sebuah library dari bahasa C yang menyediakan fasilitas
penyimpanan basis data ringan tanpa membutuhkan proses server yang terpisah dan mengizinkan pengaksesan basis data menggunakan bahasa query SQL bersifat non standar. Sqlite memilki fasilitas dalam pengelolaan basis data seperti Data Manipulation Language (DML) dan Data Definition Language (DDL). Sqlite bersifat open source artinya user dapat menggunakannya secara gratis dan dapat dimodifikasi sendiri sesuai keinginan. Basis data yang disimpan oleh Sqlite bersifat offline dan disimpan melalui perangkat penyimpanan non volatile seperti Hard Drive. Beberapa aplikasi pengelola visual database Sqlite antara lain DB Browser, Sqlitestudio, Sqlite Maestro, Datapro, Sqlpro. Sqlite menerapkan model data berbasis relasional. Model data relasional adalah model basis data yang dibangun berdasarkan tabel yang terdiri dari baris dan kolom. Baris pada tabel mewakili isi record yang mengelompokan data secara horizontal sedangkan kolom mewakili isi field yang mengelompokan data secara vertikal. Record pada tabel terdiri dari sekumpulan field dan beberapa record yang tergabung akan membentuk sebuah tabel. 2.7.
Firebase Authentication Firebase Authentication merupakan sebuah layanan Google yang
menyediakan fungsionalitas dalam proses autentikasi user pada kegiatan sign in. Fungsional autentikasi yang terdapat pada Firebase meliputi verifikasi email, email reset, password reset, Simple Mail Transfer Protocol (SMTP), dan
31
verifikasi Short Message Service (SMS). Firebase Authentication memiliki fitur kustomisasi template pesan verifikasi yang akan dikirimkan kepada pengguna aplikasi. Beberapa metode sign in dan penyedia layanan yang didukung Firebase Authentication antara lain: Email / Password; Phone; Google; Game Center; Facebook; Twitter; GitHub; Yahoo; Microsoft; Apple; Anonymous. 2.8.
Thread Sebuah thread merupakan kumpulan rangkaian kode yang dieksekusi CPU
berdasarkan penjadwalan oleh CPU. Pada setiap program yang dibuat oleh user memiliki setidaknya 1 thread untuk dijalankan. Perancangan sebuah thread dapat didefinisikan secara otomatis melalui compiler/interpreter maupun oleh user sendiri. User dapat merancang beberapa thread agar dapat dijalankan secara bersamaan yang disebut juga sebagai multithreading. Multithreading bertujuan untuk membuat sebuah program yang dapat melakukan pekerjaan di latar belakang ketika program sedang melakukan pekerjaan lainnya. Contoh program yang menerapkan multithreading adalah program stopwatch. 2.9.
Microsoft Visual Studio Code Microsoft Visual Studio Code merupakan sebuah aplikasi code editor
ringan dan kuat yang dikembangkan oleh perusahaan Microsoft. Microsoft Visual Studio Code bersifat open source dan berjalan pada desktop platform yang mendukung sistem operasi Windows, macOS, dan Linux. Microsoft Visual Studio Code mendukung sintaks dari berbagai bahasa pemrograman yang dapat ditambahkan melalui ekstensi yang disediakan. Beberapa fitur Microsoft Visual Studio Code yang memudahkan user: 1. IntelliSense Fitur ini memberikan pilihan sintaks atau daftar member program secara otomatis berupa tampilan drop-down menu. Fitur ini juga memberikan info fungsi penggunaan sintaks yang ingin digunakan.
32
Gambar 2.13. Fitur IntelliSense pada Microsoft Visual Studio Code 2. Outline Fitur ini menampilkan komponen – komponen program yang digunakan pada proses pembuatan program seperti kelas dan member kelas (attribute dan method). Fitur ini memudahkan untuk mencari statement program yang ingin diubah tanpa perlu melakukan pencarian secara manual.
Gambar 2.14. Tampilan Outline pada Microsoft Visual Studio Code 3. Explorer Fitur ini menampilkan isi file dan folder projek program yang sedang dikerjakan. User tidak perlu membuka Windows Explorer untuk membuka modul program lain.
33
Gambar 2.15. Tampilan Explorer pada Microsoft Visual Studio Code 4. Terminal Microsoft Visual Studio Code memberikan pilihan terminal yang terinstal pada desktop dan dapat dijalankan tanpa perlu membuka terminal melalui luar aplikasi Microsoft Visual Studio Code.
Gambar 2.16. Tampilan Terminal pada Microsoft Visual Studio Code 5. Split Fitur ini digunakan untuk menampilkan lembar kerja aktif lebih dari satu. Fitur ini berguna ketika user ingin bekerja lebih dari satu file secara bersamaan.
34
Gambar 2.17. Tampilan Split pada Microsoft Visual Studio Code 2.10
Figma Figma merupakan sebuah aplikasi freeware berbasis browser yang
digunakan untuk membuat rancangan antar muka aplikasi. Figma menyediakan installer untuk platform Windows dan MacOS. User yang ingin bekerja menggunakan Figma harus memiliki akun Figma atau melakukan Sign In melalui akun Google. Figma bekerja dan menyimpan lembar kerja secara online dan offline. Beberapa fitur unggulan yang dimiliki oleh Figma yaitu memungkinkan 2 user atau lebih bekerja secara bersamaan sehingga mempercepat proses pengerjaan projek. Selain itu, Figma menyediakan fitur simulasi untuk berinteraksi terhadap objek–objek pada desain yang telah selesai dibuat. Fitur ini dapat memberikan gambaran ketika desain telah di terapkan pada aplikasi yang sedang berjalan. Beberapa fitur lain yang terdapat pada Figma: 1. Layer Fitur ini digunakan untuk memisahkan dan menggabungkan gambar berdasarkan konsep layering. Layering adalah konsep penggabungan gambar yang ditumpuk menjadi beberapa lapis.
35
Gambar 2.18. Tampilan Pengaturan Layer pada Figma 2. Design Fitur ini digunakan untuk memanipulasi gambar yang sedang dipilih oleh user. Beberapa fitur tambahan lainnya yaitu mengekspor atau meyimpan gambar ke dalam format gambar seperti PNG, JPG, SVG, dan PDF.
Gambar 2.19. Tampilan Pengaturan Design pada Figma 3. Prototype Fitur ini untuk merangkai interaksi dari objek–objek pada prototype dan menampilkannya dalam bentuk preview dengan bentuk layar pada perangkat yang tersedia.
36
Gambar 2.20. Tampilan Pengaturan Prototype pada Figma 4. Code Fitur ini memungkinkan user merancang prototype menggunakan bahasa pemrograman seperti CSS, Android, dan IOS.
Gambar 2.21. Tampilan Pengaturan Code pada Figma 2.11.
Algoritma Algoritma susunan yang logis dan sistematis untuk memecahkan suatu
masalah atau untuk mencapai tujuan tertentu. Instruksi-instruksi yang terdapat pada program dan aplikasi disusun menggunakan algoritma agar instruksi yang disusun mampu menghasilkan output yang diinginkan. Algoritma memberikan
37
gambaran mengenai masalah–masalah yang terjadi pada aplikasi sebelum aplikasi dibuat langsung. Beberapa ciri – ciri dari algoritma: 1. Input, Input adalah sesuatu yang ingin dipecahkan masalahnya. Algoritma dapat memiliki nol atau lebih jumlah input. 2. Output, Output merupakan hasil ahkir dari hasil pemrosesan algoritma. Algoritma dapat memiliki nol atau lebih jumlah output. 3. Instruksi jelas dan tidak ambigu, Instruksi pada algoritma harus jelas dan tidak memiliki makna ganda pada setiap instruksinya. Contoh kata yang bersifat ambigu yaitu “tampilkan“. Kata “tampilkan“ dapat memiliki makna yang bermacam–macam sehingga kata ini harus diperjelas menjadi “tampilkan x“. 4. Terbatas, Algoritma harus berhenti ketika telah menghasilkan suatu output. Algoritma tidak boleh berahkir dengan perulangan tanpa batas. 5. Efektif, Algoritma harus dirancang secara sederhana agar dapat dijalankan sesuai dalam waktu singkat dan masuk akal. 6. Dapat
diimplementasikan,
Algoritma
yang
dirancang
harus
dapat
diimplementasikan dalam berbagai bentuk bahasa dan memiliki output yang sama. Bentuk penyajian algoritma ditentukan berdasarkan kebutuhan dalam menyajikan algoritma kepada siapa sehingga orang yang tidak paham dalam bidang komputer dapat memahaminya. Secara garis besar algoritma pada pembuatan aplikasi disajikan dalam bentuk gambar dan tulisan. Bentuk penyajian algoritma berupa gambar yaitu dengan menggunakan diagram alir (flowchart). Sedangkan, bentuk penyajian berupa tulisan menggunakan pseudocode. 1. Flowchart Flowchart merupakan sebuah diagram yang memiliki aliran 1 atau 2 arah yang
berlaku
secara
sekuensial
dan
bekesinambungan.
Flowchart
menggambarkan alur algoritma yang dimulai dari atas ke bawah atau dimulai dari kiri ke kanan untuk mengahkiri. Beberapa simbol flowchart yang wajib diketahui:
38
a. Simbol Titik Terminal, digunakan untuk memulai (start) dan mengakhiri (stop) suatu proses pada algoritma.
Gambar 2.22. Simbol Titik Terminal b. Simbol Arus, digunakan untuk menghubungkan simbol dengan simbol lainnya. Simbol ini memberikan arah jalannya algoritma.
Gambar 2.23. Simbol Arus c. Simbol Proses, digunakan untuk menunjukan proses yang dilakukan pada komputer. Simbol ini dapat digunakan untuk mendeklarasikan suatu variabel ke dalam program.
Gambar 2.24. Simbol Proses d. Simbol Keputusan, digunakan untuk memilih salah satu proses berdasarkan kondisi yang ditentukan.
Gambar 2.25. Simbol Keputusan e. Simbol Proses Terdefinisi, digunakan untuk menunjukan proses pada bagian prosedur.
Gambar 2.26. Simbol Proses Terdefinisi f. Konektor (On - Page), digunakan untuk menyederhanakan hubungan antar simbol yang jaraknya berjauhan atau rumit dalam satu halaman. Gambar 2.27. Simbol Konektor (On - Page)
39
g. Konektor (Off – Page), digunakan untuk menyederhanakan hubungan antar simbol yang jaraknya berjauhan atau rumit dalam halaman yang berbeda.
Gambar 2.28. Simbol Konektor (Off - Page) 2. Pseudocode Pseudocode merupakan sebuah bentuk penyajian algoritma yang disajikan dalam bentuk kode–kode tertentu. Pseudocode menyajikan algoritma menggunakan struktur seperti bahasa pemrograman. Pseudocode berfokus pada pembuatan logika pemrograman tanpa harus mengikuti aturan bahasa pemrograman secara umum.
Gambar 2.29. Contoh Penyajian Algoritma Menggunakan Pseudocode (Sumber: Pradhan dan Bhende, 2019) Algoritma memiliki tiga struktur dasar yaitu algoritma sekuensial, algoritma perulangan, dan algoritma percabangan. Algoritma sekuensial adalah sebuah algoritma yang tersusun secara berurutan yang terdiri dari beberapa
40
instruksi. Algoritma sekuensial mengerjakan untuk satu perintah tanpa perulangan kemudian ke perintah selanjutnya hingga perintah terahkir. Algoritma perulangan adalah sebuah algoritma yang digunakan untuk mengulang perintah sebelumnya hingga sesuai dengan kondisi tertentu. Sedangkan algoritma percabangan merupakan sebuah algoritma yang terdiri dari beberapa keputusan sesuai dengan kondisi yang telah ditentukan.
Gambar 2.30. Algoritma Sekuensial
Gambar 2.31. Algoritma Percabangan
Pada Gambar 2.30, terdapat contoh flowchart yang menjelaskan algoritma program menghitung sebuah luas persegi. Terdapat Input berupa variabel “S“ yang digunakan untuk mendefinisikan panjang dari sisi persegi. Output yang dihasilkan adalah berupa tampilan hasil luas persegi yaitu nilai dari variabel “L”. Algoritma tersebut mengerjakan satu kali instruksi tanpa mengalami perulangan sehingga disebut sebagai algoritma sekuensial. Pada Gambar 2.31, terdapat contoh flowchart yang menjelaskan algoritma program melakukan verifikasi umur terhadap pembuatan SIM. Algoritma tersebut memiliki input berupa variabel “Umur“ yang digunakan untuk memberikan keputusan berdasarkan nilai dari variabel tersebut. Nilai “Umur“ yang kurang dari sama dengan 17 maka program akan menghasilkan output berupa pesan bahwa umur yang dimasukkan belum cukup. Output akan berubah
41
menjadi “cetak SIM“ jika variabel yang dimasukkan bernilai 17 atau lebih. Algoritma tersebut memiliki instruksi yang bercabang yang bergantung dari nilai variabel “Umur“ sehingga disebut sebagai algoritma percabangan.
Gambar 2.32. Algoritma Perulangan Pada Gambar 2.32, terdapat contoh flowchart yang menjelaskan algoritma program menghitung angka berdasarkan banyak pangkat yang didefinisikan. Algoritma tersebut memiliki input “Angka“, “Pangkat“, “Total“, dan “i“. Jumlah perulangan yang terdapat pada program bergantung pada banyaknya nilai pada variabel “i yang nilainya akan bergantung dengan banyaknya nilai pada variabel “Pangkat“. Setiap melakukan perulangan, program akan melakukan pertambahan 1 nilai pada variabel “i“. Perulangan akan berlanjut jika nilai “i“ kurang dari nilai “Pangkat“ dan perulangan akan berhenti jika nilai “i“ telah melebihi dari nilai
42
“Pangkat“. Algoritma tersebut memiliki alur yang memungkinkan untuk melakukan instruksi yang sama sehingga disebut sebagai algoritma perulangan.
2.12.
Unified Modelling Language Unified Modelling Language (UML) merupakan sebuah model grafik yang
memvisualisasikan sebuah sistem pengembangan perangkat lunak berbasis objek. UML digunakan untuk mendokumentasikan cara kerja sistem maupun kelas-kelas dalam perancangan aplikasi berbasis objek. UML memberikan kemudahan dalam melakukan maintenance karena spesifikasi dan kebutuhan dari sebuah aplikasi di dokumentasikan ke dalam UML. Penulis menggunakan Use Case Diagram untuk mendokumentasikan interaksi antara user dengan sistem pada aplikasi. Use Case Diagram adalah diagram proses yang merepresentasikan hal-hal yang dapat dilakukan oleh aktor dalam menyelesaikan sebuah pekerjaan (Manalu, 2015). Diagram ini menjabarkan peran–peran yang terjadi antara user dan sistem selama aplikasi digunakan. Use Case Diagram mempunyai beberapa komponen dengan fungsi–fungsi: 1. Use Case, merupakan komponen yang menjabarkan mengenai tingkah laku (behavior) yang terjadi antara aktor dan sistem. Penamaan Use Case diberikan menggunakan kata kerja.
Gambar 2.33. Simbol Use Case 2. Aktor, merupakan komponen berupa orang atau sistem lain yang berhubungan dengan Use Case dalam suatu sistem. Aktor diberi nama tepat di bawah simbol.
Gambar 2.34. Simbol Aktor
43
3. Asosiasi, merupakan simbol yang digunakan untuk menghubungkan komunikasi antara Use Case dengan Aktor.
Gambar 2.35. Simbol Asosiasi 4. Ekstensi, merupakan simbol yang digunakan untuk menambahkan relasi Use Case dengan Use Case lain. Arah panah pada simbol ekstensi mengarah pada Use Case yang ingin ditambahkan.
Gambar 2.36. Simbol Ekstensi 5. Include, merupakan simbol yang digunakan untuk menghubungkan Use Case yang membutuhkan Use Case lain untuk dijalankan. Arah panah simbol include mengarah pada Use Case yang dibutuhkan.
Gambar 2.37. Simbol Include 6. Generalisasi, merupakan sebuah simbol yang menghubungkan Use Case spesialisasi (khusus) dengan Use Case generalisasi (umum). Arah panah generalisasi menunjuk kepada Use Case generalisasinya (umum).
Gambar 2.38. Simbol Generalisasi 2.13.
Struktur Navigasi Struktur navigasi adalah struktur yang menggambarkan alur tampilan dari
sebuah aplikasi. Struktur navigasi digunakan untuk membuat sebuah aplikasi yang memiliki lebih dari satu tampilan. Penggunaan struktur navigasi disesuaikan dengan bentuk aplikasi yang akan dibuat. Struktur navigasi terdiri dari 4 macam: 1. Struktur Navigasi Linier
44
Struktur navigasi linier menggambarkan alur tampilan aplikasi berdasarkan satu rangkaian cerita yang menampilkan satu tampilan secara berurutan.
Gambar 2.39. Struktur Navigasi Linier
2. Struktur Navigasi Non-Linier Struktur
navigasi
non–linier
adalah
sebuah
struktur
navigasi
yang
menggambarkan alur tampilan aplikasi yang tidak berurutan dan mempunyai jalur yang bermacam–macam dari satu tampilan ke tampilan lainnya. Setiap tampilan pada struktur navigasi non – linier mempunyai kedudukan yang sama.
Gambar 2.40. Struktur Navigasi Non - Linier 3. Struktur Navigasi Hirarki Struktur navigasi hirarki atau disebut juga struktur bercabang adalah sebuah struktur navigasi yang membagi tampilan berdasarkan Master Page dan Slave Page. Master Page disebut juga sebagai halaman utama dan Slave Page disebut juga sebagai halaman pendukung. Struktur navigasi hirarki membentuk struktur pohon.
Gambar 2.41. Struktur Navigasi Hirarki 4. Struktur Navigasi Campuran
45
Struktur navigasi campuran adalah struktur navigasi yang menerapkan gabungan struktur navigasi linier, non–linier, dan hirarki. Struktur navigasi ini disebut juga sebagai struktur navigasi bebas. Struktur navigasi ini memungkinkan user membuat aplikasi menjadi lebih bebas berinteraksi antar tampilan.
Gambar 2.42. Struktur Navigasi Campuran 2.14.
Metode Black Box Metode Black Box adalah sebuah metode pengujian yang berfokus pada
pengujian fungsionalitas aplikasi tanpa harus mengetahui kode programnya. Metode Black Box hanya mengevaluasi input dan output dari suatu aplikasi ketika sedang dijalankan. Metode Black Box berfungsi untuk mengetahui output ketika diberikan berbagai input pada aplikasi tanpa harus mengetahui kode programnya. Pengujian yang dilakukan menggunakan metode Black Box ini meliputi pemeriksaan bugs / error, kesesuaian alur kerja aplikasi, dan pengujian fungsi – fungsi pada aplikasi.
Gambar 2.43. Contoh Tabel Uji Coba Metode Black Box (Sumber: Ningrum, dkk., 2019)
46
Berdasarkan pada Gambar 2.43, user menguji sebuah tampilan login pada aplikasi dengan memberikan beberapa input dengan harapan menghasilkan bentuk output yang berbeda–beda. Input yang valid diharapkan akan menampilkan pesan “berhasil login“ dan masuk ke dalam form data sekaligus menutup form login. Sedangkan
input yang tidak valid diharapkan akan menampilkan pesan
“username atau password salah“ dan menolak akses login untuk masuk ke dalam form data. Kolom Id menunjukan nomor identitas dari pengujian yang dilakukan. 2.15.
System Development Life Cycle System Development Life Cycle (SDLC) adalah kumpulan beberapa variasi
langkah–langkah pengembangan sistematis, perancangan, dan pemeliharaan (maintenance) dari projek aplikasi untuk memastikan persyaratan user terpenuhi dengan penggunaan sumber daya yang sedikit (Barjtya, Sharma, dan Rani, 2017). SDLC membantu para developer untuk mengembangkan sistem aplikasi yang sesuai dengan keinginan user. SDLC berisi siklus tahapan bagaimana cara mengembangkan, mendesain, dan memelihara projek aplikasi. Pemilihan SDLC umumnya disesuaikan dari kebutuhan projek yang ingin dibangun. Tahapan pada SDLC: 1. Analisis Kebutuhan Tujuan dari tahap ini yaitu mendapatkan informasi mengenai kebutuhan apa saja yang harus dibangun untuk membangun sebuah projek aplikasi. Tahap ini juga bertujuan untuk mengetahui cara kerja sebuah sistem apabila semua persyaratan user terpenuhi. 2. Perancangan Tujuan dari tahap ini yaitu merancang sebuah projek aplikasi sesuai dengan kebutuhan yang telah dianalisis pada tahap analisis kebutuhan. Tahap ini meliputi perancangan alur program, perancangan algoritma dan perancangan antarmuka. 3. Implementasi Pada tahap ini developer mulai mengerjakan projek aplikasinya sesuai dengan rancangan perancangan yang telah dibuat.
47
4. Pengujian Tahap ini menguji kesesuaian dari projek aplikasi yang telah dibuat apakah hasil kerja aplikasi sesuai dengan perencanaan atau tidak. Tahap ini menguji proses cara kerja aplikasi, kesesuaian tampilan, dan kesesuaian proses input ouput. 5. Pemeliharaan Tahap ini mendeskripsikan proses pembaharuan sistem pada aplikasi yang telah dibangun. Proses ini akan menjadi awalan untuk fase pengembangan berikutnya. SDLC memilik beberapa macam model pengembangan: 1. Model Waterfall Model waterfall adalah model tradisional dari SDLC dimana proses dikerjakan diselesaikan terlebih dahulu sebelum menuju ke proses selanjutnya. Pada proses ini tidak ada pilihan lain untuk menuju ke proses sebelumnya setelah memasuki ke proses selanjutnya dan hasil (Barjtya, Sharma, dan Rani, 2017). Kelebihan dari model ini yaitu mudah diterapkan dan mencegah terjadinya error karena proses akan diverifikasi terlebih dahulu sebelum melanjutkan ke proses selanjutnya.
Gambar 2.44. Model Waterfall (Sumber: Kramer, 2018)
48
2. V – Shaped Model ini merupakan bentuk perkembangan dari model waterfall dimana model ini menambahkan proses pengujian secara bertahap pada aplikasi. Pada model ini tidak mengizinkan melanjutkan proses selanjutnya apabila proses sebelumnya belum selesai.
Gambar 2.45. Model V-Shaped (Barjtya, Sharma, dan Rani, 2017) 3. Iterative Model ini memfokuskan pengembangan secara bertahap dimulai dari pengembangan projek sederhana kemudian ditambahkan beberapa fungsional secara berulang di setiap siklusnya. Model ini tidak mengharuskan developer untuk menambahkan seluruh fungsional ke dalam aplikasi secara lansgung.
Gambar 2.46. Model Iterative
49
(Miraz dan Ali, 2020)
3. PERANCANGAN DAN IMPLEMENTASI
2.1.
Analisis Kebutuhan Remaja dan anak–anak menggunakan internet dan desktop sebagai
pendukung kegiatan pembelajaran dan hiburan, terutama saat pandemi COVID 19. Hal ini menyebabkan anak–anak dan remaja menjadi rentan terhadap paparan konten pornografi di internet. Konten pornografi di internet dapat ditemukan melalui situs pornografi maupun sosial media. Pemerintah Indonesia saat ini sudah melakukan pemblokiran beberapa situs pornografi dan membatasi isi penelusuran situs pencarian Google yang memiliki kata kunci berbau pornografi. Namun, beberapa situs pornografi lainnya masih dapat diakses menggunakan VPN maupun tanpa VPN. Hal ini didukung dengan penyebaran konten pornografi melalui sosial media seperti Facebook dan Twitter yang sengaja menyebarkan alamat situs pornografi. Selain itu, konten berbau seksual lainnya dapat ditemukan pada situs hiburan seperti Youtube.
Gambar 3.1. Konten Pornografi pada Sosial Media Twitter
50
51
Terdapat beberapa cara user untuk mengakses situs mengandung pornografi. User dapat mengaksesnya melalui kata kunci (Tabel 3.1) yang ditulis melalui sebuah mesin pencari. Mesin pencari ini dapat ditemukan di situs mesin pencari seperti Google dan sosial media. Kata kunci yang dimasukkan akan mempengaruhi isi konten yang akan ditampilkan pada situs. Selain itu, user dapat menulis alamat situs pornografi secara langsung melalui address bar yang ditemukan pada aplikasi browser.
Gambar 3.2. Konten Pornografi pada Sosial Media Facebook
Gambar 3.3. Konten Pornografi pada Sosial Media Youtube
Tabel 3.1 Daftar Kata Kunci Mengandung Arti Pornografi No 1 2 3
Kata Kunci Porn Sex Bokep
Arti Penelusuran Menampilkan konten pornografi secara umum Menampilkan konten pornografi secara umum Menampilkan konten pornografi berbahasa Indonesia
52
4 5 6
Bugil Jav / Japanese Adult Video Meki / Memek / Toket
Menampilkan konten pornografi berbahasa Indonesia Menampilkan konten pornografi asal Jepang Merujuk pada alat kelamin wanita
Aplikasi Bad Keyword Detector adalah aplikasi berbasis desktop yang digunakan untuk memblokir situs yang mengandung unsur pornografi dengan cara mendeteksi kata kunci yang memiliki unsur pornografi pada sebuah situs. Aplikasi ini menangkap isi situs web menggunakan teknologi screenshot dan diterjemahkan ke dalam sebuah teks menggunakan teknologi OCR. Teks yang dihasilkan akan dibandingkan dengan kamus kata kunci yang terdapat pada aplikasi. Isi teks yang memiliki kata kunci yang sesuai dengan kamus akan teridentifikasi sebagai situs yang memiliki unsur pornografi. Aplikasi akan secara otomatis menutup situs yang teridentifikasi memiliki unsur pornografi tersebut. Aplikasi ini dilengkapi fitur stealth mode yaitu sebuah fitur yang digunakan untuk menyembunyikan program dari taskbar ketika program sedang berjalan. Fitur tersebut bertujuan agar aplikasi ini tidak dapat ditemukan oleh anak atau remaja yang sedang diawasinya. Hal ini mengurangi resiko terjadi penutupan atau penghapusan terhadap aplikasi. Orang tua atau pengawas dapat memodifikasi kata kunci yang ingin ditambahkan maupun dihapus pada kamus kata kunci sehingga pengawasan menjadi lebih fleksibel. Pada tahap analisis kebutuhan dilakukan analisis kebutuhan fungsional dan analisis kebutuhan non fungsional. Analisis kebutuhan fungsional adalah tahap analisis yang digunakan untuk menentukan fitur yang dibutuhkan pada aplikasi. Analisis kebutuhan non fungsional adalah tahap analisis yang digunakan untuk menentukan kebutuhan yang harus dipenuhi dalam pembuatan aplikasi. 1. Analisis Kebutuhan Fungsional Tahap ini menentukan library yang akan digunakan dalam pembangunan aplikasi.
Aplikasi
Bad
Keywords
Detector
membutuhkan
beberapa
fungsionalitas: a. Fungsi untuk membangun GUI pada aplikasi. Dalam hal ini dibutuhkan sebuah library pada Python yaitu Tkinter.
53
b. Fungsi autentikasi login dan register. Dalam hal ini dibutuhkan sebuah layanan Firebase untuk melakukan fungsi autentikasi. Library pada Python yang dibutuhkan untuk menghubungkan aplikasi dengan Firebase yaitu Pyrebase. sebuah library pada Python yaitu Tkinter. c. Fungsi untuk menangkap isi tampilan website menggunakan teknologi screenshot. Library pada Python yang dibutuhkan adalah MSS dan PIL untuk menyimpan hasil output MSS sementara tanpa harus menyimpan di memori penyimpanan. d. Layanan basis data (database) yang digunakan untuk menyimpan kamus kata kunci. Layanan basis data yang digunakan yaitu SQLite. Library pada Python yang digunakan untuk menghubungkan aplikasi dengan SQLite yaitu Sqlite3. e. Fungsi OCR yang digunakan untuk mengubah hasil screenshot menjadi format teks. Perangkat lunak OCR yang digunakan yaitu Tesseract OCR dan Library pada Python yang digunakan untuk menghubungkan Tesseract OCR dengan aplikasi yaitu Pytesseract. f. Fungsi untuk mentutup laman web browser secara otomatis. Library pada Python yang digunakan yaitu Pyautogui. g. Fungsi yang digunakan untuk membuat shortcut tombol pada aplikasi. Library pada Python yang digunakan yaitu keyboard. 2. Analisis Kebutuhan Non Fungsional Perangkat lunak yang digunakan untuk merancang sebuah aplikasi: a. Sistem operasi Windows 10 Pro 64 bit. b. Aplikasi menulis kode program menggunakan Micrososoft Visual Studio Code. c. Aplikasi merancang prototype tampilan GUI menggunakan Figma. d. Python Interpreter. e. Aplikasi database editor menggunakan DB Browser yang mendukung SQLite database. f. Web Browser untuk mengakses Firebase Console menggunakan Google Chrome dan mengakses internet.
54
Perangkat keras yang digunakan untuk merancang sebuah aplikasi yaitu PC dengan spesifikasi: a. Prosesor AMD Ryzen 5 2500U 2.0 GHz. b. RAM 8 GB (2 Channel). c. VGA AMD Radeon Vega 8. d. Memori SSD 256 GB. 3.2.
Perancangan Tahap perancangan merupakan tahap merancang blueprint sebuah aplikasi
sebelum dibangun. Tahap ini dibagi menjadi 6 bagian, yaitu tahap perancangan arsitektur program, perancangan interaksi antar pengguna, perancangan algoritma, perancangan struktur navigasi, perancangan basis data SQLite, dan perancangan antar muka aplikasi. 3.2.1. Perancangan Arsitektur Program Tahap perancangan diawali dengan melakukan perancangan arsitekur program agar mengetahui proses request dan respond dari aplikasi sehingga memudahkan untuk melakukan tahap perancangan lainnya. Aplikasi “Bad Keywords Detector“ terhubung dan bekerja sama dengan layanan Firebase, database lokal Sqlite, dan perangkat lunak Tesseract OCR. Proses request dan respond pada layanan Firebase dilakukan dengan bantuan koneksi internet. Sedangkan proses request dan respond pada Sqlite dan Tesseract OCR tanpa menggunakan koneksi internet. Layanan Firebase digunakan dalam melakukan autentikasi user seperti login, register dan mengganti password. Ketika user melakukan input berupa email dan password pada proses login, aplikasi akan melakukan request dan mencocokan input user dengan informasi user yang terdaftar pada layanan Firebase. Jika terjadi ketidakcocokan, maka Firebase akan mengirimkan respond berupa pesan error pada aplikasi dan user tidak dapat menyelesaikan proses autentikasi. Pada proses register, aplikasi akan meminta untuk membuat informasi
55
user pada layanan Firebase. Jika proses register berhasil, Firebase akan melakukan respond dengan mengirimkan email baru yang berisi alamat link untuk melakukan verifikasi. Pada proses pergantian password, user diminta untuk memasukkan email yang terdaftar pada aplikasi yang kemudian akan dilakukan request pada layanan Firebase. Jika email sesuai, Firebase akan mengirimkan respond berupa pengiriman email yang berisi alamat link untuk melakukan pergantian password baru. Database lokal Sqlite digunakan untuk menampung kamus kata kunci yang lokasinya berada pada satu direktori pada aplikasi. Database ini diperlukan ketika aplikasi bekerja dengan OCR dan melakukan modifikasi terhadap kata kunci. Ketika bekerja dengan OCR, aplikasi akan meminta data kata kunci pada Sqlite untuk ditampung pada variabel program. Variabel tersebut akan diproses untuk dilakukan perbandingan terhadap teks hasil OCR yang didapatkan. Ketika user melakukan request pada aplikasi untuk melakukan pemblokiran akses situs pornografi, proses penangkapan layar (screenshot) akan dilakukan oleh MSS. Hasil output dari MSS akan diproses oleh method pada library PIL hingga menghasilkan format gambar dan ukuran yang diinginkan. Hasil output dari PIL akan dikonversi melalui method pada Pytesseract yang terintegrasi dengan aplikasi Tesseract OCR. Proses penutupan web browser ketika mendeteksi situs pornografi akan dilakukan oleh method pada Pyautogui. Gambar 3.4 mengilustrasikan mengenai arsitektur program pada aplikasi “Bad Keywords Detector“.
56
Gambar 3.4. Arsitektur Program Aplikasi “Bad Keywords Detector“
3.2.2. Perancangan Interaksi Antar Pengguna Pada tahap ini dilakukan perancangan kegiatan yang terjadi saat pemakaian aplikasi menggunakan Use Case Diagram. Pada diagram ini terdapat beberapa aktor yang berinteraksi dengan aplikasi antara lain pengguna, Firebase, SQLite, Tesseract OCR, dan Library pengolah gambar. Pengguna diartikan sebagai pengawas yang menggunakan proteksi dari aplikasi untuk melindungi situs pornografi. Pada aktor library, pengolah gambar di dalamnya terdiri dari library yang bertugas melakukan screenshot dan pengolah hasil screenshot yaitu MSS dan PIL. Pada Gambar 3.5 menjelaskan diagram Use Case pada aplikasi “Bad Keywords Detector“.
57
Gambar 3.5. Use Case Diagram Aplikasi “Bad Keywords Detector“
Aplikasi Bad Keywords Detector ini memiliki 4 case utama, yaitu daftar aplikasi, masuk aplikasi, pilih menu, dan keluar/logout. Beberapa case utama memiliki turunan case lainnya yang dihubungkan menggunakan simbol include dan extend. Case yang terhubung menggunakan simbol include wajib dikerjakan oleh user agar case utama dapat dikerjakan dan terhubung dengan aktor lainnya. Sedangkan case yang terhubung menggunakan simbol extend dapat mengizinkan user untuk memilih case yang ingin dikerjakan tanpa perlu mengerjakan case lainnya. Sebagai contoh, apabila user ingin mendaftarkan diri pada aplikasi maka user wajib mengisi email, password, dan konfirmasi password agar proses register pada aplikasi dapat berjalan. Pada saat memilih menu, user dapat memilih berbagai macam menu yang tersedia tanpa perlu mengerjakan case lainnya. 3.2.3. Perancangan Algoritma Pada tahap ini dilakukan perancangan algoritma program yang bertujuan untuk mengetahui tahap–tahap yang terjadi pada case sehingga akan memudahkan penyusunan blok program pada code editor. Perancangan algoritma dibangun
58
menggunakan
penyajian
diagram
alir
(Flowchart)
untuk
memudahkan
pembacaan. Perancangan algoritma dibagi menjadi 3 bagian: 1. Algoritma Mendaftar Aplikasi (Register) Pada algoritma register aplikasi, dideklarasikan 3 variabel bertipe string, yaitu variabel email_string (menampung data email), pass_string (menampung data password user), dan conf_pass_string (menampung data konfirmasi password) yang akan menampung data dari komponen Entry pada Tkinter. Pada algoritma ini terdapat 6 perintah yang dieksekusi: a. Pemeriksaan isi variabel Perintah ini akan memeriksa isi dari semua variabel yang dimasukkan user. Apabila semua variabel nilai bernilai kosong, maka program tidak dapat melanjutkan ke perintah selanjutnya. b. Pemeriksaan kesesuaian format email Perintah ini memeriksa isi email apakah sesuai dengan format email pada umumnya atau tidak. c. Pemeriksaan nilai conf_pass_string Perintah ini membandingkan apakah nilai variabel conf_pass_string sama dengan nilai variabel email_string. Apabila kedua variabel tersebut mempunyai nilai yang sama, maka program dapat melaksanakan perintah selanjutnya. d. Pemeriksaan kesesuaian format password Perintah ini digunakan untuk memeriksa format password yang dimasukkan. Format password yang sesuai memiliki syarat panjang minimal 6 karakter dan memiliki 1 karakter numerik. e. Pemeriksaan autentikasi email Perintah ini digunakan untuk memeriksa apakah email yang dimasukkan sudah terdaftar pada layanan Firebase atau tidak. Proses register akan gagal apabila email yang dimasukkan telah terdaftar. f. Pyrebase membuat user baru Pyrebase akan membuat akun baru berdasarkan email dan password yang dimasukkan.
59
Gambar 3.6. Flowchart Algoritma Register Algoritma dimulai dengan memasukkan nilai ke dalam variabel yang telah didefinisikan. Alur algoritma ditentukan dari nilai variabel valid yang bertipe boolean. Alur program akan menampilkan Messagebox berisi pesan peringatan apabila variabel valid bernilai salah atau false. 2. Algoritma Masuk Aplikasi (Login) dan Ganti Password Algoritma login aplikasi dan ganti password memiliki algoritma yang hampir sama dengan algoritma register aplikasi. Algoritma login aplikasi memiliki masukkan data berupa email_string dan password_string saja.
60
Gambar 3.7. Flowchart Algoritma Login Algoritma ganti password memiliki masukkan berupa email dari user saja karena pada kasus ini user tidak dapat mengingat password dari email.
61
Gambar 3.8. Flowchart Algoritma Ganti Password 3. Algoritma Pemblokiran Akses Situs Pornografi Algoritma ini dimulai dari inisialisasi 5 variabel yaitu variabel temp, sct_img, img, text, dan en. Setelah dilakukan inisialisasi, program akan melakukan pemeriksaan apakah variabel en bernilai True atau tidak. Sistem pemblokiran pornografi akan aktif apabila en bernilai True. Jika aktif, program akan memberikan input data dari Sqlite ke variabel temp.
62
Gambar 3.9. Flowchart Algoritma Pemblokiran Situs Pornografi Fungsi dari ke lima variabel yang diinisialisasi dijabarkan sebagai berikut: a. Variabel temp bertipe data list yang memiliki sekumpulan data kata kunci yang berasal dari Sqlite. b. Variabel sct_img adalah variabel nontype yang digunakan untuk menampung data tangkapan layar berupa kumpulan piksel. Kumpulan piksel–piksel tersebut belum dilakukan decode menjadi file gambar. c. Variabel img adalah variabel nontype yang digunakan untuk menampung proses decode pada variabel sct_img. Pada proses ini dilakukan penentuan warna gambar menjadi RGB dan menentukan ukuran gambar hingga menghasilkan sebuah file gambar.
63
d. Variabel text merupakan variabel bertipe string yang menampung hasil proses konversi gambar menjadi data teks yang dilakukan oleh method pada Pytesseract. e. Variabel en merupakan variabel bertipe boolean yang menentukan apakah sistem pemblokiran diaktifkan atau tidak. Nilai variabel ini dapat berubah ketika user menekan Button “Aktivasi Proteksi”. Proteksi yang dilakukan aplikasi akan aktif selama nilai en bernilai True dan mengubah tampilan Button menjadi “Matikan Proteksi”. Proteksi yang dilakukan aplikasi akan berhenti apabila nilai en bernilai False dan akan mengubah tampilan Button menjadi “Aktifkan Proteksi”. 3.2.4. Perancangan Struktur Navigasi Aplikasi ini menggunakan struktur navigasi berbentuk campuran. Navigasi dimulai dari halaman Splash Screen yang kemudian dilanjutkan menuju ke halaman Register. Pada halaman Register, user dapat mengakses ke halaman Login apabila user telah memiliki akun. Pada halaman Login, user dapat memilih halaman Ganti Password dan kembali ke halaman Register. Halaman Tentang dapat diakses melalui halaman Login dan Register. Apabila proses login berhasil, user dapat mengakses ke halaman Main. Pada halaman Main, user dapat mengakses menu Modifikasi Kata Kunci, Ganti Password, dan kembali ke menu Login apabila user mengakses tombol Keluar. a. Halaman Splash Screen, tampil pada awal aplikasi yang digunakan untuk memberikan gambaran mengenai aplikasi sekaligus menjadi awalan dari alur aplikasi. b. Halaman Register, digunakan sebagai wadah untuk melakukan pendaftaran (register) pada aplikasi. c. Halaman Login, digunakan untuk melakukan autentikasi data ketika user ingin masuk ke dalam aplikasi (login). d. Halaman Tentang, digunakan untuk menampilkan informasi mengenai tujuan aplikasi dan pembuat aplikasi.
64
e. Halaman Sukses Register, digunakan untuk menampilkan informasi bahwa user berhasil melakukan register dan memberikan info langkah yang harus ditempuh setelah melakukan register. f. Halaman Ganti Password, digunakan untuk melakukan proses menggantikan password lama dengan password baru. Proses yang harus dilalui untuk melakukan pergantian password ini adalah melakukan autentikasi email. g. Halaman Sukses Ganti Password, digunakan untuk menampilkan informasi bahwa user berhasil melakukan atuhentikasi email untuk melakukan pergantian password. h. Halaman Main, tampil apabila user berhasil melakukan login. Halaman ini menampilkan fitur – fitur utama aplikasi yang dapat langsung diakses user. Fitur – fitur tersebut meliputi fitur aktivasi proteksi, modifikasi kamus kata kunci, dan mengaktifkan mode sembunyi. i. Halaman Modifikasi Kata Kunci, digunakan sebagai wadah untuk melakukan modifikasi kata kunci pada kamus kata kunci.
Gambar 3.10. Struktur Navigasi Aplikasi “Bad Keywords Detector”
65
3.2.5. Perancangan Basis Data Sqlite Basis data yang akan dirancang berfungsi untuk menampung kata kunci dengan banyak yang tidak dibatasi. Basis data yang dibuat akan diberi nama blacklist. Kata kunci yang terdaftar akan dimasukkan ke dalam 1 field dengan tipe data string. Field yang dibangun diberi nama keyword dan memiliki primary key yang bertujuan agar kata kunci tidak mengalami duplikasi. File basis data akan disimpan di dalam folder yang sama dengan tempat penyimpanan aplikasi. Pada Gambar 3.11 mengilustrasikan struktur tabel yang digunakan pada tabel keyword. Keyword Kata Kunci ke 0.. Kata Kunci ke 1.. Kata Kunci ke 2.. . . . Kata Kunci ke n..
Gambar 3.11. Struktur Tabel keyword 3.2.6. Perancangan Antar Muka Aplikasi Pada tahap ini dilakukan perancangan storyboard aplikasi menggunakan aplikasi Figma. Storyboard adalah sebuah blueprint yang merepresentasikan gambaran visual dan interaksi user pada aplikasi. Tujuan pembangunan storyboard yaitu mengetahui kerangka desain halaman aplikasi dan interaksi yang terjadi pada antar muka aplikasi. Antar muka yang dirancang adalah: 1.
Halaman Splash Screen Pada halaman ini terdapat judul aplikasi, gambar flat design, dan slogan aplikasi (tagline). Gambar flat design berfungsi untuk menjelaskan gambaran target pemakai untuk aplikasi. Pada bagian bawah flat design terdapat Button Mulai yang digunakan untuk mengeksekusi halaman Register dan menutup halaman Splash Screen. Pada bagian bawah Button terdapat slogan aplikasi yang berfungsi untuk menjelaskan maksud dari aplikasi (Gambar 3.12).
66
Gambar 3.12. Sketsa Halaman Splash Screen 2.
Halaman Register Halaman ini berisi 3 komponen Entry yang berfungsi untuk memasukkan email, password, dan konfirmasi password. Keterangan yang digunakan untuk memberi informasi aturan–aturan yang harus dipatuhi dalam memasukkan data, diletakkan di atas setiap Entry. Pada halaman ini terdapat 3 button, yaitu Button Daftar, Masuk, dan Tentang. Button Daftar digunakan untuk mengonfirmasi proses mendaftar aplikasi. Button Masuk digunakan untuk menutup halaman Daftar dan masuk ke halaman Login. Button Tentang digunakan untuk menutup halaman Daftar dan masuk ke halaman Tentang.
Gambar 3.13. Sketsa Pada Halaman Register
67
3.
Halaman Login Halaman ini berisi 2 komponen Entry yang berfungsi untuk memasukkan email dan password akun yang telah terdaftar. Komponen Button yang terdapat pada halaman ini terdiri dari Button Masuk yang digunakan untuk melakukan konfirmasi login, Button Daftar untuk melakukan navigasi ke halaman Register, dan Button Ganti Password untuk melakukan navigasi ke halaman Tentang.
Gambar 3.14. Sketsa Pada Halaman Login
4.
Halaman Tentang Halaman ini menampilkan informasi mengenai tujuan aplikasi dan pembuat aplikasi. Pada halaman ini terdapat logo Universitas Gunadarma di pojok kanan bawah aplikasi. Pada bagian kiri bawah terdapat Button Kembali yang akan mengembalikan user menuju ke halaman Register atau Login.
68
Gambar 3.15. Sketsa Pada Halaman Tentang 5.
Halaman Sukses Register Halaman ini menampilkan informasi bahwa user harus memeriksa email dan melakukan verifikasi email. Halaman ini memiliki Button Masuk dan flat design. Button Masuk akan mengalihkan user ke halaman Login.
Gambar 3.16. Sketsa Pada Halaman Sukses Register 6.
Halaman Ganti Password Pada halaman ini terdapat Entry yang digunakan untuk memasukkan email user yang terdaftar pada layanan Firebase. Terdapat tombol Ganti yang digunakan untuk mengkonfirmasi proses pergantian password dan tombol Kembali yang digunakan untuk menavigasikan user ke halaman Login.
69
Gambar 3.17. Sketsa Pada Halaman Ganti Password 7.
Halaman Sukses Ganti Password Halaman ini menunjukkan bahwa user telah memasukkan email dengan benar dan terdaftar pada layanan Firebase. User dapat melakukan pemeriksaan pada email dan melakukan pergantian password.
Gambar 3.18. Sketsa Halaman Sukses Ganti Password 8.
Halaman Main Halaman ini berisi 5 Button yang dapat dieksekusi yaitu Aktifkan Proteksi, Modifikasi Kamus Kata Kunci, Aktifkan Mode Sembunyi, dan Ganti Password. Button Aktifkan Proteksi digunakan untuk melakukan eksekusi fitur pendeteksi situs. Apabila fitur tersebut diaktifkan, Label pada Button akan berubah menjadi Matikan Proteksi. User dapat melakukan pergantian kamus kata kunci melalui Button Modifikasi Kamus Kata Kunci yang akan
70
mengalihkan user pada halaman Modifikasi Kata Kunci. Button Aktifkan Mode Sembunyi digunakan untuk mengaktifkan fitur untuk menyembunyikan aplikasi dari taskbar. User dapat melakukan pergantian password melalui Button Ganti Password.
Gambar 3.19. Sketsa Halaman Main 9.
Halaman Modifikasi Kata Kunci Halaman ini berisi 1 buah Entry yang digunakan untuk memasukkan kata kunci baru pada kamus. User dapat menambahkan kata kunci dengan cara memasukkan kata kuncinya pada kata kunci yang telah dimasukkan dan terdaftar akan muncul pada Listbox. Listbox tersebut dapat dilakukan scroll ke atas dan ke bawah untuk melihat kata kunci yang berada dibawahnya. User dapat menghapus kata kunci yang ada di Listbox dengan cara memilih pada salah satu kata kunci yang tertera kemudian mengeksekusi Button Hapus. User dapat menyimpan hasil modifikasi kata kunci tersebut menggunakan Button Simpan. Pada halaman ini terdapat Button Kembali yang digunakan untuk melakukan navigasi pada halaman Main.
71
Gambar 3.20. Sketsa Halaman Modifikasi Kata Kunci 3.3.
Implementasi Tahap ini dibagi menjadi 2 bagian yaitu tahap implementasi rancangan
sistem dan program. Implementasi menjelaskan mengenai proses pembangunan autentikasi layanan Firebase dan SQLite. Implementasi program dilakukan untuk membangun GUI dan fungsional dari aplikasi. 3.3.1. Implementasi Rancangan Sistem Tahap awal pada implementasi rancangan sistem adalah membangun projek bkd2020 pada layanan Firebase. Projek tersebut akan menyimpan layanan autentikasi Firebase dan terhubung pada aplikasi Bad Keywords Detector. Pada aplikasi tersebut, email digunakan untuk melakukan sign in. Penulis memasukkan email contoh yang digunakan sebagai uji coba untuk melakukan login pada aplikasi.
Gambar 3.21. Daftar Akun Terdaftar Pada Firebase
72
Gambar 3.22. Pengaturan Metode Autentikasi Firebase Fitur authentication lainnya yang terdapat pada Firebase yaitu mengirimkan email verifikasi dan pergantian password. Email tersebut akan dikirimkan dari layanan Firebase menuju email yang terdaftar. Penulis akan memodifikasi isi email tersebut melalui fitur yang bernama Templates. Fitur Templates ini dapat digunakan untuk mengubah nama pengirim, akun email pengirim, akun email tujuan, subjek email, link dan isi pesan. Isi email yang dimasukkan pada template email: 1.
Email Verifikasi Email ini berfungsi untuk mengirimkan informasi keberhasilan proses register pada aplikasi dan mengirimkan link tujuan untuk menyelesaikan proses verifikasi agar dapat disetujui untuk melakukan proses login aplikasi. Beberapa atribut dari template email ini: a. Nama Pengirim Nama pengirim dari email ini yaitu badkeyworddetector. b. Akun Email Pengirim Email yang digunakan yaitu [email protected]. c. Akun Email Tujuan Akun email tujuan digunakan ketika user harus membalas email yang masuk. Akun email tujuan akan dikosongkan atau noreply. d. Isi Subjek Email
73
Subjek email menggunakan isi format: Verifikasi Email Akun %APP_NAME% Anda
e. Isi Pesan Email Isi pesan email menggunakan isi format:
Halo %DISPLAY_NAME%,
Klik link ini untuk memverifikasi alamat email Anda.
%LINK%
Jika Anda tidak meminta verifikasi alamat ini, Anda dapat mengabaikan email ini.
Terima Kasih,
Tim %APP_NAME% Anda
Hello,
Silahkan melakukan pergantian password pada akun %APP_NAME% anda yang memiliki email %EMAIL% dengan klik link yang ada dibawah ini.
%LINK%
Jika tidak ingin melakukan pergantian password, anda dapat mengabaikan email ini.
Terima Kasih,
Tim %APP_NAME% Anda